Props

속성타입기본값설명
valueDate | null선택된 날짜-시간 값
onChange(dateTime: Date | null) => void값이 변경될 때 호출되는 콜백
timeTimeConfig시간 패널 설정
minDateDate선택 가능한 최소 날짜
maxDateDate선택 가능한 최대 날짜
localePartial<Locale>커스텀 로케일 설정
initialMonthDate초기에 표시할 월
size"small" | "medium" | "large" | "x-large""medium"컴포넌트 크기
weekStartsOnWeekDay"sunday"한 주의 시작 요일
isDateUnavailable(date: Date) => boolean날짜를 비활성화 상태로 표시
displayFormatstring커스텀 표시 형식
openboolean제어되는(controlled) 열림 상태
initialOpenboolean초기 열림 상태 (비제어)
onOpenChange(open: boolean) => void열림 상태가 변경될 때 호출되는 콜백
requiredbooleanfalse값 지우기 비활성화
showOutsideDaysbooleanfalse인접한 월의 날짜 표시
highlightDatesDate[]강조 표시할 날짜 목록
shouldCloseOnSelectbooleanfalse프리셋 클릭 시 자동 확인
numberOfMonthsnumber1표시할 월의 수
captionLayout"buttons" | "dropdown""buttons"캡션 내비게이션 스타일
fromYearnumber드롭다운의 시작 연도
toYearnumber드롭다운의 종료 연도
disablePastbooleanfalse오늘 이전 날짜 비활성화
disableFuturebooleanfalse오늘 이후 날짜 비활성화
inlinebooleanfalse인라인으로 캘린더 표시 (팝업 없음)
namestring폼 제출을 위한 숨겨진 인풋(hidden input) 이름
placeholderstring트리거의 플레이스홀더 텍스트
hideHeaderbooleanfalse내비게이션 헤더 숨기기
hideFooterbooleanfalse액션 푸터 숨기기

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;
}