Components · Form & Input
Dual-calendar date range selector.
| Prop | Type | Default | Required | Description |
|---|---|---|---|---|
| value | { from: Date | undefined; to: Date | undefined } | — | — | Controlled date range value. |
| onChange | (range: { from: Date | undefined; to: Date | undefined }) => void | — | — | Callback invoked when the selected range changes. |
| placeholder | string | 'Select date range' | — | Placeholder text shown in the trigger input when no range is selected. |
| disabled | boolean | false | — | Disables the trigger input and calendar popover. |
| minDate | Date | — | — | Earliest selectable date. Dates before this are greyed out. |
| maxDate | Date | — | — | Latest selectable date. Dates after this are greyed out. |
| numberOfMonths | number | 2 | — | Number of months to display in the calendar popover. |
| label | string | — | — | Visible label rendered above the input. |
| error | string | — | — | Error message displayed below the input. |
import { Date Range Picker } from '@nexub/react';