Props

PropTypeDefaultDescription
valueDate | null—Selected date value
onChange(date: Date | null) => void—Callback when value changes
minDateDate—Minimum selectable date
maxDateDate—Maximum selectable date
localePartial<Locale>—Custom locale configuration
initialMonthDate—Initial displayed month
todayDatenew Date()Override today’s date for isToday highlighting and disablePast/disableFuture calculations
onMonthChange(month: Date) => void—Callback fired when the displayed month changes
size"small" | "medium" | "large" | "x-large""medium"Component size
weekStartsOnWeekDay"sunday"First day of the week
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
requiredbooleanfalseDisable clearing the value
showOutsideDaysbooleanfalseShow days from adjacent months
highlightDatesDate[]—Dates to highlight
shouldCloseOnSelectbooleanfalseAuto-confirm on date click
numberOfMonthsnumber1Number of months to display
captionLayout"buttons" | "dropdown""buttons"Caption navigation style
fromYearnumber—Start year for dropdown
toYearnumber—End year for dropdown
disablePastbooleanfalseDisable dates before today
disableFuturebooleanfalseDisable dates after today
inlinebooleanfalseShow calendar inline (no popup)
namestring—Hidden input name for form submission
placeholderstring—Trigger placeholder text
hideHeaderbooleanfalseHide the navigation header
hideFooterbooleanfalseHide the action footer