Reka | Reka UI

Prop	Default	Type
`allowNonContiguousRanges`	`false`	`boolean` When combined with `isYearUnavailable`, determines whether non-contiguous ranges may be selected.
`as`	`'div'`	`AsTag \| Component` The element or component this component should render as. Can be overwritten by `asChild`.
`asChild`		`boolean` Change the default rendered element for the one passed as a child, merging their props and behavior. Read our Composition guide for more details.
`calendarLabel`		`string` The accessible label for the calendar
`defaultPlaceholder`		`DateValue` The default placeholder date
`defaultValue`	`{ start: undefined, end: undefined }`	`DateRange` The default value for the calendar
`dir`		`'ltr' \| 'rtl'` The reading direction of the calendar when applicable.
`disabled`	`false`	`boolean` Whether or not the calendar is disabled
`fixedDate`		`'start' \| 'end'` Which part of the range should be fixed
`initialFocus`	`false`	`boolean` If true, the calendar will focus the selected year on mount
`isYearDisabled`		`Matcher` A function that returns whether or not a year is disabled
`isYearUnavailable`		`Matcher` A function that returns whether or not a year is unavailable
`locale`		`string` The locale to use for formatting dates
`maximumYears`		`number` The maximum number of years that can be selected in a range
`maxValue`		`DateValue` The maximum date that can be selected
`minValue`		`DateValue` The minimum date that can be selected
`modelValue`		`DateRange \| null` The controlled checked state of the calendar. Can be bound as `v-model`.
`nextPage`		`((placeholder: DateValue) => DateValue)` A function that returns the next page of the calendar.
`placeholder`		`DateValue` The placeholder date, which is used to determine what year range to display when no date is selected.
`preventDeselect`	`false`	`boolean` Whether or not to prevent the user from deselecting a date without selecting another date first
`prevPage`		`((placeholder: DateValue) => DateValue)` A function that returns the previous page of the calendar.
`readonly`	`false`	`boolean` Whether or not the calendar is readonly
`yearsPerPage`	`12`	`number` Number of years to display per page

Emit	Payload
`update:modelValue`	`[date: DateRange]` Event handler called whenever the model value changes
`update:placeholder`	`[date: DateValue]` Event handler called whenever the placeholder value changes
`update:startValue`	`[date: DateValue]` Event handler called whenever the start value changes

Slots (default)	Payload
`date`	`DateValue` The current date of the placeholder
`grid`	`Grid<DateValue>` The grid of years
`locale`	`string` The calendar locale
`modelValue`	`DateRange` The current date range

Methods	Type
`isYearDisabled`	`Matcher` A function that returns whether or not a year is disabled
`isYearUnavailable`	`Matcher` A function that returns whether or not a year is unavailable