Calendar
A date picker component built on react-day-picker, supporting single date, range, and multiple selection modes.
Installation
pnpm dlx stera-ui@latest add calendar
Date Picker
You can use the <Calendar> component to build a date picker. See the Date Picker page for more information.
Examples
Date Range
Month/Year Dropdown
Pass captionLayout="dropdown" to replace the navigation arrows with month/year select dropdowns.
With Presets
Week Numbers
API Reference
Calendar extends all props from react-day-picker.
| Prop | Type | Default |
|---|---|---|
mode | "single" | "range" | "multiple" | "single" |
selected | Date | DateRange | Date[] | — |
onSelect | (value) => void | — |
disabled | Date[] | Matcher | — |
captionLayout | "label" | "dropdown" | "label" |
showWeekNumber | boolean | false |