@digital-realty/ix-date 1.1.23 → 1.1.25
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/dist/IxDate.d.ts
CHANGED
|
@@ -7,6 +7,7 @@ export declare class IxDate extends MobxLitElement {
|
|
|
7
7
|
variant: 'date' | 'time' | 'date-time';
|
|
8
8
|
format: string;
|
|
9
9
|
timeFormat: string;
|
|
10
|
+
timezone: string;
|
|
10
11
|
label: string;
|
|
11
12
|
dateTimeText: string;
|
|
12
13
|
/**
|
|
@@ -111,6 +112,7 @@ export declare class IxDate extends MobxLitElement {
|
|
|
111
112
|
validateDate: () => void;
|
|
112
113
|
focusOut: () => void;
|
|
113
114
|
parseValue: () => Date;
|
|
115
|
+
getTimezoneDateTime: (date: Date) => Date;
|
|
114
116
|
formatValueAsDate: (date: Date) => string;
|
|
115
117
|
formatValueAsTime: (date: Date) => string;
|
|
116
118
|
formatValueAsDateTime: (date: Date) => string;
|
package/dist/IxDate.js
CHANGED
|
@@ -19,6 +19,7 @@ export class IxDate extends MobxLitElement {
|
|
|
19
19
|
this.variant = 'date';
|
|
20
20
|
this.format = defaultDateFormat;
|
|
21
21
|
this.timeFormat = defaultTimeFormat;
|
|
22
|
+
this.timezone = 'UTC';
|
|
22
23
|
this.label = '';
|
|
23
24
|
this.dateTimeText = '';
|
|
24
25
|
/**
|
|
@@ -56,6 +57,7 @@ export class IxDate extends MobxLitElement {
|
|
|
56
57
|
await dateFormatState.hydrateStore();
|
|
57
58
|
this.format = dateFormatState.preferredDateFormat;
|
|
58
59
|
this.timeFormat = dateFormatState.preferredTimeFormat;
|
|
60
|
+
this.timezone = dateFormatState.preferredTimezone;
|
|
59
61
|
};
|
|
60
62
|
this.handleMouseDown = (e) => {
|
|
61
63
|
if (this.showCalendarOnMouseDown) {
|
|
@@ -101,6 +103,26 @@ export class IxDate extends MobxLitElement {
|
|
|
101
103
|
}
|
|
102
104
|
return parseISO(this.value);
|
|
103
105
|
};
|
|
106
|
+
this.getTimezoneDateTime = (date) => {
|
|
107
|
+
const parts = new Intl.DateTimeFormat('en-GB', {
|
|
108
|
+
timeZone: this.timezone,
|
|
109
|
+
year: 'numeric',
|
|
110
|
+
month: '2-digit',
|
|
111
|
+
day: '2-digit',
|
|
112
|
+
hour: '2-digit',
|
|
113
|
+
minute: '2-digit',
|
|
114
|
+
second: '2-digit',
|
|
115
|
+
hour12: false,
|
|
116
|
+
}).formatToParts(new Date(date));
|
|
117
|
+
const get = (type) => { var _a; return (_a = parts.find(p => p.type === type)) === null || _a === void 0 ? void 0 : _a.value; };
|
|
118
|
+
const year = get('year');
|
|
119
|
+
const month = get('month');
|
|
120
|
+
const day = get('day');
|
|
121
|
+
const hour = get('hour');
|
|
122
|
+
const minute = get('minute');
|
|
123
|
+
const second = get('second');
|
|
124
|
+
return new Date(`${year}-${month}-${day}T${hour}:${minute}:${second}`);
|
|
125
|
+
};
|
|
104
126
|
this.formatValueAsDate = (date) => format(date, this.format || defaultDateFormat);
|
|
105
127
|
this.formatValueAsTime = (date) => format(date, this.timeFormat || defaultTimeFormat);
|
|
106
128
|
this.formatValueAsDateTime = (date) => `${this.formatValueAsDate(date)}${this.dateTimeText ? ` ${this.dateTimeText} ` : ' '}${this.formatValueAsTime(date)}`;
|
|
@@ -108,13 +130,16 @@ export class IxDate extends MobxLitElement {
|
|
|
108
130
|
const parsedDate = this.parseValue();
|
|
109
131
|
if (!isValid(parsedDate))
|
|
110
132
|
return '';
|
|
133
|
+
const adjustedDate = this.noTimeZoneConversion
|
|
134
|
+
? parsedDate
|
|
135
|
+
: this.getTimezoneDateTime(parsedDate);
|
|
111
136
|
switch (this.variant) {
|
|
112
137
|
case 'date':
|
|
113
|
-
return this.formatValueAsDate(
|
|
138
|
+
return this.formatValueAsDate(adjustedDate);
|
|
114
139
|
case 'time':
|
|
115
|
-
return this.formatValueAsTime(
|
|
140
|
+
return this.formatValueAsTime(adjustedDate);
|
|
116
141
|
case 'date-time':
|
|
117
|
-
return this.formatValueAsDateTime(
|
|
142
|
+
return this.formatValueAsDateTime(adjustedDate);
|
|
118
143
|
default:
|
|
119
144
|
return '';
|
|
120
145
|
}
|
|
@@ -234,6 +259,7 @@ export class IxDate extends MobxLitElement {
|
|
|
234
259
|
this.validateDate();
|
|
235
260
|
this.format = dateFormatState.preferredDateFormat;
|
|
236
261
|
this.timeFormat = dateFormatState.preferredTimeFormat;
|
|
262
|
+
this.timezone = dateFormatState.preferredTimezone;
|
|
237
263
|
if (this.datePicker) {
|
|
238
264
|
const formatDateIso8601 = (dateParts) => {
|
|
239
265
|
const { year, month, day } = dateParts;
|
|
@@ -271,7 +297,7 @@ export class IxDate extends MobxLitElement {
|
|
|
271
297
|
disabled: this.disabled,
|
|
272
298
|
error: !this.disabled && this.error,
|
|
273
299
|
};
|
|
274
|
-
return html
|
|
300
|
+
return html ` <ix-field
|
|
275
301
|
class="${classMap(classes)}"
|
|
276
302
|
?focused=${this.focused}
|
|
277
303
|
?populated=${this.value}
|
|
@@ -325,6 +351,9 @@ __decorate([
|
|
|
325
351
|
__decorate([
|
|
326
352
|
property({ type: String })
|
|
327
353
|
], IxDate.prototype, "timeFormat", void 0);
|
|
354
|
+
__decorate([
|
|
355
|
+
property({ type: String })
|
|
356
|
+
], IxDate.prototype, "timezone", void 0);
|
|
328
357
|
__decorate([
|
|
329
358
|
property({ type: String })
|
|
330
359
|
], IxDate.prototype, "label", void 0);
|
package/dist/IxDate.js.map
CHANGED
|
@@ -1 +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 {\n dateFormatState,\n defaultDateFormat,\n defaultTimeFormat,\n} 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' | 'static' = 'default';\n\n @property({ type: String }) variant: 'date' | 'time' | 'date-time' = 'date';\n\n @property({ type: String }) format = defaultDateFormat;\n\n @property({ type: String }) timeFormat = defaultTimeFormat;\n\n @property({ type: String }) label = '';\n\n @property({ type: String }) dateTimeText = '';\n\n /**\n * For `type='default'`, should be any value that is accepted by [new Date()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/Date).\n *\n * For `type='static'`, should be a date string that can be parsed by [parseISO](https://date-fns.org/v2.0.0/docs/parseISO), e.g.\n * - `2025-01-01`\n * - `2025-01-01 12:30Z`\n * - `2025-01-01T12:30:00.000+02:00`\n * */\n @property({ type: String }) value = '';\n\n @property({ type: Boolean }) showCalendarOnMouseDown = false;\n\n @property({ type: String }) min = '';\n\n @property({ type: String }) max = '9999-12-31';\n\n /**\n * Applies when type=static. Defaults to `false`.\n *\n * If `true`, the value is formatted but no time zone conversions are applied.\n *\n * If `false`, values that do not specify a time zone are interpreted as being in the\n * user's local time zone and all values are displayed in the user's local time zone.\n */\n @property({ type: Boolean, attribute: 'no-time-zone-conversion' })\n noTimeZoneConversion = false;\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 handleMouseDown = (e: Event) => {\n if (this.showCalendarOnMouseDown) {\n const inputElement = e.target as HTMLInputElement;\n\n if ('showPicker' in inputElement) {\n inputElement.showPicker();\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 parseValue = () => {\n if (typeof this.value !== 'string') {\n return this.value;\n }\n\n if (this.noTimeZoneConversion) {\n // Matches the time zone designator, e.g. `Z` or `-02:00`.\n // Note: does not match `-02` and `-0200`, which are valid ISO 8601 but rarely used.\n const timeZoneRegex = /Z|([+-]\\d\\d:\\d\\d)/;\n const valueWithoutTimeZone = this.value.split(timeZoneRegex)[0];\n return parseISO(valueWithoutTimeZone);\n }\n\n return parseISO(this.value);\n };\n\n formatValueAsDate = (date: Date) =>\n format(date, this.format || defaultDateFormat);\n\n formatValueAsTime = (date: Date) =>\n format(date, this.timeFormat || defaultTimeFormat);\n\n formatValueAsDateTime = (date: Date) =>\n `${this.formatValueAsDate(date)}${\n this.dateTimeText ? ` ${this.dateTimeText} ` : ' '\n }${this.formatValueAsTime(date)}`;\n\n formatValue = () => {\n const parsedDate = this.parseValue();\n if (!isValid(parsedDate)) return '';\n switch (this.variant) {\n case 'date':\n return this.formatValueAsDate(parsedDate);\n case 'time':\n return this.formatValueAsTime(parsedDate);\n case 'date-time':\n return this.formatValueAsDateTime(parsedDate);\n default:\n return '';\n }\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 renderStaticDate() {\n return html`<span>${this.formatValue()}</span>`;\n }\n\n renderDateInput() {\n const classes = {\n disabled: this.disabled,\n error: !this.disabled && this.error,\n };\n\n return 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 @mousedown=${this.handleMouseDown}\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 render() {\n return this.type === 'static'\n ? this.renderStaticDate()\n : this.renderDateInput();\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"IxDate.js","sourceRoot":"","sources":["../src/IxDate.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,sCAAsC,CAAC;AAC9C,OAAO,EAAE,yBAAyB,EAAE,MAAM,yCAAyC,CAAC;AACpF,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EACL,eAAe,EACf,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAEnD,MAAM,CAAC,MAAM,qBAAqB,GAAG,YAAY,CAAC;AAElD,MAAM,OAAO,MAAO,SAAQ,cAAc;IAA1C;;QAS8B,SAAI,GAAyB,SAAS,CAAC;QAEvC,YAAO,GAAkC,MAAM,CAAC;QAEhD,WAAM,GAAG,iBAAiB,CAAC;QAE3B,eAAU,GAAG,iBAAiB,CAAC;QAE/B,aAAQ,GAAG,KAAK,CAAC;QAEjB,UAAK,GAAG,EAAE,CAAC;QAEX,iBAAY,GAAG,EAAE,CAAC;QAE9C;;;;;;;aAOK;QACuB,UAAK,GAAG,EAAE,CAAC;QAEV,4BAAuB,GAAG,KAAK,CAAC;QAEjC,QAAG,GAAG,EAAE,CAAC;QAET,QAAG,GAAG,YAAY,CAAC;QAE/C;;;;;;;WAOG;QAEH,yBAAoB,GAAG,KAAK,CAAC;QAaZ,cAAS,GAAI,IAAoB,CAAC,wBAAwB;aACxE,eAAe,EAAE,CAAC;QAMuB,aAAQ,GAAG,KAAK,CAAC;QAYR,cAAS,GAAG,EAAE,CAAC;QAExB,aAAQ,GAAG,KAAK,CAAC;QAEjB,cAAS,GAAG,KAAK,CAAC;QAG9D,uBAAkB,GAAG,IAAI,CAAC;QAoG1B,kDAAkD;QACpB,cAAS,GAAQ,GAAG,EAAE,GAAE,CAAC,CAAC;QAEvC,YAAO,GAAG,KAAK,CAAC;QAkBjC,4BAAuB,GAAG,KAAK,IAAI,EAAE;YACnC,MAAM,eAAe,CAAC,YAAY,EAAE,CAAC;YAErC,IAAI,CAAC,MAAM,GAAG,eAAe,CAAC,mBAAmB,CAAC;YAClD,IAAI,CAAC,UAAU,GAAG,eAAe,CAAC,mBAAmB,CAAC;YACtD,IAAI,CAAC,QAAQ,GAAG,eAAe,CAAC,iBAAiB,CAAC;QACpD,CAAC,CAAC;QAkDF,oBAAe,GAAG,CAAC,CAAQ,EAAE,EAAE;YAC7B,IAAI,IAAI,CAAC,uBAAuB,EAAE;gBAChC,MAAM,YAAY,GAAG,CAAC,CAAC,MAA0B,CAAC;gBAElD,IAAI,YAAY,IAAI,YAAY,EAAE;oBAChC,YAAY,CAAC,UAAU,EAAE,CAAC;iBAC3B;aACF;QACH,CAAC,CAAC;QAEF,YAAO,GAAG,GAAG,EAAE;YACb,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACtB,CAAC,CAAC;QAEF,UAAK,GAAG,GAAG,EAAE;YACX,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAClB,CAAC,CAAC;QAEF,iBAAY,GAAG,CAAC,CAAa,EAAE,EAAE;YAC/B,MAAM,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,MAA0B,CAAC;YAC/C,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;QACxB,CAAC,CAAC;QAEF,iBAAY,GAAG,GAAG,EAAE;YAClB,IAAI,IAAI,CAAC,KAAK,EAAE;gBACd,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBAElC,IAAI,CAAC,IAAI,IAAI,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE;oBACzC,IAAI,CAAC,SAAS,GAAG,sBAAsB,CAAC;iBACzC;aACF;QACH,CAAC,CAAC;QAEF,aAAQ,GAAG,GAAG,EAAE;YACd,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACvB,CAAC,CAAC;QAEF,eAAU,GAAG,GAAG,EAAE;YAChB,IAAI,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;gBAClC,OAAO,IAAI,CAAC,KAAK,CAAC;aACnB;YAED,IAAI,IAAI,CAAC,oBAAoB,EAAE;gBAC7B,0DAA0D;gBAC1D,oFAAoF;gBACpF,MAAM,aAAa,GAAG,mBAAmB,CAAC;gBAC1C,MAAM,oBAAoB,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;gBAChE,OAAO,QAAQ,CAAC,oBAAoB,CAAC,CAAC;aACvC;YAED,OAAO,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC9B,CAAC,CAAC;QAEF,wBAAmB,GAAG,CAAC,IAAU,EAAE,EAAE;YACnC,MAAM,KAAK,GAAG,IAAI,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE;gBAC7C,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,IAAI,EAAE,SAAS;gBACf,KAAK,EAAE,SAAS;gBAChB,GAAG,EAAE,SAAS;gBACd,IAAI,EAAE,SAAS;gBACf,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,KAAK;aACd,CAAC,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;YAEjC,MAAM,GAAG,GAAG,CAAC,IAAY,EAAE,EAAE,WAAC,OAAA,MAAA,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,0CAAE,KAAK,CAAA,EAAA,CAAC;YAEtE,MAAM,IAAI,GAAG,GAAG,CAAC,MAAM,CAAC,CAAC;YACzB,MAAM,KAAK,GAAG,GAAG,CAAC,OAAO,CAAC,CAAC;YAC3B,MAAM,GAAG,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;YACvB,MAAM,IAAI,GAAG,GAAG,CAAC,MAAM,CAAC,CAAC;YACzB,MAAM,MAAM,GAAG,GAAG,CAAC,QAAQ,CAAC,CAAC;YAC7B,MAAM,MAAM,GAAG,GAAG,CAAC,QAAQ,CAAC,CAAC;YAE7B,OAAO,IAAI,IAAI,CAAC,GAAG,IAAI,IAAI,KAAK,IAAI,GAAG,IAAI,IAAI,IAAI,MAAM,IAAI,MAAM,EAAE,CAAC,CAAC;QACzE,CAAC,CAAC;QAEF,sBAAiB,GAAG,CAAC,IAAU,EAAE,EAAE,CACjC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,IAAI,iBAAiB,CAAC,CAAC;QAEjD,sBAAiB,GAAG,CAAC,IAAU,EAAE,EAAE,CACjC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,IAAI,iBAAiB,CAAC,CAAC;QAErD,0BAAqB,GAAG,CAAC,IAAU,EAAE,EAAE,CACrC,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,GAC7B,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,GACjD,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC;QAEpC,gBAAW,GAAG,GAAG,EAAE;YACjB,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;YAErC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC;gBAAE,OAAO,EAAE,CAAC;YAEpC,MAAM,YAAY,GAAG,IAAI,CAAC,oBAAoB;gBAC5C,CAAC,CAAC,UAAU;gBACZ,CAAC,CAAC,IAAI,CAAC,mBAAmB,CAAC,UAAU,CAAC,CAAC;YAEzC,QAAQ,IAAI,CAAC,OAAO,EAAE;gBACpB,KAAK,MAAM;oBACT,OAAO,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,CAAC;gBAC9C,KAAK,MAAM;oBACT,OAAO,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,CAAC;gBAC9C,KAAK,WAAW;oBACd,OAAO,IAAI,CAAC,qBAAqB,CAAC,YAAY,CAAC,CAAC;gBAClD;oBACE,OAAO,EAAE,CAAC;aACb;QACH,CAAC,CAAC;IAmDJ,CAAC;IAnaC,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,YAAY,CAAC,CAAC;IACxB,CAAC;IA+DD;;;;;OAKG;IACH,IAAI,KAAK;QACP,OAAO,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC;IAC1B,CAAC;IAWD;;OAEG;IACH,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;IAC7B,CAAC;IAED;;OAEG;IACH,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC;IAC/B,CAAC;IAED;;OAEG;IACH,IAAI,IAAI;;QACN,OAAO,MAAA,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,mCAAI,EAAE,CAAC;IACzC,CAAC;IAED,IAAI,IAAI,CAAC,IAAY;QACnB,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IAClC,CAAC;IAED;;;;OAIG;IACH,IAAI,iBAAiB;QACnB,OAAO,IAAI,CAAC,SAAS,CAAC,iBAAiB,CAAC;IAC1C,CAAC;IAED;;;;;OAKG;IACH,IAAI,QAAQ;QACV,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC;IACjC,CAAC;IAED;;;;;OAKG;IACH,IAAI,YAAY;QACd,OAAO,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC;IACrC,CAAC;IAED,aAAa;QACX,OAAO,IAAI,CAAC,SAAS,CAAC,aAAa,EAAE,CAAC;IACxC,CAAC;IAED,cAAc;QACZ,OAAO,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE,CAAC;IACzC,CAAC;IAED,eAAe;IACf,iBAAiB;QACf,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED;;OAEG;IACH,KAAK;;QACH,IAAI,CAAC,KAAK,EAAE,CAAC;QACb,IAAI,CAAC,KAAK,GAAG,MAAA,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,mCAAI,EAAE,CAAC;IAChD,CAAC;IAEkB,OAAO,CACxB,iBAAyD;QAEzD,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;YAClC,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC;YACnE,IAAI,QAAQ,EAAE;gBACZ,IAAI,CAAC,SAAS,CAAC,WAAW,CACxB;oBACE,QAAQ,EAAE,IAAI,CAAC,KAAK;iBACrB,EACD,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAChC,QAAQ,CACT,CAAC;aACH;SACF;QAED,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC1C,CAAC;IAEQ,KAAK;QACZ,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;IACzB,CAAC;IAOD,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,QAAQ,CAAC,gBAAgB,CACvB,mBAAmB,EACnB,IAAI,CAAC,uBAAuB,CAC7B,CAAC;IACJ,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,QAAQ,CAAC,mBAAmB,CAC1B,mBAAmB,EACnB,IAAI,CAAC,uBAAuB,CAC7B,CAAC;IACJ,CAAC;IAUD,YAAY;QACV,MAAM,OAAO,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACnC,MAAM,OAAO,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAEnC,IAAI,OAAO,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC,EAAE;YAC/C,MAAM,CAAC,GAAG,CAAC,GAAG,OAAO,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YAC/C,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;SAChB;QAED,IAAI,OAAO,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC,EAAE;YAC/C,MAAM,CAAC,GAAG,CAAC,GAAG,OAAO,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YAC/C,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;SAChB;QAED,IAAI,CAAC,YAAY,EAAE,CAAC;QAEpB,IAAI,CAAC,MAAM,GAAG,eAAe,CAAC,mBAAmB,CAAC;QAElD,IAAI,CAAC,UAAU,GAAG,eAAe,CAAC,mBAAmB,CAAC;QAEtD,IAAI,CAAC,QAAQ,GAAG,eAAe,CAAC,iBAAiB,CAAC;QAElD,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,MAAM,iBAAiB,GAAG,CAAC,SAAc,EAAU,EAAE;gBACnD,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,SAAS,CAAC;gBACvC,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC;gBAExC,OAAO,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YACnC,CAAC,CAAC;YAEF,MAAM,gBAAgB,GAAG,CAAC,UAAkB,EAAE,EAAE;gBAC9C,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,IAAI,EAAE,CAAC,CAAC;gBAExD,OAAO;oBACL,IAAI,EAAE,IAAI,CAAC,WAAW,EAAE;oBACxB,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE;oBACtB,GAAG,EAAE,IAAI,CAAC,OAAO,EAAE;iBACpB,CAAC;YACJ,CAAC,CAAC;YAEF,IAAI,CAAC,UAAU,CAAC,IAAI,GAAG;gBACrB,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI;gBACvB,UAAU,EAAE,iBAAiB;gBAC7B,SAAS,EAAE,gBAAgB;aAC5B,CAAC;SACH;IACH,CAAC;IAiHD,IAAI,gBAAgB;QAClB,IAAI;YACF,OAAO,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;SACzD;QAAC,OAAO,KAAK,EAAE;YACd,OAAO,IAAI,CAAC,KAAK,CAAC;SACnB;IACH,CAAC;IAED,gBAAgB;QACd,OAAO,IAAI,CAAA,SAAS,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC;IAClD,CAAC;IAED,eAAe;QACb,MAAM,OAAO,GAAG;YACd,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,KAAK,EAAE,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK;SACpC,CAAC;QAEF,OAAO,IAAI,CAAA;eACA,QAAQ,CAAC,OAAO,CAAC;iBACf,IAAI,CAAC,OAAO;mBACV,IAAI,CAAC,KAAK;kBACX,IAAI,CAAC,QAAQ;kBACb,IAAI,CAAC,QAAQ;eAChB,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,SAAS;mBACzB,IAAI,CAAC,SAAS;cACnB,IAAI,CAAC,KAAK;iBACP,IAAI,CAAC,OAAO;kBACX,IAAI,CAAC,QAAQ;;QAEvB,IAAI,CAAA;;kBAEM,IAAI,CAAC,YAAY;qBACd,IAAI,CAAC,eAAe;iBACxB,IAAI,CAAC,gBAAgB;;;cAGxB,IAAI,CAAC,GAAG;cACR,IAAI,CAAC,GAAG;oBACF,IAAI,CAAC,QAAQ;SACxB;gBACO,CAAC;IACf,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ;YAC3B,CAAC,CAAC,IAAI,CAAC,gBAAgB,EAAE;YACzB,CAAC,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;IAC7B,CAAC;;AAtaD;IACE,yBAAyB,CAAC,MAAM,CAAC,CAAC;AACpC,CAAC,GAAA,CAAA;AA+CD,mBAAmB;AAEnB,kBAAkB;AACF,wBAAiB,GAAG;IAClC,GAAG,UAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACrB,CAAC;AAEF,mBAAmB;AACH,qBAAc,GAAG,IAAI,CAAC;AAlDV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCAAwC;AAEvC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAiD;AAEhD;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sCAA4B;AAE3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAgC;AAE/B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAkB;AAEjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCAAY;AAEX;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAmB;AAUlB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCAAY;AAEV;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uDAAiC;AAEjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mCAAU;AAET;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mCAAoB;AAW/C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,yBAAyB,EAAE,CAAC;oDACrC;AAgBP;IAArB,KAAK,CAAC,aAAa,CAAC;yCAA8B;AAEtB;IAA5B,KAAK,CAAC,oBAAoB,CAAC;0CAAkB;AAEF;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAAkB;AAYR;IAApD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;yCAAgB;AAExB;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAAkB;AAEjB;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCAAmB;AAG9D;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,sBAAsB,EAAE,CAAC;kDACrC;AAqGI;IAA7B,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;yCAA2B;AAE/C;IAAR,KAAK,EAAE;uCAAyB","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 {\n dateFormatState,\n defaultDateFormat,\n defaultTimeFormat,\n} 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' | 'static' = 'default';\n\n @property({ type: String }) variant: 'date' | 'time' | 'date-time' = 'date';\n\n @property({ type: String }) format = defaultDateFormat;\n\n @property({ type: String }) timeFormat = defaultTimeFormat;\n\n @property({ type: String }) timezone = 'UTC';\n\n @property({ type: String }) label = '';\n\n @property({ type: String }) dateTimeText = '';\n\n /**\n * For `type='default'`, should be any value that is accepted by [new Date()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/Date).\n *\n * For `type='static'`, should be a date string that can be parsed by [parseISO](https://date-fns.org/v2.0.0/docs/parseISO), e.g.\n * - `2025-01-01`\n * - `2025-01-01 12:30Z`\n * - `2025-01-01T12:30:00.000+02:00`\n * */\n @property({ type: String }) value = '';\n\n @property({ type: Boolean }) showCalendarOnMouseDown = false;\n\n @property({ type: String }) min = '';\n\n @property({ type: String }) max = '9999-12-31';\n\n /**\n * Applies when type=static. Defaults to `false`.\n *\n * If `true`, the value is formatted but no time zone conversions are applied.\n *\n * If `false`, values that do not specify a time zone are interpreted as being in the\n * user's local time zone and all values are displayed in the user's local time zone.\n */\n @property({ type: Boolean, attribute: 'no-time-zone-conversion' })\n noTimeZoneConversion = false;\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 this.timezone = dateFormatState.preferredTimezone;\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 this.timezone = dateFormatState.preferredTimezone;\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 handleMouseDown = (e: Event) => {\n if (this.showCalendarOnMouseDown) {\n const inputElement = e.target as HTMLInputElement;\n\n if ('showPicker' in inputElement) {\n inputElement.showPicker();\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 parseValue = () => {\n if (typeof this.value !== 'string') {\n return this.value;\n }\n\n if (this.noTimeZoneConversion) {\n // Matches the time zone designator, e.g. `Z` or `-02:00`.\n // Note: does not match `-02` and `-0200`, which are valid ISO 8601 but rarely used.\n const timeZoneRegex = /Z|([+-]\\d\\d:\\d\\d)/;\n const valueWithoutTimeZone = this.value.split(timeZoneRegex)[0];\n return parseISO(valueWithoutTimeZone);\n }\n\n return parseISO(this.value);\n };\n\n getTimezoneDateTime = (date: Date) => {\n const parts = new Intl.DateTimeFormat('en-GB', {\n timeZone: this.timezone,\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n hour12: false,\n }).formatToParts(new Date(date));\n\n const get = (type: string) => parts.find(p => p.type === type)?.value;\n\n const year = get('year');\n const month = get('month');\n const day = get('day');\n const hour = get('hour');\n const minute = get('minute');\n const second = get('second');\n\n return new Date(`${year}-${month}-${day}T${hour}:${minute}:${second}`);\n };\n\n formatValueAsDate = (date: Date) =>\n format(date, this.format || defaultDateFormat);\n\n formatValueAsTime = (date: Date) =>\n format(date, this.timeFormat || defaultTimeFormat);\n\n formatValueAsDateTime = (date: Date) =>\n `${this.formatValueAsDate(date)}${\n this.dateTimeText ? ` ${this.dateTimeText} ` : ' '\n }${this.formatValueAsTime(date)}`;\n\n formatValue = () => {\n const parsedDate = this.parseValue();\n\n if (!isValid(parsedDate)) return '';\n\n const adjustedDate = this.noTimeZoneConversion\n ? parsedDate\n : this.getTimezoneDateTime(parsedDate);\n\n switch (this.variant) {\n case 'date':\n return this.formatValueAsDate(adjustedDate);\n case 'time':\n return this.formatValueAsTime(adjustedDate);\n case 'date-time':\n return this.formatValueAsDateTime(adjustedDate);\n default:\n return '';\n }\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 renderStaticDate() {\n return html`<span>${this.formatValue()}</span>`;\n }\n\n renderDateInput() {\n const classes = {\n disabled: this.disabled,\n error: !this.disabled && this.error,\n };\n\n return 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 @mousedown=${this.handleMouseDown}\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 render() {\n return this.type === 'static'\n ? this.renderStaticDate()\n : this.renderDateInput();\n }\n}\n"]}
|
package/dist/ix-date.min.js
CHANGED
|
@@ -1 +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";let defaultDateFormat="dd/MM/yyyy",defaultTimeFormat="HH:mm";class DateFormatState{constructor(){this.preferredDateFormat=defaultDateFormat,this.preferredTimeFormat=defaultTimeFormat,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}`;class IxDate extends MobxLitElement{constructor(){super(...arguments),this.type="default",this.variant="date",this.format=defaultDateFormat,this.timeFormat=defaultTimeFormat,this.label="",this.dateTimeText="",this.value="",this.showCalendarOnMouseDown=!1,this.min="",this.max="9999-12-31",this.noTimeZoneConversion=!1,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.handleMouseDown=t=>{this.showCalendarOnMouseDown&&"showPicker"in(t=t.target)&&t.showPicker()},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.parseValue=()=>{var t;return"string"!=typeof this.value?this.value:this.noTimeZoneConversion?(t=this.value.split(/Z|([+-]\d\d:\d\d)/)[0],parseISO(t)):parseISO(this.value)},this.formatValueAsDate=t=>format(t,this.format||defaultDateFormat),this.formatValueAsTime=t=>format(t,this.timeFormat||defaultTimeFormat),this.formatValueAsDateTime=t=>""+this.formatValueAsDate(t)+(this.dateTimeText?` ${this.dateTimeText} `:" ")+this.formatValueAsTime(t),this.formatValue=()=>{var t=this.parseValue();if(!isValid(t))return"";switch(this.variant){case"date":return this.formatValueAsDate(
|
|
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";let defaultDateFormat="dd/MM/yyyy",defaultTimeFormat="HH:mm",defaultTimezone="UTC";class DateFormatState{constructor(){this.preferredDateFormat=defaultDateFormat,this.preferredTimeFormat=defaultTimeFormat,this.preferredTimezone=defaultTimezone,makeAutoObservable(this),makePersistable(this,{name:"date-format",properties:["preferredDateFormat","preferredTimeFormat","preferredTimezone"],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}`;class IxDate extends MobxLitElement{constructor(){super(...arguments),this.type="default",this.variant="date",this.format=defaultDateFormat,this.timeFormat=defaultTimeFormat,this.timezone="UTC",this.label="",this.dateTimeText="",this.value="",this.showCalendarOnMouseDown=!1,this.min="",this.max="9999-12-31",this.noTimeZoneConversion=!1,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.timezone=dateFormatState.preferredTimezone},this.handleMouseDown=t=>{this.showCalendarOnMouseDown&&"showPicker"in(t=t.target)&&t.showPicker()},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.parseValue=()=>{var t;return"string"!=typeof this.value?this.value:this.noTimeZoneConversion?(t=this.value.split(/Z|([+-]\d\d:\d\d)/)[0],parseISO(t)):parseISO(this.value)},this.getTimezoneDateTime=t=>{let r=new Intl.DateTimeFormat("en-GB",{timeZone:this.timezone,year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit",hour12:!1}).formatToParts(new Date(t));var t=e=>{var t;return null==(t=r.find(t=>t.type===e))?void 0:t.value},e=t("year"),a=t("month"),i=t("day"),o=t("hour"),s=t("minute"),t=t("second");return new Date(e+`-${a}-${i}T${o}:${s}:`+t)},this.formatValueAsDate=t=>format(t,this.format||defaultDateFormat),this.formatValueAsTime=t=>format(t,this.timeFormat||defaultTimeFormat),this.formatValueAsDateTime=t=>""+this.formatValueAsDate(t)+(this.dateTimeText?` ${this.dateTimeText} `:" ")+this.formatValueAsTime(t),this.formatValue=()=>{var t=this.parseValue();if(!isValid(t))return"";var e=this.noTimeZoneConversion?t:this.getTimezoneDateTime(t);switch(this.variant){case"date":return this.formatValueAsDate(e);case"time":return this.formatValueAsTime(e);case"date-time":return this.formatValueAsDateTime(e);default:return""}}}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.timezone=dateFormatState.preferredTimezone,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}}renderStaticDate(){return html`<span>${this.formatValue()}</span>`}renderDateInput(){var t={disabled:this.disabled,error:!this.disabled&&this.error};return 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}" @mousedown="${this.handleMouseDown}" .value="${this.nativeInputValue}" class="flex-fill" type="date" min="${this.min}" max="${this.max}" ?disabled="${this.disabled}">`}</ix-field>`}render(){return"static"===this.type?this.renderStaticDate():this.renderDateInput()}}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,"variant",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,"timezone",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:Boolean})],IxDate.prototype,"showCalendarOnMouseDown",void 0),__decorate([property({type:String})],IxDate.prototype,"min",void 0),__decorate([property({type:String})],IxDate.prototype,"max",void 0),__decorate([property({type:Boolean,attribute:"no-time-zone-conversion"})],IxDate.prototype,"noTimeZoneConversion",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);
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
export declare const defaultDateFormat = "dd/MM/yyyy";
|
|
2
2
|
export declare const defaultTimeFormat = "HH:mm";
|
|
3
|
+
export declare const defaultTimezone = "UTC";
|
|
3
4
|
declare class DateFormatState {
|
|
4
5
|
constructor();
|
|
5
6
|
preferredDateFormat: string;
|
|
6
7
|
preferredTimeFormat: string;
|
|
8
|
+
preferredTimezone: string;
|
|
7
9
|
get isHydrated(): boolean;
|
|
8
10
|
hydrateStore(): Promise<void>;
|
|
9
11
|
clearStoredDate(): Promise<void>;
|
|
@@ -2,14 +2,20 @@ import { makeAutoObservable } from 'mobx';
|
|
|
2
2
|
import { makePersistable, isHydrated, hydrateStore, clearPersistedStore, getPersistedStore, } from 'mobx-persist-store';
|
|
3
3
|
export const defaultDateFormat = 'dd/MM/yyyy';
|
|
4
4
|
export const defaultTimeFormat = 'HH:mm';
|
|
5
|
+
export const defaultTimezone = 'UTC';
|
|
5
6
|
class DateFormatState {
|
|
6
7
|
constructor() {
|
|
7
8
|
this.preferredDateFormat = defaultDateFormat;
|
|
8
9
|
this.preferredTimeFormat = defaultTimeFormat;
|
|
10
|
+
this.preferredTimezone = defaultTimezone;
|
|
9
11
|
makeAutoObservable(this);
|
|
10
12
|
makePersistable(this, {
|
|
11
13
|
name: 'date-format',
|
|
12
|
-
properties: [
|
|
14
|
+
properties: [
|
|
15
|
+
'preferredDateFormat',
|
|
16
|
+
'preferredTimeFormat',
|
|
17
|
+
'preferredTimezone',
|
|
18
|
+
],
|
|
13
19
|
storage: window.localStorage,
|
|
14
20
|
});
|
|
15
21
|
}
|
|
@@ -1 +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,CAAC,MAAM,iBAAiB,GAAG,YAAY,CAAC;AAC9C,MAAM,CAAC,MAAM,iBAAiB,GAAG,OAAO,CAAC;AAEzC,MAAM,eAAe;IACnB;
|
|
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,CAAC,MAAM,iBAAiB,GAAG,YAAY,CAAC;AAC9C,MAAM,CAAC,MAAM,iBAAiB,GAAG,OAAO,CAAC;AAEzC,MAAM,CAAC,MAAM,eAAe,GAAG,KAAK,CAAC;AAErC,MAAM,eAAe;IACnB;QAaO,wBAAmB,GAAW,iBAAiB,CAAC;QAEhD,wBAAmB,GAAW,iBAAiB,CAAC;QAEhD,sBAAiB,GAAW,eAAe,CAAC;QAhBjD,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,eAAe,CAAC,IAAI,EAAE;YACpB,IAAI,EAAE,aAAa;YACnB,UAAU,EAAE;gBACV,qBAAqB;gBACrB,qBAAqB;gBACrB,mBAAmB;aACpB;YACD,OAAO,EAAE,MAAM,CAAC,YAAY;SAC7B,CAAC,CAAC;IACL,CAAC;IAQD,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\nexport const defaultDateFormat = 'dd/MM/yyyy';\nexport const defaultTimeFormat = 'HH:mm';\n\nexport const defaultTimezone = 'UTC';\n\nclass DateFormatState {\n constructor() {\n makeAutoObservable(this);\n makePersistable(this, {\n name: 'date-format',\n properties: [\n 'preferredDateFormat',\n 'preferredTimeFormat',\n 'preferredTimezone',\n ],\n storage: window.localStorage,\n });\n }\n\n public preferredDateFormat: string = defaultDateFormat;\n\n public preferredTimeFormat: string = defaultTimeFormat;\n\n public preferredTimezone: string = defaultTimezone;\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
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "Webcomponent ix-date following open-wc recommendations",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Digital Realty",
|
|
6
|
-
"version": "1.1.
|
|
6
|
+
"version": "1.1.25",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"main": "dist/index.js",
|
|
9
9
|
"module": "dist/index.js",
|
|
@@ -112,5 +112,5 @@
|
|
|
112
112
|
"README.md",
|
|
113
113
|
"LICENSE"
|
|
114
114
|
],
|
|
115
|
-
"gitHead": "
|
|
115
|
+
"gitHead": "42e0525865e075421d6240a4d7de5f291bfcda12"
|
|
116
116
|
}
|