@vaadin/date-time-picker 25.1.0-alpha7 → 25.1.0-alpha9
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 +64 -0
- package/package.json +12 -12
- package/web-types.json +122 -122
- package/web-types.lit.json +47 -47
package/custom-elements.json
CHANGED
|
@@ -66,6 +66,31 @@
|
|
|
66
66
|
"description": "A placeholder string for the date field.",
|
|
67
67
|
"attribute": "date-placeholder"
|
|
68
68
|
},
|
|
69
|
+
{
|
|
70
|
+
"kind": "field",
|
|
71
|
+
"name": "i18n",
|
|
72
|
+
"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 structure and default values:\n\n```js\n{\n // Accessible label to the date picker.\n // The property works in conjunction with label and accessibleName defined on the field.\n // If both properties are defined, then accessibleName takes precedence.\n // Then, the dateLabel value is concatenated with it.\n dateLabel: undefined;\n\n // Accessible label to the time picker.\n // The property works in conjunction with label and accessibleName defined on the field.\n // If both properties are defined, then accessibleName takes precedence.\n // Then, the dateLabel value is concatenated with it.\n timeLabel: undefined;\n}\n```\n\nAdditionally, all i18n properties from\n[`<vaadin-date-picker>`](#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](#/elements/vaadin-time-picker) are supported.",
|
|
73
|
+
"return": {
|
|
74
|
+
"type": {
|
|
75
|
+
"text": "Object"
|
|
76
|
+
}
|
|
77
|
+
},
|
|
78
|
+
"parameters": [
|
|
79
|
+
{
|
|
80
|
+
"name": "value",
|
|
81
|
+
"type": {
|
|
82
|
+
"text": "Object"
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
],
|
|
86
|
+
"type": {
|
|
87
|
+
"text": "!DateTimePickerI18n"
|
|
88
|
+
},
|
|
89
|
+
"inheritedFrom": {
|
|
90
|
+
"name": "I18nMixin",
|
|
91
|
+
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
92
|
+
}
|
|
93
|
+
},
|
|
69
94
|
{
|
|
70
95
|
"kind": "field",
|
|
71
96
|
"name": "initialPosition",
|
|
@@ -196,6 +221,13 @@
|
|
|
196
221
|
"description": "A placeholder string for the date field.",
|
|
197
222
|
"fieldName": "datePlaceholder"
|
|
198
223
|
},
|
|
224
|
+
{
|
|
225
|
+
"name": "i18n",
|
|
226
|
+
"inheritedFrom": {
|
|
227
|
+
"name": "I18nMixin",
|
|
228
|
+
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
229
|
+
}
|
|
230
|
+
},
|
|
199
231
|
{
|
|
200
232
|
"name": "initial-position",
|
|
201
233
|
"type": {
|
|
@@ -358,6 +390,31 @@
|
|
|
358
390
|
"module": "src/vaadin-date-time-picker-mixin.js"
|
|
359
391
|
}
|
|
360
392
|
},
|
|
393
|
+
{
|
|
394
|
+
"kind": "field",
|
|
395
|
+
"name": "i18n",
|
|
396
|
+
"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 structure and default values:\n\n```js\n{\n // Accessible label to the date picker.\n // The property works in conjunction with label and accessibleName defined on the field.\n // If both properties are defined, then accessibleName takes precedence.\n // Then, the dateLabel value is concatenated with it.\n dateLabel: undefined;\n\n // Accessible label to the time picker.\n // The property works in conjunction with label and accessibleName defined on the field.\n // If both properties are defined, then accessibleName takes precedence.\n // Then, the dateLabel value is concatenated with it.\n timeLabel: undefined;\n}\n```\n\nAdditionally, all i18n properties from\n[`<vaadin-date-picker>`](#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](#/elements/vaadin-time-picker) are supported.",
|
|
397
|
+
"return": {
|
|
398
|
+
"type": {
|
|
399
|
+
"text": "Object"
|
|
400
|
+
}
|
|
401
|
+
},
|
|
402
|
+
"parameters": [
|
|
403
|
+
{
|
|
404
|
+
"name": "value",
|
|
405
|
+
"type": {
|
|
406
|
+
"text": "Object"
|
|
407
|
+
}
|
|
408
|
+
}
|
|
409
|
+
],
|
|
410
|
+
"type": {
|
|
411
|
+
"text": "!DateTimePickerI18n"
|
|
412
|
+
},
|
|
413
|
+
"inheritedFrom": {
|
|
414
|
+
"name": "I18nMixin",
|
|
415
|
+
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
416
|
+
}
|
|
417
|
+
},
|
|
361
418
|
{
|
|
362
419
|
"kind": "field",
|
|
363
420
|
"name": "initialPosition",
|
|
@@ -595,6 +652,13 @@
|
|
|
595
652
|
"module": "src/vaadin-date-time-picker-mixin.js"
|
|
596
653
|
}
|
|
597
654
|
},
|
|
655
|
+
{
|
|
656
|
+
"name": "i18n",
|
|
657
|
+
"inheritedFrom": {
|
|
658
|
+
"name": "I18nMixin",
|
|
659
|
+
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
660
|
+
}
|
|
661
|
+
},
|
|
598
662
|
{
|
|
599
663
|
"name": "initial-position",
|
|
600
664
|
"type": {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/date-time-picker",
|
|
3
|
-
"version": "25.1.0-
|
|
3
|
+
"version": "25.1.0-alpha9",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -35,20 +35,20 @@
|
|
|
35
35
|
],
|
|
36
36
|
"dependencies": {
|
|
37
37
|
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
38
|
-
"@vaadin/a11y-base": "25.1.0-
|
|
39
|
-
"@vaadin/component-base": "25.1.0-
|
|
40
|
-
"@vaadin/date-picker": "25.1.0-
|
|
41
|
-
"@vaadin/field-base": "25.1.0-
|
|
42
|
-
"@vaadin/time-picker": "25.1.0-
|
|
43
|
-
"@vaadin/vaadin-themable-mixin": "25.1.0-
|
|
38
|
+
"@vaadin/a11y-base": "25.1.0-alpha9",
|
|
39
|
+
"@vaadin/component-base": "25.1.0-alpha9",
|
|
40
|
+
"@vaadin/date-picker": "25.1.0-alpha9",
|
|
41
|
+
"@vaadin/field-base": "25.1.0-alpha9",
|
|
42
|
+
"@vaadin/time-picker": "25.1.0-alpha9",
|
|
43
|
+
"@vaadin/vaadin-themable-mixin": "25.1.0-alpha9",
|
|
44
44
|
"lit": "^3.0.0"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
|
-
"@vaadin/aura": "25.1.0-
|
|
48
|
-
"@vaadin/chai-plugins": "25.1.0-
|
|
49
|
-
"@vaadin/test-runner-commands": "25.1.0-
|
|
47
|
+
"@vaadin/aura": "25.1.0-alpha9",
|
|
48
|
+
"@vaadin/chai-plugins": "25.1.0-alpha9",
|
|
49
|
+
"@vaadin/test-runner-commands": "25.1.0-alpha9",
|
|
50
50
|
"@vaadin/testing-helpers": "^2.0.0",
|
|
51
|
-
"@vaadin/vaadin-lumo-styles": "25.1.0-
|
|
51
|
+
"@vaadin/vaadin-lumo-styles": "25.1.0-alpha9",
|
|
52
52
|
"sinon": "^21.0.0"
|
|
53
53
|
},
|
|
54
54
|
"customElements": "custom-elements.json",
|
|
@@ -56,5 +56,5 @@
|
|
|
56
56
|
"web-types.json",
|
|
57
57
|
"web-types.lit.json"
|
|
58
58
|
],
|
|
59
|
-
"gitHead": "
|
|
59
|
+
"gitHead": "ef432311376ba3dac4233cb23d393a49a425e0a4"
|
|
60
60
|
}
|
package/web-types.json
CHANGED
|
@@ -1,29 +1,29 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://json.schemastore.org/web-types",
|
|
3
3
|
"name": "@vaadin/date-time-picker",
|
|
4
|
-
"version": "25.1.0-
|
|
4
|
+
"version": "25.1.0-alpha9",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
8
8
|
"elements": [
|
|
9
9
|
{
|
|
10
10
|
"name": "vaadin-date-time-picker",
|
|
11
|
-
"description": "`<vaadin-date-time-picker>` is a Web Component providing a date time selection field.\n\n```html\n<vaadin-date-time-picker value=\"2019-09-16T15:00\"></vaadin-date-time-picker>\n```\n```js\ndateTimePicker.value = '2019-09-16T15:00';\n```\n\nWhen the selected `value` is changed, a `value-changed` event is triggered.\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|----------------\n`label` | The slotted label element wrapper\n`input-fields` | The date and time pickers wrapper\n`helper-text` | The slotted helper text element wrapper\n`error-message` | The slotted error message element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n--------------------|---------------------------------\n`disabled` | Set when the element is disabled\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`invalid` | Set when the element is invalid\n`has-label` | Set when the element has a label\n`has-value` | Set when the element has a value\n`has-helper` | Set when the element has helper text\n`has-error-message` | Set when the element has an error message\n`has-tooltip` | Set when the element has a slotted tooltip\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------------|\n| `--vaadin-date-time-picker-gap` |\n| `--vaadin-input-field-error-color` |\n| `--vaadin-input-field-error-font-size` |\n| `--vaadin-input-field-error-font-weight` |\n| `--vaadin-input-field-error-line-height` |\n| `--vaadin-input-field-label-color` |\n| `--vaadin-input-field-label-font-size` |\n| `--vaadin-input-field-label-font-weight` |\n| `--vaadin-input-field-label-line-height` |\n| `--vaadin-input-field-helper-color` |\n| `--vaadin-input-field-helper-font-size` |\n| `--vaadin-input-field-helper-font-weight` |\n| `--vaadin-input-field-helper-line-height` |\n| `--vaadin-input-field-required-indicator-color` |\n| `--vaadin-input-field-required-indicator` |\n\n### Internal components\n\nThe following components are created by `<vaadin-date-time-picker>` and placed in light DOM:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-
|
|
11
|
+
"description": "`<vaadin-date-time-picker>` is a Web Component providing a date time selection field.\n\n```html\n<vaadin-date-time-picker value=\"2019-09-16T15:00\"></vaadin-date-time-picker>\n```\n```js\ndateTimePicker.value = '2019-09-16T15:00';\n```\n\nWhen the selected `value` is changed, a `value-changed` event is triggered.\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|----------------\n`label` | The slotted label element wrapper\n`input-fields` | The date and time pickers wrapper\n`helper-text` | The slotted helper text element wrapper\n`error-message` | The slotted error message element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n--------------------|---------------------------------\n`disabled` | Set when the element is disabled\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`invalid` | Set when the element is invalid\n`has-label` | Set when the element has a label\n`has-value` | Set when the element has a value\n`has-helper` | Set when the element has helper text\n`has-error-message` | Set when the element has an error message\n`has-tooltip` | Set when the element has a slotted tooltip\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------------|\n| `--vaadin-date-time-picker-gap` |\n| `--vaadin-input-field-error-color` |\n| `--vaadin-input-field-error-font-size` |\n| `--vaadin-input-field-error-font-weight` |\n| `--vaadin-input-field-error-line-height` |\n| `--vaadin-input-field-label-color` |\n| `--vaadin-input-field-label-font-size` |\n| `--vaadin-input-field-label-font-weight` |\n| `--vaadin-input-field-label-line-height` |\n| `--vaadin-input-field-helper-color` |\n| `--vaadin-input-field-helper-font-size` |\n| `--vaadin-input-field-helper-font-weight` |\n| `--vaadin-input-field-helper-line-height` |\n| `--vaadin-input-field-required-indicator-color` |\n| `--vaadin-input-field-required-indicator` |\n\n### Internal components\n\nThe following components are created by `<vaadin-date-time-picker>` and placed in light DOM:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-alpha9/#/elements/vaadin-date-picker).\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-alpha9/#/elements/vaadin-time-picker).\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\nincomplete => empty | unparsable-change\nincomplete => parsable | change\nincomplete => unparsable | unparsable-change\nempty => incomplete | unparsable-change\nparsable => incomplete | change\nunparsable => incomplete | 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",
|
|
@@ -33,8 +33,8 @@
|
|
|
33
33
|
}
|
|
34
34
|
},
|
|
35
35
|
{
|
|
36
|
-
"name": "
|
|
37
|
-
"description": "Set to true
|
|
36
|
+
"name": "auto-open-disabled",
|
|
37
|
+
"description": "Set to true to prevent the overlays from opening automatically.",
|
|
38
38
|
"value": {
|
|
39
39
|
"type": [
|
|
40
40
|
"boolean",
|
|
@@ -44,19 +44,28 @@
|
|
|
44
44
|
}
|
|
45
45
|
},
|
|
46
46
|
{
|
|
47
|
-
"name": "
|
|
48
|
-
"description": "
|
|
47
|
+
"name": "autofocus",
|
|
48
|
+
"description": "Specify that this control should have input focus when the page loads.",
|
|
49
49
|
"value": {
|
|
50
50
|
"type": [
|
|
51
|
-
"boolean"
|
|
51
|
+
"boolean"
|
|
52
|
+
]
|
|
53
|
+
}
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
"name": "date-placeholder",
|
|
57
|
+
"description": "A placeholder string for the date field.",
|
|
58
|
+
"value": {
|
|
59
|
+
"type": [
|
|
60
|
+
"string",
|
|
52
61
|
"null",
|
|
53
62
|
"undefined"
|
|
54
63
|
]
|
|
55
64
|
}
|
|
56
65
|
},
|
|
57
66
|
{
|
|
58
|
-
"name": "
|
|
59
|
-
"description": "
|
|
67
|
+
"name": "disabled",
|
|
68
|
+
"description": "If true, the user cannot interact with this element.",
|
|
60
69
|
"value": {
|
|
61
70
|
"type": [
|
|
62
71
|
"boolean",
|
|
@@ -88,8 +97,8 @@
|
|
|
88
97
|
}
|
|
89
98
|
},
|
|
90
99
|
{
|
|
91
|
-
"name": "
|
|
92
|
-
"description": "
|
|
100
|
+
"name": "initial-position",
|
|
101
|
+
"description": "Date which should be visible in the date picker overlay when there is no value selected.\n\nThe same date formats as for the `value` property are supported but without the time part.",
|
|
93
102
|
"value": {
|
|
94
103
|
"type": [
|
|
95
104
|
"string",
|
|
@@ -99,19 +108,19 @@
|
|
|
99
108
|
}
|
|
100
109
|
},
|
|
101
110
|
{
|
|
102
|
-
"name": "
|
|
103
|
-
"description": "
|
|
111
|
+
"name": "invalid",
|
|
112
|
+
"description": "Set to true when the field is invalid.",
|
|
104
113
|
"value": {
|
|
105
114
|
"type": [
|
|
106
|
-
"
|
|
115
|
+
"boolean",
|
|
107
116
|
"null",
|
|
108
117
|
"undefined"
|
|
109
118
|
]
|
|
110
119
|
}
|
|
111
120
|
},
|
|
112
121
|
{
|
|
113
|
-
"name": "
|
|
114
|
-
"description": "The
|
|
122
|
+
"name": "label",
|
|
123
|
+
"description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
|
|
115
124
|
"value": {
|
|
116
125
|
"type": [
|
|
117
126
|
"string",
|
|
@@ -121,20 +130,12 @@
|
|
|
121
130
|
}
|
|
122
131
|
},
|
|
123
132
|
{
|
|
124
|
-
"name": "
|
|
125
|
-
"description": "
|
|
126
|
-
"value": {
|
|
127
|
-
"type": [
|
|
128
|
-
"string"
|
|
129
|
-
]
|
|
130
|
-
}
|
|
131
|
-
},
|
|
132
|
-
{
|
|
133
|
-
"name": "min",
|
|
134
|
-
"description": "The earliest allowed value (date and time) that can be selected. All earlier values will be disabled.\n\nSupported date time format is based on ISO 8601 (without a time zone designator):\n- Minute precision `\"YYYY-MM-DDThh:mm\"`\n- Second precision `\"YYYY-MM-DDThh:mm:ss\"`\n- Millisecond precision `\"YYYY-MM-DDThh:mm:ss.fff\"`",
|
|
133
|
+
"name": "manual-validation",
|
|
134
|
+
"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.",
|
|
135
135
|
"value": {
|
|
136
136
|
"type": [
|
|
137
|
-
"
|
|
137
|
+
"boolean",
|
|
138
|
+
"null",
|
|
138
139
|
"undefined"
|
|
139
140
|
]
|
|
140
141
|
}
|
|
@@ -150,19 +151,18 @@
|
|
|
150
151
|
}
|
|
151
152
|
},
|
|
152
153
|
{
|
|
153
|
-
"name": "
|
|
154
|
-
"description": "
|
|
154
|
+
"name": "min",
|
|
155
|
+
"description": "The earliest allowed value (date and time) that can be selected. All earlier values will be disabled.\n\nSupported date time format is based on ISO 8601 (without a time zone designator):\n- Minute precision `\"YYYY-MM-DDThh:mm\"`\n- Second precision `\"YYYY-MM-DDThh:mm:ss\"`\n- Millisecond precision `\"YYYY-MM-DDThh:mm:ss.fff\"`",
|
|
155
156
|
"value": {
|
|
156
157
|
"type": [
|
|
157
158
|
"string",
|
|
158
|
-
"null",
|
|
159
159
|
"undefined"
|
|
160
160
|
]
|
|
161
161
|
}
|
|
162
162
|
},
|
|
163
163
|
{
|
|
164
|
-
"name": "
|
|
165
|
-
"description": "
|
|
164
|
+
"name": "name",
|
|
165
|
+
"description": "The name of the control, which is submitted with the form data.",
|
|
166
166
|
"value": {
|
|
167
167
|
"type": [
|
|
168
168
|
"string",
|
|
@@ -172,22 +172,20 @@
|
|
|
172
172
|
}
|
|
173
173
|
},
|
|
174
174
|
{
|
|
175
|
-
"name": "
|
|
176
|
-
"description": "
|
|
175
|
+
"name": "readonly",
|
|
176
|
+
"description": "Set to true to make this element read-only.",
|
|
177
177
|
"value": {
|
|
178
178
|
"type": [
|
|
179
|
-
"
|
|
180
|
-
"null",
|
|
181
|
-
"undefined"
|
|
179
|
+
"boolean"
|
|
182
180
|
]
|
|
183
181
|
}
|
|
184
182
|
},
|
|
185
183
|
{
|
|
186
|
-
"name": "
|
|
187
|
-
"description": "
|
|
184
|
+
"name": "required",
|
|
185
|
+
"description": "Specifies that the user must fill in a value.",
|
|
188
186
|
"value": {
|
|
189
187
|
"type": [
|
|
190
|
-
"
|
|
188
|
+
"boolean",
|
|
191
189
|
"null",
|
|
192
190
|
"undefined"
|
|
193
191
|
]
|
|
@@ -205,42 +203,44 @@
|
|
|
205
203
|
}
|
|
206
204
|
},
|
|
207
205
|
{
|
|
208
|
-
"name": "
|
|
209
|
-
"description": "
|
|
206
|
+
"name": "step",
|
|
207
|
+
"description": "Defines the time interval (in seconds) between the items displayed\nin the time selection box. The default is 1 hour (i.e. `3600`).\n\nIt also configures the precision of the time part of the value string. By default\nthe component formats time values as `hh:mm` but setting a step value\nlower than one minute or one second, format resolution changes to\n`hh:mm:ss` and `hh:mm:ss.fff` respectively.\n\nUnit must be set in seconds, and for correctly configuring intervals\nin the dropdown, it need to evenly divide a day.\n\nNote: it is possible to define step that is dividing an hour in inexact\nfragments (i.e. 5760 seconds which equals 1 hour 36 minutes), but it is\nnot recommended to use it for better UX.",
|
|
210
208
|
"value": {
|
|
211
209
|
"type": [
|
|
212
|
-
"
|
|
210
|
+
"number",
|
|
213
211
|
"null",
|
|
214
212
|
"undefined"
|
|
215
213
|
]
|
|
216
214
|
}
|
|
217
215
|
},
|
|
218
216
|
{
|
|
219
|
-
"name": "
|
|
220
|
-
"description": "
|
|
217
|
+
"name": "theme",
|
|
218
|
+
"description": "The theme variants to apply to the component.",
|
|
221
219
|
"value": {
|
|
222
220
|
"type": [
|
|
223
|
-
"
|
|
221
|
+
"string",
|
|
222
|
+
"null",
|
|
223
|
+
"undefined"
|
|
224
224
|
]
|
|
225
225
|
}
|
|
226
226
|
},
|
|
227
227
|
{
|
|
228
|
-
"name": "
|
|
229
|
-
"description": "
|
|
228
|
+
"name": "time-placeholder",
|
|
229
|
+
"description": "A placeholder string for the time field.",
|
|
230
230
|
"value": {
|
|
231
231
|
"type": [
|
|
232
|
-
"
|
|
232
|
+
"string",
|
|
233
|
+
"null",
|
|
234
|
+
"undefined"
|
|
233
235
|
]
|
|
234
236
|
}
|
|
235
237
|
},
|
|
236
238
|
{
|
|
237
|
-
"name": "
|
|
238
|
-
"description": "The
|
|
239
|
+
"name": "value",
|
|
240
|
+
"description": "The value for this element.\n\nSupported date time format is based on ISO 8601 (without a time zone designator):\n- Minute precision `\"YYYY-MM-DDThh:mm\"` (default)\n- Second precision `\"YYYY-MM-DDThh:mm:ss\"`\n- Millisecond precision `\"YYYY-MM-DDThh:mm:ss.fff\"`",
|
|
239
241
|
"value": {
|
|
240
242
|
"type": [
|
|
241
|
-
"string"
|
|
242
|
-
"null",
|
|
243
|
-
"undefined"
|
|
243
|
+
"string"
|
|
244
244
|
]
|
|
245
245
|
}
|
|
246
246
|
}
|
|
@@ -248,19 +248,19 @@
|
|
|
248
248
|
"js": {
|
|
249
249
|
"properties": [
|
|
250
250
|
{
|
|
251
|
-
"name": "
|
|
252
|
-
"description": "
|
|
251
|
+
"name": "accessibleName",
|
|
252
|
+
"description": "String used to label the component to screen reader users.",
|
|
253
253
|
"value": {
|
|
254
254
|
"type": [
|
|
255
|
-
"
|
|
255
|
+
"string",
|
|
256
256
|
"null",
|
|
257
257
|
"undefined"
|
|
258
258
|
]
|
|
259
259
|
}
|
|
260
260
|
},
|
|
261
261
|
{
|
|
262
|
-
"name": "
|
|
263
|
-
"description": "
|
|
262
|
+
"name": "accessibleNameRef",
|
|
263
|
+
"description": "Id of the element used as label of the component to screen reader users.",
|
|
264
264
|
"value": {
|
|
265
265
|
"type": [
|
|
266
266
|
"string",
|
|
@@ -270,8 +270,17 @@
|
|
|
270
270
|
}
|
|
271
271
|
},
|
|
272
272
|
{
|
|
273
|
-
"name": "
|
|
274
|
-
"description": "
|
|
273
|
+
"name": "autofocus",
|
|
274
|
+
"description": "Specify that this control should have input focus when the page loads.",
|
|
275
|
+
"value": {
|
|
276
|
+
"type": [
|
|
277
|
+
"boolean"
|
|
278
|
+
]
|
|
279
|
+
}
|
|
280
|
+
},
|
|
281
|
+
{
|
|
282
|
+
"name": "autoOpenDisabled",
|
|
283
|
+
"description": "Set to true to prevent the overlays from opening automatically.",
|
|
275
284
|
"value": {
|
|
276
285
|
"type": [
|
|
277
286
|
"boolean",
|
|
@@ -281,19 +290,19 @@
|
|
|
281
290
|
}
|
|
282
291
|
},
|
|
283
292
|
{
|
|
284
|
-
"name": "
|
|
285
|
-
"description": "
|
|
293
|
+
"name": "datePlaceholder",
|
|
294
|
+
"description": "A placeholder string for the date field.",
|
|
286
295
|
"value": {
|
|
287
296
|
"type": [
|
|
288
|
-
"
|
|
297
|
+
"string",
|
|
289
298
|
"null",
|
|
290
299
|
"undefined"
|
|
291
300
|
]
|
|
292
301
|
}
|
|
293
302
|
},
|
|
294
303
|
{
|
|
295
|
-
"name": "
|
|
296
|
-
"description": "
|
|
304
|
+
"name": "disabled",
|
|
305
|
+
"description": "If true, the user cannot interact with this element.",
|
|
297
306
|
"value": {
|
|
298
307
|
"type": [
|
|
299
308
|
"boolean",
|
|
@@ -325,19 +334,17 @@
|
|
|
325
334
|
}
|
|
326
335
|
},
|
|
327
336
|
{
|
|
328
|
-
"name": "
|
|
329
|
-
"description": "
|
|
337
|
+
"name": "i18n",
|
|
338
|
+
"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 structure and default values:\n\n```js\n{\n // Accessible label to the date picker.\n // The property works in conjunction with label and accessibleName defined on the field.\n // If both properties are defined, then accessibleName takes precedence.\n // Then, the dateLabel value is concatenated with it.\n dateLabel: undefined;\n\n // Accessible label to the time picker.\n // The property works in conjunction with label and accessibleName defined on the field.\n // If both properties are defined, then accessibleName takes precedence.\n // Then, the dateLabel value is concatenated with it.\n timeLabel: undefined;\n}\n```\n\nAdditionally, all i18n properties from\n[`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-alpha9/#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-alpha9/#/elements/vaadin-time-picker) are supported.",
|
|
330
339
|
"value": {
|
|
331
340
|
"type": [
|
|
332
|
-
"
|
|
333
|
-
"null",
|
|
334
|
-
"undefined"
|
|
341
|
+
"?"
|
|
335
342
|
]
|
|
336
343
|
}
|
|
337
344
|
},
|
|
338
345
|
{
|
|
339
|
-
"name": "
|
|
340
|
-
"description": "
|
|
346
|
+
"name": "initialPosition",
|
|
347
|
+
"description": "Date which should be visible in the date picker overlay when there is no value selected.\n\nThe same date formats as for the `value` property are supported but without the time part.",
|
|
341
348
|
"value": {
|
|
342
349
|
"type": [
|
|
343
350
|
"string",
|
|
@@ -347,17 +354,19 @@
|
|
|
347
354
|
}
|
|
348
355
|
},
|
|
349
356
|
{
|
|
350
|
-
"name": "
|
|
351
|
-
"description": "
|
|
357
|
+
"name": "invalid",
|
|
358
|
+
"description": "Set to true when the field is invalid.",
|
|
352
359
|
"value": {
|
|
353
360
|
"type": [
|
|
354
|
-
"
|
|
361
|
+
"boolean",
|
|
362
|
+
"null",
|
|
363
|
+
"undefined"
|
|
355
364
|
]
|
|
356
365
|
}
|
|
357
366
|
},
|
|
358
367
|
{
|
|
359
|
-
"name": "
|
|
360
|
-
"description": "The
|
|
368
|
+
"name": "label",
|
|
369
|
+
"description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
|
|
361
370
|
"value": {
|
|
362
371
|
"type": [
|
|
363
372
|
"string",
|
|
@@ -367,20 +376,12 @@
|
|
|
367
376
|
}
|
|
368
377
|
},
|
|
369
378
|
{
|
|
370
|
-
"name": "
|
|
371
|
-
"description": "
|
|
372
|
-
"value": {
|
|
373
|
-
"type": [
|
|
374
|
-
"string"
|
|
375
|
-
]
|
|
376
|
-
}
|
|
377
|
-
},
|
|
378
|
-
{
|
|
379
|
-
"name": "min",
|
|
380
|
-
"description": "The earliest allowed value (date and time) that can be selected. All earlier values will be disabled.\n\nSupported date time format is based on ISO 8601 (without a time zone designator):\n- Minute precision `\"YYYY-MM-DDThh:mm\"`\n- Second precision `\"YYYY-MM-DDThh:mm:ss\"`\n- Millisecond precision `\"YYYY-MM-DDThh:mm:ss.fff\"`",
|
|
379
|
+
"name": "manualValidation",
|
|
380
|
+
"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.",
|
|
381
381
|
"value": {
|
|
382
382
|
"type": [
|
|
383
|
-
"
|
|
383
|
+
"boolean",
|
|
384
|
+
"null",
|
|
384
385
|
"undefined"
|
|
385
386
|
]
|
|
386
387
|
}
|
|
@@ -396,19 +397,18 @@
|
|
|
396
397
|
}
|
|
397
398
|
},
|
|
398
399
|
{
|
|
399
|
-
"name": "
|
|
400
|
-
"description": "
|
|
400
|
+
"name": "min",
|
|
401
|
+
"description": "The earliest allowed value (date and time) that can be selected. All earlier values will be disabled.\n\nSupported date time format is based on ISO 8601 (without a time zone designator):\n- Minute precision `\"YYYY-MM-DDThh:mm\"`\n- Second precision `\"YYYY-MM-DDThh:mm:ss\"`\n- Millisecond precision `\"YYYY-MM-DDThh:mm:ss.fff\"`",
|
|
401
402
|
"value": {
|
|
402
403
|
"type": [
|
|
403
404
|
"string",
|
|
404
|
-
"null",
|
|
405
405
|
"undefined"
|
|
406
406
|
]
|
|
407
407
|
}
|
|
408
408
|
},
|
|
409
409
|
{
|
|
410
|
-
"name": "
|
|
411
|
-
"description": "
|
|
410
|
+
"name": "name",
|
|
411
|
+
"description": "The name of the control, which is submitted with the form data.",
|
|
412
412
|
"value": {
|
|
413
413
|
"type": [
|
|
414
414
|
"string",
|
|
@@ -418,22 +418,20 @@
|
|
|
418
418
|
}
|
|
419
419
|
},
|
|
420
420
|
{
|
|
421
|
-
"name": "
|
|
422
|
-
"description": "
|
|
421
|
+
"name": "readonly",
|
|
422
|
+
"description": "Set to true to make this element read-only.",
|
|
423
423
|
"value": {
|
|
424
424
|
"type": [
|
|
425
|
-
"
|
|
426
|
-
"null",
|
|
427
|
-
"undefined"
|
|
425
|
+
"boolean"
|
|
428
426
|
]
|
|
429
427
|
}
|
|
430
428
|
},
|
|
431
429
|
{
|
|
432
|
-
"name": "
|
|
433
|
-
"description": "
|
|
430
|
+
"name": "required",
|
|
431
|
+
"description": "Specifies that the user must fill in a value.",
|
|
434
432
|
"value": {
|
|
435
433
|
"type": [
|
|
436
|
-
"
|
|
434
|
+
"boolean",
|
|
437
435
|
"null",
|
|
438
436
|
"undefined"
|
|
439
437
|
]
|
|
@@ -451,40 +449,38 @@
|
|
|
451
449
|
}
|
|
452
450
|
},
|
|
453
451
|
{
|
|
454
|
-
"name": "
|
|
455
|
-
"description": "
|
|
452
|
+
"name": "step",
|
|
453
|
+
"description": "Defines the time interval (in seconds) between the items displayed\nin the time selection box. The default is 1 hour (i.e. `3600`).\n\nIt also configures the precision of the time part of the value string. By default\nthe component formats time values as `hh:mm` but setting a step value\nlower than one minute or one second, format resolution changes to\n`hh:mm:ss` and `hh:mm:ss.fff` respectively.\n\nUnit must be set in seconds, and for correctly configuring intervals\nin the dropdown, it need to evenly divide a day.\n\nNote: it is possible to define step that is dividing an hour in inexact\nfragments (i.e. 5760 seconds which equals 1 hour 36 minutes), but it is\nnot recommended to use it for better UX.",
|
|
456
454
|
"value": {
|
|
457
455
|
"type": [
|
|
458
|
-
"
|
|
456
|
+
"number",
|
|
459
457
|
"null",
|
|
460
458
|
"undefined"
|
|
461
459
|
]
|
|
462
460
|
}
|
|
463
461
|
},
|
|
464
462
|
{
|
|
465
|
-
"name": "
|
|
466
|
-
"description": "
|
|
463
|
+
"name": "timePlaceholder",
|
|
464
|
+
"description": "A placeholder string for the time field.",
|
|
467
465
|
"value": {
|
|
468
466
|
"type": [
|
|
469
|
-
"
|
|
467
|
+
"string",
|
|
468
|
+
"null",
|
|
469
|
+
"undefined"
|
|
470
470
|
]
|
|
471
471
|
}
|
|
472
472
|
},
|
|
473
473
|
{
|
|
474
|
-
"name": "
|
|
475
|
-
"description": "
|
|
474
|
+
"name": "value",
|
|
475
|
+
"description": "The value for this element.\n\nSupported date time format is based on ISO 8601 (without a time zone designator):\n- Minute precision `\"YYYY-MM-DDThh:mm\"` (default)\n- Second precision `\"YYYY-MM-DDThh:mm:ss\"`\n- Millisecond precision `\"YYYY-MM-DDThh:mm:ss.fff\"`",
|
|
476
476
|
"value": {
|
|
477
477
|
"type": [
|
|
478
|
-
"
|
|
478
|
+
"string"
|
|
479
479
|
]
|
|
480
480
|
}
|
|
481
481
|
}
|
|
482
482
|
],
|
|
483
483
|
"events": [
|
|
484
|
-
{
|
|
485
|
-
"name": "validated",
|
|
486
|
-
"description": "Fired whenever the field is validated."
|
|
487
|
-
},
|
|
488
484
|
{
|
|
489
485
|
"name": "change",
|
|
490
486
|
"description": "Fired when the user commits a value change."
|
|
@@ -493,6 +489,10 @@
|
|
|
493
489
|
"name": "invalid-changed",
|
|
494
490
|
"description": "Fired when the `invalid` property changes."
|
|
495
491
|
},
|
|
492
|
+
{
|
|
493
|
+
"name": "validated",
|
|
494
|
+
"description": "Fired whenever the field is validated."
|
|
495
|
+
},
|
|
496
496
|
{
|
|
497
497
|
"name": "value-changed",
|
|
498
498
|
"description": "Fired when the `value` property changes."
|
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-time-picker",
|
|
4
|
-
"version": "25.1.0-
|
|
4
|
+
"version": "25.1.0-alpha9",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"framework": "lit",
|
|
7
7
|
"framework-config": {
|
|
@@ -16,47 +16,40 @@
|
|
|
16
16
|
"elements": [
|
|
17
17
|
{
|
|
18
18
|
"name": "vaadin-date-time-picker",
|
|
19
|
-
"description": "`<vaadin-date-time-picker>` is a Web Component providing a date time selection field.\n\n```html\n<vaadin-date-time-picker value=\"2019-09-16T15:00\"></vaadin-date-time-picker>\n```\n```js\ndateTimePicker.value = '2019-09-16T15:00';\n```\n\nWhen the selected `value` is changed, a `value-changed` event is triggered.\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|----------------\n`label` | The slotted label element wrapper\n`input-fields` | The date and time pickers wrapper\n`helper-text` | The slotted helper text element wrapper\n`error-message` | The slotted error message element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n--------------------|---------------------------------\n`disabled` | Set when the element is disabled\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`invalid` | Set when the element is invalid\n`has-label` | Set when the element has a label\n`has-value` | Set when the element has a value\n`has-helper` | Set when the element has helper text\n`has-error-message` | Set when the element has an error message\n`has-tooltip` | Set when the element has a slotted tooltip\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------------|\n| `--vaadin-date-time-picker-gap` |\n| `--vaadin-input-field-error-color` |\n| `--vaadin-input-field-error-font-size` |\n| `--vaadin-input-field-error-font-weight` |\n| `--vaadin-input-field-error-line-height` |\n| `--vaadin-input-field-label-color` |\n| `--vaadin-input-field-label-font-size` |\n| `--vaadin-input-field-label-font-weight` |\n| `--vaadin-input-field-label-line-height` |\n| `--vaadin-input-field-helper-color` |\n| `--vaadin-input-field-helper-font-size` |\n| `--vaadin-input-field-helper-font-weight` |\n| `--vaadin-input-field-helper-line-height` |\n| `--vaadin-input-field-required-indicator-color` |\n| `--vaadin-input-field-required-indicator` |\n\n### Internal components\n\nThe following components are created by `<vaadin-date-time-picker>` and placed in light DOM:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-
|
|
19
|
+
"description": "`<vaadin-date-time-picker>` is a Web Component providing a date time selection field.\n\n```html\n<vaadin-date-time-picker value=\"2019-09-16T15:00\"></vaadin-date-time-picker>\n```\n```js\ndateTimePicker.value = '2019-09-16T15:00';\n```\n\nWhen the selected `value` is changed, a `value-changed` event is triggered.\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|----------------\n`label` | The slotted label element wrapper\n`input-fields` | The date and time pickers wrapper\n`helper-text` | The slotted helper text element wrapper\n`error-message` | The slotted error message element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n--------------------|---------------------------------\n`disabled` | Set when the element is disabled\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`invalid` | Set when the element is invalid\n`has-label` | Set when the element has a label\n`has-value` | Set when the element has a value\n`has-helper` | Set when the element has helper text\n`has-error-message` | Set when the element has an error message\n`has-tooltip` | Set when the element has a slotted tooltip\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------------|\n| `--vaadin-date-time-picker-gap` |\n| `--vaadin-input-field-error-color` |\n| `--vaadin-input-field-error-font-size` |\n| `--vaadin-input-field-error-font-weight` |\n| `--vaadin-input-field-error-line-height` |\n| `--vaadin-input-field-label-color` |\n| `--vaadin-input-field-label-font-size` |\n| `--vaadin-input-field-label-font-weight` |\n| `--vaadin-input-field-label-line-height` |\n| `--vaadin-input-field-helper-color` |\n| `--vaadin-input-field-helper-font-size` |\n| `--vaadin-input-field-helper-font-weight` |\n| `--vaadin-input-field-helper-line-height` |\n| `--vaadin-input-field-required-indicator-color` |\n| `--vaadin-input-field-required-indicator` |\n\n### Internal components\n\nThe following components are created by `<vaadin-date-time-picker>` and placed in light DOM:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-alpha9/#/elements/vaadin-date-picker).\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-alpha9/#/elements/vaadin-time-picker).\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\nincomplete => empty | unparsable-change\nincomplete => parsable | change\nincomplete => unparsable | unparsable-change\nempty => incomplete | unparsable-change\nparsable => incomplete | change\nunparsable => incomplete | unparsable-change",
|
|
20
20
|
"extension": true,
|
|
21
21
|
"attributes": [
|
|
22
22
|
{
|
|
23
|
-
"name": "?
|
|
24
|
-
"description": "
|
|
25
|
-
"value": {
|
|
26
|
-
"kind": "expression"
|
|
27
|
-
}
|
|
28
|
-
},
|
|
29
|
-
{
|
|
30
|
-
"name": "?invalid",
|
|
31
|
-
"description": "Set to true when the field is invalid.",
|
|
23
|
+
"name": "?autofocus",
|
|
24
|
+
"description": "Specify that this control should have input focus when the page loads.",
|
|
32
25
|
"value": {
|
|
33
26
|
"kind": "expression"
|
|
34
27
|
}
|
|
35
28
|
},
|
|
36
29
|
{
|
|
37
|
-
"name": "?
|
|
38
|
-
"description": "Set to true to
|
|
30
|
+
"name": "?autoOpenDisabled",
|
|
31
|
+
"description": "Set to true to prevent the overlays from opening automatically.",
|
|
39
32
|
"value": {
|
|
40
33
|
"kind": "expression"
|
|
41
34
|
}
|
|
42
35
|
},
|
|
43
36
|
{
|
|
44
|
-
"name": "?
|
|
45
|
-
"description": "
|
|
37
|
+
"name": "?disabled",
|
|
38
|
+
"description": "If true, the user cannot interact with this element.",
|
|
46
39
|
"value": {
|
|
47
40
|
"kind": "expression"
|
|
48
41
|
}
|
|
49
42
|
},
|
|
50
43
|
{
|
|
51
|
-
"name": "?
|
|
52
|
-
"description": "Set
|
|
44
|
+
"name": "?invalid",
|
|
45
|
+
"description": "Set to true when the field is invalid.",
|
|
53
46
|
"value": {
|
|
54
47
|
"kind": "expression"
|
|
55
48
|
}
|
|
56
49
|
},
|
|
57
50
|
{
|
|
58
|
-
"name": "?
|
|
59
|
-
"description": "Set to true to
|
|
51
|
+
"name": "?manualValidation",
|
|
52
|
+
"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.",
|
|
60
53
|
"value": {
|
|
61
54
|
"kind": "expression"
|
|
62
55
|
}
|
|
@@ -69,71 +62,71 @@
|
|
|
69
62
|
}
|
|
70
63
|
},
|
|
71
64
|
{
|
|
72
|
-
"name": "?
|
|
73
|
-
"description": "
|
|
65
|
+
"name": "?required",
|
|
66
|
+
"description": "Specifies that the user must fill in a value.",
|
|
74
67
|
"value": {
|
|
75
68
|
"kind": "expression"
|
|
76
69
|
}
|
|
77
70
|
},
|
|
78
71
|
{
|
|
79
|
-
"name": "
|
|
80
|
-
"description": "
|
|
72
|
+
"name": "?showWeekNumbers",
|
|
73
|
+
"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).",
|
|
81
74
|
"value": {
|
|
82
75
|
"kind": "expression"
|
|
83
76
|
}
|
|
84
77
|
},
|
|
85
78
|
{
|
|
86
|
-
"name": ".
|
|
87
|
-
"description": "
|
|
79
|
+
"name": ".accessibleName",
|
|
80
|
+
"description": "String used to label the component to screen reader users.",
|
|
88
81
|
"value": {
|
|
89
82
|
"kind": "expression"
|
|
90
83
|
}
|
|
91
84
|
},
|
|
92
85
|
{
|
|
93
|
-
"name": ".
|
|
94
|
-
"description": "
|
|
86
|
+
"name": ".accessibleNameRef",
|
|
87
|
+
"description": "Id of the element used as label of the component to screen reader users.",
|
|
95
88
|
"value": {
|
|
96
89
|
"kind": "expression"
|
|
97
90
|
}
|
|
98
91
|
},
|
|
99
92
|
{
|
|
100
|
-
"name": ".
|
|
101
|
-
"description": "
|
|
93
|
+
"name": ".datePlaceholder",
|
|
94
|
+
"description": "A placeholder string for the date field.",
|
|
102
95
|
"value": {
|
|
103
96
|
"kind": "expression"
|
|
104
97
|
}
|
|
105
98
|
},
|
|
106
99
|
{
|
|
107
|
-
"name": ".
|
|
108
|
-
"description": "
|
|
100
|
+
"name": ".errorMessage",
|
|
101
|
+
"description": "Error to show when the field is invalid.",
|
|
109
102
|
"value": {
|
|
110
103
|
"kind": "expression"
|
|
111
104
|
}
|
|
112
105
|
},
|
|
113
106
|
{
|
|
114
|
-
"name": ".
|
|
115
|
-
"description": "
|
|
107
|
+
"name": ".helperText",
|
|
108
|
+
"description": "String used for the helper text.",
|
|
116
109
|
"value": {
|
|
117
110
|
"kind": "expression"
|
|
118
111
|
}
|
|
119
112
|
},
|
|
120
113
|
{
|
|
121
|
-
"name": ".
|
|
122
|
-
"description": "The
|
|
114
|
+
"name": ".i18n",
|
|
115
|
+
"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 structure and default values:\n\n```js\n{\n // Accessible label to the date picker.\n // The property works in conjunction with label and accessibleName defined on the field.\n // If both properties are defined, then accessibleName takes precedence.\n // Then, the dateLabel value is concatenated with it.\n dateLabel: undefined;\n\n // Accessible label to the time picker.\n // The property works in conjunction with label and accessibleName defined on the field.\n // If both properties are defined, then accessibleName takes precedence.\n // Then, the dateLabel value is concatenated with it.\n timeLabel: undefined;\n}\n```\n\nAdditionally, all i18n properties from\n[`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-alpha9/#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-alpha9/#/elements/vaadin-time-picker) are supported.",
|
|
123
116
|
"value": {
|
|
124
117
|
"kind": "expression"
|
|
125
118
|
}
|
|
126
119
|
},
|
|
127
120
|
{
|
|
128
|
-
"name": ".
|
|
129
|
-
"description": "
|
|
121
|
+
"name": ".initialPosition",
|
|
122
|
+
"description": "Date which should be visible in the date picker overlay when there is no value selected.\n\nThe same date formats as for the `value` property are supported but without the time part.",
|
|
130
123
|
"value": {
|
|
131
124
|
"kind": "expression"
|
|
132
125
|
}
|
|
133
126
|
},
|
|
134
127
|
{
|
|
135
|
-
"name": ".
|
|
136
|
-
"description": "The
|
|
128
|
+
"name": ".label",
|
|
129
|
+
"description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
|
|
137
130
|
"value": {
|
|
138
131
|
"kind": "expression"
|
|
139
132
|
}
|
|
@@ -146,15 +139,15 @@
|
|
|
146
139
|
}
|
|
147
140
|
},
|
|
148
141
|
{
|
|
149
|
-
"name": ".
|
|
150
|
-
"description": "
|
|
142
|
+
"name": ".min",
|
|
143
|
+
"description": "The earliest allowed value (date and time) that can be selected. All earlier values will be disabled.\n\nSupported date time format is based on ISO 8601 (without a time zone designator):\n- Minute precision `\"YYYY-MM-DDThh:mm\"`\n- Second precision `\"YYYY-MM-DDThh:mm:ss\"`\n- Millisecond precision `\"YYYY-MM-DDThh:mm:ss.fff\"`",
|
|
151
144
|
"value": {
|
|
152
145
|
"kind": "expression"
|
|
153
146
|
}
|
|
154
147
|
},
|
|
155
148
|
{
|
|
156
|
-
"name": ".
|
|
157
|
-
"description": "
|
|
149
|
+
"name": ".name",
|
|
150
|
+
"description": "The name of the control, which is submitted with the form data.",
|
|
158
151
|
"value": {
|
|
159
152
|
"kind": "expression"
|
|
160
153
|
}
|
|
@@ -167,15 +160,15 @@
|
|
|
167
160
|
}
|
|
168
161
|
},
|
|
169
162
|
{
|
|
170
|
-
"name": ".
|
|
171
|
-
"description": "
|
|
163
|
+
"name": ".timePlaceholder",
|
|
164
|
+
"description": "A placeholder string for the time field.",
|
|
172
165
|
"value": {
|
|
173
166
|
"kind": "expression"
|
|
174
167
|
}
|
|
175
168
|
},
|
|
176
169
|
{
|
|
177
|
-
"name": "
|
|
178
|
-
"description": "
|
|
170
|
+
"name": ".value",
|
|
171
|
+
"description": "The value for this element.\n\nSupported date time format is based on ISO 8601 (without a time zone designator):\n- Minute precision `\"YYYY-MM-DDThh:mm\"` (default)\n- Second precision `\"YYYY-MM-DDThh:mm:ss\"`\n- Millisecond precision `\"YYYY-MM-DDThh:mm:ss.fff\"`",
|
|
179
172
|
"value": {
|
|
180
173
|
"kind": "expression"
|
|
181
174
|
}
|
|
@@ -194,6 +187,13 @@
|
|
|
194
187
|
"kind": "expression"
|
|
195
188
|
}
|
|
196
189
|
},
|
|
190
|
+
{
|
|
191
|
+
"name": "@validated",
|
|
192
|
+
"description": "Fired whenever the field is validated.",
|
|
193
|
+
"value": {
|
|
194
|
+
"kind": "expression"
|
|
195
|
+
}
|
|
196
|
+
},
|
|
197
197
|
{
|
|
198
198
|
"name": "@value-changed",
|
|
199
199
|
"description": "Fired when the `value` property changes.",
|