Calendar API
API reference docs for theCalendarcomponent. For examples and details on the usage of this component, visit the component demo page.
Props
| Prop | Type | Description | Default |
|---|---|---|---|
copyLabels? | object | Calendar copy labels for accessibility, tooltips and localization. Use this to provide translated or custom text for various calendar elements. | _ |
copyLabels.disabledDayLabel? | string | Aria label and tooltip content for the days that are not available. | No availability |
copyLabels.disabledMonthLabel? | string | Aria label and tooltip content for the months that are not available. | No availability |
copyLabels.goTodayLabel? | string | Aria label and tooltip content for the button that navigates to today. | Today |
copyLabels.nextMonthLabel? | string | Aria label and tooltip content for the button that navigates to the next month. | Next month |
copyLabels.nextYearLabel? | string | Aria label and tooltip content for the button that navigates to the next year. | Next year |
copyLabels.previousMonthLabel? | string | Aria label and tooltip content for the button that navigates to the previous month. | Previous month |
copyLabels.previousYearLabel? | string | Aria label and tooltip content for the button that navigates to the previous year. | Previous year |
hasMonthPicker? | boolean | Determines whether Calendar has month grid or not. | true |
isDateUnavailable? | function | A callback function invoked for each date in the calendar. | |
| _ | |||
localeCode? | 'ar' | 'bg' | 'cs' | 'da' | 'de' | 'el' | 'en' | 'es' | 'et' | 'fi' | 'fr' | 'he' | 'hr' | 'hu' | 'is' | 'it' | 'ja' | 'ko' | 'lt' | 'lv' | 'nl' | 'no' | 'pl' | 'pt' | 'ro' | 'ru' | 'sl' | 'sq' | 'sr' | 'sv' | 'tr' | 'uk' | 'zh' | Locale code (ISO 639-1) for date localization. | en |
maxValue? | Date | The maximum allowed date that a user may select. | _ |
minValue? | Date | The minimum allowed date that a user may select. | _ |
onValueChange? | function | Handler that is called when the value changes. | _ |
onVisibleMonthChange? | function | Handler that is called when the currently visible month changes. | _ |
onVisibleYearChange? | function | Handler that is called when the currently visible year changes. | _ |
size? | small | standard | The size of the calendar. | standard |
tzModifier? | string | The timezone modifier for the calendar to consider the "today" date. | |
Intl.DateTimeFormat().resolvedOptions().timeZone | |||
value? | Date | The current value (controlled). | _ |
visibleMonth? | Date | Controls the currently focused date within the calendar. | _ |
weekStartsOn? | 0 | 1 | 2 | 3 | 4 | 5 | 6 | The index of the first day of the week. Accepts a value from 0 (Sunday) to 6 (Saturday). Overrides the locale's default setting. | _ |
hasTodayButton? | boolean | Show/Hide the today button in the calendar. | true |