Controls
Date Picker
A spring-physics calendar picker with sliding month transitions, staggered day-cell entry, and a velocity-aware trigger — the date picker your design system deserves.
Installation
Coming soon. Components will be available via the registry once checkout goes live.
Usage
const [date, setDate] = useState<Date>();
<AnimatedDatePicker value={date} onChange={setDate} />Props
| Prop | Type | Default | Description |
|---|---|---|---|
| value | Date | — | Currently selected date (controlled). |
| onChange | (date: Date) => void | — | Fired when a date is selected. |
| placeholder | string | "Pick a date" | Trigger label when no date is selected. |
| disabled | boolean | false | Disables the trigger and prevents opening. |
| minDate | Date | — | Earliest selectable date. Days before this are dimmed. |
| maxDate | Date | — | Latest selectable date. Days after this are dimmed. |
| className | string | — | Tailwind classes on the root container. |
Use cases
Booking flows
Check-in / check-out date selection with min/max constraints.
Form date fields
Drop-in replacement for any native <input type='date'> that needs premium feel.
Event scheduling
Pick a date for meetings, reminders, or deadlines.
Billing / subscription start dates
Allow users to choose when a plan takes effect.