Vesture
Get started

Date & time

DatePicker

A text input plus calendar popover for a single date, with locale-aware typed-input parsing.

DatePicker

Preview

Usage

tsx
import { DatePicker } from "@vesture/react";

<DatePicker value={date} onChange={setDate} minDate={new Date()} locale="en-GB" />

Behavior

  • Typed text is parsed locale-aware and rejects overflow dates (e.g. Feb 31); invalid text reverts to the last valid value on blur.
  • Popover uses a non-modal dialog role and returns focus to the input on close.

Props

PropTypeDefaultDescription
value / defaultValue / onChangeDate | nullonChange receives null when cleared.
minDate / maxDate / isDateDisabledmixedSame as Calendar.
localestring"en-US"Drives input parsing, placeholder, and the Calendar.
placeholderstringDefaults to a locale-derived format like MM/DD/YYYY.
open / onOpenChangeboolean / fnControlled popover state.