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.
Event date
Installation
npx hq-kit add date-field
Controlled
In a controlled date field, the value must be passed as a prop, and the field is not directly editable by the user.
Thursday, December 12, 2024
2024-12-12
Event date
Date Time Field
You can also use the date field to select both date and time.
Event date
Validation
When validation is applied, the date field will show a validation message if the entered value is invalid.
Disabled
A disabled date field is non-interactive and visually represented in a disabled state.
Event date