Date selector
Preview
Demo code
Inputs
| Option | Type | Default value | Possible values |
|---|---|---|---|
| color | enum | transparent | primary/secondary/black/white/transparent |
| size | enum | medium | small/medium/large |
| border | boolean | false | true/false |
| rounded | boolean | false | true/false |
| fullWidth | boolean | false | true/false |
| textAlign | enum | start | start/center/end |
| closeButtonText | string | Close | any string |
| selectedDate | Date | - | any javascript Date |
| selectedMonth | number | 1 | 1-12 |
| selectedYear | number | 2024 | 0-2038 |
| monthOptions | object[] | [] | { name, value }[] |
| yearOptions | object[] | [] | { name, value }[] |
| closeOnSelectDate | boolean | true | true/false |
| buttonClasses | string | - | any string |
| buttonSelectDateText | string | Select a date | any string |
| buttonCloseText | string | Close | any string |
| buttonSelectMonthText | string | Select month | any string |
| buttonSelectYearText | string | Select year | any string |
| dateFormatExpression | string | dd.MM.yyyy | any string |
| dropdownOffset | string | 8px | 0-[infinite]px |
| showMonthSelector | boolean | true | true/false |
| showYearSelector | boolean | true | true/false |
| dayNames | string[] | [ 'M', 'T', 'W', 'T', 'F', 'S', 'S'] | any string array |
Outputs
| Event | Type | Value |
|---|---|---|
| dateSelected | Date | Emits the selected date as a JavaScript Date object |