Skip to content

HyDateField

A locale-aware segmented date (and optional time) input. Each unit (month / day / year, plus hour / minute in datetime mode) is an arrow-adjustable, type-to-edit spinbutton — the keyboard-first, screen- reader-friendly replacement for a readonly trigger. No calendar; compose with hy-date-picker for the popover.

Independently form-associated — usable standalone with its own name / value and form-control surface (hy-date-picker composes it rather than re-implementing).

Value is ISO YYYY-MM-DD (date) or YYYY-MM-DDTHH:MM (datetime). Segment order, separators, and 12/24h come from the resolved locale via Intl.

Examples

html
<hy-date-field label="Start date" value="2026-03-07"></hy-date-field>
<hy-date-field type="datetime" label="Starts at"></hy-date-field>

Events

  • input - Fires on each segment edit that yields a complete valid value.
  • change - Fires on blur / Enter once all segments form a valid value.

Built with Lit. Documented with VitePress.