Props

PropTipoPadrãoDescrição
value{ start: Date | null; end: Date | null }Valor do intervalo de datas selecionado
onChange(value: { start: Date | null; end: Date | null }) => voidCallback quando o valor muda
presetsDateRangePreset[]Predefinições de intervalo de datas
maxDaysnumberMáximo de dias permitidos no intervalo (inclusivo)
minDaysnumberMínimo de dias exigidos no intervalo (inclusivo)
allowSingleDateInRangebooleantruePermitir intervalo onde o início é igual ao fim
minDateDateData mínima selecionável
maxDateDateData máxima selecionável
localePartial<Locale>Configuração de localidade personalizada
initialMonthDateMês inicial exibido
size"small" | "medium" | "large" | "x-large""medium"Tamanho do componente
weekStartsOnWeekDay"sunday"Primeiro dia da semana
isDateUnavailable(date: Date) => booleanMarcar datas como desabilitadas
displayFormatstringFormato de exibição personalizado (ex. "DD/MM/YYYY")
openbooleanEstado de aberto controlado
initialOpenbooleanEstado de aberto inicial (não controlado)
onOpenChange(open: boolean) => voidCallback quando o estado de aberto muda
requiredbooleanfalseDesabilitar a limpeza do valor
showOutsideDaysbooleanfalseMostrar dias dos meses adjacentes
highlightDatesDate[]Datas para destacar
shouldCloseOnSelectbooleanfalseConfirmar automaticamente quando a data final é selecionada
numberOfMonthsnumber2Número de meses a serem exibidos
captionLayout"buttons" | "dropdown""buttons"Estilo de navegação do cabeçalho
fromYearnumberAno de início para o dropdown
toYearnumberAno final para o dropdown
disablePastbooleanfalseDesabilitar datas anteriores a hoje
disableFuturebooleanfalseDesabilitar datas posteriores a hoje
inlinebooleanfalseMostrar calendário embutido (sem pop-up)
namestringNome do input oculto para submissão de formulário (data de início)
endNamestringNome do input oculto para a data final (padrão é name-end)
placeholderstringTexto do placeholder do gatilho
hideHeaderbooleanfalseOcultar o cabeçalho de navegação
hideFooterbooleanfalseOcultar o rodapé de ações

DateRangePreset

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