Codey

Appearance

Calendar ​

INFO

This component uses the calendar from PrimeVue. It's full documentation can be found here.

javascript
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.