Calendar

INFO

This component uses the calendar from PrimeVue. Its full documentation can be found here.

import { XerCalendar } from "@xerius/codey-components";

Showcases

INFO

When using other features of the calendar outside the scope of our showcases, please contact Codey so they can ensure the required styling is available for your use case.

default Calendar

With Placeholder

With Button Bar

With Time Picker

With Calendar Button

As Month Picker

As Year Picker

As Date Range Picker

With Error

As Inline Calendar

As Invalid

As Disabled

Without Form Control

Note

Using a component directly without XerFormControl or <label> requires you to place the correct aria-label on the underlying component input element.

Props

All props from the Prime Calendar can be provided. The full documentation can be found here.

Events

All events from the Prime Calendar can be provided. The full documentation can be found here.

Slots

All slots from the Prime Calendar can be provided. The full documentation can be found here.

Automation Ids

A data-automation-id needs to be provided to the component as Prime Vue based components do not have a default data-automation-id.