Date Picker
A date picker combines a DateField and a Calendar popover to allow users to enter or select a date and time value.
Installation
CLI
Manual
npx hq-kit add date-picker
Basic
A date picker combines a DateField with a Calendar popover, allowing users to either type in or select a date and time.
Preview
Code
Event date
mmddyyyy
Date and Time
Preview
Code
Event date
42620250613
Controlled
Preview
Code
Saturday, April 26, 2025
2025-04-26
Event date
4262025
Validation
Preview
Code
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.
Preview
Code