屬性

Prop	Type	Default	說明
`value`	`{ start: Date \| null; end: Date \| null }`	—	選定的日期範圍值
`onChange`	`(value: { start: Date \| null; end: Date \| null }) => void`	—	值變更時的回呼
`presets`	`DateRangePreset[]`	—	預定義的日期範圍預設
`maxDays`	`number`	—	範圍內允許的最大天數（含）
`minDays`	`number`	—	範圍内要求的最小天數（含）
`allowSingleDateInRange`	`boolean`	`true`	允許開始等於結束的範圍
`minDate`	`Date`	—	最小可選日期
`maxDate`	`Date`	—	最大可選日期
`locale`	`Partial<Locale>`	—	自訂語言環境設定
`initialMonth`	`Date`	—	初始顯示月份
`size`	`"small" \| "medium" \| "large" \| "x-large"`	`"medium"`	元件大小
`weekStartsOn`	`WeekDay`	`"sunday"`	一週的第一天
`isDateUnavailable`	`(date: Date) => boolean`	—	將日期標記為停用
`displayFormat`	`string`	—	自訂顯示格式（例如 `"YYYY/MM/DD"`）
`open`	`boolean`	—	受控的開啟狀態
`initialOpen`	`boolean`	—	初始開啟狀態（非受控）
`onOpenChange`	`(open: boolean) => void`	—	開啟狀態變更時的回呼
`required`	`boolean`	`false`	停用清除值
`showOutsideDays`	`boolean`	`false`	顯示相鄰月份的日期
`highlightDates`	`Date[]`	—	要突顯的日期
`shouldCloseOnSelect`	`boolean`	`false`	選擇結束日期時自動確認
`numberOfMonths`	`number`	`2`	要顯示的月份數
`captionLayout`	`"buttons" \| "dropdown"`	`"buttons"`	標題導覽樣式
`fromYear`	`number`	—	下拉選單的開始年份
`toYear`	`number`	—	下拉選單的結束年份
`disablePast`	`boolean`	`false`	停用今天之前的日期
`disableFuture`	`boolean`	`false`	停用今天之後的日期
`inline`	`boolean`	`false`	內聯顯示日曆（無彈出視窗）
`name`	`string`	—	用於表單提交的隱藏輸入名稱（開始日期）
`endName`	`string`	—	結束日期的隱藏輸入名稱（預設為 `name-end`）
`placeholder`	`string`	—	觸發器的預留位置文字
`hideHeader`	`boolean`	`false`	隱藏導覽標頭
`hideFooter`	`boolean`	`false`	隱藏動作頁尾

DateRangePreset

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