@vaadin/date-time-picker 25.4.0-alpha2 → 25.4.0-alpha4
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 +13 -77
- package/package.json +12 -12
- package/web-types.json +8 -8
- package/web-types.lit.json +7 -7
package/custom-elements.json
CHANGED
|
@@ -96,10 +96,6 @@
|
|
|
96
96
|
"type": {
|
|
97
97
|
"text": "boolean"
|
|
98
98
|
}
|
|
99
|
-
},
|
|
100
|
-
"inheritedFrom": {
|
|
101
|
-
"name": "ValidateMixin",
|
|
102
|
-
"package": "@vaadin/field-base/src/validate-mixin.js"
|
|
103
99
|
}
|
|
104
100
|
},
|
|
105
101
|
{
|
|
@@ -114,8 +110,7 @@
|
|
|
114
110
|
"type": {
|
|
115
111
|
"text": "DatePickerDateMetadataProvider | null | undefined"
|
|
116
112
|
},
|
|
117
|
-
"description": "A function that provides metadata for the dates the calendar is about to render: whether they\nare disabled, and CSS `part` names for styling from outside using the `::part()` selector.\nThe provider is called for a range of dates at a time, and again as the calendar renders\nfurther dates.\n\nIt receives a `DatePickerDateRange` and returns an array of `DatePickerDateMetadata` objects\nfor the dates in that range that have metadata. It can return a `Promise` to load the metadata\nasynchronously, and `null` or `undefined` when no date in the range has metadata.\n\nThe returned array has the following structure:\n\n```js\n[\n // The date is an ISO 8601 string.\n { date: '2026-01-01', disabled: true },\n\n // Adds a custom part name to the date.\n { date: '2026-01-02', part: 'busy' },\n]\n```\n\nA date is disabled if its metadata marks it disabled, or it is outside `min` and `max`.\nDisabled dates are not selectable, and a value on a disabled date makes the field invalid.\nThe provider does not affect which date is focused when opening the overlay. Use\n`initialPosition` property to provide a selectable date.\n\nWhile a returned `Promise` is pending, the dates it covers are not disabled yet and render with\nthe `loading` part. If the function throws or rejects, corresponding dates are requested again\nthe next time the user navigates.\n\nThe provider is used for validation also when the overlay is closed. Date is considered valid\nwhile the provider is pending. Unlike `<vaadin-date-picker>`, the value is not re-validated\nwhen the metadata is loaded, but checked against it at the next validation instead.\n\nKeep a stable reference to the function: assigning a new one clears the cache and re-fetches\nvisible range. Call `clearCache()` to re-fetch when the data behind the same function changed."
|
|
118
|
-
"attribute": "date-metadata-provider"
|
|
113
|
+
"description": "A function that provides metadata for the dates the calendar is about to render: whether they\nare disabled, and CSS `part` names for styling from outside using the `::part()` selector.\nThe provider is called for a range of dates at a time, and again as the calendar renders\nfurther dates.\n\nIt receives a `DatePickerDateRange` and returns an array of `DatePickerDateMetadata` objects\nfor the dates in that range that have metadata. It can return a `Promise` to load the metadata\nasynchronously, and `null` or `undefined` when no date in the range has metadata.\n\nThe returned array has the following structure:\n\n```js\n[\n // The date is an ISO 8601 string.\n { date: '2026-01-01', disabled: true },\n\n // Adds a custom part name to the date.\n { date: '2026-01-02', part: 'busy' },\n]\n```\n\nA date is disabled if its metadata marks it disabled, or it is outside `min` and `max`.\nDisabled dates are not selectable, and a value on a disabled date makes the field invalid.\nThe provider does not affect which date is focused when opening the overlay. Use\n`initialPosition` property to provide a selectable date.\n\nWhile a returned `Promise` is pending, the dates it covers are not disabled yet and render with\nthe `loading` part. If the function throws or rejects, corresponding dates are requested again\nthe next time the user navigates.\n\nThe provider is used for validation also when the overlay is closed. Date is considered valid\nwhile the provider is pending. Unlike `<vaadin-date-picker>`, the value is not re-validated\nwhen the metadata is loaded, but checked against it at the next validation instead.\n\nKeep a stable reference to the function: assigning a new one clears the cache and re-fetches\nvisible range. Call `clearCache()` to re-fetch when the data behind the same function changed."
|
|
119
114
|
},
|
|
120
115
|
{
|
|
121
116
|
"kind": "field",
|
|
@@ -182,16 +177,11 @@
|
|
|
182
177
|
{
|
|
183
178
|
"kind": "field",
|
|
184
179
|
"name": "i18n",
|
|
185
|
-
"
|
|
180
|
+
"description": "The object used to localize this component. To change the default\nlocalization, set this to an object that provides all properties, or\njust the individual properties you want to change.\n\nWhen not set, defaults to `undefined`.\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.",
|
|
186
181
|
"type": {
|
|
187
|
-
"text": "
|
|
182
|
+
"text": "DateTimePickerI18n | undefined"
|
|
188
183
|
},
|
|
189
|
-
"
|
|
190
|
-
"attribute": "i18n",
|
|
191
|
-
"inheritedFrom": {
|
|
192
|
-
"name": "I18nMixin",
|
|
193
|
-
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
194
|
-
}
|
|
184
|
+
"privacy": "public"
|
|
195
185
|
},
|
|
196
186
|
{
|
|
197
187
|
"kind": "field",
|
|
@@ -431,14 +421,6 @@
|
|
|
431
421
|
"description": "Specify that this control should have input focus when the page loads.",
|
|
432
422
|
"fieldName": "autofocus"
|
|
433
423
|
},
|
|
434
|
-
{
|
|
435
|
-
"name": "date-metadata-provider",
|
|
436
|
-
"type": {
|
|
437
|
-
"text": "DatePickerDateMetadataProvider | null | undefined"
|
|
438
|
-
},
|
|
439
|
-
"description": "A function that provides metadata for the dates the calendar is about to render: whether they\nare disabled, and CSS `part` names for styling from outside using the `::part()` selector.\nThe provider is called for a range of dates at a time, and again as the calendar renders\nfurther dates.\n\nIt receives a `DatePickerDateRange` and returns an array of `DatePickerDateMetadata` objects\nfor the dates in that range that have metadata. It can return a `Promise` to load the metadata\nasynchronously, and `null` or `undefined` when no date in the range has metadata.\n\nThe returned array has the following structure:\n\n```js\n[\n // The date is an ISO 8601 string.\n { date: '2026-01-01', disabled: true },\n\n // Adds a custom part name to the date.\n { date: '2026-01-02', part: 'busy' },\n]\n```\n\nA date is disabled if its metadata marks it disabled, or it is outside `min` and `max`.\nDisabled dates are not selectable, and a value on a disabled date makes the field invalid.\nThe provider does not affect which date is focused when opening the overlay. Use\n`initialPosition` property to provide a selectable date.\n\nWhile a returned `Promise` is pending, the dates it covers are not disabled yet and render with\nthe `loading` part. If the function throws or rejects, corresponding dates are requested again\nthe next time the user navigates.\n\nThe provider is used for validation also when the overlay is closed. Date is considered valid\nwhile the provider is pending. Unlike `<vaadin-date-picker>`, the value is not re-validated\nwhen the metadata is loaded, but checked against it at the next validation instead.\n\nKeep a stable reference to the function: assigning a new one clears the cache and re-fetches\nvisible range. Call `clearCache()` to re-fetch when the data behind the same function changed.",
|
|
440
|
-
"fieldName": "dateMetadataProvider"
|
|
441
|
-
},
|
|
442
424
|
{
|
|
443
425
|
"name": "date-placeholder",
|
|
444
426
|
"type": {
|
|
@@ -491,18 +473,6 @@
|
|
|
491
473
|
"package": "@vaadin/field-base/src/field-mixin.js"
|
|
492
474
|
}
|
|
493
475
|
},
|
|
494
|
-
{
|
|
495
|
-
"name": "i18n",
|
|
496
|
-
"type": {
|
|
497
|
-
"text": "Object | undefined"
|
|
498
|
-
},
|
|
499
|
-
"description": "The object used to localize this component. To change the default\nlocalization, set this to an object that provides all properties, or\njust the individual properties you want to change.\n\nWhen not set, defaults to `undefined`.\n\nShould be overridden by subclasses to provide a custom JSDoc with the\ndefault I18N properties.",
|
|
500
|
-
"fieldName": "i18n",
|
|
501
|
-
"inheritedFrom": {
|
|
502
|
-
"name": "I18nMixin",
|
|
503
|
-
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
504
|
-
}
|
|
505
|
-
},
|
|
506
476
|
{
|
|
507
477
|
"name": "initial-position",
|
|
508
478
|
"type": {
|
|
@@ -770,7 +740,6 @@
|
|
|
770
740
|
"text": "DatePickerDateMetadataProvider | null | undefined"
|
|
771
741
|
},
|
|
772
742
|
"description": "A function that provides metadata for the dates the calendar is about to render: whether they\nare disabled, and CSS `part` names for styling from outside using the `::part()` selector.\nThe provider is called for a range of dates at a time, and again as the calendar renders\nfurther dates.\n\nIt receives a `DatePickerDateRange` and returns an array of `DatePickerDateMetadata` objects\nfor the dates in that range that have metadata. It can return a `Promise` to load the metadata\nasynchronously, and `null` or `undefined` when no date in the range has metadata.\n\nThe returned array has the following structure:\n\n```js\n[\n // The date is an ISO 8601 string.\n { date: '2026-01-01', disabled: true },\n\n // Adds a custom part name to the date.\n { date: '2026-01-02', part: 'busy' },\n]\n```\n\nA date is disabled if its metadata marks it disabled, or it is outside `min` and `max`.\nDisabled dates are not selectable, and a value on a disabled date makes the field invalid.\nThe provider does not affect which date is focused when opening the overlay. Use\n`initialPosition` property to provide a selectable date.\n\nWhile a returned `Promise` is pending, the dates it covers are not disabled yet and render with\nthe `loading` part. If the function throws or rejects, corresponding dates are requested again\nthe next time the user navigates.\n\nThe provider is used for validation also when the overlay is closed. Date is considered valid\nwhile the provider is pending. Unlike `<vaadin-date-picker>`, the value is not re-validated\nwhen the metadata is loaded, but checked against it at the next validation instead.\n\nKeep a stable reference to the function: assigning a new one clears the cache and re-fetches\nvisible range. Call `clearCache()` to re-fetch when the data behind the same function changed.",
|
|
773
|
-
"attribute": "date-metadata-provider",
|
|
774
743
|
"inheritedFrom": {
|
|
775
744
|
"name": "DateTimePickerMixin",
|
|
776
745
|
"module": "src/vaadin-date-time-picker-mixin.js"
|
|
@@ -849,15 +818,14 @@
|
|
|
849
818
|
{
|
|
850
819
|
"kind": "field",
|
|
851
820
|
"name": "i18n",
|
|
852
|
-
"
|
|
821
|
+
"description": "The object used to localize this component. To change the default\nlocalization, set this to an object that provides all properties, or\njust the individual properties you want to change.\n\nWhen not set, defaults to `undefined`.\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.",
|
|
853
822
|
"type": {
|
|
854
|
-
"text": "
|
|
823
|
+
"text": "DateTimePickerI18n | undefined"
|
|
855
824
|
},
|
|
856
|
-
"
|
|
857
|
-
"attribute": "i18n",
|
|
825
|
+
"privacy": "public",
|
|
858
826
|
"inheritedFrom": {
|
|
859
|
-
"name": "
|
|
860
|
-
"
|
|
827
|
+
"name": "DateTimePickerMixin",
|
|
828
|
+
"module": "src/vaadin-date-time-picker-mixin.js"
|
|
861
829
|
}
|
|
862
830
|
},
|
|
863
831
|
{
|
|
@@ -1059,15 +1027,11 @@
|
|
|
1059
1027
|
],
|
|
1060
1028
|
"events": [
|
|
1061
1029
|
{
|
|
1062
|
-
"name": "change",
|
|
1063
1030
|
"type": {
|
|
1064
|
-
"text": "
|
|
1031
|
+
"text": "Event"
|
|
1065
1032
|
},
|
|
1066
1033
|
"description": "Fired when the user commits a value change.",
|
|
1067
|
-
"
|
|
1068
|
-
"name": "DateTimePickerMixin",
|
|
1069
|
-
"module": "src/vaadin-date-time-picker-mixin.js"
|
|
1070
|
-
}
|
|
1034
|
+
"name": "change"
|
|
1071
1035
|
},
|
|
1072
1036
|
{
|
|
1073
1037
|
"type": {
|
|
@@ -1077,15 +1041,11 @@
|
|
|
1077
1041
|
"name": "invalid-changed"
|
|
1078
1042
|
},
|
|
1079
1043
|
{
|
|
1080
|
-
"name": "unparsable-change",
|
|
1081
1044
|
"type": {
|
|
1082
|
-
"text": "
|
|
1045
|
+
"text": "Event"
|
|
1083
1046
|
},
|
|
1084
1047
|
"description": "Fired when the user commits an unparsable or incomplete value change and there is no change event.",
|
|
1085
|
-
"
|
|
1086
|
-
"name": "DateTimePickerMixin",
|
|
1087
|
-
"module": "src/vaadin-date-time-picker-mixin.js"
|
|
1088
|
-
}
|
|
1048
|
+
"name": "unparsable-change"
|
|
1089
1049
|
},
|
|
1090
1050
|
{
|
|
1091
1051
|
"type": {
|
|
@@ -1163,18 +1123,6 @@
|
|
|
1163
1123
|
"module": "src/vaadin-date-time-picker-mixin.js"
|
|
1164
1124
|
}
|
|
1165
1125
|
},
|
|
1166
|
-
{
|
|
1167
|
-
"name": "date-metadata-provider",
|
|
1168
|
-
"type": {
|
|
1169
|
-
"text": "DatePickerDateMetadataProvider | null | undefined"
|
|
1170
|
-
},
|
|
1171
|
-
"description": "A function that provides metadata for the dates the calendar is about to render: whether they\nare disabled, and CSS `part` names for styling from outside using the `::part()` selector.\nThe provider is called for a range of dates at a time, and again as the calendar renders\nfurther dates.\n\nIt receives a `DatePickerDateRange` and returns an array of `DatePickerDateMetadata` objects\nfor the dates in that range that have metadata. It can return a `Promise` to load the metadata\nasynchronously, and `null` or `undefined` when no date in the range has metadata.\n\nThe returned array has the following structure:\n\n```js\n[\n // The date is an ISO 8601 string.\n { date: '2026-01-01', disabled: true },\n\n // Adds a custom part name to the date.\n { date: '2026-01-02', part: 'busy' },\n]\n```\n\nA date is disabled if its metadata marks it disabled, or it is outside `min` and `max`.\nDisabled dates are not selectable, and a value on a disabled date makes the field invalid.\nThe provider does not affect which date is focused when opening the overlay. Use\n`initialPosition` property to provide a selectable date.\n\nWhile a returned `Promise` is pending, the dates it covers are not disabled yet and render with\nthe `loading` part. If the function throws or rejects, corresponding dates are requested again\nthe next time the user navigates.\n\nThe provider is used for validation also when the overlay is closed. Date is considered valid\nwhile the provider is pending. Unlike `<vaadin-date-picker>`, the value is not re-validated\nwhen the metadata is loaded, but checked against it at the next validation instead.\n\nKeep a stable reference to the function: assigning a new one clears the cache and re-fetches\nvisible range. Call `clearCache()` to re-fetch when the data behind the same function changed.",
|
|
1172
|
-
"fieldName": "dateMetadataProvider",
|
|
1173
|
-
"inheritedFrom": {
|
|
1174
|
-
"name": "DateTimePickerMixin",
|
|
1175
|
-
"module": "src/vaadin-date-time-picker-mixin.js"
|
|
1176
|
-
}
|
|
1177
|
-
},
|
|
1178
1126
|
{
|
|
1179
1127
|
"name": "date-placeholder",
|
|
1180
1128
|
"type": {
|
|
@@ -1235,18 +1183,6 @@
|
|
|
1235
1183
|
"package": "@vaadin/field-base/src/field-mixin.js"
|
|
1236
1184
|
}
|
|
1237
1185
|
},
|
|
1238
|
-
{
|
|
1239
|
-
"name": "i18n",
|
|
1240
|
-
"type": {
|
|
1241
|
-
"text": "Object | undefined"
|
|
1242
|
-
},
|
|
1243
|
-
"description": "The object used to localize this component. To change the default\nlocalization, set this to an object that provides all properties, or\njust the individual properties you want to change.\n\nWhen not set, defaults to `undefined`.\n\nShould be overridden by subclasses to provide a custom JSDoc with the\ndefault I18N properties.",
|
|
1244
|
-
"fieldName": "i18n",
|
|
1245
|
-
"inheritedFrom": {
|
|
1246
|
-
"name": "I18nMixin",
|
|
1247
|
-
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
|
1248
|
-
}
|
|
1249
|
-
},
|
|
1250
1186
|
{
|
|
1251
1187
|
"name": "initial-position",
|
|
1252
1188
|
"type": {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/date-time-picker",
|
|
3
|
-
"version": "25.4.0-
|
|
3
|
+
"version": "25.4.0-alpha4",
|
|
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.4.0-
|
|
39
|
-
"@vaadin/component-base": "25.4.0-
|
|
40
|
-
"@vaadin/date-picker": "25.4.0-
|
|
41
|
-
"@vaadin/field-base": "25.4.0-
|
|
42
|
-
"@vaadin/time-picker": "25.4.0-
|
|
43
|
-
"@vaadin/vaadin-themable-mixin": "25.4.0-
|
|
38
|
+
"@vaadin/a11y-base": "25.4.0-alpha4",
|
|
39
|
+
"@vaadin/component-base": "25.4.0-alpha4",
|
|
40
|
+
"@vaadin/date-picker": "25.4.0-alpha4",
|
|
41
|
+
"@vaadin/field-base": "25.4.0-alpha4",
|
|
42
|
+
"@vaadin/time-picker": "25.4.0-alpha4",
|
|
43
|
+
"@vaadin/vaadin-themable-mixin": "25.4.0-alpha4",
|
|
44
44
|
"lit": "^3.0.0"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
|
-
"@vaadin/aura": "25.4.0-
|
|
48
|
-
"@vaadin/chai-plugins": "25.4.0-
|
|
49
|
-
"@vaadin/test-runner-commands": "25.4.0-
|
|
47
|
+
"@vaadin/aura": "25.4.0-alpha4",
|
|
48
|
+
"@vaadin/chai-plugins": "25.4.0-alpha4",
|
|
49
|
+
"@vaadin/test-runner-commands": "25.4.0-alpha4",
|
|
50
50
|
"@vaadin/testing-helpers": "^2.0.0",
|
|
51
|
-
"@vaadin/vaadin-lumo-styles": "25.4.0-
|
|
51
|
+
"@vaadin/vaadin-lumo-styles": "25.4.0-alpha4",
|
|
52
52
|
"sinon": "^22.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": "7809e4c099538333a6dbd11d8da18a0c6ec30dad"
|
|
60
60
|
}
|
package/web-types.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://json.schemastore.org/web-types",
|
|
3
3
|
"name": "@vaadin/date-time-picker",
|
|
4
|
-
"version": "25.4.0-
|
|
4
|
+
"version": "25.4.0-alpha4",
|
|
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-aside-gap` |\n| `--vaadin-input-field-label-aside-text-align` |\n| `--vaadin-input-field-label-aside-width` |\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.4.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-aside-gap` |\n| `--vaadin-input-field-label-aside-text-align` |\n| `--vaadin-input-field-label-aside-width` |\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.4.0-alpha4/#/elements/vaadin-date-picker).\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha4/#/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
14
|
"name": "accessible-description-ref",
|
|
@@ -257,8 +257,8 @@
|
|
|
257
257
|
}
|
|
258
258
|
},
|
|
259
259
|
{
|
|
260
|
-
"name": "
|
|
261
|
-
"description": "
|
|
260
|
+
"name": "autoOpenDisabled",
|
|
261
|
+
"description": "Set to true to prevent the overlays from opening automatically.",
|
|
262
262
|
"value": {
|
|
263
263
|
"type": [
|
|
264
264
|
"boolean"
|
|
@@ -266,8 +266,8 @@
|
|
|
266
266
|
}
|
|
267
267
|
},
|
|
268
268
|
{
|
|
269
|
-
"name": "
|
|
270
|
-
"description": "
|
|
269
|
+
"name": "autofocus",
|
|
270
|
+
"description": "Specify that this control should have input focus when the page loads.",
|
|
271
271
|
"value": {
|
|
272
272
|
"type": [
|
|
273
273
|
"boolean"
|
|
@@ -332,10 +332,10 @@
|
|
|
332
332
|
},
|
|
333
333
|
{
|
|
334
334
|
"name": "i18n",
|
|
335
|
-
"description": "The object used to localize this component. To change the default\nlocalization, set this to an object that provides all properties, or\njust the individual properties you want to change.\n\nWhen not set, defaults to `undefined`.\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.4.0-
|
|
335
|
+
"description": "The object used to localize this component. To change the default\nlocalization, set this to an object that provides all properties, or\njust the individual properties you want to change.\n\nWhen not set, defaults to `undefined`.\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.4.0-alpha4/#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha4/#/elements/vaadin-time-picker) are supported.",
|
|
336
336
|
"value": {
|
|
337
337
|
"type": [
|
|
338
|
-
"
|
|
338
|
+
"DateTimePickerI18n",
|
|
339
339
|
"undefined"
|
|
340
340
|
]
|
|
341
341
|
}
|
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.4.0-
|
|
4
|
+
"version": "25.4.0-alpha4",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"framework": "lit",
|
|
7
7
|
"framework-config": {
|
|
@@ -16,7 +16,7 @@
|
|
|
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-aside-gap` |\n| `--vaadin-input-field-label-aside-text-align` |\n| `--vaadin-input-field-label-aside-width` |\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.4.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-aside-gap` |\n| `--vaadin-input-field-label-aside-text-align` |\n| `--vaadin-input-field-label-aside-width` |\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.4.0-alpha4/#/elements/vaadin-date-picker).\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha4/#/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
|
{
|
|
@@ -41,15 +41,15 @@
|
|
|
41
41
|
}
|
|
42
42
|
},
|
|
43
43
|
{
|
|
44
|
-
"name": "?
|
|
45
|
-
"description": "
|
|
44
|
+
"name": "?autoOpenDisabled",
|
|
45
|
+
"description": "Set to true to prevent the overlays from opening automatically.",
|
|
46
46
|
"value": {
|
|
47
47
|
"kind": "expression"
|
|
48
48
|
}
|
|
49
49
|
},
|
|
50
50
|
{
|
|
51
|
-
"name": "?
|
|
52
|
-
"description": "
|
|
51
|
+
"name": "?autofocus",
|
|
52
|
+
"description": "Specify that this control should have input focus when the page loads.",
|
|
53
53
|
"value": {
|
|
54
54
|
"kind": "expression"
|
|
55
55
|
}
|
|
@@ -98,7 +98,7 @@
|
|
|
98
98
|
},
|
|
99
99
|
{
|
|
100
100
|
"name": ".i18n",
|
|
101
|
-
"description": "The object used to localize this component. To change the default\nlocalization, set this to an object that provides all properties, or\njust the individual properties you want to change.\n\nWhen not set, defaults to `undefined`.\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.4.0-
|
|
101
|
+
"description": "The object used to localize this component. To change the default\nlocalization, set this to an object that provides all properties, or\njust the individual properties you want to change.\n\nWhen not set, defaults to `undefined`.\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.4.0-alpha4/#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha4/#/elements/vaadin-time-picker) are supported.",
|
|
102
102
|
"value": {
|
|
103
103
|
"kind": "expression"
|
|
104
104
|
}
|