Calendar

Use bo-calendar when the date grid should remain visible. For a compact field, use Date Picker.

Usage

October 2026

SunMonTueWedThuFriSat

No date selected

<bo-calendar v-model="selectedDate" />

Date limits

Pass min-date, max-date, or disabled-dates to limit selection.

October 2026

SunMonTueWedThuFriSat

<bo-calendar>
  v-model="selectedDate"
  :min-date="minDate"
  :max-date="maxDate"
/>

API

Prop / event	Type	Default	Description
id / dataTestId	string	autogenerated	Root attributes.
modelValue	Date | undefined	undefined	Selected date used by v-model.
minDate / maxDate	Date	-	Earliest and latest selectable dates.
disabledDates	Date[]	-	Dates that cannot be selected.
disabled	boolean	false	Disables navigation and selection.
locale	string	en-US	Locale used for labels and formatting.
update:modelValue	event	-	Emitted when the selected date changes.
select	(date: Date) event	-	Emitted after a selectable date is chosen.