@vaadin/time-picker 25.1.0-beta1 → 25.1.0-beta3

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/time-picker",
3
- "version": "25.1.0-beta1",
3
+ "version": "25.1.0-beta3",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -35,28 +35,28 @@
35
35
  ],
36
36
  "dependencies": {
37
37
  "@open-wc/dedupe-mixin": "^1.3.0",
38
- "@vaadin/a11y-base": "25.1.0-beta1",
39
- "@vaadin/combo-box": "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/item": "25.1.0-beta1",
44
- "@vaadin/overlay": "25.1.0-beta1",
45
- "@vaadin/vaadin-themable-mixin": "25.1.0-beta1",
38
+ "@vaadin/a11y-base": "25.1.0-beta3",
39
+ "@vaadin/combo-box": "25.1.0-beta3",
40
+ "@vaadin/component-base": "25.1.0-beta3",
41
+ "@vaadin/field-base": "25.1.0-beta3",
42
+ "@vaadin/input-container": "25.1.0-beta3",
43
+ "@vaadin/item": "25.1.0-beta3",
44
+ "@vaadin/overlay": "25.1.0-beta3",
45
+ "@vaadin/vaadin-themable-mixin": "25.1.0-beta3",
46
46
  "lit": "^3.0.0"
47
47
  },
48
48
  "devDependencies": {
49
- "@vaadin/aura": "25.1.0-beta1",
50
- "@vaadin/chai-plugins": "25.1.0-beta1",
51
- "@vaadin/test-runner-commands": "25.1.0-beta1",
49
+ "@vaadin/aura": "25.1.0-beta3",
50
+ "@vaadin/chai-plugins": "25.1.0-beta3",
51
+ "@vaadin/test-runner-commands": "25.1.0-beta3",
52
52
  "@vaadin/testing-helpers": "^2.0.0",
53
- "@vaadin/vaadin-lumo-styles": "25.1.0-beta1",
54
- "sinon": "^21.0.0"
53
+ "@vaadin/vaadin-lumo-styles": "25.1.0-beta3",
54
+ "sinon": "^21.0.2"
55
55
  },
56
56
  "customElements": "custom-elements.json",
57
57
  "web-types": [
58
58
  "web-types.json",
59
59
  "web-types.lit.json"
60
60
  ],
61
- "gitHead": "0ccf77c385fc6a92ac2a6344ce8804b94956226d"
61
+ "gitHead": "4251850231a42298fda23b83928da588831cdb5d"
62
62
  }
@@ -43,7 +43,6 @@ export const TimePickerMixin = (superClass) =>
43
43
  * - `hh:mm` (default)
44
44
  * - `hh:mm:ss`
45
45
  * - `hh:mm:ss.fff`
46
- * @type {string}
47
46
  */
