API and Development
DateRangeInput from @prepared911/ui/date-range-input. modes offers Before, After, and Between. One entry hides the mode control and shows only the end that mode uses. More than one shows the control. An uncontrolled mode follows the value, including after the form resets. Closing without Apply keeps the mode an empty value already shows. The calendar grid is Calendar; this field owns the popover.
| Prop | Meaning |
|---|---|
label | Required name of the group. |
rangeLabels | Start and end, heard before the label. |
segmentLabels | Legacy segment names (API compatibility). The trigger is read-only; dates are chosen on the calendar. |
timeSegmentLabels / timeFieldLabels | With type DateRangeInputType.DateTime, names for clock segments in the panel. |
calendarLabel | The button that opens the calendar. |
value / defaultValue | { start, end } of local Dates, or null. |
onValueChange | Next value and details.reason. |
allowPartialRange | Reports a range with null for an empty end. |
minDate / maxDate / disableFuture | Bounds for both ends. |
isDateDisabledForMode | Per-mode disable; use createAdvancedDateRangeDisabledForMode for ui-calendar past/future flags. |
confirm | Requires applyLabel and resetLabel. Reset restores the value and mode held when the popover opened, and stays open. Clear, when clearLabel is set, empties the draft and stays open. Escape and an outside press close without committing. Apply is the only primary action. |
modes | Before, After, and Between. One mode hides the control. Requires confirm, modeSelectLabel, applyLabel, resetLabel, and clearLabel. |
mode | Controlled Before, After, or Between while modes is set. Omit it and the mode follows the value, then defaultMode. |
defaultMode | Mode shown while the value has no end yet. Defaults to Between when that mode is offered. |
onModeChange | Called when the mode changes from the panel or the field select. |