DatePicker

A trigger button that opens a calendar popup for selecting a single date, with full keyboard navigation, min/max bounds, and no external date library.

Installation

npx dafink-ui add date-picker

Demo

Arrow keys navigate the calendar grid.

Props

NameTypeDefaultDescription
valueDate | nullundefinedThe currently selected date (controlled).
onChange(date: Date) => voidundefinedCalled when the user selects a day.
placeholderstring'Pick a date'Text shown when no date is selected.
minDateundefinedEarliest selectable date.
maxDateundefinedLatest selectable date.
disabledbooleanfalseDisables the trigger.
labelstringundefinedVisible label above the trigger.
hintstringundefinedHelper text below the trigger.
errorstringundefinedError message; applies error border styling.
classNamestring''Additional classes on the root wrapper.