@ui5/webcomponents 2.16.0-rc.0 → 2.16.0-rc.2

package/dist/DateTimeInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimeInput.js","sourceRoot":"","sources":["../src/DateTimeInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AAErF,SAAS;AACT,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,MAAM,4CAA4C,CAAC;AACtE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAEtF;;;;;;GAMG;AAKH,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,KAAK;IAAjC;;QAEC,iCAA4B,GAAG,KAAK,CAAC;IAgBtC,CAAC;IAdA;;;;;;OAMG;IACH,IAAI,oBAAoB;QACvB,OAAO,IAAI,CAAC,4BAA4B,IAAI,KAAK,CAAC,oBAAoB,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC;IACjG,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,QAAQ,EAAE,CAAC,CAAC;IAClD,CAAC;CACD,CAAA;AAhBA;IADC,QAAQ,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;mEACK;AAFhC,aAAa;IAJlB,aAAa,CAAC;QACd,GAAG,EAAE,oBAAoB;KACzB,CAAC;GAEI,aAAa,CAkBlB;AAED,aAAa,CAAC,MAAM,EAAE,CAAC;AAEvB,eAAe,aAAa,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\n\n// Styles\nimport Input from \"./Input.js\";\nimport { property } from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport { isDesktop, isPhone, isTablet } from \"@ui5/webcomponents-base/dist/Device.js\";\n\n/**\n * Extention of the UI5 Input, so we do not modify Input's private properties within the datetime components.\n * Intended to be used for the DateTime components.\n *\n * @class\n * @private\n */\n@customElement({\n\ttag: \"ui5-datetime-input\",\n})\n\nclass DateTimeInput extends Input {\n\t@property({ noAttribute: true })\n\t_shouldOpenValueStatePopover = false;\n\n\t/**\n\t * Prevents the value state message popover from appearing when a responsive popover (like time selection) is open\n\t * since the responsive popover already includes the necessary information in its header.\n\t *\n\t * @protected\n\t * @override\n\t */\n\tget hasValueStateMessage() {\n\t\treturn this._shouldOpenValueStatePopover && super.hasValueStateMessage && !this._isMobileDevice;\n\t}\n\n\tget _isMobileDevice() {\n\t\treturn !isDesktop() && (isPhone() || isTablet());\n\t}\n}\n\nDateTimeInput.define();\n\nexport default DateTimeInput;\n"]}
+{"version":3,"file":"DateTimeInput.js","sourceRoot":"","sources":["../src/DateTimeInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,UAAU,MAAM,kDAAkD,CAAC;AAE1E,SAAS;AACT,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,MAAM,4CAA4C,CAAC;AACtE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAEtF;;;;;;GAMG;AAKH,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,KAAK;IAAjC;;QAEC,iCAA4B,GAAG,KAAK,CAAC;IAkDtC,CAAC;IAhDA;;;;;;OAMG;IACH,IAAI,oBAAoB;QACvB,OAAO,IAAI,CAAC,4BAA4B,IAAI,KAAK,CAAC,oBAAoB,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC;IACjG,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,QAAQ,EAAE,CAAC,CAAC;IAClD,CAAC;IAED;;;;OAIG;IACH,IAAI,wBAAwB;QAC3B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;YACzB,OAAO;QACR,CAAC;QAED,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,KAAK,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAE3G,IAAI,IAAI,CAAC,qCAAqC,EAAE,CAAC;YAChD,OAAO,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,GAAG,UAAU,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC;QAClF,CAAC;QAED,mFAAmF;QACnF,IAAI,IAAI,CAAC,iBAAiB,CAAC,MAAM,EAAE,CAAC;YACnC,MAAM,SAAS,GAAG,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;YAC5C,IAAI,SAAS,CAAC,OAAO,KAAK,MAAM,EAAE,CAAC;gBAClC,MAAM,aAAa,GAAI,SAA6B,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;gBACtF,MAAM,WAAW,GAAG,aAAa;qBAC/B,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,WAAW,IAAI,EAAE,CAAC;qBACnC,IAAI,CAAC,GAAG,CAAC;qBACT,IAAI,EAAE,CAAC;gBACT,OAAO,WAAW,CAAC,CAAC,CAAC,GAAG,UAAU,IAAI,WAAW,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC;YAClE,CAAC;YACD,gCAAgC;YAChC,OAAO,GAAG,UAAU,IAAI,SAAS,CAAC,WAAW,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,CAAC;QAC9D,CAAC;QAED,OAAO,UAAU,CAAC;IACnB,CAAC;CACD,CAAA;AAlDA;IADC,QAAQ,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;mEACK;AAFhC,aAAa;IAJlB,aAAa,CAAC;QACd,GAAG,EAAE,oBAAoB;KACzB,CAAC;GAEI,aAAa,CAoDlB;AAED,aAAa,CAAC,MAAM,EAAE,CAAC;AAEvB,eAAe,aAAa,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\n\n// Styles\nimport Input from \"./Input.js\";\nimport { property } from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport { isDesktop, isPhone, isTablet } from \"@ui5/webcomponents-base/dist/Device.js\";\n\n/**\n * Extention of the UI5 Input, so we do not modify Input's private properties within the datetime components.\n * Intended to be used for the DateTime components.\n *\n * @class\n * @private\n */\n@customElement({\n\ttag: \"ui5-datetime-input\",\n})\n\nclass DateTimeInput extends Input {\n\t@property({ noAttribute: true })\n\t_shouldOpenValueStatePopover = false;\n\n\t/**\n\t * Prevents the value state message popover from appearing when a responsive popover (like time selection) is open\n\t * since the responsive popover already includes the necessary information in its header.\n\t *\n\t * @protected\n\t * @override\n\t */\n\tget hasValueStateMessage() {\n\t\treturn this._shouldOpenValueStatePopover && super.hasValueStateMessage && !this._isMobileDevice;\n\t}\n\n\tget _isMobileDevice() {\n\t\treturn !isDesktop() && (isPhone() || isTablet());\n\t}\n\n\t/**\n\t * Override to handle nested slot structure from DatePicker -> DateTimeInput slot forwarding.\n\t * Assumes DateTimeInput always has slot-within-slot structure for valueStateMessage.\n\t * @override\n\t */\n\tget ariaValueStateHiddenText(): string | undefined {\n\t\tif (!this.hasValueState) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst valueState = this.valueState !== ValueState.None ? this.valueStateTypeMappings[this.valueState] : \"\";\n\n\t\tif (this.shouldDisplayDefaultValueStateMessage) {\n\t\t\treturn this.valueStateText ? `${valueState} ${this.valueStateText}` : valueState;\n\t\t}\n\n\t\t// Handle the specific nested slot case: outer slot -> inner slot -> actual content\n\t\tif (this.valueStateMessage.length) {\n\t\t\tconst outerSlot = this.valueStateMessage[0];\n\t\t\tif (outerSlot.tagName === \"SLOT\") {\n\t\t\t\tconst assignedNodes = (outerSlot as HTMLSlotElement).assignedNodes({ flatten: true });\n\t\t\t\tconst textContent = assignedNodes\n\t\t\t\t\t.map(node => node.textContent || \"\")\n\t\t\t\t\t.join(\" \")\n\t\t\t\t\t.trim();\n\t\t\t\treturn textContent ? `${valueState} ${textContent}` : valueState;\n\t\t\t}\n\t\t\t// Fallback for non-slot content\n\t\t\treturn `${valueState} ${outerSlot.textContent || \"\"}`.trim();\n\t\t}\n\n\t\treturn valueState;\n\t}\n}\n\nDateTimeInput.define();\n\nexport default DateTimeInput;\n"]}

package/dist/DateTimePicker.d.ts