48
47
  value: {
49
48
  type: String,
@@ -59,7 +58,6 @@ export const TimePickerMixin = (superClass) =>
59
58
  * - `hh:mm`
60
59
  * - `hh:mm:ss`
61
60
  * - `hh:mm:ss.fff`
62
- * @type {string}
63
61
  */
64
62
  min: {
65
63
  type: String,
@@ -74,7 +72,6 @@ export const TimePickerMixin = (superClass) =>
74
72
  * - `hh:mm`
75
73
  * - `hh:mm:ss`
76
74
  * - `hh:mm:ss.fff`
77
- * @type {string}
78
75
  */
79
76
  max: {
80
77
  type: String,
@@ -177,7 +174,7 @@ export const TimePickerMixin = (superClass) =>
177
174
  * NOTE: `formatTime` and `parseTime` must be implemented in a
178
175
  * compatible manner to ensure the component works properly.
179
176
  *
180
- * @return {!TimePickerI18n}
177
+ * @type {!TimePickerI18n}
181
178
  */
182
179
  get i18n() {
183
180
  return super.i18n;
@@ -37,6 +37,11 @@ export type TimePickerValueChangedEvent = CustomEvent<{ value: string }>;
37
37
  */
38
38
  export type TimePickerValidatedEvent = CustomEvent<{ valid: boolean }>;
39
39
 
40
+ /**
41
+ * Fired when the user commits an unparsable value change and there is no change event.
42
+ */
43
+ export type TimePickerUnparsableChangeEvent = CustomEvent;
44
+
40
45
  export interface TimePickerCustomEventMap {
41
46
  'invalid-changed': TimePickerInvalidChangedEvent;
42
47
 
@@ -44,6 +49,8 @@ export interface TimePickerCustomEventMap {
44
49
 
45
50
  'value-changed': TimePickerValueChangedEvent;
46
51
 
52
+ 'unparsable-change': TimePickerUnparsableChangeEvent;
53
+
47
54
  validated: TimePickerValidatedEvent;
48
55
  }
49
56
 
@@ -130,6 +137,7 @@ export interface TimePickerEventMap extends HTMLElementEventMap, TimePickerCusto
130
137
  * unparsable => unparsable | unparsable-change
131
138
  *
132
139
  * @fires {Event} change - Fired when the user commits a value change.
140
+ * @fires {Event} unparsable-change - Fired when the user commits an unparsable value change and there is no change event.
133
141
  * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes.
134
142
  * @fires {CustomEvent} opened-changed - Fired when the `opened` property changes.
135
143
  * @fires {CustomEvent} value-changed - Fired when the `value` property changes.
@@ -97,6 +97,7 @@ import { TimePickerMixin } from './vaadin-time-picker-mixin.js';
97
97
  * unparsable => unparsable | unparsable-change
98
98
  *
99
99
  * @fires {Event} change - Fired when the user commits a value change.
100
+ * @fires {Event} unparsable-change - Fired when the user commits an unparsable value change and there is no change event.
100
101
  * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes.
101
102
  * @fires {CustomEvent} opened-changed - Fired when the `opened` property changes.
102
103
  * @fires {CustomEvent} value-changed - Fired when the `value` property changes.
package/web-types.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/time-picker",
4
- "version": "25.1.0-beta1",
4
+ "version": "25.1.0-beta3",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
8
8
  "elements": [
9
9
  {
10
10
  "name": "vaadin-time-picker",
11
- "description": "`<vaadin-time-picker>` is a Web Component providing a time-selection field.\n\n```html\n<vaadin-time-picker></vaadin-time-picker>\n```\n```js\ntimePicker.value = '14:30';\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`--vaadin-time-picker-overlay-width` | Width of the overlay | `auto`\n`--vaadin-time-picker-overlay-max-height`| Max height of the overlay | `65vh`\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`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\n### Internal components\n\nIn addition to `<vaadin-time-picker>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-time-picker-item>` - has the same API as [`<vaadin-item>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-beta1/#/elements/vaadin-item).\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",
11
+ "description": "`<vaadin-time-picker>` is a Web Component providing a time-selection field.\n\n```html\n<vaadin-time-picker></vaadin-time-picker>\n```\n```js\ntimePicker.value = '14:30';\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`--vaadin-time-picker-overlay-width` | Width of the overlay | `auto`\n`--vaadin-time-picker-overlay-max-height`| Max height of the overlay | `65vh`\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`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\n### Internal components\n\nIn addition to `<vaadin-time-picker>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-time-picker-item>` - has the same API as [`<vaadin-item>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-beta3/#/elements/vaadin-item).\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
14
  "name": "accessible-name",
@@ -120,6 +120,17 @@
120
120
  ]
121
121
  }
122
122
  },
123
+ {
124
+ "name": "i18n",
125
+ "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\nShould be overridden by subclasses to provide a custom JSDoc with the\ndefault I18N properties.",
126
+ "value": {
127
+ "type": [
128
+ "Object",
129
+ "null",
130
+ "undefined"
131
+ ]
132
+ }
133
+ },
123
134
  {
124
135
  "name": "invalid",
125
136
  "description": "Set to true when the field is invalid.",
@@ -158,7 +169,9 @@
158
169
  "description": "Maximum time allowed.\n\nSupported time formats are in ISO 8601:\n- `hh:mm`\n- `hh:mm:ss`\n- `hh:mm:ss.fff`",
159
170
  "value": {
160
171
  "type": [
161
- "string"
172
+ "string",
173
+ "null",
174
+ "undefined"
162
175
  ]
163
176
  }
164
177
  },
@@ -167,7 +180,9 @@
167
180
  "description": "Minimum time allowed.\n\nSupported time formats are in ISO 8601:\n- `hh:mm`\n- `hh:mm:ss`\n- `hh:mm:ss.fff`",
168
181
  "value": {
169
182
  "type": [
170
- "string"
183
+ "string",
184
+ "null",
185
+ "undefined"
171
186
  ]
172
187
  }
173
188
  },
@@ -187,7 +202,9 @@
187
202
  "description": "True if the dropdown is open, false otherwise.",
188
203
  "value": {
189
204
  "type": [
190
- "boolean"
205
+ "boolean",
206
+ "null",
207
+ "undefined"
191
208
  ]
192
209
  }
193
210
  },
@@ -273,7 +290,9 @@
273
290
  "description": "The time value for this element.\n\nSupported time formats are in ISO 8601:\n- `hh:mm` (default)\n- `hh:mm:ss`\n- `hh:mm:ss.fff`",
274
291
  "value": {
275
292
  "type": [
276
- "string"
293
+ "string",
294
+ "null",
295
+ "undefined"
277
296
  ]
278
297
  }
279
298
  }
@@ -395,7 +414,7 @@
395
414
  "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides both the\ntime parsing and formatting functions.\n\nThe object has the following JSON structure:\n\n```js\n{\n // A function to format given `Object` as\n // time string. Object is in the format `{ hours: ..., minutes: ..., seconds: ..., milliseconds: ... }`\n formatTime: (time) => {\n // returns a string representation of the given\n // object in `hh` / 'hh:mm' / 'hh:mm:ss' / 'hh:mm:ss.fff' - formats\n },\n\n // A function to parse the given text to an `Object` in the format\n // `{ hours: ..., minutes: ..., seconds: ..., milliseconds: ... }`.\n // Must properly parse (at least) text\n // formatted by `formatTime`.\n parseTime: text => {\n // Parses a string in object/string that can be formatted by`formatTime`.\n }\n}\n```\n\nNOTE: `formatTime` and `parseTime` must be implemented in a\ncompatible manner to ensure the component works properly.",
396
415
  "value": {
397
416
  "type": [
398
- "TimePickerI18n"
417
+ "?"
399
418
  ]
400
419
  }
401
420
  },
