@vaadin/date-time-picker 24.6.0-alpha3 → 24.6.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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/date-time-picker",
3
- "version": "24.6.0-alpha3",
3
+ "version": "24.6.0-alpha4",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -36,18 +36,18 @@
36
36
  ],
37
37
  "dependencies": {
38
38
  "@polymer/polymer": "^3.0.0",
39
- "@vaadin/a11y-base": "24.6.0-alpha3",
40
- "@vaadin/component-base": "24.6.0-alpha3",
41
- "@vaadin/custom-field": "24.6.0-alpha3",
42
- "@vaadin/date-picker": "24.6.0-alpha3",
43
- "@vaadin/field-base": "24.6.0-alpha3",
44
- "@vaadin/time-picker": "24.6.0-alpha3",
45
- "@vaadin/vaadin-lumo-styles": "24.6.0-alpha3",
46
- "@vaadin/vaadin-material-styles": "24.6.0-alpha3",
47
- "@vaadin/vaadin-themable-mixin": "24.6.0-alpha3"
39
+ "@vaadin/a11y-base": "24.6.0-alpha4",
40
+ "@vaadin/component-base": "24.6.0-alpha4",
41
+ "@vaadin/custom-field": "24.6.0-alpha4",
42
+ "@vaadin/date-picker": "24.6.0-alpha4",
43
+ "@vaadin/field-base": "24.6.0-alpha4",
44
+ "@vaadin/time-picker": "24.6.0-alpha4",
45
+ "@vaadin/vaadin-lumo-styles": "24.6.0-alpha4",
46
+ "@vaadin/vaadin-material-styles": "24.6.0-alpha4",
47
+ "@vaadin/vaadin-themable-mixin": "24.6.0-alpha4"
48
48
  },
49
49
  "devDependencies": {
50
- "@vaadin/chai-plugins": "24.6.0-alpha3",
50
+ "@vaadin/chai-plugins": "24.6.0-alpha4",
51
51
  "@vaadin/testing-helpers": "^1.0.0",
52
52
  "sinon": "^18.0.0"
53
53
  },
@@ -55,5 +55,5 @@
55
55
  "web-types.json",
56
56
  "web-types.lit.json"
57
57
  ],
58
- "gitHead": "f917e587caaf86b3d55598233811409b0f34ff69"
58
+ "gitHead": "78967d4f3bb46f58f43c2cc621802554acb2efaf"
59
59
  }
@@ -11,7 +11,12 @@ import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
11
11
  import { SlotController } from '@vaadin/component-base/src/slot-controller.js';
