Calendar - Web Component
The Calendar component can be used imported from:
Playground
Parameters
The Web component uses the <z-calendar> tag:
By default, all the parameters are optional or can be set in different, except for the ones marked as required
The parametrization of the component can be done with the following custom HTML params:
| Name | Type | Description | Slot | A11y |
|---|---|---|---|---|
model | string | The selected date. | ||
first-weekday | string | The first day of the week. | ||
calendar-type | string | The calendar type. | ||
locale | string | The localization attribute. |
Events
This component has events. Check the documentation about how to use the events.
| Name | Payload | Description |
|---|---|---|
change | string | Fires when the selected date changes. |
restarted | void | Emitted on value reset |
Parameters use
model
By defining the model prop, you can set the initial value of the input.
first-weekday
By defining the first-weekday prop, you can set the first day of the week. Possible values are sunday and monday. If not defined, the default value is monday.
calendar-type
By defining the calendar-type prop, you can set the type of the calendar.
locale
Attention!
The localization format of the input should come from the format settings of the client's operation system or browser. Check the localization docs.
By defining the locale prop, you can set the locale of the calendar. If not defined, the default will be the browser's locale.
Flags
disabled
The attribute disabled will block the interaction with the component.
Browser support
Detected engine:
Chromium
Webkit
Gecko