@@ -437,7 +456,9 @@
437
456
  "description": "Maximum time allowed.\n\nSupported time formats are in ISO 8601:\n- `hh:mm`\n- `hh:mm:ss`\n- `hh:mm:ss.fff`",
438
457
  "value": {
439
458
  "type": [
440
- "string"
459
+ "string",
460
+ "null",
461
+ "undefined"
441
462
  ]
442
463
  }
443
464
  },
@@ -446,7 +467,9 @@
446
467
  "description": "Minimum time allowed.\n\nSupported time formats are in ISO 8601:\n- `hh:mm`\n- `hh:mm:ss`\n- `hh:mm:ss.fff`",
447
468
  "value": {
448
469
  "type": [
449
- "string"
470
+ "string",
471
+ "null",
472
+ "undefined"
450
473
  ]
451
474
  }
452
475
  },
@@ -466,7 +489,9 @@
466
489
  "description": "True if the dropdown is open, false otherwise.",
467
490
  "value": {
468
491
  "type": [
469
- "boolean"
492
+ "boolean",
493
+ "null",
494
+ "undefined"
470
495
  ]
471
496
  }
472
497
  },
@@ -541,7 +566,9 @@
541
566
  "description": "The time value for this element.\n\nSupported time formats are in ISO 8601:\n- `hh:mm` (default)\n- `hh:mm:ss`\n- `hh:mm:ss.fff`",
542
567
  "value": {
543
568
  "type": [
544
- "string"
569
+ "string",
570
+ "null",
571
+ "undefined"
545
572
  ]
546
573
  }
547
574
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/time-picker",
4
- "version": "25.1.0-beta1",
4
+ "version": "25.1.0-beta3",
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-time-picker",
19
- "description": "`<vaadin-time-picker>` is a Web Component providing a time-selection field.\n\n```html\n<vaadin-time-picker></vaadin-time-picker>\n```\n```js\ntimePicker.value = '14:30';\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`--vaadin-time-picker-overlay-width` | Width of the overlay | `auto`\n`--vaadin-time-picker-overlay-max-height`| Max height of the overlay | `65vh`\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`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\n### Internal components\n\nIn addition to `<vaadin-time-picker>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-time-picker-item>` - has the same API as [`<vaadin-item>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-beta1/#/elements/vaadin-item).\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",
19
+ "description": "`<vaadin-time-picker>` is a Web Component providing a time-selection field.\n\n```html\n<vaadin-time-picker></vaadin-time-picker>\n```\n```js\ntimePicker.value = '14:30';\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`--vaadin-time-picker-overlay-width` | Width of the overlay | `auto`\n`--vaadin-time-picker-overlay-max-height`| Max height of the overlay | `65vh`\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`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\n### Internal components\n\nIn addition to `<vaadin-time-picker>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-time-picker-item>` - has the same API as [`<vaadin-item>`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-beta3/#/elements/vaadin-item).\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",
20
20
  "extension": true,
21
21
  "attributes": [
22
22
  {