12
12
  import { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';
13
13
  import { DatePicker } from '@vaadin/date-picker/src/vaadin-date-picker.js';
14
- import { dateEquals, parseDate } from '@vaadin/date-picker/src/vaadin-date-picker-helper.js';
14
+ import {
15
+ dateEquals,
16
+ formatUTCISODate,
17
+ normalizeUTCDate,
18
+ parseUTCDate,
19
+ } from '@vaadin/date-picker/src/vaadin-date-picker-helper.js';
15
20
  import { FieldMixin } from '@vaadin/field-base/src/field-mixin.js';
16
21
  import { inputFieldShared } from '@vaadin/field-base/src/styles/input-field-shared-styles.js';
17
22
  import { TimePicker } from '@vaadin/time-picker/src/vaadin-time-picker.js';
@@ -621,16 +626,16 @@ class DateTimePicker extends FieldMixin(DisabledMixin(FocusMixin(ThemableMixin(E
621
626
  __updateTimePickerMinMax() {
622
627
  if (this.__timePicker && this.__datePicker) {
623
628
  const selectedDate = this.__parseDate(this.__datePicker.value);
624
- const isMinMaxSameDay = dateEquals(this.__minDateTime, this.__maxDateTime);
629
+ const isMinMaxSameDay = dateEquals(this.__minDateTime, this.__maxDateTime, normalizeUTCDate);
625
630
  const oldTimeValue = this.__timePicker.value;
626
631
 
627
- if ((this.__minDateTime && dateEquals(selectedDate, this.__minDateTime)) || isMinMaxSameDay) {
632
+ if ((this.__minDateTime && dateEquals(selectedDate, this.__minDateTime, normalizeUTCDate)) || isMinMaxSameDay) {
628
633
  this.__timePicker.min = this.__dateToIsoTimeString(this.__minDateTime);
629
634
  } else {
630
635
  this.__timePicker.min = this.__defaultTimeMinValue;
631
636
  }
632
637
 
633
- if ((this.__maxDateTime && dateEquals(selectedDate, this.__maxDateTime)) || isMinMaxSameDay) {
638
+ if ((this.__maxDateTime && dateEquals(selectedDate, this.__maxDateTime, normalizeUTCDate)) || isMinMaxSameDay) {
634
639
  this.__timePicker.max = this.__dateToIsoTimeString(this.__maxDateTime);
635
640
  } else {
636
641
  this.__timePicker.max = this.__defaultTimeMaxValue;
@@ -756,7 +761,7 @@ class DateTimePicker extends FieldMixin(DisabledMixin(FocusMixin(ThemableMixin(E
756
761
  * @private
757
762
  */
758
763
  __parseDate(str) {
759
- return parseDate(str);
764
+ return parseUTCDate(str);
760
765
  }
761
766
 
762
767
  /**
@@ -770,7 +775,7 @@ class DateTimePicker extends FieldMixin(DisabledMixin(FocusMixin(ThemableMixin(E
770
775
  if (!date) {
771
776
  return defaultValue;
772
777
  }
773
- return DatePicker.prototype._formatISO(date);
778
+ return formatUTCISODate(date);
774
779
  }
775
780
 
776
781
  /**
@@ -817,10 +822,10 @@ class DateTimePicker extends FieldMixin(DisabledMixin(FocusMixin(ThemableMixin(E
817
822
  return;
818
823
  }
819
824
 
820
- date.setHours(parseInt(time.hours));
821
- date.setMinutes(parseInt(time.minutes || 0));
822
- date.setSeconds(parseInt(time.seconds || 0));
823
- date.setMilliseconds(parseInt(time.milliseconds || 0));
825
+ date.setUTCHours(parseInt(time.hours));
826
+ date.setUTCMinutes(parseInt(time.minutes || 0));
827
+ date.setUTCSeconds(parseInt(time.seconds || 0));
828
+ date.setUTCMilliseconds(parseInt(time.milliseconds || 0));
824
829
 
825
830
  return date;
826
831
  }
@@ -850,10 +855,10 @@ class DateTimePicker extends FieldMixin(DisabledMixin(FocusMixin(ThemableMixin(E
850
855
  __dateToIsoTimeString(date) {
851
856
  return this.__formatTimeISO(
852
857
  this.__validateTime({
853
- hours: date.getHours(),
854
- minutes: date.getMinutes(),
855
- seconds: date.getSeconds(),
856
- milliseconds: date.getMilliseconds(),
858
+ hours: date.getUTCHours(),
859
+ minutes: date.getUTCMinutes(),
860
+ seconds: date.getUTCSeconds(),
861
+ milliseconds: date.getUTCMilliseconds(),
857
862
  }),
858
863
  );
859
864
  }
@@ -910,14 +915,14 @@ class DateTimePicker extends FieldMixin(DisabledMixin(FocusMixin(ThemableMixin(E
910
915
  * @private
911
916
  */
912
917
  __dateTimeEquals(date1, date2) {
913
- if (!dateEquals(date1, date2)) {
918
+ if (!dateEquals(date1, date2, normalizeUTCDate)) {
914
919
  return false;
915
920
  }
916
921
  return (
917
- date1.getHours() === date2.getHours() &&
918
- date1.getMinutes() === date2.getMinutes() &&
919
- date1.getSeconds() === date2.getSeconds() &&
920
- date1.getMilliseconds() === date2.getMilliseconds()
922
+ date1.getUTCHours() === date2.getUTCHours() &&
923
+ date1.getUTCMinutes() === date2.getUTCMinutes() &&
924
+ date1.getUTCSeconds() === date2.getUTCSeconds() &&
925
+ date1.getUTCMilliseconds() === date2.getUTCMilliseconds()
921
926
  );
922
927
  }
923
928
 
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": "24.6.0-alpha3",
4
+ "version": "24.6.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`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 | Part name\n--------------------|-------------------------------------------|------------\n`disabled` | Set when the element is disabled | :host\n`focused` | Set when the element is focused | :host\n`focus-ring` | Set when the element is keyboard focused | :host\n`readonly` | Set when the element is readonly | :host\n`invalid` | Set when the element is invalid | :host\n`has-label` | Set when the element has a label | :host\n`has-value` | Set when the element has a value | :host\n`has-helper` | Set when the element has helper text | :host\n`has-error-message` | Set when the element has an error message | :host\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/24.6.0-alpha3/#/elements/vaadin-date-picker).\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-time-picker).\n\nNote: the `theme` attribute value set on `<vaadin-date-time-picker>` is\npropagated to these components.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
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`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 | Part name\n--------------------|-------------------------------------------|------------\n`disabled` | Set when the element is disabled | :host\n`focused` | Set when the element is focused | :host\n`focus-ring` | Set when the element is keyboard focused | :host\n`readonly` | Set when the element is readonly | :host\n`invalid` | Set when the element is invalid | :host\n`has-label` | Set when the element has a label | :host\n`has-value` | Set when the element has a value | :host\n`has-helper` | Set when the element has helper text | :host\n`has-error-message` | Set when the element has an error message | :host\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/24.6.0-alpha4/#/elements/vaadin-date-picker).\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-time-picker).\n\nNote: the `theme` attribute value set on `<vaadin-date-time-picker>` is\npropagated to these components.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
12
12
  "attributes": [
13
13
  {
14
14
  "name": "disabled",
@@ -224,7 +224,7 @@
224
224
  },
225
225
  {
226
226
  "name": "overlay-class",
227
- "description": "A space-delimited list of CSS class names to set on the overlay elements\nof the internal components controlled by the `<vaadin-date-time-picker>`:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-date-picker#property-overlayClass)\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-time-picker#property-overlayClass)",
227
+ "description": "A space-delimited list of CSS class names to set on the overlay elements\nof the internal components controlled by the `<vaadin-date-time-picker>`:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-date-picker#property-overlayClass)\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-time-picker#property-overlayClass)",
228
228
  "value": {
229
229
  "type": [
230
230
  "string",
@@ -461,7 +461,7 @@
461
461
  },
462
462
  {
463
463
  "name": "i18n",
464
- "description": "The object used to localize this component.\nTo change the default localization, replace the entire\n`i18n` object or just the properties you want to modify.\n\nThe object is a combination of the i18n properties supported by\n[`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-time-picker).",
464
+ "description": "The object used to localize this component.\nTo change the default localization, replace the entire\n`i18n` object or just the properties you want to modify.\n\nThe object is a combination of the i18n properties supported by\n[`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-time-picker).",
465
465
  "value": {
466
466
  "type": [
467
467
  "DateTimePickerI18n"
@@ -470,7 +470,7 @@
470
470
  },
471
471
  {
472
472
  "name": "overlayClass",
473
- "description": "A space-delimited list of CSS class names to set on the overlay elements\nof the internal components controlled by the `<vaadin-date-time-picker>`:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-date-picker#property-overlayClass)\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-time-picker#property-overlayClass)",
473
+ "description": "A space-delimited list of CSS class names to set on the overlay elements\nof the internal components controlled by the `<vaadin-date-time-picker>`:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-date-picker#property-overlayClass)\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-time-picker#property-overlayClass)",
474
474
  "value": {
475
475
  "type": [
476
476
  "string",
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/date-time-picker",
4
- "version": "24.6.0-alpha3",
4
+ "version": "24.6.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`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 | Part name\n--------------------|-------------------------------------------|------------\n`disabled` | Set when the element is disabled | :host\n`focused` | Set when the element is focused | :host\n`focus-ring` | Set when the element is keyboard focused | :host\n`readonly` | Set when the element is readonly | :host\n`invalid` | Set when the element is invalid | :host\n`has-label` | Set when the element has a label | :host\n`has-value` | Set when the element has a value | :host\n`has-helper` | Set when the element has helper text | :host\n`has-error-message` | Set when the element has an error message | :host\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/24.6.0-alpha3/#/elements/vaadin-date-picker).\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-time-picker).\n\nNote: the `theme` attribute value set on `<vaadin-date-time-picker>` is\npropagated to these components.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
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`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 | Part name\n--------------------|-------------------------------------------|------------\n`disabled` | Set when the element is disabled | :host\n`focused` | Set when the element is focused | :host\n`focus-ring` | Set when the element is keyboard focused | :host\n`readonly` | Set when the element is readonly | :host\n`invalid` | Set when the element is invalid | :host\n`has-label` | Set when the element has a label | :host\n`has-value` | Set when the element has a value | :host\n`has-helper` | Set when the element has helper text | :host\n`has-error-message` | Set when the element has an error message | :host\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/24.6.0-alpha4/#/elements/vaadin-date-picker).\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-time-picker).\n\nNote: the `theme` attribute value set on `<vaadin-date-time-picker>` is\npropagated to these components.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
20
20
  "extension": true,
21
21
  "attributes": [
22
22
  {
@@ -161,14 +161,14 @@
161
161
  },
162
162
  {
163
163
  "name": ".i18n",
164
- "description": "The object used to localize this component.\nTo change the default localization, replace the entire\n`i18n` object or just the properties you want to modify.\n\nThe object is a combination of the i18n properties supported by\n[`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-time-picker).",
164
+ "description": "The object used to localize this component.\nTo change the default localization, replace the entire\n`i18n` object or just the properties you want to modify.\n\nThe object is a combination of the i18n properties supported by\n[`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-date-picker) and\n[`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-time-picker).",
165
165
  "value": {
166
166
  "kind": "expression"
167
167
  }
168
168
  },
169
169
  {
170
170
  "name": ".overlayClass",
171
- "description": "A space-delimited list of CSS class names to set on the overlay elements\nof the internal components controlled by the `<vaadin-date-time-picker>`:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-date-picker#property-overlayClass)\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha3/#/elements/vaadin-time-picker#property-overlayClass)",
171
+ "description": "A space-delimited list of CSS class names to set on the overlay elements\nof the internal components controlled by the `<vaadin-date-time-picker>`:\n\n- [`<vaadin-date-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-date-picker#property-overlayClass)\n- [`<vaadin-time-picker>`](https://cdn.vaadin.com/vaadin-web-components/24.6.0-alpha4/#/elements/vaadin-time-picker#property-overlayClass)",
172
172
  "value": {
173
173
  "kind": "expression"
174
174
  }