Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA typed date field with a calendar button that opens a popover calendar, both editing the same value, and closing and returning focus when a day is picked. Use this when people either type a date they know or browse a calendar for one they do not.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it when people either type a date they know or browse a calendar for one they do not.
Do not use it for ranges; use date-range-filter-popover.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
| value / defaultValue / onValueChange | string | null | null | ISO date. |
| min / max | string | - | Limits for the field and the calendar. |
| isDateUnavailable | (date: string) => boolean | - | Disabled days. |
| label | string | Date | Accessible name. |
The pattern ships with a Testing Library test (date-field-with-calendar-popover.test.tsx) that covers typing then opening, picking a day, and limits applied to both.