Date Picker
A UI component that provides an interactive way to select a single date from a calendar view.
Basic
A date picker combines a DateField with a Calendar popover, allowing users to either type in or select a date and time.
Installation
If you hit any issues, make sure you check out the installation guide here for more information.
Composed Components
When you install this component via the CLI, it automatically loads all composed components, so you don’t need to add them individually.
The Date Picker comes packed with several components to enhance functionality and provide a seamless experience.
Manual Installation
Make sure you also install the composed components and the required packages for the component to function properly.
Date and Time
While not a full-fledged date-time picker, this setup lets you edit both date and time in a segmented field.
Validation
To ensure that the date picker is filled out, use the isRequired
prop.
Custom Validation
The validate
function is your go-to for custom validation rules. It checks the current date value and returns an error message string or strings if the value doesn't meet your criteria.
Controlled
Take control of your date picker by passing a value
prop, which allows you to manage the selected date.
Friday, February 28, 2025
2025-02-28
Disabled
When the date picker is disabled, it becomes non-interactive and visually represents a disabled state.