Właściwości

WłaściwośćTypDomyślneOpis
value{ start: Date | null; end: Date | null }Wybrana wartość zakresu daty i czasu
onChange(value: { start: Date | null; end: Date | null }) => voidFunkcja zwrotna wywoływana przy zmianie wartości
timeTimeConfigKonfiguracja panelu czasu (stosowana zarówno do początku, jak i końca)
presetsDateRangePreset[]Predefiniowane ustawienia zakresu dat
maxDaysnumberMaksymalna dozwolona liczba dni w zakresie (włącznie)
minDaysnumberMinimalna wymagana liczba dni w zakresie (włącznie)
allowSingleDateInRangebooleantrueZezwalaj na zakres, w którym data początkowa jest równa końcowej
minDateDateMinimalna data, którą można wybrać
maxDateDateMaksymalna data, którą można wybrać
localePartial<Locale>Niestandardowa konfiguracja lokalizacji
initialMonthDatePoczątkowy wyświetlany miesiąc
size"small" | "medium" | "large" | "x-large""medium"Rozmiar komponentu
weekStartsOnWeekDay"sunday"Pierwszy dzień tygodnia
isDateUnavailable(date: Date) => booleanOznacz daty jako niedostępne
displayFormatstringNiestandardowy format wyświetlania
openbooleanKontrolowany stan otwarcia
initialOpenbooleanPoczątkowy stan otwarcia (niekontrolowany)
onOpenChange(open: boolean) => voidFunkcja zwrotna wywoływana przy zmianie stanu otwarcia
requiredbooleanfalseWyłącz możliwość czyszczenia wartości
showOutsideDaysbooleanfalsePokaż dni z sąsiednich miesięcy
highlightDatesDate[]Daty do wyróżnienia
shouldCloseOnSelectbooleanfalseAutomatyczne zatwierdzenie po kliknięciu presetu
numberOfMonthsnumber2Liczba wyświetlanych miesięcy
captionLayout"buttons" | "dropdown""buttons"Styl nawigacji w nagłówku
fromYearnumberRok początkowy dla listy rozwijanej
toYearnumberRok końcowy dla listy rozwijanej
disablePastbooleanfalseWyłącz daty przed dzisiaj
disableFuturebooleanfalseWyłącz daty po dzisiaj
inlinebooleanfalsePokaż kalendarz w linii (bez wyskakującego okienka)
namestringNazwa ukrytego pola dla przesyłania formularza (data i czas rozpoczęcia)
endNamestringNazwa ukrytego pola dla daty i czasu zakończenia (domyślnie name-end)
placeholderstringTekst zastępczy przycisku otwierającego
hideHeaderbooleanfalseUkryj nagłówek nawigacyjny
hideFooterbooleanfalseUkryj stopkę z akcjami

TimeConfig

interface TimeConfig {
/** Time display precision. Defaults to "minute". */
precision?: "hour" | "minute" | "second";
/** 12-hour or 24-hour format. Defaults to "24". */
hourFormat?: "12" | "24";
/** Minute increment step. Defaults to 5. */
minuteStep?: 1 | 2 | 3 | 5 | 10 | 15 | 20 | 30;
/** Second increment step. Defaults to 1. */
secondStep?: 1 | 2 | 3 | 5 | 10 | 15 | 20 | 30;
/** Height (in px) of each scroll wheel item. Defaults to 32. */
itemHeight?: number;
}

DateRangePreset

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