DatePicker

Import

import { DatePicker } from '@dangbt/pro-ui'

Basic usage

<DatePicker label="Start Date" />

Controlled

import { parseDate } from '@internationalized/date'
 
const [date, setDate] = useState(parseDate('2025-01-01'))
 
<DatePicker label="Due Date" value={date} onChange={setDate} />

With min/max

<DatePicker
  label="Appointment"
  minValue={today(getLocalTimeZone())}
  maxValue={parseDate('2025-12-31')}
/>

Props

Prop	Type	Default	Description
label	string	—	Picker label
value	CalendarDate	—	Controlled date value
defaultValue	CalendarDate	—	Uncontrolled default
onChange	(date: CalendarDate) => void	—	Called on date selection
minValue	CalendarDate	—	Minimum selectable date
maxValue	CalendarDate	—	Maximum selectable date
isDisabled	boolean	—	Disable the picker
errorMessage	string	—	Error state text