@vaadin/date-picker 25.1.0-alpha8 → 25.1.0-beta1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +58 -0
- package/package.json +13 -13
- package/web-types.json +140 -149
- package/web-types.lit.json +61 -61
package/custom-elements.json
CHANGED
|
@@ -472,6 +472,28 @@
|
|
|
472
472
|
"name": "close",
|
|
473
473
|
"description": "Closes the dropdown."
|
|
474
474
|
},
|
|
475
|
+
{
|
|
476
|
+
"kind": "field",
|
|
477
|
+
"name": "i18n",
|
|
478
|
+
"description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following JSON structure and default values:\n\n```js\n{\n // An array with the full names of months starting\n // with January.\n monthNames: [\n 'January', 'February', 'March', 'April', 'May',\n 'June', 'July', 'August', 'September',\n 'October', 'November', 'December'\n ],\n\n // An array of weekday names starting with Sunday. Used\n // in screen reader announcements.\n weekdays: [\n 'Sunday', 'Monday', 'Tuesday', 'Wednesday',\n 'Thursday', 'Friday', 'Saturday'\n ],\n\n // An array of short weekday names starting with Sunday.\n // Displayed in the calendar.\n weekdaysShort: [\n 'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'\n ],\n\n // An integer indicating the first day of the week\n // (0 = Sunday, 1 = Monday, etc.).\n firstDayOfWeek: 0,\n\n // Translation of the Today shortcut button text.\n today: 'Today',\n\n // Translation of the Cancel button text.\n cancel: 'Cancel',\n\n // Used for adjusting the year value when parsing dates with short years.\n // The year values between 0 and 99 are evaluated and adjusted.\n // Example: for a referenceDate of 1970-10-30;\n // dateToBeParsed: 40-10-30, result: 1940-10-30\n // dateToBeParsed: 80-10-30, result: 1980-10-30\n // dateToBeParsed: 10-10-30, result: 2010-10-30\n // Supported date format: ISO 8601 `\"YYYY-MM-DD\"` (default)\n // The default value is the current date.\n referenceDate: '',\n\n // A function to format given `Object` as\n // date string. Object is in the format `{ day: ..., month: ..., year: ... }`\n // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n formatDate: d => {\n // returns a string representation of the given\n // object in 'MM/DD/YYYY' -format\n },\n\n // A function to parse the given text to an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n // Must properly parse (at least) text formatted by `formatDate`.\n // Setting the property to null will disable keyboard input feature.\n // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n parseDate: text => {\n // Parses a string in 'MM/DD/YY', 'MM/DD' or 'DD' -format to\n // an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n }\n\n // A function to format given `monthName` and\n // `fullYear` integer as calendar title string.\n formatTitle: (monthName, fullYear) => {\n return monthName + ' ' + fullYear;\n }\n}\n```",
|
|
479
|
+
"return": {
|
|
480
|
+
"type": {
|
|
481
|
+
"text": "!DatePickerI18n"
|
|
482
|
+
}
|
|
483
|
+
},
|
|
484
|
+
"parameters": [
|
|
485
|
+
{
|
|
486
|
+
"name": "value",
|
|
487
|
+
"type": {
|
|
488
|
+
"text": "Object"
|
|
489
|
+
}
|
|
490
|
+
}
|
|
491
|
+
],
|
|
492
|
+
"inheritedFrom": {
|
|
493
|
+
"name": "I18nMixin",
|
|
494
|
+
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
495
|
+
}
|
|
496
|
+
},
|
|
475
497
|
{
|
|
476
498
|
"kind": "field",
|
|
477
499
|
"name": "initialPosition",
|
|
@@ -568,6 +590,13 @@
|
|
|
568
590
|
"description": "Set true to prevent the overlay from opening automatically.",
|
|
569
591
|
"fieldName": "autoOpenDisabled"
|
|
570
592
|
},
|
|
593
|
+
{
|
|
594
|
+
"name": "i18n",
|
|
595
|
+
"inheritedFrom": {
|
|
596
|
+
"name": "I18nMixin",
|
|
597
|
+
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
598
|
+
}
|
|
599
|
+
},
|
|
571
600
|
{
|
|
572
601
|
"name": "initial-position",
|
|
573
602
|
"description": "Date which should be visible when there is no value selected.\n\nThe same date formats as for the `value` property are supported.",
|
|
@@ -1696,6 +1725,28 @@
|
|
|
1696
1725
|
"package": "@vaadin/field-base/src/field-mixin.js"
|
|
1697
1726
|
}
|
|
1698
1727
|
},
|
|
1728
|
+
{
|
|
1729
|
+
"kind": "field",
|
|
1730
|
+
"name": "i18n",
|
|
1731
|
+
"description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following JSON structure and default values:\n\n```js\n{\n // An array with the full names of months starting\n // with January.\n monthNames: [\n 'January', 'February', 'March', 'April', 'May',\n 'June', 'July', 'August', 'September',\n 'October', 'November', 'December'\n ],\n\n // An array of weekday names starting with Sunday. Used\n // in screen reader announcements.\n weekdays: [\n 'Sunday', 'Monday', 'Tuesday', 'Wednesday',\n 'Thursday', 'Friday', 'Saturday'\n ],\n\n // An array of short weekday names starting with Sunday.\n // Displayed in the calendar.\n weekdaysShort: [\n 'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'\n ],\n\n // An integer indicating the first day of the week\n // (0 = Sunday, 1 = Monday, etc.).\n firstDayOfWeek: 0,\n\n // Translation of the Today shortcut button text.\n today: 'Today',\n\n // Translation of the Cancel button text.\n cancel: 'Cancel',\n\n // Used for adjusting the year value when parsing dates with short years.\n // The year values between 0 and 99 are evaluated and adjusted.\n // Example: for a referenceDate of 1970-10-30;\n // dateToBeParsed: 40-10-30, result: 1940-10-30\n // dateToBeParsed: 80-10-30, result: 1980-10-30\n // dateToBeParsed: 10-10-30, result: 2010-10-30\n // Supported date format: ISO 8601 `\"YYYY-MM-DD\"` (default)\n // The default value is the current date.\n referenceDate: '',\n\n // A function to format given `Object` as\n // date string. Object is in the format `{ day: ..., month: ..., year: ... }`\n // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n formatDate: d => {\n // returns a string representation of the given\n // object in 'MM/DD/YYYY' -format\n },\n\n // A function to parse the given text to an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n // Must properly parse (at least) text formatted by `formatDate`.\n // Setting the property to null will disable keyboard input feature.\n // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n parseDate: text => {\n // Parses a string in 'MM/DD/YY', 'MM/DD' or 'DD' -format to\n // an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n }\n\n // A function to format given `monthName` and\n // `fullYear` integer as calendar title string.\n formatTitle: (monthName, fullYear) => {\n return monthName + ' ' + fullYear;\n }\n}\n```",
|
|
1732
|
+
"return": {
|
|
1733
|
+
"type": {
|
|
1734
|
+
"text": "!DatePickerI18n"
|
|
1735
|
+
}
|
|
1736
|
+
},
|
|
1737
|
+
"parameters": [
|
|
1738
|
+
{
|
|
1739
|
+
"name": "value",
|
|
1740
|
+
"type": {
|
|
1741
|
+
"text": "Object"
|
|
1742
|
+
}
|
|
1743
|
+
}
|
|
1744
|
+
],
|
|
1745
|
+
"inheritedFrom": {
|
|
1746
|
+
"name": "I18nMixin",
|
|
1747
|
+
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
1748
|
+
}
|
|
1749
|
+
},
|
|
1699
1750
|
{
|
|
1700
1751
|
"kind": "field",
|
|
1701
1752
|
"name": "initialPosition",
|
|
@@ -2006,6 +2057,13 @@
|
|
|
2006
2057
|
"package": "@vaadin/field-base/src/field-mixin.js"
|
|
2007
2058
|
}
|
|
2008
2059
|
},
|
|
2060
|
+
{
|
|
2061
|
+
"name": "i18n",
|
|
2062
|
+
"inheritedFrom": {
|
|
2063
|
+
"name": "I18nMixin",
|
|
2064
|
+
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
2065
|
+
}
|
|
2066
|
+
},
|
|
2009
2067
|
{
|
|
2010
2068
|
"name": "initial-position",
|
|
2011
2069
|
"description": "Date which should be visible when there is no value selected.\n\nThe same date formats as for the `value` property are supported.",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/date-picker",
|
|
3
|
-
"version": "25.1.0-
|
|
3
|
+
"version": "25.1.0-beta1",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -35,21 +35,21 @@
|
|
|
35
35
|
],
|
|
36
36
|
"dependencies": {
|
|
37
37
|
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
38
|
-
"@vaadin/a11y-base": "25.1.0-
|
|
39
|
-
"@vaadin/button": "25.1.0-
|
|
40
|
-
"@vaadin/component-base": "25.1.0-
|
|
41
|
-
"@vaadin/field-base": "25.1.0-
|
|
42
|
-
"@vaadin/input-container": "25.1.0-
|
|
43
|
-
"@vaadin/overlay": "25.1.0-
|
|
44
|
-
"@vaadin/vaadin-themable-mixin": "25.1.0-
|
|
38
|
+
"@vaadin/a11y-base": "25.1.0-beta1",
|
|
39
|
+
"@vaadin/button": "25.1.0-beta1",
|
|
40
|
+
"@vaadin/component-base": "25.1.0-beta1",
|
|
41
|
+
"@vaadin/field-base": "25.1.0-beta1",
|
|
42
|
+
"@vaadin/input-container": "25.1.0-beta1",
|
|
43
|
+
"@vaadin/overlay": "25.1.0-beta1",
|
|
44
|
+
"@vaadin/vaadin-themable-mixin": "25.1.0-beta1",
|
|
45
45
|
"lit": "^3.0.0"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
|
48
|
-
"@vaadin/aura": "25.1.0-
|
|
49
|
-
"@vaadin/chai-plugins": "25.1.0-
|
|
50
|
-
"@vaadin/test-runner-commands": "25.1.0-
|
|
48
|
+
"@vaadin/aura": "25.1.0-beta1",
|
|
49
|
+
"@vaadin/chai-plugins": "25.1.0-beta1",
|
|
50
|
+
"@vaadin/test-runner-commands": "25.1.0-beta1",
|
|
51
51
|
"@vaadin/testing-helpers": "^2.0.0",
|
|
52
|
-
"@vaadin/vaadin-lumo-styles": "25.1.0-
|
|
52
|
+
"@vaadin/vaadin-lumo-styles": "25.1.0-beta1",
|
|
53
53
|
"sinon": "^21.0.0"
|
|
54
54
|
},
|
|
55
55
|
"customElements": "custom-elements.json",
|
|
@@ -57,5 +57,5 @@
|
|
|
57
57
|
"web-types.json",
|
|
58
58
|
"web-types.lit.json"
|
|
59
59
|
],
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "0ccf77c385fc6a92ac2a6344ce8804b94956226d"
|
|
61
61
|
}
|
package/web-types.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://json.schemastore.org/web-types",
|
|
3
3
|
"name": "@vaadin/date-picker",
|
|
4
|
-
"version": "25.1.0-
|
|
4
|
+
"version": "25.1.0-beta1",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
@@ -11,30 +11,30 @@
|
|
|
11
11
|
"description": "`<vaadin-date-picker>` is an input field that allows to enter a date by typing or by selecting from a calendar overlay.\n\n```html\n<vaadin-date-picker label=\"Birthday\"></vaadin-date-picker>\n```\n```js\ndatePicker.value = '2016-03-02';\n```\n\nWhen the selected `value` is changed, a `value-changed` event is triggered.\n\n### Styling\n\nThe following custom properties are available for styling:\n\nCustom property | Description | Default\n-------------------------------|----------------------------|---------\n`--vaadin-field-default-width` | Default width of the field | `12em`\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|----------------\n`label` | The label element\n`input-field` | The element that wraps prefix, value and buttons\n`field-button` | Set on both clear and toggle buttons\n`clear-button` | The clear button\n`error-message` | The error message element\n`helper-text` | The helper text element wrapper\n`required-indicator` | The `required` state indicator element\n`toggle-button` | The toggle button\n`backdrop` | Backdrop of the overlay\n`overlay` | The overlay container\n`content` | The overlay content\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n---------------------|---------------------------------\n`disabled` | Set when the element is disabled\n`has-value` | Set when the element has a value\n`has-label` | Set when the element has a label\n`has-helper` | Set when the element has helper text or slot\n`has-error-message` | Set when the element has an error message\n`has-tooltip` | Set when the element has a slotted tooltip\n`invalid` | Set when the element is invalid\n`focused` | Set when the element is focused\n`focus-ring` | Set when the element is keyboard focused\n`readonly` | Set when the element is readonly\n`opened` | Set when the overlay is opened\n`week-numbers` | Set when week numbers are shown in the calendar\n\n### Internal components\n\nIn addition to `<vaadin-date-picker>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-date-picker-overlay-content>`\n- `<vaadin-date-picker-month-scroller>`\n- `<vaadin-date-picker-year-scroller>`\n- `<vaadin-date-picker-year>`\n- `<vaadin-month-calendar>`\n\nIn order to style the overlay content, use `<vaadin-date-picker-overlay-content>` shadow DOM parts:\n\nPart name | Description\n----------------------|--------------------\n`years-toggle-button` | Fullscreen mode years scroller toggle\n`toolbar` | Toolbar with slotted buttons\n\nThe following state attributes are available on the `<vaadin-date-picker-overlay-content>` element:\n\nAttribute | Description\n----------------|-------------------------------------------------\n`desktop` | Set when the overlay content is in desktop mode\n`fullscreen` | Set when the overlay content is in fullscreen mode\n`years-visible` | Set when the year scroller is visible in fullscreen mode\n\nIn order to style the month calendar, use `<vaadin-month-calendar>` shadow DOM parts:\n\nPart name | Description\n----------------------|--------------------\n`month-header` | Month title\n`weekdays` | Weekday container\n`weekday` | Weekday element\n`week-numbers` | Week numbers container\n`week-number` | Week number element\n`date` | Date element\n`disabled` | Disabled date element\n`focused` | Focused date element\n`selected` | Selected date element\n`today` | Date element corresponding to the current day\n`past` | Date element corresponding to the date in the past\n`future` | Date element corresponding to the date in the future\n\nIn order to style year scroller elements, use `<vaadin-date-picker-year>` shadow DOM parts:\n\nPart name | Description\n----------------------|--------------------\n`year-number` | Year number\n`year-separator` | Year separator\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n\n### Change events\n\nDepending on the nature of the value change that the user attempts to commit e.g. by pressing Enter,\nthe component can fire either a `change` event or an `unparsable-change` event:\n\nValue change | Event\n:------------------------|:------------------\nempty => parsable | change\nempty => unparsable | unparsable-change\nparsable => empty | change\nparsable => parsable | change\nparsable => unparsable | change\nunparsable => empty | unparsable-change\nunparsable => parsable | change\nunparsable => unparsable | unparsable-change",
|
|
12
12
|
"attributes": [
|
|
13
13
|
{
|
|
14
|
-
"name": "
|
|
15
|
-
"description": "
|
|
14
|
+
"name": "accessible-name",
|
|
15
|
+
"description": "String used to label the component to screen reader users.",
|
|
16
16
|
"value": {
|
|
17
17
|
"type": [
|
|
18
|
-
"
|
|
18
|
+
"string",
|
|
19
19
|
"null",
|
|
20
20
|
"undefined"
|
|
21
21
|
]
|
|
22
22
|
}
|
|
23
23
|
},
|
|
24
24
|
{
|
|
25
|
-
"name": "
|
|
26
|
-
"description": "
|
|
25
|
+
"name": "accessible-name-ref",
|
|
26
|
+
"description": "Id of the element used as label of the component to screen reader users.",
|
|
27
27
|
"value": {
|
|
28
28
|
"type": [
|
|
29
|
-
"
|
|
29
|
+
"string",
|
|
30
30
|
"null",
|
|
31
31
|
"undefined"
|
|
32
32
|
]
|
|
33
33
|
}
|
|
34
34
|
},
|
|
35
35
|
{
|
|
36
|
-
"name": "
|
|
37
|
-
"description": "
|
|
36
|
+
"name": "allowed-char-pattern",
|
|
37
|
+
"description": "A pattern matched against individual characters the user inputs.\n\nWhen set, the field will prevent:\n- `keydown` events if the entered key doesn't match `/^allowedCharPattern$/`\n- `paste` events if the pasted text doesn't match `/^allowedCharPattern*$/`\n- `drop` events if the dropped text doesn't match `/^allowedCharPattern*$/`\n\nFor example, to allow entering only numbers and minus signs, use:\n`allowedCharPattern = \"[\\\\d-]\"`",
|
|
38
38
|
"value": {
|
|
39
39
|
"type": [
|
|
40
40
|
"string",
|
|
@@ -44,8 +44,8 @@
|
|
|
44
44
|
}
|
|
45
45
|
},
|
|
46
46
|
{
|
|
47
|
-
"name": "
|
|
48
|
-
"description": "Set to
|
|
47
|
+
"name": "auto-open-disabled",
|
|
48
|
+
"description": "Set true to prevent the overlay from opening automatically.",
|
|
49
49
|
"value": {
|
|
50
50
|
"type": [
|
|
51
51
|
"boolean",
|
|
@@ -55,8 +55,8 @@
|
|
|
55
55
|
}
|
|
56
56
|
},
|
|
57
57
|
{
|
|
58
|
-
"name": "
|
|
59
|
-
"description": "
|
|
58
|
+
"name": "autofocus",
|
|
59
|
+
"description": "Specify that this control should have input focus when the page loads.",
|
|
60
60
|
"value": {
|
|
61
61
|
"type": [
|
|
62
62
|
"boolean",
|
|
@@ -66,8 +66,8 @@
|
|
|
66
66
|
}
|
|
67
67
|
},
|
|
68
68
|
{
|
|
69
|
-
"name": "
|
|
70
|
-
"description": "
|
|
69
|
+
"name": "autoselect",
|
|
70
|
+
"description": "If true, the input text gets fully selected when the field is focused using click or touch / tap.",
|
|
71
71
|
"value": {
|
|
72
72
|
"type": [
|
|
73
73
|
"boolean",
|
|
@@ -77,30 +77,30 @@
|
|
|
77
77
|
}
|
|
78
78
|
},
|
|
79
79
|
{
|
|
80
|
-
"name": "
|
|
81
|
-
"description": "
|
|
80
|
+
"name": "clear-button-visible",
|
|
81
|
+
"description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
|
|
82
82
|
"value": {
|
|
83
83
|
"type": [
|
|
84
|
-
"
|
|
84
|
+
"boolean",
|
|
85
85
|
"null",
|
|
86
86
|
"undefined"
|
|
87
87
|
]
|
|
88
88
|
}
|
|
89
89
|
},
|
|
90
90
|
{
|
|
91
|
-
"name": "
|
|
92
|
-
"description": "
|
|
91
|
+
"name": "disabled",
|
|
92
|
+
"description": "If true, the user cannot interact with this element.",
|
|
93
93
|
"value": {
|
|
94
94
|
"type": [
|
|
95
|
-
"
|
|
95
|
+
"boolean",
|
|
96
96
|
"null",
|
|
97
97
|
"undefined"
|
|
98
98
|
]
|
|
99
99
|
}
|
|
100
100
|
},
|
|
101
101
|
{
|
|
102
|
-
"name": "
|
|
103
|
-
"description": "
|
|
102
|
+
"name": "error-message",
|
|
103
|
+
"description": "Error to show when the field is invalid.",
|
|
104
104
|
"value": {
|
|
105
105
|
"type": [
|
|
106
106
|
"string",
|
|
@@ -110,8 +110,8 @@
|
|
|
110
110
|
}
|
|
111
111
|
},
|
|
112
112
|
{
|
|
113
|
-
"name": "
|
|
114
|
-
"description": "
|
|
113
|
+
"name": "helper-text",
|
|
114
|
+
"description": "String used for the helper text.",
|
|
115
115
|
"value": {
|
|
116
116
|
"type": [
|
|
117
117
|
"string",
|
|
@@ -121,17 +121,19 @@
|
|
|
121
121
|
}
|
|
122
122
|
},
|
|
123
123
|
{
|
|
124
|
-
"name": "
|
|
125
|
-
"description": "
|
|
124
|
+
"name": "initial-position",
|
|
125
|
+
"description": "Date which should be visible when there is no value selected.\n\nThe same date formats as for the `value` property are supported.",
|
|
126
126
|
"value": {
|
|
127
127
|
"type": [
|
|
128
|
-
"string"
|
|
128
|
+
"string",
|
|
129
|
+
"null",
|
|
130
|
+
"undefined"
|
|
129
131
|
]
|
|
130
132
|
}
|
|
131
133
|
},
|
|
132
134
|
{
|
|
133
|
-
"name": "
|
|
134
|
-
"description": "Set to true
|
|
135
|
+
"name": "invalid",
|
|
136
|
+
"description": "Set to true when the field is invalid.",
|
|
135
137
|
"value": {
|
|
136
138
|
"type": [
|
|
137
139
|
"boolean",
|
|
@@ -141,8 +143,8 @@
|
|
|
141
143
|
}
|
|
142
144
|
},
|
|
143
145
|
{
|
|
144
|
-
"name": "
|
|
145
|
-
"description": "
|
|
146
|
+
"name": "label",
|
|
147
|
+
"description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
|
|
146
148
|
"value": {
|
|
147
149
|
"type": [
|
|
148
150
|
"string",
|
|
@@ -152,8 +154,8 @@
|
|
|
152
154
|
}
|
|
153
155
|
},
|
|
154
156
|
{
|
|
155
|
-
"name": "
|
|
156
|
-
"description": "
|
|
157
|
+
"name": "manual-validation",
|
|
158
|
+
"description": "Set to true to enable manual validation mode. This mode disables automatic\nconstraint validation, allowing you to control the validation process yourself.\nYou can still trigger constraint validation manually with the `validate()` method\nor use `checkValidity()` to assess the component's validity without affecting\nthe invalid state. In manual validation mode, you can also manipulate\nthe `invalid` property directly through your application logic without conflicts\nwith the component's internal validation.",
|
|
157
159
|
"value": {
|
|
158
160
|
"type": [
|
|
159
161
|
"boolean",
|
|
@@ -163,61 +165,50 @@
|
|
|
163
165
|
}
|
|
164
166
|
},
|
|
165
167
|
{
|
|
166
|
-
"name": "
|
|
167
|
-
"description": "The
|
|
168
|
+
"name": "max",
|
|
169
|
+
"description": "The latest date that can be selected. All later dates will be disabled.\n\nSupported date formats:\n- ISO 8601 `\"YYYY-MM-DD\"` (default)\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
|
|
168
170
|
"value": {
|
|
169
171
|
"type": [
|
|
170
172
|
"string",
|
|
171
|
-
"null",
|
|
172
173
|
"undefined"
|
|
173
174
|
]
|
|
174
175
|
}
|
|
175
176
|
},
|
|
176
177
|
{
|
|
177
|
-
"name": "
|
|
178
|
-
"description": "
|
|
178
|
+
"name": "min",
|
|
179
|
+
"description": "The earliest date that can be selected. All earlier dates will be disabled.\n\nSupported date formats:\n- ISO 8601 `\"YYYY-MM-DD\"` (default)\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
|
|
179
180
|
"value": {
|
|
180
181
|
"type": [
|
|
181
182
|
"string",
|
|
182
|
-
"null",
|
|
183
183
|
"undefined"
|
|
184
184
|
]
|
|
185
185
|
}
|
|
186
186
|
},
|
|
187
187
|
{
|
|
188
|
-
"name": "
|
|
189
|
-
"description": "
|
|
188
|
+
"name": "name",
|
|
189
|
+
"description": "The name of this field.",
|
|
190
190
|
"value": {
|
|
191
191
|
"type": [
|
|
192
|
-
"
|
|
192
|
+
"string",
|
|
193
193
|
"null",
|
|
194
194
|
"undefined"
|
|
195
195
|
]
|
|
196
196
|
}
|
|
197
197
|
},
|
|
198
198
|
{
|
|
199
|
-
"name": "
|
|
200
|
-
"description": "
|
|
199
|
+
"name": "opened",
|
|
200
|
+
"description": "Set true to open the date selector overlay.",
|
|
201
201
|
"value": {
|
|
202
202
|
"type": [
|
|
203
|
-
"
|
|
203
|
+
"boolean",
|
|
204
204
|
"null",
|
|
205
205
|
"undefined"
|
|
206
206
|
]
|
|
207
207
|
}
|
|
208
208
|
},
|
|
209
209
|
{
|
|
210
|
-
"name": "
|
|
211
|
-
"description": "
|
|
212
|
-
"value": {
|
|
213
|
-
"type": [
|
|
214
|
-
"Object"
|
|
215
|
-
]
|
|
216
|
-
}
|
|
217
|
-
},
|
|
218
|
-
{
|
|
219
|
-
"name": "initial-position",
|
|
220
|
-
"description": "Date which should be visible when there is no value selected.\n\nThe same date formats as for the `value` property are supported.",
|
|
210
|
+
"name": "placeholder",
|
|
211
|
+
"description": "A hint to the user of what can be entered in the field.",
|
|
221
212
|
"value": {
|
|
222
213
|
"type": [
|
|
223
214
|
"string",
|
|
@@ -227,8 +218,8 @@
|
|
|
227
218
|
}
|
|
228
219
|
},
|
|
229
220
|
{
|
|
230
|
-
"name": "
|
|
231
|
-
"description": "
|
|
221
|
+
"name": "readonly",
|
|
222
|
+
"description": "When present, it specifies that the field is read-only.",
|
|
232
223
|
"value": {
|
|
233
224
|
"type": [
|
|
234
225
|
"boolean",
|
|
@@ -238,8 +229,8 @@
|
|
|
238
229
|
}
|
|
239
230
|
},
|
|
240
231
|
{
|
|
241
|
-
"name": "
|
|
242
|
-
"description": "
|
|
232
|
+
"name": "required",
|
|
233
|
+
"description": "Specifies that the user must fill in a value.",
|
|
243
234
|
"value": {
|
|
244
235
|
"type": [
|
|
245
236
|
"boolean",
|
|
@@ -260,33 +251,33 @@
|
|
|
260
251
|
}
|
|
261
252
|
},
|
|
262
253
|
{
|
|
263
|
-
"name": "
|
|
264
|
-
"description": "The
|
|
254
|
+
"name": "theme",
|
|
255
|
+
"description": "The theme variants to apply to the component.",
|
|
265
256
|
"value": {
|
|
266
257
|
"type": [
|
|
267
258
|
"string",
|
|
259
|
+
"null",
|
|
268
260
|
"undefined"
|
|
269
261
|
]
|
|
270
262
|
}
|
|
271
263
|
},
|
|
272
264
|
{
|
|
273
|
-
"name": "
|
|
274
|
-
"description": "The
|
|
265
|
+
"name": "title",
|
|
266
|
+
"description": "The text usually displayed in a tooltip popup when the mouse is over the field.",
|
|
275
267
|
"value": {
|
|
276
268
|
"type": [
|
|
277
269
|
"string",
|
|
270
|
+
"null",
|
|
278
271
|
"undefined"
|
|
279
272
|
]
|
|
280
273
|
}
|
|
281
274
|
},
|
|
282
275
|
{
|
|
283
|
-
"name": "
|
|
284
|
-
"description": "
|
|
276
|
+
"name": "value",
|
|
277
|
+
"description": "Selected date.\n\nSupported date formats:\n- ISO 8601 `\"YYYY-MM-DD\"` (default)\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
|
|
285
278
|
"value": {
|
|
286
279
|
"type": [
|
|
287
|
-
"string"
|
|
288
|
-
"null",
|
|
289
|
-
"undefined"
|
|
280
|
+
"string"
|
|
290
281
|
]
|
|
291
282
|
}
|
|
292
283
|
}
|
|
@@ -294,30 +285,30 @@
|
|
|
294
285
|
"js": {
|
|
295
286
|
"properties": [
|
|
296
287
|
{
|
|
297
|
-
"name": "
|
|
298
|
-
"description": "
|
|
288
|
+
"name": "accessibleName",
|
|
289
|
+
"description": "String used to label the component to screen reader users.",
|
|
299
290
|
"value": {
|
|
300
291
|
"type": [
|
|
301
|
-
"
|
|
292
|
+
"string",
|
|
302
293
|
"null",
|
|
303
294
|
"undefined"
|
|
304
295
|
]
|
|
305
296
|
}
|
|
306
297
|
},
|
|
307
298
|
{
|
|
308
|
-
"name": "
|
|
309
|
-
"description": "
|
|
299
|
+
"name": "accessibleNameRef",
|
|
300
|
+
"description": "Id of the element used as label of the component to screen reader users.",
|
|
310
301
|
"value": {
|
|
311
302
|
"type": [
|
|
312
|
-
"
|
|
303
|
+
"string",
|
|
313
304
|
"null",
|
|
314
305
|
"undefined"
|
|
315
306
|
]
|
|
316
307
|
}
|
|
317
308
|
},
|
|
318
309
|
{
|
|
319
|
-
"name": "
|
|
320
|
-
"description": "
|
|
310
|
+
"name": "allowedCharPattern",
|
|
311
|
+
"description": "A pattern matched against individual characters the user inputs.\n\nWhen set, the field will prevent:\n- `keydown` events if the entered key doesn't match `/^allowedCharPattern$/`\n- `paste` events if the pasted text doesn't match `/^allowedCharPattern*$/`\n- `drop` events if the dropped text doesn't match `/^allowedCharPattern*$/`\n\nFor example, to allow entering only numbers and minus signs, use:\n`allowedCharPattern = \"[\\\\d-]\"`",
|
|
321
312
|
"value": {
|
|
322
313
|
"type": [
|
|
323
314
|
"string",
|
|
@@ -327,8 +318,8 @@
|
|
|
327
318
|
}
|
|
328
319
|
},
|
|
329
320
|
{
|
|
330
|
-
"name": "
|
|
331
|
-
"description": "
|
|
321
|
+
"name": "autofocus",
|
|
322
|
+
"description": "Specify that this control should have input focus when the page loads.",
|
|
332
323
|
"value": {
|
|
333
324
|
"type": [
|
|
334
325
|
"boolean",
|
|
@@ -338,8 +329,8 @@
|
|
|
338
329
|
}
|
|
339
330
|
},
|
|
340
331
|
{
|
|
341
|
-
"name": "
|
|
342
|
-
"description": "Set
|
|
332
|
+
"name": "autoOpenDisabled",
|
|
333
|
+
"description": "Set true to prevent the overlay from opening automatically.",
|
|
343
334
|
"value": {
|
|
344
335
|
"type": [
|
|
345
336
|
"boolean",
|
|
@@ -349,8 +340,8 @@
|
|
|
349
340
|
}
|
|
350
341
|
},
|
|
351
342
|
{
|
|
352
|
-
"name": "
|
|
353
|
-
"description": "
|
|
343
|
+
"name": "autoselect",
|
|
344
|
+
"description": "If true, the input text gets fully selected when the field is focused using click or touch / tap.",
|
|
354
345
|
"value": {
|
|
355
346
|
"type": [
|
|
356
347
|
"boolean",
|
|
@@ -360,30 +351,30 @@
|
|
|
360
351
|
}
|
|
361
352
|
},
|
|
362
353
|
{
|
|
363
|
-
"name": "
|
|
364
|
-
"description": "
|
|
354
|
+
"name": "clearButtonVisible",
|
|
355
|
+
"description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
|
|
365
356
|
"value": {
|
|
366
357
|
"type": [
|
|
367
|
-
"
|
|
358
|
+
"boolean",
|
|
368
359
|
"null",
|
|
369
360
|
"undefined"
|
|
370
361
|
]
|
|
371
362
|
}
|
|
372
363
|
},
|
|
373
364
|
{
|
|
374
|
-
"name": "
|
|
375
|
-
"description": "
|
|
365
|
+
"name": "disabled",
|
|
366
|
+
"description": "If true, the user cannot interact with this element.",
|
|
376
367
|
"value": {
|
|
377
368
|
"type": [
|
|
378
|
-
"
|
|
369
|
+
"boolean",
|
|
379
370
|
"null",
|
|
380
371
|
"undefined"
|
|
381
372
|
]
|
|
382
373
|
}
|
|
383
374
|
},
|
|
384
375
|
{
|
|
385
|
-
"name": "
|
|
386
|
-
"description": "
|
|
376
|
+
"name": "errorMessage",
|
|
377
|
+
"description": "Error to show when the field is invalid.",
|
|
387
378
|
"value": {
|
|
388
379
|
"type": [
|
|
389
380
|
"string",
|
|
@@ -393,8 +384,8 @@
|
|
|
393
384
|
}
|
|
394
385
|
},
|
|
395
386
|
{
|
|
396
|
-
"name": "
|
|
397
|
-
"description": "
|
|
387
|
+
"name": "helperText",
|
|
388
|
+
"description": "String used for the helper text.",
|
|
398
389
|
"value": {
|
|
399
390
|
"type": [
|
|
400
391
|
"string",
|
|
@@ -404,28 +395,17 @@
|
|
|
404
395
|
}
|
|
405
396
|
},
|
|
406
397
|
{
|
|
407
|
-
"name": "
|
|
408
|
-
"description": "
|
|
409
|
-
"value": {
|
|
410
|
-
"type": [
|
|
411
|
-
"string"
|
|
412
|
-
]
|
|
413
|
-
}
|
|
414
|
-
},
|
|
415
|
-
{
|
|
416
|
-
"name": "clearButtonVisible",
|
|
417
|
-
"description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
|
|
398
|
+
"name": "i18n",
|
|
399
|
+
"description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following JSON structure and default values:\n\n```js\n{\n // An array with the full names of months starting\n // with January.\n monthNames: [\n 'January', 'February', 'March', 'April', 'May',\n 'June', 'July', 'August', 'September',\n 'October', 'November', 'December'\n ],\n\n // An array of weekday names starting with Sunday. Used\n // in screen reader announcements.\n weekdays: [\n 'Sunday', 'Monday', 'Tuesday', 'Wednesday',\n 'Thursday', 'Friday', 'Saturday'\n ],\n\n // An array of short weekday names starting with Sunday.\n // Displayed in the calendar.\n weekdaysShort: [\n 'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'\n ],\n\n // An integer indicating the first day of the week\n // (0 = Sunday, 1 = Monday, etc.).\n firstDayOfWeek: 0,\n\n // Translation of the Today shortcut button text.\n today: 'Today',\n\n // Translation of the Cancel button text.\n cancel: 'Cancel',\n\n // Used for adjusting the year value when parsing dates with short years.\n // The year values between 0 and 99 are evaluated and adjusted.\n // Example: for a referenceDate of 1970-10-30;\n // dateToBeParsed: 40-10-30, result: 1940-10-30\n // dateToBeParsed: 80-10-30, result: 1980-10-30\n // dateToBeParsed: 10-10-30, result: 2010-10-30\n // Supported date format: ISO 8601 `\"YYYY-MM-DD\"` (default)\n // The default value is the current date.\n referenceDate: '',\n\n // A function to format given `Object` as\n // date string. Object is in the format `{ day: ..., month: ..., year: ... }`\n // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n formatDate: d => {\n // returns a string representation of the given\n // object in 'MM/DD/YYYY' -format\n },\n\n // A function to parse the given text to an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n // Must properly parse (at least) text formatted by `formatDate`.\n // Setting the property to null will disable keyboard input feature.\n // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n parseDate: text => {\n // Parses a string in 'MM/DD/YY', 'MM/DD' or 'DD' -format to\n // an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n }\n\n // A function to format given `monthName` and\n // `fullYear` integer as calendar title string.\n formatTitle: (monthName, fullYear) => {\n return monthName + ' ' + fullYear;\n }\n}\n```",
|
|
418
400
|
"value": {
|
|
419
401
|
"type": [
|
|
420
|
-
"
|
|
421
|
-
"null",
|
|
422
|
-
"undefined"
|
|
402
|
+
"DatePickerI18n"
|
|
423
403
|
]
|
|
424
404
|
}
|
|
425
405
|
},
|
|
426
406
|
{
|
|
427
|
-
"name": "
|
|
428
|
-
"description": "
|
|
407
|
+
"name": "initialPosition",
|
|
408
|
+
"description": "Date which should be visible when there is no value selected.\n\nThe same date formats as for the `value` property are supported.",
|
|
429
409
|
"value": {
|
|
430
410
|
"type": [
|
|
431
411
|
"string",
|
|
@@ -435,8 +415,8 @@
|
|
|
435
415
|
}
|
|
436
416
|
},
|
|
437
417
|
{
|
|
438
|
-
"name": "
|
|
439
|
-
"description": "
|
|
418
|
+
"name": "invalid",
|
|
419
|
+
"description": "Set to true when the field is invalid.",
|
|
440
420
|
"value": {
|
|
441
421
|
"type": [
|
|
442
422
|
"boolean",
|
|
@@ -446,19 +426,18 @@
|
|
|
446
426
|
}
|
|
447
427
|
},
|
|
448
428
|
{
|
|
449
|
-
"name": "
|
|
450
|
-
"description": "
|
|
429
|
+
"name": "isDateDisabled",
|
|
430
|
+
"description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.",
|
|
451
431
|
"value": {
|
|
452
432
|
"type": [
|
|
453
|
-
"
|
|
454
|
-
"null",
|
|
433
|
+
"function DatePickerDate: boolean",
|
|
455
434
|
"undefined"
|
|
456
435
|
]
|
|
457
436
|
}
|
|
458
437
|
},
|
|
459
438
|
{
|
|
460
|
-
"name": "
|
|
461
|
-
"description": "
|
|
439
|
+
"name": "label",
|
|
440
|
+
"description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
|
|
462
441
|
"value": {
|
|
463
442
|
"type": [
|
|
464
443
|
"string",
|
|
@@ -468,8 +447,8 @@
|
|
|
468
447
|
}
|
|
469
448
|
},
|
|
470
449
|
{
|
|
471
|
-
"name": "
|
|
472
|
-
"description": "
|
|
450
|
+
"name": "manualValidation",
|
|
451
|
+
"description": "Set to true to enable manual validation mode. This mode disables automatic\nconstraint validation, allowing you to control the validation process yourself.\nYou can still trigger constraint validation manually with the `validate()` method\nor use `checkValidity()` to assess the component's validity without affecting\nthe invalid state. In manual validation mode, you can also manipulate\nthe `invalid` property directly through your application logic without conflicts\nwith the component's internal validation.",
|
|
473
452
|
"value": {
|
|
474
453
|
"type": [
|
|
475
454
|
"boolean",
|
|
@@ -479,28 +458,28 @@
|
|
|
479
458
|
}
|
|
480
459
|
},
|
|
481
460
|
{
|
|
482
|
-
"name": "
|
|
483
|
-
"description": "The
|
|
461
|
+
"name": "max",
|
|
462
|
+
"description": "The latest date that can be selected. All later dates will be disabled.\n\nSupported date formats:\n- ISO 8601 `\"YYYY-MM-DD\"` (default)\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
|
|
484
463
|
"value": {
|
|
485
464
|
"type": [
|
|
486
465
|
"string",
|
|
487
|
-
"null",
|
|
488
466
|
"undefined"
|
|
489
467
|
]
|
|
490
468
|
}
|
|
491
469
|
},
|
|
492
470
|
{
|
|
493
|
-
"name": "
|
|
494
|
-
"description": "The
|
|
471
|
+
"name": "min",
|
|
472
|
+
"description": "The earliest date that can be selected. All earlier dates will be disabled.\n\nSupported date formats:\n- ISO 8601 `\"YYYY-MM-DD\"` (default)\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
|
|
495
473
|
"value": {
|
|
496
474
|
"type": [
|
|
497
|
-
"
|
|
475
|
+
"string",
|
|
476
|
+
"undefined"
|
|
498
477
|
]
|
|
499
478
|
}
|
|
500
479
|
},
|
|
501
480
|
{
|
|
502
|
-
"name": "
|
|
503
|
-
"description": "
|
|
481
|
+
"name": "name",
|
|
482
|
+
"description": "The name of this field.",
|
|
504
483
|
"value": {
|
|
505
484
|
"type": [
|
|
506
485
|
"string",
|
|
@@ -521,8 +500,19 @@
|
|
|
521
500
|
}
|
|
522
501
|
},
|
|
523
502
|
{
|
|
524
|
-
"name": "
|
|
525
|
-
"description": "
|
|
503
|
+
"name": "placeholder",
|
|
504
|
+
"description": "A hint to the user of what can be entered in the field.",
|
|
505
|
+
"value": {
|
|
506
|
+
"type": [
|
|
507
|
+
"string",
|
|
508
|
+
"null",
|
|
509
|
+
"undefined"
|
|
510
|
+
]
|
|
511
|
+
}
|
|
512
|
+
},
|
|
513
|
+
{
|
|
514
|
+
"name": "readonly",
|
|
515
|
+
"description": "When present, it specifies that the field is read-only.",
|
|
526
516
|
"value": {
|
|
527
517
|
"type": [
|
|
528
518
|
"boolean",
|
|
@@ -532,8 +522,8 @@
|
|
|
532
522
|
}
|
|
533
523
|
},
|
|
534
524
|
{
|
|
535
|
-
"name": "
|
|
536
|
-
"description": "
|
|
525
|
+
"name": "required",
|
|
526
|
+
"description": "Specifies that the user must fill in a value.",
|
|
537
527
|
"value": {
|
|
538
528
|
"type": [
|
|
539
529
|
"boolean",
|
|
@@ -543,41 +533,38 @@
|
|
|
543
533
|
}
|
|
544
534
|
},
|
|
545
535
|
{
|
|
546
|
-
"name": "
|
|
547
|
-
"description": "
|
|
536
|
+
"name": "showWeekNumbers",
|
|
537
|
+
"description": "Set true to display ISO-8601 week numbers in the calendar. Notice that\ndisplaying week numbers is only supported when `i18n.firstDayOfWeek`\nis 1 (Monday).",
|
|
548
538
|
"value": {
|
|
549
539
|
"type": [
|
|
550
|
-
"
|
|
540
|
+
"boolean",
|
|
541
|
+
"null",
|
|
551
542
|
"undefined"
|
|
552
543
|
]
|
|
553
544
|
}
|
|
554
545
|
},
|
|
555
546
|
{
|
|
556
|
-
"name": "
|
|
557
|
-
"description": "The
|
|
547
|
+
"name": "title",
|
|
548
|
+
"description": "The text usually displayed in a tooltip popup when the mouse is over the field.",
|
|
558
549
|
"value": {
|
|
559
550
|
"type": [
|
|
560
551
|
"string",
|
|
552
|
+
"null",
|
|
561
553
|
"undefined"
|
|
562
554
|
]
|
|
563
555
|
}
|
|
564
556
|
},
|
|
565
557
|
{
|
|
566
|
-
"name": "
|
|
567
|
-
"description": "
|
|
558
|
+
"name": "value",
|
|
559
|
+
"description": "Selected date.\n\nSupported date formats:\n- ISO 8601 `\"YYYY-MM-DD\"` (default)\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
|
|
568
560
|
"value": {
|
|
569
561
|
"type": [
|
|
570
|
-
"
|
|
571
|
-
"undefined"
|
|
562
|
+
"string"
|
|
572
563
|
]
|
|
573
564
|
}
|
|
574
565
|
}
|
|
575
566
|
],
|
|
576
567
|
"events": [
|
|
577
|
-
{
|
|
578
|
-
"name": "validated",
|
|
579
|
-
"description": "Fired whenever the field is validated."
|
|
580
|
-
},
|
|
581
568
|
{
|
|
582
569
|
"name": "change",
|
|
583
570
|
"description": "Fired when the user commits a value change."
|
|
@@ -586,17 +573,21 @@
|
|
|
586
573
|
"name": "input",
|
|
587
574
|
"description": "Fired when the value is changed by the user: on every typing keystroke,\nand the value is cleared using the clear button."
|
|
588
575
|
},
|
|
576
|
+
{
|
|
577
|
+
"name": "invalid-changed",
|
|
578
|
+
"description": "Fired when the `invalid` property changes."
|
|
579
|
+
},
|
|
589
580
|
{
|
|
590
581
|
"name": "opened-changed",
|
|
591
582
|
"description": "Fired when `opened` property value changes."
|
|
592
583
|
},
|
|
593
584
|
{
|
|
594
|
-
"name": "
|
|
595
|
-
"description": "Fired
|
|
585
|
+
"name": "validated",
|
|
586
|
+
"description": "Fired whenever the field is validated."
|
|
596
587
|
},
|
|
597
588
|
{
|
|
598
|
-
"name": "
|
|
599
|
-
"description": "Fired when
|
|
589
|
+
"name": "value-changed",
|
|
590
|
+
"description": "Fired when `value` property value changes."
|
|
600
591
|
}
|
|
601
592
|
]
|
|
602
593
|
}
|
package/web-types.lit.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://json.schemastore.org/web-types",
|
|
3
3
|
"name": "@vaadin/date-picker",
|
|
4
|
-
"version": "25.1.0-
|
|
4
|
+
"version": "25.1.0-beta1",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"framework": "lit",
|
|
7
7
|
"framework-config": {
|
|
@@ -20,57 +20,57 @@
|
|
|
20
20
|
"extension": true,
|
|
21
21
|
"attributes": [
|
|
22
22
|
{
|
|
23
|
-
"name": "?
|
|
24
|
-
"description": "
|
|
23
|
+
"name": "?autofocus",
|
|
24
|
+
"description": "Specify that this control should have input focus when the page loads.",
|
|
25
25
|
"value": {
|
|
26
26
|
"kind": "expression"
|
|
27
27
|
}
|
|
28
28
|
},
|
|
29
29
|
{
|
|
30
|
-
"name": "?
|
|
31
|
-
"description": "
|
|
30
|
+
"name": "?autoOpenDisabled",
|
|
31
|
+
"description": "Set true to prevent the overlay from opening automatically.",
|
|
32
32
|
"value": {
|
|
33
33
|
"kind": "expression"
|
|
34
34
|
}
|
|
35
35
|
},
|
|
36
36
|
{
|
|
37
|
-
"name": "?
|
|
38
|
-
"description": "
|
|
37
|
+
"name": "?autoselect",
|
|
38
|
+
"description": "If true, the input text gets fully selected when the field is focused using click or touch / tap.",
|
|
39
39
|
"value": {
|
|
40
40
|
"kind": "expression"
|
|
41
41
|
}
|
|
42
42
|
},
|
|
43
43
|
{
|
|
44
|
-
"name": "?
|
|
45
|
-
"description": "Set to true to
|
|
44
|
+
"name": "?clearButtonVisible",
|
|
45
|
+
"description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
|
|
46
46
|
"value": {
|
|
47
47
|
"kind": "expression"
|
|
48
48
|
}
|
|
49
49
|
},
|
|
50
50
|
{
|
|
51
|
-
"name": "?
|
|
52
|
-
"description": "
|
|
51
|
+
"name": "?disabled",
|
|
52
|
+
"description": "If true, the user cannot interact with this element.",
|
|
53
53
|
"value": {
|
|
54
54
|
"kind": "expression"
|
|
55
55
|
}
|
|
56
56
|
},
|
|
57
57
|
{
|
|
58
|
-
"name": "?
|
|
59
|
-
"description": "Set to true
|
|
58
|
+
"name": "?invalid",
|
|
59
|
+
"description": "Set to true when the field is invalid.",
|
|
60
60
|
"value": {
|
|
61
61
|
"kind": "expression"
|
|
62
62
|
}
|
|
63
63
|
},
|
|
64
64
|
{
|
|
65
|
-
"name": "?
|
|
66
|
-
"description": "
|
|
65
|
+
"name": "?isDateDisabled",
|
|
66
|
+
"description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.",
|
|
67
67
|
"value": {
|
|
68
68
|
"kind": "expression"
|
|
69
69
|
}
|
|
70
70
|
},
|
|
71
71
|
{
|
|
72
|
-
"name": "?
|
|
73
|
-
"description": "
|
|
72
|
+
"name": "?manualValidation",
|
|
73
|
+
"description": "Set to true to enable manual validation mode. This mode disables automatic\nconstraint validation, allowing you to control the validation process yourself.\nYou can still trigger constraint validation manually with the `validate()` method\nor use `checkValidity()` to assess the component's validity without affecting\nthe invalid state. In manual validation mode, you can also manipulate\nthe `invalid` property directly through your application logic without conflicts\nwith the component's internal validation.",
|
|
74
74
|
"value": {
|
|
75
75
|
"kind": "expression"
|
|
76
76
|
}
|
|
@@ -83,141 +83,141 @@
|
|
|
83
83
|
}
|
|
84
84
|
},
|
|
85
85
|
{
|
|
86
|
-
"name": "?
|
|
87
|
-
"description": "
|
|
86
|
+
"name": "?readonly",
|
|
87
|
+
"description": "When present, it specifies that the field is read-only.",
|
|
88
88
|
"value": {
|
|
89
89
|
"kind": "expression"
|
|
90
90
|
}
|
|
91
91
|
},
|
|
92
92
|
{
|
|
93
|
-
"name": "?
|
|
94
|
-
"description": "
|
|
93
|
+
"name": "?required",
|
|
94
|
+
"description": "Specifies that the user must fill in a value.",
|
|
95
95
|
"value": {
|
|
96
96
|
"kind": "expression"
|
|
97
97
|
}
|
|
98
98
|
},
|
|
99
99
|
{
|
|
100
|
-
"name": "?
|
|
101
|
-
"description": "
|
|
100
|
+
"name": "?showWeekNumbers",
|
|
101
|
+
"description": "Set true to display ISO-8601 week numbers in the calendar. Notice that\ndisplaying week numbers is only supported when `i18n.firstDayOfWeek`\nis 1 (Monday).",
|
|
102
102
|
"value": {
|
|
103
103
|
"kind": "expression"
|
|
104
104
|
}
|
|
105
105
|
},
|
|
106
106
|
{
|
|
107
|
-
"name": ".
|
|
108
|
-
"description": "
|
|
107
|
+
"name": ".accessibleName",
|
|
108
|
+
"description": "String used to label the component to screen reader users.",
|
|
109
109
|
"value": {
|
|
110
110
|
"kind": "expression"
|
|
111
111
|
}
|
|
112
112
|
},
|
|
113
113
|
{
|
|
114
|
-
"name": ".
|
|
115
|
-
"description": "
|
|
114
|
+
"name": ".accessibleNameRef",
|
|
115
|
+
"description": "Id of the element used as label of the component to screen reader users.",
|
|
116
116
|
"value": {
|
|
117
117
|
"kind": "expression"
|
|
118
118
|
}
|
|
119
119
|
},
|
|
120
120
|
{
|
|
121
|
-
"name": ".
|
|
122
|
-
"description": "
|
|
121
|
+
"name": ".allowedCharPattern",
|
|
122
|
+
"description": "A pattern matched against individual characters the user inputs.\n\nWhen set, the field will prevent:\n- `keydown` events if the entered key doesn't match `/^allowedCharPattern$/`\n- `paste` events if the pasted text doesn't match `/^allowedCharPattern*$/`\n- `drop` events if the dropped text doesn't match `/^allowedCharPattern*$/`\n\nFor example, to allow entering only numbers and minus signs, use:\n`allowedCharPattern = \"[\\\\d-]\"`",
|
|
123
123
|
"value": {
|
|
124
124
|
"kind": "expression"
|
|
125
125
|
}
|
|
126
126
|
},
|
|
127
127
|
{
|
|
128
|
-
"name": ".
|
|
129
|
-
"description": "
|
|
128
|
+
"name": ".errorMessage",
|
|
129
|
+
"description": "Error to show when the field is invalid.",
|
|
130
130
|
"value": {
|
|
131
131
|
"kind": "expression"
|
|
132
132
|
}
|
|
133
133
|
},
|
|
134
134
|
{
|
|
135
|
-
"name": ".
|
|
136
|
-
"description": "
|
|
135
|
+
"name": ".helperText",
|
|
136
|
+
"description": "String used for the helper text.",
|
|
137
137
|
"value": {
|
|
138
138
|
"kind": "expression"
|
|
139
139
|
}
|
|
140
140
|
},
|
|
141
141
|
{
|
|
142
|
-
"name": ".
|
|
143
|
-
"description": "
|
|
142
|
+
"name": ".i18n",
|
|
143
|
+
"description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following JSON structure and default values:\n\n```js\n{\n // An array with the full names of months starting\n // with January.\n monthNames: [\n 'January', 'February', 'March', 'April', 'May',\n 'June', 'July', 'August', 'September',\n 'October', 'November', 'December'\n ],\n\n // An array of weekday names starting with Sunday. Used\n // in screen reader announcements.\n weekdays: [\n 'Sunday', 'Monday', 'Tuesday', 'Wednesday',\n 'Thursday', 'Friday', 'Saturday'\n ],\n\n // An array of short weekday names starting with Sunday.\n // Displayed in the calendar.\n weekdaysShort: [\n 'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'\n ],\n\n // An integer indicating the first day of the week\n // (0 = Sunday, 1 = Monday, etc.).\n firstDayOfWeek: 0,\n\n // Translation of the Today shortcut button text.\n today: 'Today',\n\n // Translation of the Cancel button text.\n cancel: 'Cancel',\n\n // Used for adjusting the year value when parsing dates with short years.\n // The year values between 0 and 99 are evaluated and adjusted.\n // Example: for a referenceDate of 1970-10-30;\n // dateToBeParsed: 40-10-30, result: 1940-10-30\n // dateToBeParsed: 80-10-30, result: 1980-10-30\n // dateToBeParsed: 10-10-30, result: 2010-10-30\n // Supported date format: ISO 8601 `\"YYYY-MM-DD\"` (default)\n // The default value is the current date.\n referenceDate: '',\n\n // A function to format given `Object` as\n // date string. Object is in the format `{ day: ..., month: ..., year: ... }`\n // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n formatDate: d => {\n // returns a string representation of the given\n // object in 'MM/DD/YYYY' -format\n },\n\n // A function to parse the given text to an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n // Must properly parse (at least) text formatted by `formatDate`.\n // Setting the property to null will disable keyboard input feature.\n // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n parseDate: text => {\n // Parses a string in 'MM/DD/YY', 'MM/DD' or 'DD' -format to\n // an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n }\n\n // A function to format given `monthName` and\n // `fullYear` integer as calendar title string.\n formatTitle: (monthName, fullYear) => {\n return monthName + ' ' + fullYear;\n }\n}\n```",
|
|
144
144
|
"value": {
|
|
145
145
|
"kind": "expression"
|
|
146
146
|
}
|
|
147
147
|
},
|
|
148
148
|
{
|
|
149
|
-
"name": ".
|
|
150
|
-
"description": "
|
|
149
|
+
"name": ".initialPosition",
|
|
150
|
+
"description": "Date which should be visible when there is no value selected.\n\nThe same date formats as for the `value` property are supported.",
|
|
151
151
|
"value": {
|
|
152
152
|
"kind": "expression"
|
|
153
153
|
}
|
|
154
154
|
},
|
|
155
155
|
{
|
|
156
|
-
"name": ".
|
|
157
|
-
"description": "The
|
|
156
|
+
"name": ".label",
|
|
157
|
+
"description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
|
|
158
158
|
"value": {
|
|
159
159
|
"kind": "expression"
|
|
160
160
|
}
|
|
161
161
|
},
|
|
162
162
|
{
|
|
163
|
-
"name": ".
|
|
164
|
-
"description": "
|
|
163
|
+
"name": ".max",
|
|
164
|
+
"description": "The latest date that can be selected. All later dates will be disabled.\n\nSupported date formats:\n- ISO 8601 `\"YYYY-MM-DD\"` (default)\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
|
|
165
165
|
"value": {
|
|
166
166
|
"kind": "expression"
|
|
167
167
|
}
|
|
168
168
|
},
|
|
169
169
|
{
|
|
170
|
-
"name": ".
|
|
171
|
-
"description": "The
|
|
170
|
+
"name": ".min",
|
|
171
|
+
"description": "The earliest date that can be selected. All earlier dates will be disabled.\n\nSupported date formats:\n- ISO 8601 `\"YYYY-MM-DD\"` (default)\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
|
|
172
172
|
"value": {
|
|
173
173
|
"kind": "expression"
|
|
174
174
|
}
|
|
175
175
|
},
|
|
176
176
|
{
|
|
177
|
-
"name": ".
|
|
178
|
-
"description": "The
|
|
177
|
+
"name": ".name",
|
|
178
|
+
"description": "The name of this field.",
|
|
179
179
|
"value": {
|
|
180
180
|
"kind": "expression"
|
|
181
181
|
}
|
|
182
182
|
},
|
|
183
183
|
{
|
|
184
|
-
"name": ".
|
|
185
|
-
"description": "
|
|
184
|
+
"name": ".placeholder",
|
|
185
|
+
"description": "A hint to the user of what can be entered in the field.",
|
|
186
186
|
"value": {
|
|
187
187
|
"kind": "expression"
|
|
188
188
|
}
|
|
189
189
|
},
|
|
190
190
|
{
|
|
191
|
-
"name": ".
|
|
192
|
-
"description": "The
|
|
191
|
+
"name": ".title",
|
|
192
|
+
"description": "The text usually displayed in a tooltip popup when the mouse is over the field.",
|
|
193
193
|
"value": {
|
|
194
194
|
"kind": "expression"
|
|
195
195
|
}
|
|
196
196
|
},
|
|
197
197
|
{
|
|
198
|
-
"name": ".
|
|
199
|
-
"description": "
|
|
198
|
+
"name": ".value",
|
|
199
|
+
"description": "Selected date.\n\nSupported date formats:\n- ISO 8601 `\"YYYY-MM-DD\"` (default)\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
|
|
200
200
|
"value": {
|
|
201
201
|
"kind": "expression"
|
|
202
202
|
}
|
|
203
203
|
},
|
|
204
204
|
{
|
|
205
|
-
"name": "@
|
|
206
|
-
"description": "Fired
|
|
205
|
+
"name": "@change",
|
|
206
|
+
"description": "Fired when the user commits a value change.",
|
|
207
207
|
"value": {
|
|
208
208
|
"kind": "expression"
|
|
209
209
|
}
|
|
210
210
|
},
|
|
211
211
|
{
|
|
212
|
-
"name": "@
|
|
213
|
-
"description": "Fired when the user
|
|
212
|
+
"name": "@input",
|
|
213
|
+
"description": "Fired when the value is changed by the user: on every typing keystroke,\nand the value is cleared using the clear button.",
|
|
214
214
|
"value": {
|
|
215
215
|
"kind": "expression"
|
|
216
216
|
}
|
|
217
217
|
},
|
|
218
218
|
{
|
|
219
|
-
"name": "@
|
|
220
|
-
"description": "Fired when the
|
|
219
|
+
"name": "@invalid-changed",
|
|
220
|
+
"description": "Fired when the `invalid` property changes.",
|
|
221
221
|
"value": {
|
|
222
222
|
"kind": "expression"
|
|
223
223
|
}
|
|
@@ -230,15 +230,15 @@
|
|
|
230
230
|
}
|
|
231
231
|
},
|
|
232
232
|
{
|
|
233
|
-
"name": "@
|
|
234
|
-
"description": "Fired
|
|
233
|
+
"name": "@validated",
|
|
234
|
+
"description": "Fired whenever the field is validated.",
|
|
235
235
|
"value": {
|
|
236
236
|
"kind": "expression"
|
|
237
237
|
}
|
|
238
238
|
},
|
|
239
239
|
{
|
|
240
|
-
"name": "@
|
|
241
|
-
"description": "Fired when
|
|
240
|
+
"name": "@value-changed",
|
|
241
|
+
"description": "Fired when `value` property value changes.",
|
|
242
242
|
"value": {
|
|
243
243
|
"kind": "expression"
|
|
244
244
|
}
|