Calendar
import { Calendar } from '@tangible/ui';
Interactive docs and examples: Calendar in Storybook.
Calendar props
| Prop | Type | Default | Description |
|---|---|---|---|
aria-label? |
string |
||
className? |
string |
||
defaultMonth? |
Date |
Initial visible month for uncontrolled usage. | |
isDayDisabled? |
(day: Date) => boolean |
Per-day disable hook, applied on top of min/max. | |
labels? |
CalendarLabels |
Override default English strings for i18n. | |
locale? |
string |
the document language, falling back to 'en-US' |
BCP 47 locale for month/weekday names and numeric formats. |
max? |
Date |
Latest selectable day (inclusive, time-of-day ignored). | |
min? |
Date |
Earliest selectable day (inclusive, time-of-day ignored). | |
month? |
Date |
Controlled visible month (any day within it). | |
onChange? |
(day: Date) => void |
Day clicked/chosen. Receives the calendar day at noon; callers merge their own time-of-day (see withDay). |
|
onMonthChange? |
(month: Date) => void |
||
range? |
DateRange | null |
Range to paint (endpoints + in-between fill). Painting only — range selection logic lives in DateRangePicker. | |
value? |
Date | null |
Selected day. | |
weekStartsOn? |
0 | 1 | 2 | 3 | 4 | 5 | 6 |
1 |
First day of the week. 0 = Sunday … 6 = Saturday. |
Other exports
defaultCalendarLabels:Required<CalendarLabels>
Examples
Stories: Default, Min/Max bounds, Range painting (via DateRangePicker), Week Starts Sunday, Localised (de-DE) (interactive page).
Component API tokens: shared with DatePicker.