@digital-realty/ix-date 1.1.11 → 1.1.13

package/dist/IxDate.d.ts

@@ -17,6 +17,7 @@ export declare class IxDate extends MobxLitElement {
         delegatesFocus: boolean;
         mode: ShadowRootMode;
         slotAssignment?: SlotAssignmentMode | undefined;
+        /** @nocollapse  */
         customElements?: CustomElementRegistry | undefined;
         registry?: CustomElementRegistry | undefined;
     };
@@ -91,8 +92,6 @@ export declare class IxDate extends MobxLitElement {
     handleChange: (e: InputEvent) => void;
     validateDate: () => void;
     focusOut: () => void;
-    formatDate: (date: string | Date) => string;
-    formatTime: (date: string | Date) => string;
     get nativeInputValue(): string;
     render(): import("lit-html").TemplateResult<1>;
 }

package/dist/IxDate.js

@@ -5,19 +5,18 @@ import { classMap } from 'lit/directives/class-map.js';
 import '@digital-realty/ix-field/ix-field.js';
 import { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';
 import { format } from 'date-fns/format.js';
-import { isValid } from 'date-fns/isValid.js';
 import { parse } from 'date-fns/parse.js';
-import { parseISO } from 'date-fns/parseISO.js';
 import { MobxLitElement } from '@adobe/lit-mobx';
 import { dateFormatState } from './state/date-format-state.js';
 import { IxDateStyles } from './ix-date-styles.js';
+import { formatDate, formatTime } from './date-utils.js';
 export const NativeInputDateFormat = 'yyyy-MM-dd';
 export class IxDate extends MobxLitElement {
     constructor() {
         super(...arguments);
         this.type = 'default';
         this.format = 'dd/MM/yyyy';
-        this.timeFormat = 'HH:mm';
+        this.timeFormat = 'hh:mm a';
         this.variant = 'date';
         this.label = '';
         this.dateTimeText = '';
@@ -62,18 +61,6 @@ export class IxDate extends MobxLitElement {
         this.focusOut = () => {
             this.focused = false;
         };
-        this.formatDate = (date) => {
-            const parsedDate = typeof date === 'string' ? parseISO(date) : date;
-            return isValid(parsedDate)
-                ? format(parsedDate, this.format || 'dd/MM/yyyy')
-                : '';
-        };
-        this.formatTime = (date) => {
-            const parsedDate = typeof date === 'string' ? parseISO(date) : date;
-            return isValid(parsedDate)
-                ? format(parsedDate, this.timeFormat || 'HH:mm')
-                : '';
-        };
     }
     static get styles() {
         return [IxDateStyles];
@@ -212,7 +199,7 @@ export class IxDate extends MobxLitElement {
     }
     get nativeInputValue() {
         try {
-            return format(this.value, NativeInputDateFormat);
+            return new Date(this.value).toISOString().split('T')[0];
         }
         catch (error) {
             return this.value;
@@ -226,8 +213,8 @@ export class IxDate extends MobxLitElement {
         return this.type === 'static'
             ? html `
           <span
-            >${this.formatDate(this.value)}${this.variant === 'date-time'
-                ? `${this.dateTimeText ? ` ${this.dateTimeText} ` : ' '}${this.formatTime(this.value)}`
+            >${formatDate(this.value, this.format)}${this.variant === 'date-time'
+                ? `${this.dateTimeText ? ` ${this.dateTimeText} ` : ' '}${formatTime(this.value, this.timeFormat)}`
                 : ''}</span
           >
         `

package/dist/IxDate.js.map

@@ -1 +1 @@
-{"version":3,"file":"IxDate.js","sourceRoot":"","sources":["../src/IxDate.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport '@digital-realty/ix-field/ix-field.js';\nimport { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport { format } from 'date-fns/format.js';\nimport { isValid } from 'date-fns/isValid.js';\nimport { parse } from 'date-fns/parse.js';\nimport { parseISO } from 'date-fns/parseISO.js';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { dateFormatState } from './state/date-format-state.js';\nimport { IxDateStyles } from './ix-date-styles.js';\n\nexport const NativeInputDateFormat = 'yyyy-MM-dd';\n\nexport class IxDate extends MobxLitElement {\n  static {\n    requestUpdateOnAriaChange(IxDate);\n  }\n\n  static get styles() {\n    return [IxDateStyles];\n  }\n\n  @property({ type: String }) type = 'default';\n\n  @property({ type: String }) format = 'dd/MM/yyyy';\n\n  @property({ type: String }) timeFormat = 'HH:mm';\n\n  @property({ type: String }) variant = 'date';\n\n  @property({ type: String }) label = '';\n\n  @property({ type: String }) dateTimeText = '';\n\n  @property({ type: String }) value = '';\n\n  @property({ type: String }) min = '';\n\n  @property({ type: String }) max = '9999-12-31';\n\n  // Form association\n\n  /** @nocollapse */\n  static override shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /** @nocollapse  */\n  static readonly formAssociated = true;\n\n  private readonly internals = (this as HTMLElement) /* needed for closure */\n    .attachInternals();\n\n  @query('#date-input') dateInput!: HTMLInputElement;\n\n  @query('vaadin-date-picker') datePicker!: any;\n\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /**\n   * Gets or sets whether or not the text field is in a visually invalid state.\n   *\n   * This error state overrides the error state controlled by\n   * `reportValidity()`.\n   */\n  get error() {\n    return !!this.errorText;\n  }\n\n  @property({ type: String, attribute: 'error-text' }) errorText = '';\n\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  @property({ type: Boolean, reflect: true }) hideError = false;\n\n  @property({ type: Boolean, attribute: 'clear-button-visible' })\n  clearButtonVisible = true;\n\n  /**\n   * The associated form element with which this element's value will submit.\n   */\n  get form() {\n    return this.internals.form;\n  }\n\n  /**\n   * The labels this element is associated with.\n   */\n  get labels() {\n    return this.internals.labels;\n  }\n\n  /**\n   * The HTML name to use in form submission.\n   */\n  get name() {\n    return this.getAttribute('name') ?? '';\n  }\n\n  set name(name: string) {\n    this.setAttribute('name', name);\n  }\n\n  /**\n   * Returns the text field's validation error message.\n   *\n   * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation\n   */\n  get validationMessage() {\n    return this.internals.validationMessage;\n  }\n\n  /**\n   * Returns a `ValidityState` object that represents the validity states of the\n   * text field.\n   *\n   * https://developer.mozilla.org/en-US/docs/Web/API/ValidityState\n   */\n  get validity() {\n    return this.internals.validity;\n  }\n\n  /**\n   * Returns whether an element will successfully validate based on forms\n   * validation rules and constraints.\n   *\n   * https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate\n   */\n  get willValidate() {\n    return this.internals.willValidate;\n  }\n\n  checkValidity() {\n    return this.internals.checkValidity();\n  }\n\n  reportValidity() {\n    return this.internals.reportValidity();\n  }\n\n  /** @private */\n  formResetCallback() {\n    this.reset();\n  }\n\n  /**\n   * Reset the text field to its default value.\n   */\n  reset() {\n    this.clear();\n    this.value = this.getAttribute('value') ?? '';\n  }\n\n  protected override updated(\n    changedProperties: Map<string | number | symbol, unknown>\n  ) {\n    if (changedProperties.has('value')) {\n      const inputVal = this.dateInput ? this.dateInput : this.datePicker;\n      if (inputVal) {\n        this.internals.setValidity(\n          {\n            badInput: this.error,\n          },\n          this.error ? this.errorText : '',\n          inputVal\n        );\n      }\n    }\n\n    this.internals.setFormValue(this.value);\n  }\n\n  override focus() {\n    this.dateInput.focus();\n  }\n\n  // eslint-disable-next-line class-methods-use-this\n  @property({ type: Function }) onChanged: any = () => {};\n\n  @state() private focused = false;\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    document.addEventListener(\n      'dateFormatChanged',\n      this.handleDateFormatChanged\n    );\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    document.removeEventListener(\n      'dateFormatChanged',\n      this.handleDateFormatChanged\n    );\n  }\n\n  handleDateFormatChanged = async () => {\n    await dateFormatState.hydrateStore();\n\n    this.format = dateFormatState.preferredDateFormat;\n    this.timeFormat = dateFormatState.preferredTimeFormat;\n  };\n\n  firstUpdated() {\n    const minDate = new Date(this.min);\n    const maxDate = new Date(this.max);\n\n    if (minDate && !Number.isNaN(minDate.valueOf())) {\n      const [min] = minDate.toISOString().split('T');\n      this.min = min;\n    }\n\n    if (maxDate && !Number.isNaN(maxDate.valueOf())) {\n      const [max] = maxDate.toISOString().split('T');\n      this.max = max;\n    }\n\n    this.validateDate();\n\n    this.format = dateFormatState.preferredDateFormat;\n\n    this.timeFormat = dateFormatState.preferredTimeFormat;\n\n    if (this.datePicker) {\n      const formatDateIso8601 = (dateParts: any): string => {\n        const { year, month, day } = dateParts;\n        const date = new Date(year, month, day);\n\n        return format(date, this.format);\n      };\n\n      const parseDateIso8601 = (inputValue: string) => {\n        const date = parse(inputValue, this.format, new Date());\n\n        return {\n          year: date.getFullYear(),\n          month: date.getMonth(),\n          day: date.getDate(),\n        };\n      };\n\n      this.datePicker.i18n = {\n        ...this.datePicker.i18n,\n        formatDate: formatDateIso8601,\n        parseDate: parseDateIso8601,\n      };\n    }\n  }\n\n  focusin = () => {\n    this.focused = true;\n  };\n\n  clear = () => {\n    this.value = '';\n  };\n\n  handleChange = (e: InputEvent) => {\n    const { value } = e.target as HTMLInputElement;\n    this.value = value;\n    this.validateDate();\n    this.onChanged(value);\n  };\n\n  validateDate = () => {\n    if (this.value) {\n      const date = new Date(this.value);\n\n      if (!date || Number.isNaN(date.valueOf())) {\n        this.errorText = 'Invalid date format.';\n      }\n    }\n  };\n\n  focusOut = () => {\n    this.focused = false;\n  };\n\n  formatDate = (date: string | Date) => {\n    const parsedDate = typeof date === 'string' ? parseISO(date) : date;\n    return isValid(parsedDate)\n      ? format(parsedDate, this.format || 'dd/MM/yyyy')\n      : '';\n  };\n\n  formatTime = (date: string | Date) => {\n    const parsedDate = typeof date === 'string' ? parseISO(date) : date;\n    return isValid(parsedDate)\n      ? format(parsedDate, this.timeFormat || 'HH:mm')\n      : '';\n  };\n\n  get nativeInputValue() {\n    try {\n      return format(this.value, NativeInputDateFormat);\n    } catch (error) {\n      return this.value;\n    }\n  }\n\n  render() {\n    const classes = {\n      disabled: this.disabled,\n      error: !this.disabled && this.error,\n    };\n\n    return this.type === 'static'\n      ? html`\n          <span\n            >${this.formatDate(this.value)}${this.variant === 'date-time'\n              ? `${\n                  this.dateTimeText ? ` ${this.dateTimeText} ` : ' '\n                }${this.formatTime(this.value)}`\n              : ''}</span\n          >\n        `\n      : html`<ix-field\n          class=\"${classMap(classes)}\"\n          ?focused=${this.focused}\n          ?populated=${this.value}\n          ?disabled=${this.disabled}\n          ?required=${this.required}\n          ?error=${this.error && !this.hideError}\n          error-text=${this.errorText}\n          label=${this.label}\n          @focusin=${this.focusin}\n          @focusout=${this.focusOut}\n        >\n          ${html`<input\n            id=\"date-input\"\n            @change=${this.handleChange}\n            .value=${this.nativeInputValue}\n            class=\"flex-fill\"\n            type=\"date\"\n            min=${this.min}\n            max=${this.max}\n            ?disabled=${this.disabled}\n          />`}\n        </ix-field> `;\n  }\n}\n"]}
+{"version":3,"file":"IxDate.js","sourceRoot":"","sources":["../src/IxDate.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport '@digital-realty/ix-field/ix-field.js';\nimport { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport { format } from 'date-fns/format.js';\nimport { parse } from 'date-fns/parse.js';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { dateFormatState } from './state/date-format-state.js';\nimport { IxDateStyles } from './ix-date-styles.js';\nimport { formatDate, formatTime } from './date-utils.js';\n\nexport const NativeInputDateFormat = 'yyyy-MM-dd';\n\nexport class IxDate extends MobxLitElement {\n  static {\n    requestUpdateOnAriaChange(IxDate);\n  }\n\n  static get styles() {\n    return [IxDateStyles];\n  }\n\n  @property({ type: String }) type = 'default';\n\n  @property({ type: String }) format = 'dd/MM/yyyy';\n\n  @property({ type: String }) timeFormat = 'hh:mm a';\n\n  @property({ type: String }) variant = 'date';\n\n  @property({ type: String }) label = '';\n\n  @property({ type: String }) dateTimeText = '';\n\n  @property({ type: String }) value = '';\n\n  @property({ type: String }) min = '';\n\n  @property({ type: String }) max = '9999-12-31';\n\n  // Form association\n\n  /** @nocollapse */\n  static override shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /** @nocollapse  */\n  static readonly formAssociated = true;\n\n  private readonly internals = (this as HTMLElement) /* needed for closure */\n    .attachInternals();\n\n  @query('#date-input') dateInput!: HTMLInputElement;\n\n  @query('vaadin-date-picker') datePicker!: any;\n\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /**\n   * Gets or sets whether or not the text field is in a visually invalid state.\n   *\n   * This error state overrides the error state controlled by\n   * `reportValidity()`.\n   */\n  get error() {\n    return !!this.errorText;\n  }\n\n  @property({ type: String, attribute: 'error-text' }) errorText = '';\n\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  @property({ type: Boolean, reflect: true }) hideError = false;\n\n  @property({ type: Boolean, attribute: 'clear-button-visible' })\n  clearButtonVisible = true;\n\n  /**\n   * The associated form element with which this element's value will submit.\n   */\n  get form() {\n    return this.internals.form;\n  }\n\n  /**\n   * The labels this element is associated with.\n   */\n  get labels() {\n    return this.internals.labels;\n  }\n\n  /**\n   * The HTML name to use in form submission.\n   */\n  get name() {\n    return this.getAttribute('name') ?? '';\n  }\n\n  set name(name: string) {\n    this.setAttribute('name', name);\n  }\n\n  /**\n   * Returns the text field's validation error message.\n   *\n   * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation\n   */\n  get validationMessage() {\n    return this.internals.validationMessage;\n  }\n\n  /**\n   * Returns a `ValidityState` object that represents the validity states of the\n   * text field.\n   *\n   * https://developer.mozilla.org/en-US/docs/Web/API/ValidityState\n   */\n  get validity() {\n    return this.internals.validity;\n  }\n\n  /**\n   * Returns whether an element will successfully validate based on forms\n   * validation rules and constraints.\n   *\n   * https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate\n   */\n  get willValidate() {\n    return this.internals.willValidate;\n  }\n\n  checkValidity() {\n    return this.internals.checkValidity();\n  }\n\n  reportValidity() {\n    return this.internals.reportValidity();\n  }\n\n  /** @private */\n  formResetCallback() {\n    this.reset();\n  }\n\n  /**\n   * Reset the text field to its default value.\n   */\n  reset() {\n    this.clear();\n    this.value = this.getAttribute('value') ?? '';\n  }\n\n  protected override updated(\n    changedProperties: Map<string | number | symbol, unknown>\n  ) {\n    if (changedProperties.has('value')) {\n      const inputVal = this.dateInput ? this.dateInput : this.datePicker;\n      if (inputVal) {\n        this.internals.setValidity(\n          {\n            badInput: this.error,\n          },\n          this.error ? this.errorText : '',\n          inputVal\n        );\n      }\n    }\n\n    this.internals.setFormValue(this.value);\n  }\n\n  override focus() {\n    this.dateInput.focus();\n  }\n\n  // eslint-disable-next-line class-methods-use-this\n  @property({ type: Function }) onChanged: any = () => {};\n\n  @state() private focused = false;\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    document.addEventListener(\n      'dateFormatChanged',\n      this.handleDateFormatChanged\n    );\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    document.removeEventListener(\n      'dateFormatChanged',\n      this.handleDateFormatChanged\n    );\n  }\n\n  handleDateFormatChanged = async () => {\n    await dateFormatState.hydrateStore();\n\n    this.format = dateFormatState.preferredDateFormat;\n    this.timeFormat = dateFormatState.preferredTimeFormat;\n  };\n\n  firstUpdated() {\n    const minDate = new Date(this.min);\n    const maxDate = new Date(this.max);\n\n    if (minDate && !Number.isNaN(minDate.valueOf())) {\n      const [min] = minDate.toISOString().split('T');\n      this.min = min;\n    }\n\n    if (maxDate && !Number.isNaN(maxDate.valueOf())) {\n      const [max] = maxDate.toISOString().split('T');\n      this.max = max;\n    }\n\n    this.validateDate();\n\n    this.format = dateFormatState.preferredDateFormat;\n\n    this.timeFormat = dateFormatState.preferredTimeFormat;\n\n    if (this.datePicker) {\n      const formatDateIso8601 = (dateParts: any): string => {\n        const { year, month, day } = dateParts;\n        const date = new Date(year, month, day);\n\n        return format(date, this.format);\n      };\n\n      const parseDateIso8601 = (inputValue: string) => {\n        const date = parse(inputValue, this.format, new Date());\n\n        return {\n          year: date.getFullYear(),\n          month: date.getMonth(),\n          day: date.getDate(),\n        };\n      };\n\n      this.datePicker.i18n = {\n        ...this.datePicker.i18n,\n        formatDate: formatDateIso8601,\n        parseDate: parseDateIso8601,\n      };\n    }\n  }\n\n  focusin = () => {\n    this.focused = true;\n  };\n\n  clear = () => {\n    this.value = '';\n  };\n\n  handleChange = (e: InputEvent) => {\n    const { value } = e.target as HTMLInputElement;\n    this.value = value;\n    this.validateDate();\n    this.onChanged(value);\n  };\n\n  validateDate = () => {\n    if (this.value) {\n      const date = new Date(this.value);\n\n      if (!date || Number.isNaN(date.valueOf())) {\n        this.errorText = 'Invalid date format.';\n      }\n    }\n  };\n\n  focusOut = () => {\n    this.focused = false;\n  };\n\n  get nativeInputValue() {\n    try {\n      return new Date(this.value).toISOString().split('T')[0];\n    } catch (error) {\n      return this.value;\n    }\n  }\n\n  render() {\n    const classes = {\n      disabled: this.disabled,\n      error: !this.disabled && this.error,\n    };\n\n    return this.type === 'static'\n      ? html`\n          <span\n            >${formatDate(this.value, this.format)}${this.variant === 'date-time'\n              ? `${\n                  this.dateTimeText ? ` ${this.dateTimeText} ` : ' '\n                }${formatTime(this.value, this.timeFormat)}`\n              : ''}</span\n          >\n        `\n      : html`<ix-field\n          class=\"${classMap(classes)}\"\n          ?focused=${this.focused}\n          ?populated=${this.value}\n          ?disabled=${this.disabled}\n          ?required=${this.required}\n          ?error=${this.error && !this.hideError}\n          error-text=${this.errorText}\n          label=${this.label}\n          @focusin=${this.focusin}\n          @focusout=${this.focusOut}\n        >\n          ${html`<input\n            id=\"date-input\"\n            @change=${this.handleChange}\n            .value=${this.nativeInputValue}\n            class=\"flex-fill\"\n            type=\"date\"\n            min=${this.min}\n            max=${this.max}\n            ?disabled=${this.disabled}\n          />`}\n        </ix-field> `;\n  }\n}\n"]}

package/dist/date-utils.d.ts

@@ -0,0 +1,2 @@
+export declare const formatDate: (date: string | Date, dateFormat: string) => string;
+export declare const formatTime: (date: string | Date, timeFormat: string) => string;

package/dist/date-utils.js

@@ -0,0 +1,19 @@
+import { format } from 'date-fns/format.js';
+import { isValid } from 'date-fns/isValid.js';
+import { parseISO } from 'date-fns/parseISO.js';
+import { toZonedTime } from "date-fns-tz";
+export const formatDate = (date, dateFormat) => {
+    const parsedDate = typeof date === 'string' ? parseISO(date) : date;
+    const utcDate = toZonedTime(parsedDate, 'UTC'); // Force UTC time zone
+    return isValid(utcDate)
+        ? format(utcDate, dateFormat)
+        : '';
+};
+export const formatTime = (date, timeFormat) => {
+    const parsedDate = typeof date === 'string' ? parseISO(date) : date;
+    const utcDate = toZonedTime(parsedDate, 'UTC'); // Force UTC time zone
+    return isValid(utcDate)
+        ? format(utcDate, timeFormat)
+        : '';
+};
+//# sourceMappingURL=date-utils.js.map

package/dist/date-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-utils.js","sourceRoot":"","sources":["../src/date-utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAmB,EAAE,UAAkB,EAAE,EAAE;IACpE,MAAM,UAAU,GAAG,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IACpE,MAAM,OAAO,GAAG,WAAW,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC,sBAAsB;IACtE,OAAO,OAAO,CAAC,OAAO,CAAC;QACrB,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC;QAC7B,CAAC,CAAC,EAAE,CAAC;AAET,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAmB,EAAE,UAAkB,EAAE,EAAE;IACpE,MAAM,UAAU,GAAG,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IACpE,MAAM,OAAO,GAAG,WAAW,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC,sBAAsB;IACtE,OAAO,OAAO,CAAC,OAAO,CAAC;QACrB,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC;QAC7B,CAAC,CAAC,EAAE,CAAC;AACT,CAAC,CAAC","sourcesContent":["import { format } from 'date-fns/format.js';\nimport { isValid } from 'date-fns/isValid.js';\nimport { parseISO } from 'date-fns/parseISO.js';\nimport { toZonedTime } from \"date-fns-tz\";\n\nexport const formatDate = (date: string | Date, dateFormat: string) => {\n  const parsedDate = typeof date === 'string' ? parseISO(date) : date;\n  const utcDate = toZonedTime(parsedDate, 'UTC'); // Force UTC time zone\n  return isValid(utcDate)\n    ? format(utcDate, dateFormat)\n    : '';\n\n}\n\nexport const formatTime = (date: string | Date, timeFormat: string) => {\n  const parsedDate = typeof date === 'string' ? parseISO(date) : date;\n  const utcDate = toZonedTime(parsedDate, 'UTC'); // Force UTC time zone\n  return isValid(utcDate)\n    ? format(utcDate, timeFormat)\n    : '';\n};"]}

package/dist/ix-date.min.js

@@ -1 +1 @@
-import{__decorate}from"tslib";import{css,LitElement,html}from"lit";import{property,query,state}from"lit/decorators.js";import{classMap}from"lit/directives/class-map.js";import"@digital-realty/ix-field/ix-field.js";import{requestUpdateOnAriaChange}from"@material/web/internal/aria/delegate.js";import{format}from"date-fns/format.js";import{isValid}from"date-fns/isValid.js";import{parse}from"date-fns/parse.js";import{parseISO}from"date-fns/parseISO.js";import{MobxLitElement}from"@adobe/lit-mobx";import{makeAutoObservable}from"mobx";import{makePersistable,isHydrated,hydrateStore,clearPersistedStore,getPersistedStore}from"mobx-persist-store";class DateFormatState{constructor(){this.preferredDateFormat="dd/MM/yyyy",this.preferredTimeFormat="HH:mm",makeAutoObservable(this),makePersistable(this,{name:"date-format",properties:["preferredDateFormat","preferredTimeFormat"],storage:window.localStorage})}get isHydrated(){return isHydrated(this)}async hydrateStore(){await hydrateStore(this)}async clearStoredDate(){await clearPersistedStore(this)}async getStoredData(){return getPersistedStore(this)}}let dateFormatState=new DateFormatState,IxDateStyles=css`:host{display:block}::part(input-field){background:0 0;padding:0;height:26px}#search-input-vaadin-date-picker-3{padding:0!important;--_hover-highlight:transparent}ix-field{display:block;position:relative;--vaadin-field-default-width:auto;height:var(--ix-line-height);cursor:pointer}input::-webkit-calendar-picker-indicator{cursor:pointer}vaadin-date-picker::before{display:none}`,NativeInputDateFormat="yyyy-MM-dd";class IxDate extends MobxLitElement{constructor(){super(...arguments),this.type="default",this.format="dd/MM/yyyy",this.timeFormat="HH:mm",this.variant="date",this.label="",this.dateTimeText="",this.value="",this.min="",this.max="9999-12-31",this.internals=this.attachInternals(),this.disabled=!1,this.errorText="",this.required=!1,this.hideError=!1,this.clearButtonVisible=!0,this.onChanged=()=>{},this.focused=!1,this.handleDateFormatChanged=async()=>{await dateFormatState.hydrateStore(),this.format=dateFormatState.preferredDateFormat,this.timeFormat=dateFormatState.preferredTimeFormat},this.focusin=()=>{this.focused=!0},this.clear=()=>{this.value=""},this.handleChange=t=>{t=t.target.value;this.value=t,this.validateDate(),this.onChanged(t)},this.validateDate=()=>{var t;!this.value||(t=new Date(this.value))&&!Number.isNaN(t.valueOf())||(this.errorText="Invalid date format.")},this.focusOut=()=>{this.focused=!1},this.formatDate=t=>{t="string"==typeof t?parseISO(t):t;return isValid(t)?format(t,this.format||"dd/MM/yyyy"):""},this.formatTime=t=>{t="string"==typeof t?parseISO(t):t;return isValid(t)?format(t,this.timeFormat||"HH:mm"):""}}static get styles(){return[IxDateStyles]}get error(){return!!this.errorText}get form(){return this.internals.form}get labels(){return this.internals.labels}get name(){var t;return null!=(t=this.getAttribute("name"))?t:""}set name(t){this.setAttribute("name",t)}get validationMessage(){return this.internals.validationMessage}get validity(){return this.internals.validity}get willValidate(){return this.internals.willValidate}checkValidity(){return this.internals.checkValidity()}reportValidity(){return this.internals.reportValidity()}formResetCallback(){this.reset()}reset(){var t;this.clear(),this.value=null!=(t=this.getAttribute("value"))?t:""}updated(t){t.has("value")&&(t=this.dateInput||this.datePicker)&&this.internals.setValidity({badInput:this.error},this.error?this.errorText:"",t),this.internals.setFormValue(this.value)}focus(){this.dateInput.focus()}connectedCallback(){super.connectedCallback(),document.addEventListener("dateFormatChanged",this.handleDateFormatChanged)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("dateFormatChanged",this.handleDateFormatChanged)}firstUpdated(){var t=new Date(this.min),e=new Date(this.max);t&&!Number.isNaN(t.valueOf())&&([t]=t.toISOString().split("T"),this.min=t),e&&!Number.isNaN(e.valueOf())&&([t]=e.toISOString().split("T"),this.max=t),this.validateDate(),this.format=dateFormatState.preferredDateFormat,this.timeFormat=dateFormatState.preferredTimeFormat,this.datePicker&&(this.datePicker.i18n={...this.datePicker.i18n,formatDate:t=>{var{year:t,month:e,day:r}=t,t=new Date(t,e,r);return format(t,this.format)},parseDate:t=>{t=parse(t,this.format,new Date);return{year:t.getFullYear(),month:t.getMonth(),day:t.getDate()}}})}get nativeInputValue(){try{return format(this.value,NativeInputDateFormat)}catch(t){return this.value}}render(){var t={disabled:this.disabled,error:!this.disabled&&this.error};return"static"===this.type?html`<span>${this.formatDate(this.value)}${"date-time"===this.variant?(this.dateTimeText?` ${this.dateTimeText} `:" ")+this.formatTime(this.value):""}</span>`:html`<ix-field class="${classMap(t)}" ?focused="${this.focused}" ?populated="${this.value}" ?disabled="${this.disabled}" ?required="${this.required}" ?error="${this.error&&!this.hideError}" error-text="${this.errorText}" label="${this.label}" @focusin="${this.focusin}" @focusout="${this.focusOut}">${html`<input id="date-input" @change="${this.handleChange}" .value="${this.nativeInputValue}" class="flex-fill" type="date" min="${this.min}" max="${this.max}" ?disabled="${this.disabled}">`}</ix-field>`}}requestUpdateOnAriaChange(IxDate),IxDate.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0},IxDate.formAssociated=!0,__decorate([property({type:String})],IxDate.prototype,"type",void 0),__decorate([property({type:String})],IxDate.prototype,"format",void 0),__decorate([property({type:String})],IxDate.prototype,"timeFormat",void 0),__decorate([property({type:String})],IxDate.prototype,"variant",void 0),__decorate([property({type:String})],IxDate.prototype,"label",void 0),__decorate([property({type:String})],IxDate.prototype,"dateTimeText",void 0),__decorate([property({type:String})],IxDate.prototype,"value",void 0),__decorate([property({type:String})],IxDate.prototype,"min",void 0),__decorate([property({type:String})],IxDate.prototype,"max",void 0),__decorate([query("#date-input")],IxDate.prototype,"dateInput",void 0),__decorate([query("vaadin-date-picker")],IxDate.prototype,"datePicker",void 0),__decorate([property({type:Boolean,reflect:!0})],IxDate.prototype,"disabled",void 0),__decorate([property({type:String,attribute:"error-text"})],IxDate.prototype,"errorText",void 0),__decorate([property({type:Boolean,reflect:!0})],IxDate.prototype,"required",void 0),__decorate([property({type:Boolean,reflect:!0})],IxDate.prototype,"hideError",void 0),__decorate([property({type:Boolean,attribute:"clear-button-visible"})],IxDate.prototype,"clearButtonVisible",void 0),__decorate([property({type:Function})],IxDate.prototype,"onChanged",void 0),__decorate([state()],IxDate.prototype,"focused",void 0),window.customElements.define("ix-date",IxDate);
+import{__decorate}from"tslib";import{css,LitElement,html}from"lit";import{property,query,state}from"lit/decorators.js";import{classMap}from"lit/directives/class-map.js";import"@digital-realty/ix-field/ix-field.js";import{requestUpdateOnAriaChange}from"@material/web/internal/aria/delegate.js";import{format}from"date-fns/format.js";import{parse}from"date-fns/parse.js";import{MobxLitElement}from"@adobe/lit-mobx";import{makeAutoObservable}from"mobx";import{makePersistable,isHydrated,hydrateStore,clearPersistedStore,getPersistedStore}from"mobx-persist-store";import{isValid}from"date-fns/isValid.js";import{parseISO}from"date-fns/parseISO.js";import{toZonedTime}from"date-fns-tz";class DateFormatState{constructor(){this.preferredDateFormat="dd/MM/yyyy",this.preferredTimeFormat="hh:mm a",makeAutoObservable(this),makePersistable(this,{name:"date-format",properties:["preferredDateFormat","preferredTimeFormat"],storage:window.localStorage})}get isHydrated(){return isHydrated(this)}async hydrateStore(){await hydrateStore(this)}async clearStoredDate(){await clearPersistedStore(this)}async getStoredData(){return getPersistedStore(this)}}let dateFormatState=new DateFormatState,IxDateStyles=css`:host{display:block}::part(input-field){background:0 0;padding:0;height:26px}#search-input-vaadin-date-picker-3{padding:0!important;--_hover-highlight:transparent}ix-field{display:block;position:relative;--vaadin-field-default-width:auto;height:var(--ix-line-height);cursor:pointer}input::-webkit-calendar-picker-indicator{cursor:pointer}vaadin-date-picker::before{display:none}`,formatDate=(t,e)=>{t="string"==typeof t?parseISO(t):t,t=toZonedTime(t,"UTC");return isValid(t)?format(t,e):""},formatTime=(t,e)=>{t="string"==typeof t?parseISO(t):t,t=toZonedTime(t,"UTC");return isValid(t)?format(t,e):""};class IxDate extends MobxLitElement{constructor(){super(...arguments),this.type="default",this.format="dd/MM/yyyy",this.timeFormat="hh:mm a",this.variant="date",this.label="",this.dateTimeText="",this.value="",this.min="",this.max="9999-12-31",this.internals=this.attachInternals(),this.disabled=!1,this.errorText="",this.required=!1,this.hideError=!1,this.clearButtonVisible=!0,this.onChanged=()=>{},this.focused=!1,this.handleDateFormatChanged=async()=>{await dateFormatState.hydrateStore(),this.format=dateFormatState.preferredDateFormat,this.timeFormat=dateFormatState.preferredTimeFormat},this.focusin=()=>{this.focused=!0},this.clear=()=>{this.value=""},this.handleChange=t=>{t=t.target.value;this.value=t,this.validateDate(),this.onChanged(t)},this.validateDate=()=>{var t;!this.value||(t=new Date(this.value))&&!Number.isNaN(t.valueOf())||(this.errorText="Invalid date format.")},this.focusOut=()=>{this.focused=!1}}static get styles(){return[IxDateStyles]}get error(){return!!this.errorText}get form(){return this.internals.form}get labels(){return this.internals.labels}get name(){var t;return null!=(t=this.getAttribute("name"))?t:""}set name(t){this.setAttribute("name",t)}get validationMessage(){return this.internals.validationMessage}get validity(){return this.internals.validity}get willValidate(){return this.internals.willValidate}checkValidity(){return this.internals.checkValidity()}reportValidity(){return this.internals.reportValidity()}formResetCallback(){this.reset()}reset(){var t;this.clear(),this.value=null!=(t=this.getAttribute("value"))?t:""}updated(t){t.has("value")&&(t=this.dateInput||this.datePicker)&&this.internals.setValidity({badInput:this.error},this.error?this.errorText:"",t),this.internals.setFormValue(this.value)}focus(){this.dateInput.focus()}connectedCallback(){super.connectedCallback(),document.addEventListener("dateFormatChanged",this.handleDateFormatChanged)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("dateFormatChanged",this.handleDateFormatChanged)}firstUpdated(){var t=new Date(this.min),e=new Date(this.max);t&&!Number.isNaN(t.valueOf())&&([t]=t.toISOString().split("T"),this.min=t),e&&!Number.isNaN(e.valueOf())&&([t]=e.toISOString().split("T"),this.max=t),this.validateDate(),this.format=dateFormatState.preferredDateFormat,this.timeFormat=dateFormatState.preferredTimeFormat,this.datePicker&&(this.datePicker.i18n={...this.datePicker.i18n,formatDate:t=>{var{year:t,month:e,day:r}=t,t=new Date(t,e,r);return format(t,this.format)},parseDate:t=>{t=parse(t,this.format,new Date);return{year:t.getFullYear(),month:t.getMonth(),day:t.getDate()}}})}get nativeInputValue(){try{return new Date(this.value).toISOString().split("T")[0]}catch(t){return this.value}}render(){var t={disabled:this.disabled,error:!this.disabled&&this.error};return"static"===this.type?html`<span>${formatDate(this.value,this.format)}${"date-time"===this.variant?(this.dateTimeText?` ${this.dateTimeText} `:" ")+formatTime(this.value,this.timeFormat):""}</span>`:html`<ix-field class="${classMap(t)}" ?focused="${this.focused}" ?populated="${this.value}" ?disabled="${this.disabled}" ?required="${this.required}" ?error="${this.error&&!this.hideError}" error-text="${this.errorText}" label="${this.label}" @focusin="${this.focusin}" @focusout="${this.focusOut}">${html`<input id="date-input" @change="${this.handleChange}" .value="${this.nativeInputValue}" class="flex-fill" type="date" min="${this.min}" max="${this.max}" ?disabled="${this.disabled}">`}</ix-field>`}}requestUpdateOnAriaChange(IxDate),IxDate.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0},IxDate.formAssociated=!0,__decorate([property({type:String})],IxDate.prototype,"type",void 0),__decorate([property({type:String})],IxDate.prototype,"format",void 0),__decorate([property({type:String})],IxDate.prototype,"timeFormat",void 0),__decorate([property({type:String})],IxDate.prototype,"variant",void 0),__decorate([property({type:String})],IxDate.prototype,"label",void 0),__decorate([property({type:String})],IxDate.prototype,"dateTimeText",void 0),__decorate([property({type:String})],IxDate.prototype,"value",void 0),__decorate([property({type:String})],IxDate.prototype,"min",void 0),__decorate([property({type:String})],IxDate.prototype,"max",void 0),__decorate([query("#date-input")],IxDate.prototype,"dateInput",void 0),__decorate([query("vaadin-date-picker")],IxDate.prototype,"datePicker",void 0),__decorate([property({type:Boolean,reflect:!0})],IxDate.prototype,"disabled",void 0),__decorate([property({type:String,attribute:"error-text"})],IxDate.prototype,"errorText",void 0),__decorate([property({type:Boolean,reflect:!0})],IxDate.prototype,"required",void 0),__decorate([property({type:Boolean,reflect:!0})],IxDate.prototype,"hideError",void 0),__decorate([property({type:Boolean,attribute:"clear-button-visible"})],IxDate.prototype,"clearButtonVisible",void 0),__decorate([property({type:Function})],IxDate.prototype,"onChanged",void 0),__decorate([state()],IxDate.prototype,"focused",void 0),window.customElements.define("ix-date",IxDate);

package/dist/state/date-format-state.js

@@ -3,7 +3,7 @@ import { makePersistable, isHydrated, hydrateStore, clearPersistedStore, getPers
 class DateFormatState {
     constructor() {
         this.preferredDateFormat = 'dd/MM/yyyy';
-        this.preferredTimeFormat = 'HH:mm';
+        this.preferredTimeFormat = 'hh:mm a';
         makeAutoObservable(this);
         makePersistable(this, {
             name: 'date-format',

package/dist/state/date-format-state.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-format-state.js","sourceRoot":"","sources":["../../src/state/date-format-state.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,MAAM,CAAC;AAC1C,OAAO,EACL,eAAe,EACf,UAAU,EACV,YAAY,EACZ,mBAAmB,EACnB,iBAAiB,GAClB,MAAM,oBAAoB,CAAC;AAE5B,MAAM,eAAe;IACnB;QASO,wBAAmB,GAAW,YAAY,CAAC;QAE3C,wBAAmB,GAAW,OAAO,CAAC;QAV3C,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,eAAe,CAAC,IAAI,EAAE;YACpB,IAAI,EAAE,aAAa;YACnB,UAAU,EAAE,CAAC,qBAAqB,EAAE,qBAAqB,CAAC;YAC1D,OAAO,EAAE,MAAM,CAAC,YAAY;SAC7B,CAAC,CAAC;IACL,CAAC;IAMD,IAAI,UAAU;QACZ,OAAO,UAAU,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAED,KAAK,CAAC,YAAY;QAChB,MAAM,YAAY,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC;IAED,KAAK,CAAC,eAAe;QACnB,MAAM,mBAAmB,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC;IAED,KAAK,CAAC,aAAa;QACjB,OAAO,iBAAiB,CAAC,IAAI,CAAC,CAAC;IACjC,CAAC;CACF;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,IAAI,eAAe,EAAE,CAAC","sourcesContent":["import { makeAutoObservable } from 'mobx';\nimport {\n  makePersistable,\n  isHydrated,\n  hydrateStore,\n  clearPersistedStore,\n  getPersistedStore,\n} from 'mobx-persist-store';\n\nclass DateFormatState {\n  constructor() {\n    makeAutoObservable(this);\n    makePersistable(this, {\n      name: 'date-format',\n      properties: ['preferredDateFormat', 'preferredTimeFormat'],\n      storage: window.localStorage,\n    });\n  }\n\n  public preferredDateFormat: string = 'dd/MM/yyyy';\n\n  public preferredTimeFormat: string = 'HH:mm';\n\n  get isHydrated() {\n    return isHydrated(this);\n  }\n\n  async hydrateStore() {\n    await hydrateStore(this);\n  }\n\n  async clearStoredDate() {\n    await clearPersistedStore(this);\n  }\n\n  async getStoredData() {\n    return getPersistedStore(this);\n  }\n}\n\nexport const dateFormatState = new DateFormatState();\n"]}
+{"version":3,"file":"date-format-state.js","sourceRoot":"","sources":["../../src/state/date-format-state.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,MAAM,CAAC;AAC1C,OAAO,EACL,eAAe,EACf,UAAU,EACV,YAAY,EACZ,mBAAmB,EACnB,iBAAiB,GAClB,MAAM,oBAAoB,CAAC;AAE5B,MAAM,eAAe;IACnB;QASO,wBAAmB,GAAW,YAAY,CAAC;QAE3C,wBAAmB,GAAW,SAAS,CAAC;QAV7C,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,eAAe,CAAC,IAAI,EAAE;YACpB,IAAI,EAAE,aAAa;YACnB,UAAU,EAAE,CAAC,qBAAqB,EAAE,qBAAqB,CAAC;YAC1D,OAAO,EAAE,MAAM,CAAC,YAAY;SAC7B,CAAC,CAAC;IACL,CAAC;IAMD,IAAI,UAAU;QACZ,OAAO,UAAU,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAED,KAAK,CAAC,YAAY;QAChB,MAAM,YAAY,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC;IAED,KAAK,CAAC,eAAe;QACnB,MAAM,mBAAmB,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC;IAED,KAAK,CAAC,aAAa;QACjB,OAAO,iBAAiB,CAAC,IAAI,CAAC,CAAC;IACjC,CAAC;CACF;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,IAAI,eAAe,EAAE,CAAC","sourcesContent":["import { makeAutoObservable } from 'mobx';\nimport {\n  makePersistable,\n  isHydrated,\n  hydrateStore,\n  clearPersistedStore,\n  getPersistedStore,\n} from 'mobx-persist-store';\n\nclass DateFormatState {\n  constructor() {\n    makeAutoObservable(this);\n    makePersistable(this, {\n      name: 'date-format',\n      properties: ['preferredDateFormat', 'preferredTimeFormat'],\n      storage: window.localStorage,\n    });\n  }\n\n  public preferredDateFormat: string = 'dd/MM/yyyy';\n\n  public preferredTimeFormat: string = 'hh:mm a';\n\n  get isHydrated() {\n    return isHydrated(this);\n  }\n\n  async hydrateStore() {\n    await hydrateStore(this);\n  }\n\n  async clearStoredDate() {\n    await clearPersistedStore(this);\n  }\n\n  async getStoredData() {\n    return getPersistedStore(this);\n  }\n}\n\nexport const dateFormatState = new DateFormatState();\n"]}

package/package.json

@@ -3,12 +3,13 @@
   "description": "Webcomponent ix-date following open-wc recommendations",
   "license": "MIT",
   "author": "Digital Realty",
-  "version": "1.1.11",
+  "version": "1.1.13",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "exports": {
     ".": "./dist/index.js",
+    "./dist/date-utils.js": "./dist/date-utils.js",
     "./ix-date.js": "./dist/ix-date.js",
     "./ix-date.min.js": "./dist/ix-date.min.js"
   },
@@ -29,9 +30,11 @@
     "@adobe/lit-mobx": "^2.2.2",
     "@digital-realty/ix-field": "^1.1.6",
     "@material/web": "1.2.0",
+    "@rollup/plugin-replace": "^6.0.2",
     "@vaadin/date-picker": "^24.6.0",
     "@web/test-runner-commands": "^0.9.0",
     "date-fns": "^4.1.0",
+    "date-fns-tz": "^3.2.0",
     "lit": "^3.2.1",
     "mobx": "^6.12.1",
     "mobx-persist-store": "^1.1.3"
@@ -108,5 +111,5 @@
     "README.md",
     "LICENSE"
   ],
-  "gitHead": "0145fd7e21426000f7322d803fe82af81d143882"
+  "gitHead": "5706516f4bf3b8260ad0db0d78869a58653acb6e"
 }