Getting Started
Dark Mode
Charts
Colors
Drag-and-drop
Forms
Utilities
Date Field
Enter dates directly into this field, perfect for logging events or deadlines with the precision of a historian noting important events.
Basic
A date field allows users to enter and adjust date and time values using a keyboard. Each part of the date is shown in its own editable segment.
Installation
If you hit any issues, make sure you check out the installation guide here for more information.
Composed Components
Plug this component into the CLI, and it automatically loads all the included components. No need to add them individually.
The Date Field comes packed with a variety of components to make it stand out.
Manual Installation
Sometimes, using the CLI is the way to go, so make sure you install the necessary dependencies for the components you want to use.
Date Time Field
You can also use the date field to select both date and time.
Validation
When validation is applied, the date field will show a validation message if the entered value is invalid.
Prefix
A demonstration of how to add a prefix to the date field component for enhanced clarity or customization.
Suffix
A demonstration of how to add a suffix to the date field component to provide additional context or customization.
Controlled
In a controlled date field, the value must be passed as a prop, and the field is not directly editable by the user.
Friday, January 3, 2025
2025-01-03
Uncontrolled
In a controlled date field, the value must be passed as a prop, and the field is not directly editable by the user.
Readonly
In a readonly date field, the value is provided as a prop, and the field is not editable by the user.
Disabled
A disabled date field is non-interactive and visually represented in a disabled state.