Component
Date Picker
A date picker with calendar dropdown and optional time selection. Uses the headless @refraction-ui/date-picker core.
Examples
Click to open the calendar and select a date.
Calendar + Time
Installation
$
pnpm add @refraction-ui/react-date-pickerUsage
tsx
import { DatePicker } from '@refraction-ui/react-date-picker'
export function MyComponent() {
const [date, setDate] = useState<Date>()
return <DatePicker value={date} onChange={setDate} />
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
value | Date | -- | Selected date/time. |
onChange | (date: Date) => void | -- | Callback when date changes. |
className | string | -- | Additional CSS classes. |