@@ -100,6 +100,11 @@ declare class DateTimePicker extends DatePicker implements IFormInputElement {
      * @private
      */
     _previewValues: PreviewValues;
+    /**
+     * Stores the last valid value to preserve time when entering invalid values
+     * @private
+     */
+    _lastValidValue: string;
     _clocks: TimeSelectionClocks;
     _handleResizeBound: ResizeObserverCallback;
     constructor();
@@ -117,6 +122,8 @@ declare class DateTimePicker extends DatePicker implements IFormInputElement {
      * @private
      */
     _togglePicker(): void;
+    get formValidityMessage(): string;
+    get formValidity(): ValidityStateFlags;
     get _formatPattern(): string;
     get _calendarTimestamp(): number;
     get _calendarSelectedDates(): string[];
@@ -175,6 +182,10 @@ declare class DateTimePicker extends DatePicker implements IFormInputElement {
      * @override
      */
     _modifyDateValue(amount: number, unit: string, preserveDate: boolean): void;
+    /**
+     * @override
+     */
+    _updateValueAndFireEvents(value: string, normalizeValue: boolean, events: Array<"change" | "value-changed" | "input">, updateValue?: boolean): void;
     /**
      * Checks if the provided value is valid and within valid range.
      * @override

package/dist/DateTimePicker.js

@@ -18,7 +18,7 @@ import DateFormat from "@ui5/webcomponents-localization/dist/DateFormat.js";
 import DatePicker from "./DatePicker.js";
 import { isPhone } from "@ui5/webcomponents-base/dist/Device.js";
 // i18n texts
-import { TIMEPICKER_SUBMIT_BUTTON, TIMEPICKER_CANCEL_BUTTON, DATETIME_DESCRIPTION, DATETIME_PICKER_DATE_BUTTON, DATETIME_PICKER_TIME_BUTTON, DATETIMEPICKER_POPOVER_ACCESSIBLE_NAME, } from "./generated/i18n/i18n-defaults.js";
+import { TIMEPICKER_SUBMIT_BUTTON, TIMEPICKER_CANCEL_BUTTON, DATETIME_DESCRIPTION, DATETIME_PICKER_DATE_BUTTON, DATETIME_PICKER_TIME_BUTTON, DATETIMEPICKER_POPOVER_ACCESSIBLE_NAME, DATETIME_VALUE_MISSING, DATETIME_PATTERN_MISMATCH, DATETIME_RANGEUNDERFLOW, DATETIME_RANGEOVERFLOW, } from "./generated/i18n/i18n-defaults.js";
 // Template
 import DateTimePickerTemplate from "./DateTimePickerTemplate.js";
 // Styles
@@ -116,6 +116,11 @@ let DateTimePicker = DateTimePicker_1 = class DateTimePicker extends DatePicker
          * @private
          */
         this._previewValues = {};
+        /**
+         * Stores the last valid value to preserve time when entering invalid values
+         * @private
+         */
+        this._lastValidValue = "";
         this._handleResizeBound = this._handleResize.bind(this);
     }
     /**
@@ -142,12 +147,43 @@ let DateTimePicker = DateTimePicker_1 = class DateTimePicker extends DatePicker
     _togglePicker() {
         super._togglePicker();
         if (this.open) {
+            let timeSelectionValue = this.value;
+            // If current value is invalid, use the last valid value for time selection
+            if (!timeSelectionValue || !this.isValidValue(timeSelectionValue)) {
+                timeSelectionValue = this._lastValidValue || this.getValueFormat().format(UI5Date.getInstance());
+            }
             this._previewValues = {
                 ...this._previewValues,
-                timeSelectionValue: this.value || this.getValueFormat().format(UI5Date.getInstance()),
+                timeSelectionValue,
             };
         }
     }
+    get formValidityMessage() {
+        const validity = this.formValidity;
+        if (validity.valueMissing) {
+            // @ts-ignore oFormatOptions is a private API of DateFormat
+            return DateTimePicker_1.i18nBundle.getText(DATETIME_VALUE_MISSING, this.getFormat().oFormatOptions.pattern);
+        }
+        if (validity.patternMismatch) {
+            // @ts-ignore oFormatOptions is a private API of DateFormat
+            return DateTimePicker_1.i18nBundle.getText(DATETIME_PATTERN_MISMATCH, this.getFormat().oFormatOptions.pattern);
+        }
+        if (validity.rangeUnderflow) {
+            return DateTimePicker_1.i18nBundle.getText(DATETIME_RANGEUNDERFLOW, this.minDate);
+        }
+        if (validity.rangeOverflow) {
+            return DateTimePicker_1.i18nBundle.getText(DATETIME_RANGEOVERFLOW, this.maxDate);
+        }
+        return "";
+    }
+    get formValidity() {
+        return {
+            valueMissing: this.required && !this.value,
+            patternMismatch: !this.isValidValue(this.value),
+            rangeUnderflow: !this.isValidMin(this.value),
+            rangeOverflow: !this.isValidMax(this.value),
+        };
+    }
     get _formatPattern() {
         const hasHours = !!(this.formatPattern || "").match(/H/i);
         const fallback = !this.formatPattern || !hasHours;
@@ -217,13 +253,17 @@ let DateTimePicker = DateTimePicker_1 = class DateTimePicker extends DatePicker
      */
     async onSelectedDatesChange(e) {
         e.preventDefault();
-        // @ts-ignore Needed for FF
-        const dateTimePickerContent = e.path ? e.path[1] : e.composedPath()[1];
+        // Try to get the current time value from the time picker,
+        // but fallback to last valid value if current picker time is empty or invalid
+        let timeValue = this._clocks?.value || "";
+        if (!timeValue || !this.isValidValue(timeValue)) {
+            timeValue = this._lastValidValue || this.getValueFormat().format(UI5Date.getInstance());
+        }
         this._previewValues = {
             ...this._previewValues,
             calendarTimestamp: e.detail.timestamp,
             calendarValue: e.detail.selectedValues[0],
-            timeSelectionValue: dateTimePickerContent.lastChild.value,
+            timeSelectionValue: timeValue,
         };
         this._showTimeView = true;
         if (this.showDateView) {
@@ -294,6 +334,16 @@ let DateTimePicker = DateTimePicker_1 = class DateTimePicker extends DatePicker
         const newValue = this.formatValue(modifiedLocalDate);
         this._updateValueAndFireEvents(newValue, true, ["change", "value-changed"]);
     }
+    /**
+     * @override
+     */
+    _updateValueAndFireEvents(value, normalizeValue, events, updateValue = true) {
+        super._updateValueAndFireEvents(value, normalizeValue, events, updateValue);
+        // Always store the current value if it's valid (handles both updates and initial values)
+        if (this.value && this.isValidValue(this.value)) {
+            this._lastValidValue = this.value;
+        }
+    }
     /**
      * Checks if the provided value is valid and within valid range.
      * @override
@@ -383,6 +433,9 @@ __decorate([
 __decorate([
     property({ type: Object })
 ], DateTimePicker.prototype, "_previewValues", void 0);
+__decorate([
+    property()
+], DateTimePicker.prototype, "_lastValidValue", void 0);
 __decorate([
     query("[ui5-time-selection-clocks]")
 ], DateTimePicker.prototype, "_clocks", void 0);

package/dist/DateTimePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimePicker.js","sourceRoot":"","sources":["../src/DateTimePicker.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,aAAa,MAAM,wDAAwD,CAAC;AAEnF,OAAO,SAAS,MAAM,kDAAkD,CAAC;AACzE,OAAO,2BAA2B,MAAM,qEAAqE,CAAC;AAC9G,OAAO,YAAY,MAAM,4DAA4D,CAAC;AACtF,OAAO,YAAY,MAAM,4DAA4D,CAAC;AAEtF,OAAO,4CAA4C,CAAC;AACpD,OAAO,OAAO,MAAM,uDAAuD,CAAC;AAC5E,OAAO,UAAU,MAAM,oDAAoD,CAAC;AAG5E,OAAO,UAAU,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,wCAAwC,CAAC;AAOjE,aAAa;AACb,OAAO,EACN,wBAAwB,EACxB,wBAAwB,EACxB,oBAAoB,EACpB,2BAA2B,EAC3B,2BAA2B,EAC3B,sCAAsC,GACtC,MAAM,mCAAmC,CAAC;AAE3C,WAAW;AACX,OAAO,sBAAsB,MAAM,6BAA6B,CAAC;AAEjE,SAAS;AACT,OAAO,iBAAiB,MAAM,0CAA0C,CAAC;AACzE,OAAO,wBAAwB,MAAM,iDAAiD,CAAC;AACvF,OAAO,mBAAmB,MAAM,gCAAgC,CAAC;AAEjE,OAAO,KAAK,MAAM,kDAAkD,CAAC;AACrE,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AAExE,MAAM,qBAAqB,GAAG,GAAG,CAAC,CAAC,KAAK;AAQxC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6DG;AAUH,IAAM,cAAc,sBAApB,MAAM,cAAe,SAAQ,UAAU;IAmCtC;QACC,KAAK,EAAE,CAAC;QAnCT;;;;;;;WAOG;QAEH,kBAAa,GAAG,KAAK,CAAA;QAErB;;;;;;;WAOG;QAEH,eAAU,GAAG,KAAK,CAAC;QAEnB;;;WAGG;QAEH,mBAAc,GAAkB,EAAE,CAAC;QASlC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACzD,CAAC;IAED;;OAEG;IACH,6BAA6B;QAC5B,KAAK,CAAC,6BAA6B,EAAE,CAAC;QACtC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;QAC3B,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;IAC1B,CAAC;IAED;;OAEG;IAEH,UAAU;QACT,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAChE,CAAC;IAED,SAAS;QACR,aAAa,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAClE,CAAC;IAED;;;OAGG;IACH,aAAa;QACZ,KAAK,CAAC,aAAa,EAAE,CAAC;QAEtB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,IAAI,CAAC,cAAc,GAAG;gBACrB,GAAG,IAAI,CAAC,cAAc;gBACtB,kBAAkB,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;aACrF,CAAC;QACH,CAAC;IACF,CAAC;IAED,IAAI,cAAc;QACjB,MAAM,QAAQ,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAC1D,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,QAAQ,CAAC;QAElD,MAAM,UAAU,GAAG,2BAA2B,CAAC,SAAS,EAAE,CAAC,CAAC;QAC5D,OAAO,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,0BAA0B,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC;IACrI,CAAC;IAED,IAAI,kBAAkB;QACrB,OAAO,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC,CAAC,KAAK,CAAC,kBAAkB,CAAC;IACjH,CAAC;IAED,IAAI,sBAAsB;QACzB,OAAO,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,sBAAsB,CAAC;IAC/G,CAAC;IAED,IAAI,mBAAmB;QACtB,OAAO,IAAI,CAAC,cAAc,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;IACrG,CAAC;IAED,IAAI,YAAY;QACf,OAAO,WAAW,CAAC;IACpB,CAAC;IAED,IAAI,UAAU;QACb,OAAO,gBAAc,CAAC,UAAU,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC;IACpE,CAAC;IAED,IAAI,cAAc;QACjB,OAAO,gBAAc,CAAC,UAAU,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC;IACpE,CAAC;IAED,IAAI,YAAY;QACf,OAAO,gBAAc,CAAC,UAAU,CAAC,OAAO,CAAC,2BAA2B,CAAC,CAAC;IACvE,CAAC;IAED,IAAI,YAAY;QACf,OAAO,gBAAc,CAAC,UAAU,CAAC,OAAO,CAAC,2BAA2B,CAAC,CAAC;IACvE,CAAC;IAED,IAAI,UAAU;QACb,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,YAAY;QACf,OAAO,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC;IACrD,CAAC;IAED,IAAI,YAAY;QACf,OAAO,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC;IACpD,CAAC;IAED,IAAI,UAAU;QACb,OAAO,OAAO,EAAE,IAAI,IAAI,CAAC,UAAU,CAAC;IACrC,CAAC;IAED;;OAEG;IACH,IAAI,eAAe;QAClB,OAAO,gBAAc,CAAC,UAAU,CAAC,OAAO,CAAC,oBAAoB,CAAC,CAAC;IAChE,CAAC;IAED;;OAEG;IACH,IAAI,oBAAoB;QACvB,OAAO,gBAAc,CAAC,UAAU,CAAC,OAAO,CAAC,sCAAsC,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IACtG,CAAC;IAED;;;OAGG;IACH,IAAI,iBAAiB;QACpB,OAAO,IAAI,CAAC;IACb,CAAC;IAED;;OAEG;IAEH;;OAEG;IACH,KAAK,CAAC,qBAAqB,CAAC,CAAkD;QAC7E,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,2BAA2B;QAC3B,MAAM,qBAAqB,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;QACvE,IAAI,CAAC,cAAc,GAAG;YACrB,GAAG,IAAI,CAAC,cAAc;YACtB,iBAAiB,EAAE,CAAC,CAAC,MAAM,CAAC,SAAS;YACrC,aAAa,EAAE,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC;YACzC,kBAAkB,EAAE,qBAAqB,CAAC,SAAS,CAAC,KAAK;SACzD,CAAC;QACF,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;QAE1B,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACvB,OAAO;QACR,CAAC;QAED,MAAM,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IACtB,CAAC;IAED,qBAAqB,CAAC,CAA8C;QACnE,IAAI,CAAC,cAAc,GAAG;YACrB,GAAG,IAAI,CAAC,cAAc;YACtB,kBAAkB,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK;SAClC,CAAC;IACH,CAAC;IAED;;OAEG;IACH,aAAa;QACZ,MAAM,aAAa,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC;QAChD,MAAM,WAAW,GAAG,aAAa,IAAI,qBAAqB,CAAC;QAC3D,MAAM,UAAU,GAAG,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,WAAW,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,0BAA0B;QAErH,IAAI,UAAU,EAAE,CAAC;YAChB,IAAI,CAAC,UAAU,GAAG,WAAW,CAAC;QAC/B,CAAC;IACF,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,CAAC,IAAI,CAAC,sBAAsB,IAAI,CAAC,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC;IAC5E,CAAC;IAED;;OAEG;IACH,YAAY;QACX,MAAM,YAAY,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAEhD,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;QACzD,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC;YAC1B,IAAI,CAAC,yBAAyB,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC,CAAC;QAC1E,CAAC;QAED,IAAI,CAAC,aAAa,EAAE,CAAC;IACtB,CAAC;IAED;;;OAGG;IACH,YAAY;QACX,IAAI,CAAC,aAAa,EAAE,CAAC;IACtB,CAAC;IAED;;;;OAIG;IACH,qBAAqB,CAAC,CAAyD;QAC9E,MAAM,YAAY,GAAG,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;QAC/C,IAAI,CAAC,aAAa,GAAG,YAAY,CAAC,YAAY,CAAC,cAAc,CAAC,KAAK,MAAM,CAAC;IAC3E,CAAC;IAED;;OAEG;IACH,gBAAgB,CAAC,MAAc,EAAE,IAAY,EAAE,YAAqB;QACnE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;YACrB,OAAO;QACR,CAAC;QAED,MAAM,YAAY,GAAG,YAAY,CAAC,YAAY,CAAC,eAAe,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC1I,MAAM,iBAAiB,GAAG,YAAY,CAAC,aAAa,EAAE,CAAC;QACvD,iBAAiB,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC;QACtD,iBAAiB,CAAC,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,EAAE,CAAC,CAAC;QAC1D,iBAAiB,CAAC,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,EAAE,CAAC,CAAC;QAE1D,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;QACrD,IAAI,CAAC,yBAAyB,CAAC,QAAQ,EAAE,IAAI,EAAE,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC,CAAC;IAC7E,CAAC;IAED;;;;OAIG;IACH,mBAAmB,CAAC,KAAa;QAChC,IAAI,KAAK,KAAK,EAAE,EAAE,CAAC;YAClB,OAAO,IAAI,CAAC;QACb,CAAC;QACD,OAAO,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IACjC,CAAC;IAED,mBAAmB;QAClB,MAAM,YAAY,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAS,CAAC;QACzF,MAAM,YAAY,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,mBAAmB,CAAS,CAAC;QACnF,IAAI,YAAY,EAAE,CAAC;YAClB,YAAY,CAAC,QAAQ,CAAC,YAAY,CAAC,QAAQ,EAAE,CAAC,CAAC;YAC/C,YAAY,CAAC,UAAU,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC,CAAC;YACnD,YAAY,CAAC,UAAU,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC,CAAC;QACpD,CAAC;QAED,OAAO,YAAY,CAAC;IACrB,CAAC;IAED,SAAS;QACR,OAAO,IAAI,CAAC,UAAU;YACrB,CAAC,CAAC,UAAU,CAAC,mBAAmB,CAAC;gBAChC,aAAa,EAAE,IAAI;gBACnB,OAAO,EAAE,IAAI,CAAC,cAAc;gBAC5B,YAAY,EAAE,IAAI,CAAC,oBAAoB;aACvC,CAAC;YACF,CAAC,CAAC,UAAU,CAAC,mBAAmB,CAAC;gBAChC,aAAa,EAAE,IAAI;gBACnB,KAAK,EAAE,IAAI,CAAC,cAAc;gBAC1B,YAAY,EAAE,IAAI,CAAC,oBAAoB;aACvC,CAAC,CAAC;IACL,CAAC;IAED,gBAAgB;QACf,OAAO,IAAI,CAAC,uBAAuB;YAClC,CAAC,CAAC,UAAU,CAAC,mBAAmB,CAAC;gBAChC,aAAa,EAAE,IAAI;gBACnB,OAAO,EAAE,IAAI,CAAC,cAAc;gBAC5B,YAAY,EAAE,IAAI,CAAC,oBAAoB;aACvC,CAAC;YACF,CAAC,CAAC,UAAU,CAAC,mBAAmB,CAAC;gBAChC,aAAa,EAAE,IAAI;gBACnB,KAAK,EAAE,IAAI,CAAC,cAAc;gBAC1B,YAAY,EAAE,IAAI,CAAC,oBAAoB;aACvC,CAAC,CAAC;IACL,CAAC;IAED,cAAc;QACb,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YACxB,OAAO,IAAI,CAAC,YAAY,EAAE,CAAC;QAC5B,CAAC;QAED,OAAO,IAAI,CAAC,qBAAqB;YAChC,CAAC,CAAC,UAAU,CAAC,mBAAmB,CAAC;gBAChC,aAAa,EAAE,IAAI;gBACnB,OAAO,EAAE,IAAI,CAAC,YAAY;gBAC1B,YAAY,EAAE,IAAI,CAAC,oBAAoB;aACvC,CAAC;YACF,CAAC,CAAC,UAAU,CAAC,mBAAmB,CAAC;gBAChC,aAAa,EAAE,IAAI;gBACnB,KAAK,EAAE,IAAI,CAAC,YAAY;gBACxB,YAAY,EAAE,IAAI,CAAC,oBAAoB;aACvC,CAAC,CAAC;IACL,CAAC;IAED,YAAY;QACX,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE,CAAC;YAC9B,IAAI,CAAC,kBAAkB,GAAG,UAAU,CAAC,mBAAmB,CAAC;gBACxD,aAAa,EAAE,IAAI;gBACnB,OAAO,EAAE,qBAAqB;gBAC9B,YAAY,EAAE,IAAI,CAAC,oBAAoB;aACvC,CAAC,CAAC;QACJ,CAAC;QACD,OAAO,IAAI,CAAC,kBAAkB,CAAC;IAChC,CAAC;IAED;;OAEG;IACH,IAAI,oBAAoB;QACvB,OAAO,mBAAmB,CAAC,cAAc,CAAC;IAC3C,CAAC;CACD,CAAA;AA5UA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;qDAC1B;AAWrB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDACT;AAOnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDACQ;AAGnC;IADC,KAAK,CAAC,6BAA6B,CAAC;+CACP;AA/BzB,cAAc;IATnB,aAAa,CAAC;QACd,GAAG,EAAE,qBAAqB;QAC1B,QAAQ,EAAE,sBAAsB;QAChC,MAAM,EAAE;YACP,UAAU,CAAC,MAAM;YACjB,iBAAiB;YACjB,wBAAwB;SACxB;KACD,CAAC;GACI,cAAc,CAsVnB;AAED,cAAc,CAAC,MAAM,EAAE,CAAC;AAExB,eAAe,cAAc,CAAC","sourcesContent":["import property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport getLocale from \"@ui5/webcomponents-base/dist/locale/getLocale.js\";\nimport getCachedLocaleDataInstance from \"@ui5/webcomponents-localization/dist/getCachedLocaleDataInstance.js\";\nimport modifyDateBy from \"@ui5/webcomponents-localization/dist/dates/modifyDateBy.js\";\nimport CalendarDate from \"@ui5/webcomponents-localization/dist/dates/CalendarDate.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport \"@ui5/webcomponents-icons/dist/date-time.js\";\nimport UI5Date from \"@ui5/webcomponents-localization/dist/dates/UI5Date.js\";\nimport DateFormat from \"@ui5/webcomponents-localization/dist/DateFormat.js\";\nimport type { SegmentedButtonSelectionChangeEventDetail } from \"./SegmentedButton.js\";\nimport type { CalendarSelectionChangeEventDetail } from \"./Calendar.js\";\nimport DatePicker from \"./DatePicker.js\";\nimport { isPhone } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type {\n\tDatePickerChangeEventDetail as DateTimePickerChangeEventDetail,\n\tDatePickerInputEventDetail as DateTimePickerInputEventDetail,\n} from \"./DatePicker.js\";\nimport type { TimeSelectionChangeEventDetail } from \"./TimePickerInternals.js\";\n\n// i18n texts\nimport {\n\tTIMEPICKER_SUBMIT_BUTTON,\n\tTIMEPICKER_CANCEL_BUTTON,\n\tDATETIME_DESCRIPTION,\n\tDATETIME_PICKER_DATE_BUTTON,\n\tDATETIME_PICKER_TIME_BUTTON,\n\tDATETIMEPICKER_POPOVER_ACCESSIBLE_NAME,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport DateTimePickerTemplate from \"./DateTimePickerTemplate.js\";\n\n// Styles\nimport DateTimePickerCss from \"./generated/themes/DateTimePicker.css.js\";\nimport DateTimePickerPopoverCss from \"./generated/themes/DateTimePickerPopover.css.js\";\nimport CalendarPickersMode from \"./types/CalendarPickersMode.js\";\nimport type TimeSelectionClocks from \"./TimeSelectionClocks.js\";\nimport query from \"@ui5/webcomponents-base/dist/decorators/query.js\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\n\nconst PHONE_MODE_BREAKPOINT = 640; // px\n\ntype PreviewValues = {\n\ttimeSelectionValue?: string,\n\tcalendarTimestamp?: number,\n\tcalendarValue?: string,\n}\n\n/**\n * @class\n *\n * ### Overview\n * The `DateTimePicker` component alows users to select both date (day, month and year) and time (hours, minutes and seconds)\n * and for the purpose it consists of input field and Date/Time picker.\n *\n * ### Usage\n *\n * Use the `DateTimePicker` if you need a combined date and time input component.\n * Don't use it if you want to use either date, or time value.\n * In this case, use the `DatePicker` or the `TimePicker` components instead.\n *\n * The user can set date/time by:\n *\n * - using the calendar and the time selectors\n * - typing in the input field\n *\n * Programmatically, to set date/time for the `DateTimePicker`, use the `value` property\n *\n * ### Formatting\n *\n * The value entered by typing into the input field must fit to the used date/time format.\n *\n * Supported format options are pattern-based on Unicode LDML Date Format notation.\n * For more information, see [UTS #35: Unicode Locale Data Markup Language](https://unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table).\n *\n * **Example:** the following format `dd/MM/yyyy, hh:mm:ss aa`\n * corresponds the `13/04/2020, 03:16:16 AM` value.\n *\n * The small 'h' defines \"12\" hours format and the \"aa\" symbols - \"AM/PM\" time periods.\n *\n * **Example:** the following format `dd/MM/yyyy, HH:mm:ss`\n * corresponds the `13/04/2020, 15:16:16` value.\n *\n * The capital 'H' indicates \"24\" hours format.\n *\n * **Note:** If the `formatPattern` does NOT include time,\n * the `DateTimePicker` will fallback to the default time format according to the locale.\n *\n * **Note:** If no placeholder is set to the `DateTimePicker`,\n * the current `formatPattern` is displayed as a placeholder.\n * If another placeholder is needed, it must be set or in case no placeholder is needed - it can be set to an empty string.\n *\n * **Note:** If the user input does NOT match the `formatPattern`,\n * the `DateTimePicker` makes an attempt to parse it based on the\n * locale settings.\n *\n * ### Responsive behavior\n *\n * The `DateTimePicker` is responsive and fully adapts to all devices.\n * For larger screens, such as tablet or desktop, it is displayed as a popover, while\n * on phone devices, it is displayed full screen.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/DateTimePicker.js\";`\n * @constructor\n * @extends DatePicker\n * @since 1.0.0-rc.7\n * @public\n */\n@customElement({\n\ttag: \"ui5-datetime-picker\",\n\ttemplate: DateTimePickerTemplate,\n\tstyles: [\n\t\tDatePicker.styles,\n\t\tDateTimePickerCss,\n\t\tDateTimePickerPopoverCss,\n\t],\n})\nclass DateTimePicker extends DatePicker implements IFormInputElement {\n\t/**\n\t * Defines the visibility of the time view in `phoneMode`.\n\t * For more information, see the `phoneMode` property.\n\t *\n\t * **Note:** The date view would be displayed by default.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean, noAttribute: true })\n\t_showTimeView = false\n\n\t/**\n\t * Defines if the `DateTimePicker` should be displayed in phone mode.\n\t * The phone mode turns on when the component is used on small screens or phone devices.\n\t * In phone mode the user can see either the calendar view, or the time view\n\t * and can switch between the views via toggle buttons.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_phoneMode = false;\n\n\t/**\n\t * Selected, but not yet confirmed date/time\n\t * @private\n\t */\n\t@property({ type: Object })\n\t_previewValues: PreviewValues = {};\n\n\t@query(\"[ui5-time-selection-clocks]\")\n\t_clocks!: TimeSelectionClocks;\n\n\t_handleResizeBound: ResizeObserverCallback;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._handleResizeBound = this._handleResize.bind(this);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tonResponsivePopoverAfterClose() {\n\t\tsuper.onResponsivePopoverAfterClose();\n\t\tthis._showTimeView = false;\n\t\tthis._previewValues = {};\n\t}\n\n\t/**\n\t * LIFECYCLE METHODS\n\t */\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(document.body, this._handleResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(document.body, this._handleResizeBound);\n\t}\n\n\t/**\n\t * @override\n\t * @private\n\t */\n\t_togglePicker() {\n\t\tsuper._togglePicker();\n\n\t\tif (this.open) {\n\t\t\tthis._previewValues = {\n\t\t\t\t...this._previewValues,\n\t\t\t\ttimeSelectionValue: this.value || this.getValueFormat().format(UI5Date.getInstance()),\n\t\t\t};\n\t\t}\n\t}\n\n\tget _formatPattern() {\n\t\tconst hasHours = !!(this.formatPattern || \"\").match(/H/i);\n\t\tconst fallback = !this.formatPattern || !hasHours;\n\n\t\tconst localeData = getCachedLocaleDataInstance(getLocale());\n\t\treturn fallback ? localeData.getCombinedDateTimePattern(\"medium\", \"medium\", this._primaryCalendarType) : (this.formatPattern || \"\");\n\t}\n\n\tget _calendarTimestamp() {\n\t\treturn this._previewValues.calendarTimestamp ? this._previewValues.calendarTimestamp : super._calendarTimestamp;\n\t}\n\n\tget _calendarSelectedDates() {\n\t\treturn this._previewValues.calendarValue ? [this._previewValues.calendarValue] : super._calendarSelectedDates;\n\t}\n\n\tget _timeSelectionValue() {\n\t\treturn this._previewValues.timeSelectionValue ? this._previewValues.timeSelectionValue : this.value;\n\t}\n\n\tget openIconName() {\n\t\treturn \"date-time\";\n\t}\n\n\tget btnOKLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(TIMEPICKER_SUBMIT_BUTTON);\n\t}\n\n\tget btnCancelLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(TIMEPICKER_CANCEL_BUTTON);\n\t}\n\n\tget btnDateLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_PICKER_DATE_BUTTON);\n\t}\n\n\tget btnTimeLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_PICKER_TIME_BUTTON);\n\t}\n\n\tget showFooter() {\n\t\treturn true;\n\t}\n\n\tget showDateView() {\n\t\treturn this._phoneView ? !this._showTimeView : true;\n\t}\n\n\tget showTimeView() {\n\t\treturn this._phoneView ? this._showTimeView : true;\n\t}\n\n\tget _phoneView() {\n\t\treturn isPhone() || this._phoneMode;\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget roleDescription() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_DESCRIPTION);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget pickerAccessibleName() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIMEPICKER_POPOVER_ACCESSIBLE_NAME, this.ariaLabelText);\n\t}\n\n\t/**\n\t * Defines whether the dialog on mobile should have header\n\t * @private\n\t */\n\tget _shouldHideHeader() {\n\t\treturn true;\n\t}\n\n\t/**\n\t * EVENT HANDLERS\n\t */\n\n\t/**\n\t * @override\n\t */\n\tasync onSelectedDatesChange(e: CustomEvent<CalendarSelectionChangeEventDetail>) {\n\t\te.preventDefault();\n\t\t// @ts-ignore Needed for FF\n\t\tconst dateTimePickerContent = e.path ? e.path[1] : e.composedPath()[1];\n\t\tthis._previewValues = {\n\t\t\t...this._previewValues,\n\t\t\tcalendarTimestamp: e.detail.timestamp,\n\t\t\tcalendarValue: e.detail.selectedValues[0],\n\t\t\ttimeSelectionValue: dateTimePickerContent.lastChild.value,\n\t\t};\n\t\tthis._showTimeView = true;\n\n\t\tif (this.showDateView) {\n\t\t\treturn;\n\t\t}\n\n\t\tawait renderFinished();\n\t\tthis._clocks.focus();\n\t}\n\n\tonTimeSelectionChange(e: CustomEvent<TimeSelectionChangeEventDetail>) {\n\t\tthis._previewValues = {\n\t\t\t...this._previewValues,\n\t\t\ttimeSelectionValue: e.detail.value,\n\t\t};\n\t}\n\n\t/**\n\t * Handles document resize to switch between `phoneMode` and normal appearance.\n\t */\n\t_handleResize() {\n\t\tconst documentWidth = document.body.offsetWidth;\n\t\tconst toPhoneMode = documentWidth <= PHONE_MODE_BREAKPOINT;\n\t\tconst modeChange = (toPhoneMode && !this._phoneMode) || (!toPhoneMode && this._phoneMode); // XOR not allowed by lint\n\n\t\tif (modeChange) {\n\t\t\tthis._phoneMode = toPhoneMode;\n\t\t}\n\t}\n\n\tget _submitDisabled() {\n\t\treturn !this._calendarSelectedDates || !this._calendarSelectedDates.length;\n\t}\n\n\t/**\n\t * Handles clicking on the `submit` button, within the picker`s footer.\n\t */\n\t_submitClick() {\n\t\tconst selectedDate = this.getSelectedDateTime();\n\n\t\tconst value = this.getValueFormat().format(selectedDate);\n\t\tif (this.value !== value) {\n\t\t\tthis._updateValueAndFireEvents(value, true, [\"change\", \"value-changed\"]);\n\t\t}\n\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * Handles clicking on the `cancel` button, within the picker`s footer,\n\t * that would disregard the user selection.\n\t */\n\t_cancelClick() {\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * Handles the date/time switch available in `phoneMode` to switch\n\t * between the date and time views.\n\t * @param e\n\t */\n\t_dateTimeSwitchChange(e: CustomEvent<SegmentedButtonSelectionChangeEventDetail>) { // Note: fix when SegmentedButton is implemented in TS\n\t\tconst selectedItem = e.detail.selectedItems[0];\n\t\tthis._showTimeView = selectedItem.getAttribute(\"data-ui5-key\") === \"Time\";\n\t}\n\n\t/**\n\t * @override\n\t */\n\t_modifyDateValue(amount: number, unit: string, preserveDate: boolean) {\n\t\tif (!this.dateValue) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst modifiedDate = modifyDateBy(CalendarDate.fromLocalJSDate(this.dateValue), amount, unit, preserveDate, this._minDate, this._maxDate);\n\t\tconst modifiedLocalDate = modifiedDate.toLocalJSDate();\n\t\tmodifiedLocalDate.setHours(this.dateValue.getHours());\n\t\tmodifiedLocalDate.setMinutes(this.dateValue.getMinutes());\n\t\tmodifiedLocalDate.setSeconds(this.dateValue.getSeconds());\n\n\t\tconst newValue = this.formatValue(modifiedLocalDate);\n\t\tthis._updateValueAndFireEvents(newValue, true, [\"change\", \"value-changed\"]);\n\t}\n\n\t/**\n\t * Checks if the provided value is valid and within valid range.\n\t * @override\n\t * @param value\n\t */\n\t_checkValueValidity(value: string): boolean {\n\t\tif (value === \"\") {\n\t\t\treturn true;\n\t\t}\n\t\treturn this.isValidValue(value);\n\t}\n\n\tgetSelectedDateTime() {\n\t\tconst selectedDate = this.getValueFormat().parse(this._calendarSelectedDates[0]) as Date;\n\t\tconst selectedTime = this.getValueFormat().parse(this._timeSelectionValue) as Date;\n\t\tif (selectedTime) {\n\t\t\tselectedDate.setHours(selectedTime.getHours());\n\t\t\tselectedDate.setMinutes(selectedTime.getMinutes());\n\t\t\tselectedDate.setSeconds(selectedTime.getSeconds());\n\t\t}\n\n\t\treturn selectedDate;\n\t}\n\n\tgetFormat() {\n\t\treturn this._isPattern\n\t\t\t? DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: this._formatPattern,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t})\n\t\t\t: DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tstyle: this._formatPattern,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t}\n\n\tgetDisplayFormat() {\n\t\treturn this._isDisplayFormatPattern\n\t\t\t? DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: this._displayFormat,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t})\n\t\t\t: DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tstyle: this._displayFormat,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t}\n\n\tgetValueFormat() {\n\t\tif (!this._valueFormat) {\n\t\t\treturn this.getISOFormat();\n\t\t}\n\n\t\treturn this._isValueFormatPattern\n\t\t\t? DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: this._valueFormat,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t})\n\t\t\t: DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tstyle: this._valueFormat,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t}\n\n\tgetISOFormat() {\n\t\tif (!this._isoFormatInstance) {\n\t\t\tthis._isoFormatInstance = DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: \"YYYY-MM-dd hh:mm:ss\",\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t\t}\n\t\treturn this._isoFormatInstance;\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget _calendarPickersMode() {\n\t\treturn CalendarPickersMode.DAY_MONTH_YEAR;\n\t}\n}\n\nDateTimePicker.define();\n\nexport default DateTimePicker;\nexport type {\n\tDateTimePickerChangeEventDetail,\n\tDateTimePickerInputEventDetail,\n};\n"]}
+{"version":3,"file":"DateTimePicker.js","sourceRoot":"","sources":["../src/DateTimePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport getLocale from \"@ui5/webcomponents-base/dist/locale/getLocale.js\";\nimport getCachedLocaleDataInstance from \"@ui5/webcomponents-localization/dist/getCachedLocaleDataInstance.js\";\nimport modifyDateBy from \"@ui5/webcomponents-localization/dist/dates/modifyDateBy.js\";\nimport CalendarDate from \"@ui5/webcomponents-localization/dist/dates/CalendarDate.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport \"@ui5/webcomponents-icons/dist/date-time.js\";\nimport UI5Date from \"@ui5/webcomponents-localization/dist/dates/UI5Date.js\";\nimport DateFormat from \"@ui5/webcomponents-localization/dist/DateFormat.js\";\nimport type { SegmentedButtonSelectionChangeEventDetail } from \"./SegmentedButton.js\";\nimport type { CalendarSelectionChangeEventDetail } from \"./Calendar.js\";\nimport DatePicker from \"./DatePicker.js\";\nimport { isPhone } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type {\n\tDatePickerChangeEventDetail as DateTimePickerChangeEventDetail,\n\tDatePickerInputEventDetail as DateTimePickerInputEventDetail,\n} from \"./DatePicker.js\";\nimport type { TimeSelectionChangeEventDetail } from \"./TimePickerInternals.js\";\n\n// i18n texts\nimport {\n\tTIMEPICKER_SUBMIT_BUTTON,\n\tTIMEPICKER_CANCEL_BUTTON,\n\tDATETIME_DESCRIPTION,\n\tDATETIME_PICKER_DATE_BUTTON,\n\tDATETIME_PICKER_TIME_BUTTON,\n\tDATETIMEPICKER_POPOVER_ACCESSIBLE_NAME,\n\tDATETIME_VALUE_MISSING,\n\tDATETIME_PATTERN_MISMATCH,\n\tDATETIME_RANGEUNDERFLOW,\n\tDATETIME_RANGEOVERFLOW,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport DateTimePickerTemplate from \"./DateTimePickerTemplate.js\";\n\n// Styles\nimport DateTimePickerCss from \"./generated/themes/DateTimePicker.css.js\";\nimport DateTimePickerPopoverCss from \"./generated/themes/DateTimePickerPopover.css.js\";\nimport CalendarPickersMode from \"./types/CalendarPickersMode.js\";\nimport type TimeSelectionClocks from \"./TimeSelectionClocks.js\";\nimport query from \"@ui5/webcomponents-base/dist/decorators/query.js\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\n\nconst PHONE_MODE_BREAKPOINT = 640; // px\n\ntype PreviewValues = {\n\ttimeSelectionValue?: string,\n\tcalendarTimestamp?: number,\n\tcalendarValue?: string,\n}\n\n/**\n * @class\n *\n * ### Overview\n * The `DateTimePicker` component alows users to select both date (day, month and year) and time (hours, minutes and seconds)\n * and for the purpose it consists of input field and Date/Time picker.\n *\n * ### Usage\n *\n * Use the `DateTimePicker` if you need a combined date and time input component.\n * Don't use it if you want to use either date, or time value.\n * In this case, use the `DatePicker` or the `TimePicker` components instead.\n *\n * The user can set date/time by:\n *\n * - using the calendar and the time selectors\n * - typing in the input field\n *\n * Programmatically, to set date/time for the `DateTimePicker`, use the `value` property\n *\n * ### Formatting\n *\n * The value entered by typing into the input field must fit to the used date/time format.\n *\n * Supported format options are pattern-based on Unicode LDML Date Format notation.\n * For more information, see [UTS #35: Unicode Locale Data Markup Language](https://unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table).\n *\n * **Example:** the following format `dd/MM/yyyy, hh:mm:ss aa`\n * corresponds the `13/04/2020, 03:16:16 AM` value.\n *\n * The small 'h' defines \"12\" hours format and the \"aa\" symbols - \"AM/PM\" time periods.\n *\n * **Example:** the following format `dd/MM/yyyy, HH:mm:ss`\n * corresponds the `13/04/2020, 15:16:16` value.\n *\n * The capital 'H' indicates \"24\" hours format.\n *\n * **Note:** If the `formatPattern` does NOT include time,\n * the `DateTimePicker` will fallback to the default time format according to the locale.\n *\n * **Note:** If no placeholder is set to the `DateTimePicker`,\n * the current `formatPattern` is displayed as a placeholder.\n * If another placeholder is needed, it must be set or in case no placeholder is needed - it can be set to an empty string.\n *\n * **Note:** If the user input does NOT match the `formatPattern`,\n * the `DateTimePicker` makes an attempt to parse it based on the\n * locale settings.\n *\n * ### Responsive behavior\n *\n * The `DateTimePicker` is responsive and fully adapts to all devices.\n * For larger screens, such as tablet or desktop, it is displayed as a popover, while\n * on phone devices, it is displayed full screen.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/DateTimePicker.js\";`\n * @constructor\n * @extends DatePicker\n * @since 1.0.0-rc.7\n * @public\n */\n@customElement({\n\ttag: \"ui5-datetime-picker\",\n\ttemplate: DateTimePickerTemplate,\n\tstyles: [\n\t\tDatePicker.styles,\n\t\tDateTimePickerCss,\n\t\tDateTimePickerPopoverCss,\n\t],\n})\nclass DateTimePicker extends DatePicker implements IFormInputElement {\n\t/**\n\t * Defines the visibility of the time view in `phoneMode`.\n\t * For more information, see the `phoneMode` property.\n\t *\n\t * **Note:** The date view would be displayed by default.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean, noAttribute: true })\n\t_showTimeView = false\n\n\t/**\n\t * Defines if the `DateTimePicker` should be displayed in phone mode.\n\t * The phone mode turns on when the component is used on small screens or phone devices.\n\t * In phone mode the user can see either the calendar view, or the time view\n\t * and can switch between the views via toggle buttons.\n\t * @default false\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_phoneMode = false;\n\n\t/**\n\t * Selected, but not yet confirmed date/time\n\t * @private\n\t */\n\t@property({ type: Object })\n\t_previewValues: PreviewValues = {};\n\n\t/**\n\t * Stores the last valid value to preserve time when entering invalid values\n\t * @private\n\t */\n\t@property()\n\t_lastValidValue: string = \"\";\n\n\t@query(\"[ui5-time-selection-clocks]\")\n\t_clocks!: TimeSelectionClocks;\n\n\t_handleResizeBound: ResizeObserverCallback;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._handleResizeBound = this._handleResize.bind(this);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tonResponsivePopoverAfterClose() {\n\t\tsuper.onResponsivePopoverAfterClose();\n\t\tthis._showTimeView = false;\n\t\tthis._previewValues = {};\n\t}\n\n\t/**\n\t * LIFECYCLE METHODS\n\t */\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(document.body, this._handleResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(document.body, this._handleResizeBound);\n\t}\n\n\t/**\n\t * @override\n\t * @private\n\t */\n\t_togglePicker() {\n\t\tsuper._togglePicker();\n\n\t\tif (this.open) {\n\t\t\tlet timeSelectionValue = this.value;\n\n\t\t\t// If current value is invalid, use the last valid value for time selection\n\t\t\tif (!timeSelectionValue || !this.isValidValue(timeSelectionValue)) {\n\t\t\t\ttimeSelectionValue = this._lastValidValue || this.getValueFormat().format(UI5Date.getInstance());\n\t\t\t}\n\n\t\t\tthis._previewValues = {\n\t\t\t\t...this._previewValues,\n\t\t\t\ttimeSelectionValue,\n\t\t\t};\n\t\t}\n\t}\n\n\tget formValidityMessage() {\n\t\tconst validity = this.formValidity;\n\n\t\tif (validity.valueMissing) {\n\t\t\t// @ts-ignore oFormatOptions is a private API of DateFormat\n\t\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_VALUE_MISSING, this.getFormat().oFormatOptions.pattern as string);\n\t\t}\n\t\tif (validity.patternMismatch) {\n\t\t\t// @ts-ignore oFormatOptions is a private API of DateFormat\n\t\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_PATTERN_MISMATCH, this.getFormat().oFormatOptions.pattern as string);\n\t\t}\n\t\tif (validity.rangeUnderflow) {\n\t\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_RANGEUNDERFLOW, this.minDate);\n\t\t}\n\t\tif (validity.rangeOverflow) {\n\t\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_RANGEOVERFLOW, this.maxDate);\n\t\t}\n\n\t\treturn \"\";\n\t}\n\n\tget formValidity(): ValidityStateFlags {\n\t\treturn {\n\t\t\tvalueMissing: this.required && !this.value,\n\t\t\tpatternMismatch: !this.isValidValue(this.value),\n\t\t\trangeUnderflow: !this.isValidMin(this.value),\n\t\t\trangeOverflow: !this.isValidMax(this.value),\n\t\t};\n\t}\n\n\tget _formatPattern() {\n\t\tconst hasHours = !!(this.formatPattern || \"\").match(/H/i);\n\t\tconst fallback = !this.formatPattern || !hasHours;\n\n\t\tconst localeData = getCachedLocaleDataInstance(getLocale());\n\t\treturn fallback ? localeData.getCombinedDateTimePattern(\"medium\", \"medium\", this._primaryCalendarType) : (this.formatPattern || \"\");\n\t}\n\n\tget _calendarTimestamp() {\n\t\treturn this._previewValues.calendarTimestamp ? this._previewValues.calendarTimestamp : super._calendarTimestamp;\n\t}\n\n\tget _calendarSelectedDates() {\n\t\treturn this._previewValues.calendarValue ? [this._previewValues.calendarValue] : super._calendarSelectedDates;\n\t}\n\n\tget _timeSelectionValue() {\n\t\treturn this._previewValues.timeSelectionValue ? this._previewValues.timeSelectionValue : this.value;\n\t}\n\n\tget openIconName() {\n\t\treturn \"date-time\";\n\t}\n\n\tget btnOKLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(TIMEPICKER_SUBMIT_BUTTON);\n\t}\n\n\tget btnCancelLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(TIMEPICKER_CANCEL_BUTTON);\n\t}\n\n\tget btnDateLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_PICKER_DATE_BUTTON);\n\t}\n\n\tget btnTimeLabel() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_PICKER_TIME_BUTTON);\n\t}\n\n\tget showFooter() {\n\t\treturn true;\n\t}\n\n\tget showDateView() {\n\t\treturn this._phoneView ? !this._showTimeView : true;\n\t}\n\n\tget showTimeView() {\n\t\treturn this._phoneView ? this._showTimeView : true;\n\t}\n\n\tget _phoneView() {\n\t\treturn isPhone() || this._phoneMode;\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget roleDescription() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIME_DESCRIPTION);\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget pickerAccessibleName() {\n\t\treturn DateTimePicker.i18nBundle.getText(DATETIMEPICKER_POPOVER_ACCESSIBLE_NAME, this.ariaLabelText);\n\t}\n\n\t/**\n\t * Defines whether the dialog on mobile should have header\n\t * @private\n\t */\n\tget _shouldHideHeader() {\n\t\treturn true;\n\t}\n\n\t/**\n\t * EVENT HANDLERS\n\t */\n\n\t/**\n\t * @override\n\t */\n\tasync onSelectedDatesChange(e: CustomEvent<CalendarSelectionChangeEventDetail>) {\n\t\te.preventDefault();\n\n\t\t// Try to get the current time value from the time picker,\n\t\t// but fallback to last valid value if current picker time is empty or invalid\n\t\tlet timeValue = this._clocks?.value || \"\";\n\t\tif (!timeValue || !this.isValidValue(timeValue)) {\n\t\t\ttimeValue = this._lastValidValue || this.getValueFormat().format(UI5Date.getInstance());\n\t\t}\n\n\t\tthis._previewValues = {\n\t\t\t...this._previewValues,\n\t\t\tcalendarTimestamp: e.detail.timestamp,\n\t\t\tcalendarValue: e.detail.selectedValues[0],\n\t\t\ttimeSelectionValue: timeValue,\n\t\t};\n\t\tthis._showTimeView = true;\n\n\t\tif (this.showDateView) {\n\t\t\treturn;\n\t\t}\n\n\t\tawait renderFinished();\n\t\tthis._clocks.focus();\n\t}\n\n\tonTimeSelectionChange(e: CustomEvent<TimeSelectionChangeEventDetail>) {\n\t\tthis._previewValues = {\n\t\t\t...this._previewValues,\n\t\t\ttimeSelectionValue: e.detail.value,\n\t\t};\n\t}\n\n\t/**\n\t * Handles document resize to switch between `phoneMode` and normal appearance.\n\t */\n\t_handleResize() {\n\t\tconst documentWidth = document.body.offsetWidth;\n\t\tconst toPhoneMode = documentWidth <= PHONE_MODE_BREAKPOINT;\n\t\tconst modeChange = (toPhoneMode && !this._phoneMode) || (!toPhoneMode && this._phoneMode); // XOR not allowed by lint\n\n\t\tif (modeChange) {\n\t\t\tthis._phoneMode = toPhoneMode;\n\t\t}\n\t}\n\n\tget _submitDisabled() {\n\t\treturn !this._calendarSelectedDates || !this._calendarSelectedDates.length;\n\t}\n\n\t/**\n\t * Handles clicking on the `submit` button, within the picker`s footer.\n\t */\n\t_submitClick() {\n\t\tconst selectedDate = this.getSelectedDateTime();\n\n\t\tconst value = this.getValueFormat().format(selectedDate);\n\t\tif (this.value !== value) {\n\t\t\tthis._updateValueAndFireEvents(value, true, [\"change\", \"value-changed\"]);\n\t\t}\n\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * Handles clicking on the `cancel` button, within the picker`s footer,\n\t * that would disregard the user selection.\n\t */\n\t_cancelClick() {\n\t\tthis._togglePicker();\n\t}\n\n\t/**\n\t * Handles the date/time switch available in `phoneMode` to switch\n\t * between the date and time views.\n\t * @param e\n\t */\n\t_dateTimeSwitchChange(e: CustomEvent<SegmentedButtonSelectionChangeEventDetail>) { // Note: fix when SegmentedButton is implemented in TS\n\t\tconst selectedItem = e.detail.selectedItems[0];\n\t\tthis._showTimeView = selectedItem.getAttribute(\"data-ui5-key\") === \"Time\";\n\t}\n\n\t/**\n\t * @override\n\t */\n\t_modifyDateValue(amount: number, unit: string, preserveDate: boolean) {\n\t\tif (!this.dateValue) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst modifiedDate = modifyDateBy(CalendarDate.fromLocalJSDate(this.dateValue), amount, unit, preserveDate, this._minDate, this._maxDate);\n\t\tconst modifiedLocalDate = modifiedDate.toLocalJSDate();\n\t\tmodifiedLocalDate.setHours(this.dateValue.getHours());\n\t\tmodifiedLocalDate.setMinutes(this.dateValue.getMinutes());\n\t\tmodifiedLocalDate.setSeconds(this.dateValue.getSeconds());\n\n\t\tconst newValue = this.formatValue(modifiedLocalDate);\n\t\tthis._updateValueAndFireEvents(newValue, true, [\"change\", \"value-changed\"]);\n\t}\n\n\t/**\n\t * @override\n\t */\n\t_updateValueAndFireEvents(value: string, normalizeValue: boolean, events: Array<\"change\" | \"value-changed\" | \"input\">, updateValue = true) {\n\t\tsuper._updateValueAndFireEvents(value, normalizeValue, events, updateValue);\n\n\t\t// Always store the current value if it's valid (handles both updates and initial values)\n\t\tif (this.value && this.isValidValue(this.value)) {\n\t\t\tthis._lastValidValue = this.value;\n\t\t}\n\t}\n\n\t/**\n\t * Checks if the provided value is valid and within valid range.\n\t * @override\n\t * @param value\n\t */\n\t_checkValueValidity(value: string): boolean {\n\t\tif (value === \"\") {\n\t\t\treturn true;\n\t\t}\n\t\treturn this.isValidValue(value);\n\t}\n\n\tgetSelectedDateTime() {\n\t\tconst selectedDate = this.getValueFormat().parse(this._calendarSelectedDates[0]) as Date;\n\t\tconst selectedTime = this.getValueFormat().parse(this._timeSelectionValue) as Date;\n\t\tif (selectedTime) {\n\t\t\tselectedDate.setHours(selectedTime.getHours());\n\t\t\tselectedDate.setMinutes(selectedTime.getMinutes());\n\t\t\tselectedDate.setSeconds(selectedTime.getSeconds());\n\t\t}\n\n\t\treturn selectedDate;\n\t}\n\n\tgetFormat() {\n\t\treturn this._isPattern\n\t\t\t? DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: this._formatPattern,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t})\n\t\t\t: DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tstyle: this._formatPattern,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t}\n\n\tgetDisplayFormat() {\n\t\treturn this._isDisplayFormatPattern\n\t\t\t? DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: this._displayFormat,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t})\n\t\t\t: DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tstyle: this._displayFormat,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t}\n\n\tgetValueFormat() {\n\t\tif (!this._valueFormat) {\n\t\t\treturn this.getISOFormat();\n\t\t}\n\n\t\treturn this._isValueFormatPattern\n\t\t\t? DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: this._valueFormat,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t})\n\t\t\t: DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tstyle: this._valueFormat,\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t}\n\n\tgetISOFormat() {\n\t\tif (!this._isoFormatInstance) {\n\t\t\tthis._isoFormatInstance = DateFormat.getDateTimeInstance({\n\t\t\t\tstrictParsing: true,\n\t\t\t\tpattern: \"YYYY-MM-dd hh:mm:ss\",\n\t\t\t\tcalendarType: this._primaryCalendarType,\n\t\t\t});\n\t\t}\n\t\treturn this._isoFormatInstance;\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget _calendarPickersMode() {\n\t\treturn CalendarPickersMode.DAY_MONTH_YEAR;\n\t}\n}\n\nDateTimePicker.define();\n\nexport default DateTimePicker;\nexport type {\n\tDateTimePickerChangeEventDetail,\n\tDateTimePickerInputEventDetail,\n};\n"]}

package/dist/DayPickerTemplate.js

@@ -6,7 +6,7 @@ export default function DayPickerTemplate() {
         }, style: {
             "justify-content": "center",
             display: this._hidden ? "none" : "flex",
-        }, onKeyDown: this._onkeydown, onKeyUp: this._onkeyup, onClick: this._onclick, onMouseOver: this._onmouseover, onFocusIn: this._onfocusin, onFocusOut: this._onfocusout, children: _jsxs("div", { id: `${this._id}-content`, class: "ui5-dp-content", role: "grid", "aria-roledescription": this.ariaRoledescription, children: [_jsx("div", { role: "row", class: "ui5-dp-days-names-container", children: this._dayNames.map(day => _jsx("div", { role: "columnheader", "aria-label": day.name, class: day.classes, children: day.ultraShortName })) }), this._weeks.map(week => {
+        }, onKeyDown: this._onkeydown, onKeyUp: this._onkeyup, onClick: this._onclick, onMouseOver: this._onmouseover, children: _jsxs("div", { id: `${this._id}-content`, class: "ui5-dp-content", role: "grid", "aria-roledescription": this.ariaRoledescription, children: [_jsx("div", { role: "row", class: "ui5-dp-days-names-container", children: this._dayNames.map(day => _jsx("div", { role: "columnheader", "aria-label": day.name, class: day.classes, children: day.ultraShortName })) }), this._weeks.map(week => {
                     return week.length > 0 ?
                         _jsx("div", { class: "ui5-dp-weeks-row", role: "row", children: week.map(day => {
                                 return "timestamp" in day ?

package/dist/DayPickerTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"DayPickerTemplate.js","sourceRoot":"","sources":["../src/DayPickerTemplate.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,iBAAiB;IACxC,OAAO,CACN,cACC,KAAK,EAAE;YACN,aAAa,EAAE,IAAI;YACnB,yBAAyB,EAAE,IAAI,CAAC,wBAAwB;SACxD,EACD,KAAK,EAAE;YACN,iBAAiB,EAAE,QAAQ;YAC3B,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;SACvC,EACD,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,YAE5B,eAAK,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,UAAU,EAAE,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,MAAM,0BAAuB,IAAI,CAAC,mBAAmB,aAChH,cAAK,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,6BAA6B,YACjD,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CACzB,cACC,IAAI,EAAC,cAAc,gBACP,GAAG,CAAC,IAAI,EACpB,KAAK,EAAE,GAAG,CAAC,OAAO,YAEjB,GAAG,CAAC,cAAc,GACd,CACN,GACI,EAEL,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;oBACtB,OAAO,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;wBACxB,cAAK,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,KAAK,YACtC,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;gCACf,OAAO,WAAW,IAAI,GAAG,CAAC,CAAC;oCAC1B,uCACuB,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACrD,QAAQ,EAAE,GAAG,CAAC,SAAS,wBACH,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,wBACjC,GAAG,CAAC,SAAS,EACjC,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,GAAG,CAAC,OAAO,mBACH,GAAG,CAAC,YAAY,gBACnB,GAAG,CAAC,SAAS,mBACV,GAAG,CAAC,YAAY,EAC/B,KAAK,EAAE,GAAG,CAAC,OAAO,EAClB,IAAI,EAAE,GAAG,CAAC,KAAK,aACf,eACC,KAAK,EAAC,gBAAgB,wBACF,GAAG,CAAC,SAAS,YAEhC,GAAG,CAAC,GAAG,GACF,EACN,GAAG,CAAC,wBAAwB;gDAC1B,eAAM,KAAK,EAAC,kCAAkC,YAC5C,GAAG,CAAC,SAAS,GACR,EAET,GAAG,CAAC,IAAI;gDACN,cAAK,KAAK,EAAE,qBAAqB,GAAG,CAAC,IAAI,EAAE,GAAQ,IAEjD;oCACN,CAAC;wCACD,CAAC,GAAG,CAAC,QAAQ,IAAI,CAChB,cACC,SAAS,EAAC,2BAA2B,EACrC,IAAI,EAAC,WAAW,gBACJ,iBAAiB,GAAG,CAAC,OAAO,EAAE,YAE1C,eAAM,SAAS,EAAC,iBAAiB,YAAE,GAAG,CAAC,OAAO,GAAQ,GACjD,CACN,CAAC;4BACJ,CAAC,CAAC,GACG;wBACN,CAAC;4BACD,cAAK,KAAK,EAAC,mBAAmB,GAAO,CAAC;gBACxC,CAAC,CAAC,IACG,GACD,CAAC,CAAC;AACV,CAAC","sourcesContent":["import type DayPicker from \"./DayPicker.js\";\n\nexport default function DayPickerTemplate(this: DayPicker) {\n\treturn (\n\t\t<div\n\t\t\tclass={{\n\t\t\t\t\"ui5-dp-root\": true,\n\t\t\t\t\"ui5-dp-twocalendartypes\": this.hasSecondaryCalendarType,\n\t\t\t}}\n\t\t\tstyle={{\n\t\t\t\t\"justify-content\": \"center\",\n\t\t\t\tdisplay: this._hidden ? \"none\" : \"flex\",\n\t\t\t}}\n\t\t\tonKeyDown={this._onkeydown}\n\t\t\tonKeyUp={this._onkeyup}\n\t\t\tonClick={this._onclick}\n\t\t\tonMouseOver={this._onmouseover}\n\t\t\tonFocusIn={this._onfocusin}\n\t\t\tonFocusOut={this._onfocusout}\n\t\t>\n\t\t\t<div id={`${this._id}-content`} class=\"ui5-dp-content\" role=\"grid\" aria-roledescription={this.ariaRoledescription}>\n\t\t\t\t<div role=\"row\" class=\"ui5-dp-days-names-container\">\n\t\t\t\t\t{this._dayNames.map(day =>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\trole=\"columnheader\"\n\t\t\t\t\t\t\taria-label={day.name}\n\t\t\t\t\t\t\tclass={day.classes}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{day.ultraShortName}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t{this._weeks.map(week => {\n\t\t\t\t\t return week.length > 0 ?\n\t\t\t\t\t\t<div class=\"ui5-dp-weeks-row\" role=\"row\">\n\t\t\t\t\t\t\t{week.map(day => {\n\t\t\t\t\t\t\t\treturn \"timestamp\" in day ?\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tdata-ui5-special-day={day.type ? day.type : undefined}\n\t\t\t\t\t\t\t\t\t\ttabindex={day._tabIndex}\n\t\t\t\t\t\t\t\t\t\tdata-sap-focus-ref={day.focusRef ? \"true\" : undefined}\n\t\t\t\t\t\t\t\t\t\tdata-sap-timestamp={day.timestamp}\n\t\t\t\t\t\t\t\t\t\trole=\"gridcell\"\n\t\t\t\t\t\t\t\t\t\ttitle={day.tooltip}\n\t\t\t\t\t\t\t\t\t\taria-selected={day.ariaSelected}\n\t\t\t\t\t\t\t\t\t\taria-label={day.ariaLabel}\n\t\t\t\t\t\t\t\t\t\taria-disabled={day.ariaDisabled}\n\t\t\t\t\t\t\t\t\t\tclass={day.classes}\n\t\t\t\t\t\t\t\t\t\tpart={day.parts}>\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"ui5-dp-daytext\"\n\t\t\t\t\t\t\t\t\t\t\tdata-sap-timestamp={day.timestamp}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{day.day}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t{day._isSecondaryCalendarType &&\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"ui5-dp-daytext ui5-dp-daysectext\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{day.secondDay}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t{day.type &&\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class={`ui5-dp-specialday ${day.type}`}></div>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t:\n\t\t\t\t\t\t\t\t\t!day.isHidden && (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"ui5-dp-weekname-container\"\n\t\t\t\t\t\t\t\t\t\t\trole=\"rowheader\"\n\t\t\t\t\t\t\t\t\t\t\taria-label={`Calendar Week ${day.weekNum}`}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"ui5-dp-weekname\">{day.weekNum}</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t:\n\t\t\t\t\t\t<div class=\"ui5-dp-empty-week\"></div>;\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>);\n}\n"]}
+{"version":3,"file":"DayPickerTemplate.js","sourceRoot":"","sources":["../src/DayPickerTemplate.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,iBAAiB;IACxC,OAAO,CACN,cACC,KAAK,EAAE;YACN,aAAa,EAAE,IAAI;YACnB,yBAAyB,EAAE,IAAI,CAAC,wBAAwB;SACxD,EACD,KAAK,EAAE;YACN,iBAAiB,EAAE,QAAQ;YAC3B,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;SACvC,EACD,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,WAAW,EAAE,IAAI,CAAC,YAAY,YAE9B,eAAK,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,UAAU,EAAE,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,MAAM,0BAAuB,IAAI,CAAC,mBAAmB,aAChH,cAAK,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,6BAA6B,YACjD,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CACzB,cACC,IAAI,EAAC,cAAc,gBACP,GAAG,CAAC,IAAI,EACpB,KAAK,EAAE,GAAG,CAAC,OAAO,YAEjB,GAAG,CAAC,cAAc,GACd,CACN,GACI,EAEL,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;oBACtB,OAAO,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;wBACxB,cAAK,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,KAAK,YACtC,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;gCACf,OAAO,WAAW,IAAI,GAAG,CAAC,CAAC;oCAC1B,uCACuB,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACrD,QAAQ,EAAE,GAAG,CAAC,SAAS,wBACH,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,wBACjC,GAAG,CAAC,SAAS,EACjC,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,GAAG,CAAC,OAAO,mBACH,GAAG,CAAC,YAAY,gBACnB,GAAG,CAAC,SAAS,mBACV,GAAG,CAAC,YAAY,EAC/B,KAAK,EAAE,GAAG,CAAC,OAAO,EAClB,IAAI,EAAE,GAAG,CAAC,KAAK,aACf,eACC,KAAK,EAAC,gBAAgB,wBACF,GAAG,CAAC,SAAS,YAEhC,GAAG,CAAC,GAAG,GACF,EACN,GAAG,CAAC,wBAAwB;gDAC1B,eAAM,KAAK,EAAC,kCAAkC,YAC5C,GAAG,CAAC,SAAS,GACR,EAET,GAAG,CAAC,IAAI;gDACN,cAAK,KAAK,EAAE,qBAAqB,GAAG,CAAC,IAAI,EAAE,GAAQ,IAEjD;oCACN,CAAC;wCACD,CAAC,GAAG,CAAC,QAAQ,IAAI,CAChB,cACC,SAAS,EAAC,2BAA2B,EACrC,IAAI,EAAC,WAAW,gBACJ,iBAAiB,GAAG,CAAC,OAAO,EAAE,YAE1C,eAAM,SAAS,EAAC,iBAAiB,YAAE,GAAG,CAAC,OAAO,GAAQ,GACjD,CACN,CAAC;4BACJ,CAAC,CAAC,GACG;wBACN,CAAC;4BACD,cAAK,KAAK,EAAC,mBAAmB,GAAO,CAAC;gBACxC,CAAC,CAAC,IACG,GACD,CAAC,CAAC;AACV,CAAC","sourcesContent":["import type DayPicker from \"./DayPicker.js\";\n\nexport default function DayPickerTemplate(this: DayPicker) {\n\treturn (\n\t\t<div\n\t\t\tclass={{\n\t\t\t\t\"ui5-dp-root\": true,\n\t\t\t\t\"ui5-dp-twocalendartypes\": this.hasSecondaryCalendarType,\n\t\t\t}}\n\t\t\tstyle={{\n\t\t\t\t\"justify-content\": \"center\",\n\t\t\t\tdisplay: this._hidden ? \"none\" : \"flex\",\n\t\t\t}}\n\t\t\tonKeyDown={this._onkeydown}\n\t\t\tonKeyUp={this._onkeyup}\n\t\t\tonClick={this._onclick}\n\t\t\tonMouseOver={this._onmouseover}\n\t\t>\n\t\t\t<div id={`${this._id}-content`} class=\"ui5-dp-content\" role=\"grid\" aria-roledescription={this.ariaRoledescription}>\n\t\t\t\t<div role=\"row\" class=\"ui5-dp-days-names-container\">\n\t\t\t\t\t{this._dayNames.map(day =>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\trole=\"columnheader\"\n\t\t\t\t\t\t\taria-label={day.name}\n\t\t\t\t\t\t\tclass={day.classes}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{day.ultraShortName}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t{this._weeks.map(week => {\n\t\t\t\t\t return week.length > 0 ?\n\t\t\t\t\t\t<div class=\"ui5-dp-weeks-row\" role=\"row\">\n\t\t\t\t\t\t\t{week.map(day => {\n\t\t\t\t\t\t\t\treturn \"timestamp\" in day ?\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tdata-ui5-special-day={day.type ? day.type : undefined}\n\t\t\t\t\t\t\t\t\t\ttabindex={day._tabIndex}\n\t\t\t\t\t\t\t\t\t\tdata-sap-focus-ref={day.focusRef ? \"true\" : undefined}\n\t\t\t\t\t\t\t\t\t\tdata-sap-timestamp={day.timestamp}\n\t\t\t\t\t\t\t\t\t\trole=\"gridcell\"\n\t\t\t\t\t\t\t\t\t\ttitle={day.tooltip}\n\t\t\t\t\t\t\t\t\t\taria-selected={day.ariaSelected}\n\t\t\t\t\t\t\t\t\t\taria-label={day.ariaLabel}\n\t\t\t\t\t\t\t\t\t\taria-disabled={day.ariaDisabled}\n\t\t\t\t\t\t\t\t\t\tclass={day.classes}\n\t\t\t\t\t\t\t\t\t\tpart={day.parts}>\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"ui5-dp-daytext\"\n\t\t\t\t\t\t\t\t\t\t\tdata-sap-timestamp={day.timestamp}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{day.day}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t{day._isSecondaryCalendarType &&\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"ui5-dp-daytext ui5-dp-daysectext\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{day.secondDay}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t{day.type &&\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class={`ui5-dp-specialday ${day.type}`}></div>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t:\n\t\t\t\t\t\t\t\t\t!day.isHidden && (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"ui5-dp-weekname-container\"\n\t\t\t\t\t\t\t\t\t\t\trole=\"rowheader\"\n\t\t\t\t\t\t\t\t\t\t\taria-label={`Calendar Week ${day.weekNum}`}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"ui5-dp-weekname\">{day.weekNum}</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t:\n\t\t\t\t\t\t<div class=\"ui5-dp-empty-week\"></div>;\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>);\n}\n"]}

package/dist/DynamicDateRange.d.ts

@@ -1,6 +1,6 @@
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
-import type { JsxTemplate } from "@ui5/webcomponents-base";
+import type { JsxTemplate } from "@ui5/webcomponents-base/dist/index.js";
 import IconMode from "./types/IconMode.js";
 import type Input from "./Input.js";
 import type List from "./List.js";
@@ -50,9 +50,10 @@ interface IDynamicDateRangeOption {
     format: (value: DynamicDateRangeValue) => string;
     parse: (value: string) => DynamicDateRangeValue | undefined;
     toDates: (value: DynamicDateRangeValue) => Array<Date>;
-    handleSelectionChange?: (event: CustomEvent) => DynamicDateRangeValue | undefined;
+    handleSelectionChange?: (event: CustomEvent, value: DynamicDateRangeValue | undefined) => DynamicDateRangeValue | undefined;
     template?: JsxTemplate;
     isValidString: (value: string) => boolean;
+    resetState?: () => void;
 }
 /**
  * @class
@@ -78,6 +79,9 @@ interface IDynamicDateRangeOption {
  * - "TOMORROW" - Represents the next date. An example value is `{ operator: "TOMORROW"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Tomorrow.js";`
  * - "DATE" - Represents a single date. An example value is `{ operator: "DATE", values: [new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/SingleDate.js";`
  * - "DATERANGE" - Represents a range of dates. An example value is `{ operator: "DATERANGE", values: [new Date(), new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/DateRange.js";`
+ * - "DATETIMERANGE" - Represents a range of dates with times. An example value is `{ operator: "DATETIMERANGE", values: [new Date(), new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/DateTimeRange.js";`
+ * - "FROMDATETIME" - Represents a range from date and time. An example value is `{ operator: "FROMDATETIME", values: [new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/FromDateTime.js";`
+ * - "TODATETIME" - Represents a range to date and time. An example value is `{ operator: "TODATETIME", values: [new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/ToDateTime.js";`
  * - "LASTDAYS" - Represents Last X Days from today. An example value is `{ operator: "LASTDAYS", values: [2]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js";`
  * - "LASTWEEKS" - Represents Last X Weeks from today. An example value is `{ operator: "LASTWEEKS", values: [3]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js";`
  * - "LASTMONTHS" - Represents Last X Months from today. An example value is `{ operator: "LASTMONTHS", values: [6]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js";`
@@ -123,18 +127,21 @@ declare class DynamicDateRange extends UI5Element {
      */
     open: boolean;
     _currentOption?: IDynamicDateRangeOption;
+    _lastSelectedOption?: IDynamicDateRangeOption;
     currentValue?: DynamicDateRangeValue;
     optionsObjects: Array<IDynamicDateRangeOption>;
     static optionsClasses: Map<string, new (operators?: Array<string>) => IDynamicDateRangeOption>;
     _input?: Input;
     _list?: List;
     onBeforeRendering(): void;
+    onAfterRendering(): Promise<void>;
     /**
      * Creates and normalizes options from the options string
      */
     _createNormalizedOptions(): Array<IDynamicDateRangeOption>;
     splitOptions(options: string): Array<string>;
     _focusSelectedItem(): void;
+    _focusLastSelectedItem(): void;
     /**
      * Defines whether the value help icon is hidden
      * @private

package/dist/DynamicDateRange.js

@@ -13,6 +13,7 @@ import query from "@ui5/webcomponents-base/dist/decorators/query.js";
 import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
 import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
 import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js";
+import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js";
 import { isF4, isShow } from "@ui5/webcomponents-base/dist/Keys.js";
 import DynamicDateRangeTemplate from "./DynamicDateRangeTemplate.js";
 import IconMode from "./types/IconMode.js";
@@ -47,6 +48,9 @@ import ResponsivePopoverCommonCss from "./generated/themes/ResponsivePopoverComm
  * - "TOMORROW" - Represents the next date. An example value is `{ operator: "TOMORROW"}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/Tomorrow.js";`
  * - "DATE" - Represents a single date. An example value is `{ operator: "DATE", values: [new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/SingleDate.js";`
  * - "DATERANGE" - Represents a range of dates. An example value is `{ operator: "DATERANGE", values: [new Date(), new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/DateRange.js";`
+ * - "DATETIMERANGE" - Represents a range of dates with times. An example value is `{ operator: "DATETIMERANGE", values: [new Date(), new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/DateTimeRange.js";`
+ * - "FROMDATETIME" - Represents a range from date and time. An example value is `{ operator: "FROMDATETIME", values: [new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/FromDateTime.js";`
+ * - "TODATETIME" - Represents a range to date and time. An example value is `{ operator: "TODATETIME", values: [new Date()]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/ToDateTime.js";`
  * - "LASTDAYS" - Represents Last X Days from today. An example value is `{ operator: "LASTDAYS", values: [2]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js";`
  * - "LASTWEEKS" - Represents Last X Weeks from today. An example value is `{ operator: "LASTWEEKS", values: [3]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js";`
  * - "LASTMONTHS" - Represents Last X Months from today. An example value is `{ operator: "LASTMONTHS", values: [6]}`. Import: `import "@ui5/webcomponents/dist/dynamic-date-range-options/LastOptions.js";`
@@ -89,6 +93,13 @@ let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5El
         this.optionsObjects = this._createNormalizedOptions();
         this._focusSelectedItem();
     }
+    async onAfterRendering() {
+        await renderFinished().then(() => {
+            setTimeout(() => {
+                this._focusLastSelectedItem();
+            }, 0);
+        });
+    }
     /**
      * Creates and normalizes options from the options string
      */
@@ -125,6 +136,21 @@ let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5El
             this._list?.focusItem(listItem);
         }
     }
+    _focusLastSelectedItem() {
+        if (!this._lastSelectedOption) {
+            return;
+        }
+        // Ensure the list exists and has items
+        if (!this._list || !this._list.items.length) {
+            return;
+        }
+        // Find the index of the last selected option in the options array
+        const optionIndex = this.optionsObjects.findIndex(option => option.operator === this._lastSelectedOption?.operator);
+        if (optionIndex >= 0 && optionIndex < this._list.items.length) {
+            const listItem = this._list.items[optionIndex];
+            this._list.focusItem(listItem);
+        }
+    }
     /**
      * Defines whether the value help icon is hidden
      * @private
@@ -137,7 +163,7 @@ let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5El
     }
     _togglePicker() {
         if (this.open) {
-            this.open = false;
+            this._close();
         }
         else {
             this.open = true;
@@ -145,6 +171,7 @@ let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5El
     }
     _selectOption(e) {
         this._currentOption = this.optionsObjects.find(option => option.text === e.detail.item.textContent);
+        this._lastSelectedOption = this._currentOption;
         if (!this._currentOption?.template) {
             this.currentValue = this._currentOption?.parse(this._currentOption.text);
             this._submitValue();
@@ -221,10 +248,12 @@ let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5El
         else {
             this.value = undefined;
         }
+        this._currentOption?.resetState?.();
         this._currentOption = undefined;
         this.open = false;
     }
     _close() {
+        this._currentOption?.resetState?.();
         this._currentOption = undefined;
         this.open = false;
     }
@@ -256,7 +285,11 @@ let DynamicDateRange = DynamicDateRange_1 = class DynamicDateRange extends UI5El
         return DynamicDateRange_1.i18nBundle.getText(DYNAMIC_DATE_RANGE_EMPTY_SELECTED_TEXT);
     }
     handleSelectionChange(e) {
-        this.currentValue = this._currentOption?.handleSelectionChange && this._currentOption?.handleSelectionChange(e);
+        const value = this._currentOption?.handleSelectionChange?.(e, this.currentValue);
+        this.currentValue = JSON.parse(JSON.stringify(value)); // deep clone
+        if (this.currentValue) {
+            this.currentValue.values = value?.values;
+        }
         // Update _currentOption if the operator changed
         if (this.currentValue && this.currentValue.operator !== this._currentOption?.operator) {
             this._currentOption = this.getOption(this.currentValue.operator);