속성

속성타입기본값설명
value{ start: Date | null; end: Date | null }선택된 날짜 범위 값
onChange(value: { start: Date | null; end: Date | null }) => void값이 변경될 때 호출되는 콜백
presetsDateRangePreset[]미리 정의된 날짜 범위 프리셋
maxDaysnumber범위 내에서 허용되는 최대 일수 (포함)
minDaysnumber범위 내에서 필요한 최소 일수 (포함)
allowSingleDateInRangebooleantrue시작일과 종료일이 같은 범위를 허용
minDateDate선택 가능한 최소 날짜
maxDateDate선택 가능한 최대 날짜
localePartial<Locale>사용자 정의 로케일 설정
initialMonthDate초기에 표시될 월
size"small" | "medium" | "large" | "x-large""medium"컴포넌트 크기
weekStartsOnWeekDay"sunday"한 주의 시작 요일
isDateUnavailable(date: Date) => boolean날짜를 비활성화로 표시
displayFormatstring사용자 정의 표시 형식 (예: "YYYY/MM/DD")
openboolean제어되는 열림 상태
initialOpenboolean초기 열림 상태 (비제어)
onOpenChange(open: boolean) => void열림 상태가 변경될 때 호출되는 콜백
requiredbooleanfalse값 지우기 비활성화
showOutsideDaysbooleanfalse인접한 달의 날짜 표시
highlightDatesDate[]강조할 날짜
shouldCloseOnSelectbooleanfalse종료일 선택 시 자동 확인
numberOfMonthsnumber2표시할 월 개수
captionLayout"buttons" | "dropdown""buttons"캡션 탐색 스타일
fromYearnumber드롭다운의 시작 연도
toYearnumber드롭다운의 종료 연도
disablePastbooleanfalse오늘 이전 날짜 비활성화
disableFuturebooleanfalse오늘 이후 날짜 비활성화
inlinebooleanfalse달력을 인라인으로 표시 (팝업 없음)
namestring폼 제출을 위한 숨겨진 입력 필드의 이름 (시작일)
endNamestring종료일을 위한 숨겨진 입력 필드의 이름 (기본값: name-end)
placeholderstring트리거 플레이스홀더 텍스트
hideHeaderbooleanfalse탐색 헤더 숨기기
hideFooterbooleanfalse액션 푸터 숨기기

DateRangePreset

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