道具

支柱類型預設描述
value{ start: Date | null; end: Date | null }—Selected date range value
onChange(value: { start: Date | null; end: Date | null }) => void—Callback when value changes
presetsDateRangePreset[]—Predefined date range presets
maxDaysnumber—Maximum days allowed in range (inclusive)
minDaysnumber—Minimum days required in range (inclusive)
allowSingleDateInRangebooleantrue允許開始等於結束的範圍
minDateDate—Minimum selectable date
maxDateDate—Maximum selectable date
localePartial<Locale>—Custom locale configuration
initialMonthDate—Initial displayed month
size"small" | "medium" | "large" | "x-large""medium"Component size
weekStartsOnWeekDay"sunday"一週的第一天
isDateUnavailable(date: Date) => boolean—Mark dates as disabled
displayFormatstring—Custom display format (e.g. "YYYY/MM/DD")
openboolean—Controlled open state
initialOpenboolean—Initial open state (uncontrolled)
onOpenChange(open: boolean) => void—Callback when open state changes
requiredbooleanfalse禁用清除值
showOutsideDaysbooleanfalse顯示相鄰月份的天數
highlightDatesDate[]—Dates to highlight
shouldCloseOnSelectbooleanfalse選擇結束日期時自動確認
numberOfMonthsnumber2顯示月數
captionLayout"buttons" | "dropdown""buttons"Caption navigation style
fromYearnumber—Start year for dropdown
toYearnumber—End year for dropdown
disablePastbooleanfalse禁用今天之前的日期
disableFuturebooleanfalse禁用今天之後的日期
inlinebooleanfalse內嵌顯示行事曆（無彈出視窗）
namestring—Hidden input name for form submission (start date)
endNamestring—Hidden input name for end date (defaults to name-end)
placeholderstring—Trigger placeholder text
hideHeaderbooleanfalse隱藏導航標題
hideFooterbooleanfalse隱藏操作頁腳

DateRangePreset

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