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 }) => void—Callback quando o valor muda
presetsDateRangePreset[]—Predefinições de intervalo de datas
maxDaysnumber—Máximo de dias permitidos no intervalo (inclusivo)
minDaysnumber—Mínimo de dias exigidos no intervalo (inclusivo)
allowSingleDateInRangebooleantruePermitir intervalo onde o início é igual ao fim
minDateDate—Data mínima selecionável
maxDateDate—Data máxima selecionável
localePartial<Locale>—Configuração de localidade personalizada
initialMonthDate—Mês inicial exibido
size"small" | "medium" | "large" | "x-large""medium"Tamanho do componente
weekStartsOnWeekDay"sunday"Primeiro dia da semana
isDateUnavailable(date: Date) => boolean—Marcar datas como desabilitadas
displayFormatstring—Formato de exibição personalizado (ex. "DD/MM/YYYY")
openboolean—Estado de aberto controlado
initialOpenboolean—Estado de aberto inicial (não controlado)
onOpenChange(open: boolean) => void—Callback 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
fromYearnumber—Ano de início para o dropdown
toYearnumber—Ano final para o dropdown
disablePastbooleanfalseDesabilitar datas anteriores a hoje
disableFuturebooleanfalseDesabilitar datas posteriores a hoje
inlinebooleanfalseMostrar calendário embutido (sem pop-up)
namestring—Nome do input oculto para submissão de formulário (data de início)
endNamestring—Nome do input oculto para a data final (padrão é name-end)
placeholderstring—Texto 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 });
}