Prop’lar

PropTürVarsayılanAçıklama
value{ start: Date | null; end: Date | null }Seçili tarih aralığı değeri
onChange(value: { start: Date | null; end: Date | null }) => voidDeğer değiştiğinde geri arama
presetsDateRangePreset[]Önceden tanımlanmış tarih aralığı hazır ayarları
maxDaysnumberAralıkta izin verilen maksimum gün sayısı (dahil)
minDaysnumberAralıkta gerekli minimum gün sayısı (dahil)
allowSingleDateInRangebooleantrueBaşlangıç ve bitişin eşit olduğu aralığa izin ver
minDateDateMinimum seçilebilir tarih
maxDateDateMaksimum seçilebilir tarih
localePartial<Locale>Özel yerel ayar yapılandırması
initialMonthDateBaşlangıçta görüntülenen ay
size"small" | "medium" | "large" | "x-large""medium"Bileşen boyutu
weekStartsOnWeekDay"sunday"Haftanın ilk günü
isDateUnavailable(date: Date) => booleanTarihleri devre dışı olarak işaretle
displayFormatstringÖzel görüntüleme formatı (ör. "YYYY/MM/DD")
openbooleanKontrollü açık durumu
initialOpenbooleanBaşlangıçtaki açık durumu (kontrolsüz)
onOpenChange(open: boolean) => voidAçık durumu değiştiğinde geri arama
requiredbooleanfalseDeğeri temizlemeyi devre dışı bırak
showOutsideDaysbooleanfalseBitişik aylardaki günleri göster
highlightDatesDate[]Vurgulanacak tarihler
shouldCloseOnSelectbooleanfalseBitiş tarihi seçildiğinde otomatik onayla
numberOfMonthsnumber2Görüntülenecek ay sayısı
captionLayout"buttons" | "dropdown""buttons"Başlık gezinme stili
fromYearnumberAçılır menü için başlangıç yılı
toYearnumberAçılır menü için bitiş yılı
disablePastbooleanfalseBugünden önceki tarihleri devre dışı bırak
disableFuturebooleanfalseBugünden sonraki tarihleri devre dışı bırak
inlinebooleanfalseTakvimi satır içi göster (açılır pencere yok)
namestringForm gönderimi için gizli girdi adı (başlangıç tarihi)
endNamestringBitiş tarihi için gizli girdi adı (varsayılan olarak name-end)
placeholderstringTetikleyici yer tutucu metni
hideHeaderbooleanfalseGezinme başlığını gizle
hideFooterbooleanfalseEylem altbilgisini gizle

DateRangePreset

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