forms · primitive

Date picker

Native date input with helper copy and min/max bounds. UInput type="date" renders the browser-native picker — accessible, keyboard-friendly, locale-aware, no custom popover to maintain. For richer date-range UI (calendar grid, presets), compose with UInput + a calendar widget; that's a heavier pattern not yet in the catalog.

basic

Single date

ISO-8601 string accepted by `v-model`.
Must be on or after today (2026-09-01).

date range

Two-input pattern

Must be on or after 2026-04-01

Selected range: 2026-04-01 → 2026-04-30

other date types

Time, datetime, month, week

`type=time` for HH:MM input.
`type=datetime-local`.
`type=month`.
`type=week`.

notes

Browser native vs. custom calendar

Native pickers vary in look across browsers but win on accessibility (keyboard nav, screen-reader labels, locale handling) and zero JS. Reach for a custom calendar grid only when the UX needs presets ("last 30 days"), constrained ranges, or a designed mini-calendar inline.