Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99

--d --h --m --sGet Pro

Popover Date Quick Pick

ProNew

A due-date popover with Today, Tomorrow, Next week and No date presets plus a native date input, with the date in words on the trigger.

Customize

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.

value

label, locale

Guide and examples

When to use it

Use this for due dates, snooze times and review dates, where most picks are near today and a calendar grid is overkill.

Do not use it for date ranges or for booking, where availability must be shown; use a calendar.

Installation

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.

Log in Get Pro for $35

Props

PopoverDateQuickPick

Prop	Type	Default	Description
`value`	`string`	-	ISO date (yyyy-mm-dd) or empty.
`onValueChange`	`(value: string) => void`	-	Called with the new ISO date or an empty string.
`today`	`Date`	`new Date()`	Reference date for the presets.
`label, locale`	`string`	`Due date, en-US`	Trigger label and formatting.

Accessibility

The trigger is named "Due date: Tue, Oct 27" using Intl.DateTimeFormat; presets expose aria-pressed for the chosen one.
The native <input type="date"> keeps the platform's picker, keyboard entry and localisation.
Choosing a preset or a date closes the popover and returns focus to the trigger.

Keyboard

Key	Action
Enter or Space	opens the popover and presses a preset
Escape	closes without changes

Testing

The pattern ships a Testing Library test (popover-date-quick-pick.test.tsx) that covers the named trigger, presets with pressed state, clearing and the native date input.