Oggetti di scena

PuntelloTipoPredefinitoDescrizione
value{ start: Date | null; end: Date | null }Selected date range value
onChange(value: { start: Date | null; end: Date | null }) => voidCallback when value changes
presetsDateRangePreset[]Predefined date range presets
maxDaysnumberMaximum days allowed in range (inclusive)
minDaysnumberMinimum days required in range (inclusive)
allowSingleDateInRangebooleantrueConsenti intervallo in cui l’inizio è uguale alla fine
minDateDateMinimum selectable date
maxDateDateMaximum selectable date
localePartial<Locale>Custom locale configuration
initialMonthDateInitial displayed month
size"small" | "medium" | "large" | "x-large""medium"Component size
weekStartsOnWeekDay"sunday"Primo giorno della settimana
isDateUnavailable(date: Date) => booleanMark dates as disabled
displayFormatstringCustom display format (e.g. "YYYY/MM/DD")
openbooleanControlled open state
initialOpenbooleanInitial open state (uncontrolled)
onOpenChange(open: boolean) => voidCallback when open state changes
requiredbooleanfalseDisabilita la cancellazione del valore
showOutsideDaysbooleanfalseMostra i giorni dei mesi adiacenti
highlightDatesDate[]Dates to highlight
shouldCloseOnSelectbooleanfalseConferma automatica quando viene selezionata la data di fine
numberOfMonthsnumber2Numero di mesi da visualizzare
captionLayout"buttons" | "dropdown""buttons"Caption navigation style
fromYearnumberStart year for dropdown
toYearnumberEnd year for dropdown
disablePastbooleanfalseDisattiva le date prima di oggi
disableFuturebooleanfalseDisabilita le date successive a oggi
inlinebooleanfalseMostra calendario in linea (nessun popup)
namestringHidden input name for form submission (start date)
endNamestringHidden input name for end date (defaults to name-end)
placeholderstringTrigger placeholder text
hideHeaderbooleanfalseNascondi l’intestazione di navigazione
hideFooterbooleanfalseNascondi il piè di pagina dell’azione

DateRangePreset

interface DateRangePreset {
label: string;
value: { start: Date; end: Date } | (() => { start: Date; end: Date });
}