@ui5/webcomponents 2.0.0-rc.1 → 2.0.0-rc.3

package/dist/TimePicker.js

@@ -5,12 +5,37 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 var TimePicker_1;
+import { isPhone } from "@ui5/webcomponents-base/dist/Device.js";
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import event from "@ui5/webcomponents-base/dist/decorators/event.js";
+import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
+import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
+import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import getLocale from "@ui5/webcomponents-base/dist/locale/getLocale.js";
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import "@ui5/webcomponents-localization/dist/features/calendar/Gregorian.js"; // default calendar for bundling
+import DateFormat from "@ui5/webcomponents-localization/dist/DateFormat.js";
 import getCachedLocaleDataInstance from "@ui5/webcomponents-localization/dist/getCachedLocaleDataInstance.js";
-import property from "@ui5/webcomponents-base/dist/decorators/property.js";
-import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
-import TimePickerBase from "./TimePickerBase.js";
-import { TIMEPICKER_INPUT_DESCRIPTION, } from "./generated/i18n/i18n-defaults.js";
+import { fetchCldr } from "@ui5/webcomponents-base/dist/asset-registries/LocaleData.js";
+import { isShow, isPageUp, isPageDown, isPageUpShift, isPageDownShift, isPageUpShiftCtrl, isPageDownShiftCtrl, isTabNext, isTabPrevious, isF6Next, isF6Previous, } from "@ui5/webcomponents-base/dist/Keys.js";
+import "@ui5/webcomponents-icons/dist/time-entry-request.js";
+import UI5Date from "@ui5/webcomponents-localization/dist/dates/UI5Date.js";
+import Icon from "./Icon.js";
+import Popover from "./Popover.js";
+import ResponsivePopover from "./ResponsivePopover.js";
+import TimePickerTemplate from "./generated/templates/TimePickerTemplate.lit.js";
+import Input from "./Input.js";
+import Button from "./Button.js";
+import TimeSelectionClocks from "./TimeSelectionClocks.js";
+import TimeSelectionInputs from "./TimeSelectionInputs.js";
+import { TIMEPICKER_SUBMIT_BUTTON, TIMEPICKER_CANCEL_BUTTON, TIMEPICKER_INPUT_DESCRIPTION, } from "./generated/i18n/i18n-defaults.js";
+// Styles
+import TimePickerCss from "./generated/themes/TimePicker.css.js";
+import TimePickerPopoverCss from "./generated/themes/TimePickerPopover.css.js";
+import PopoverCss from "./generated/themes/Popover.css.js";
+import ResponsivePopoverCommonCss from "./generated/themes/ResponsivePopoverCommon.css.js";
 /**
  * @class
  *
@@ -69,16 +94,48 @@ import { TIMEPICKER_INPUT_DESCRIPTION, } from "./generated/i18n/i18n-defaults.js
  *
  * `import "@ui5/webcomponents/dist/TimePicker.js";`
  * @constructor
- * @extends TimePickerBase
+ * @extends UI5Element
  * @public
  * @since 1.0.0-rc.6
  */
-let TimePicker = TimePicker_1 = class TimePicker extends TimePickerBase {
+let TimePicker = TimePicker_1 = class TimePicker extends UI5Element {
+    static async onDefine() {
+        [TimePicker_1.i18nBundle] = await Promise.all([
+            getI18nBundle("@ui5/webcomponents"),
+            fetchCldr(getLocale().getLanguage(), getLocale().getRegion(), getLocale().getScript()),
+        ]);
+    }
     onBeforeRendering() {
         if (this.value) {
             this.value = this.normalizeValue(this.value) || this.value;
         }
     }
+    get dateAriaDescription() {
+        return TimePicker_1.i18nBundle.getText(TIMEPICKER_INPUT_DESCRIPTION);
+    }
+    get accInfo() {
+        return {
+            "ariaRoledescription": this.dateAriaDescription,
+            "ariaHasPopup": "dialog",
+        };
+    }
+    /**
+     * Currently selected time represented as JavaScript Date instance
+     * @public
+     * @default null
+     */
+    get dateValue() {
+        return this.getFormat().parse(this._effectiveValue);
+    }
+    /**
+     * @protected
+     */
+    get _placeholder() {
+        return this.placeholder !== undefined ? this.placeholder : this._displayFormat;
+    }
+    /**
+     * @protected
+     */
     get _formatPattern() {
         const hasHours = !!this.formatPattern.match(/H/i);
         const fallback = !this.formatPattern || !hasHours;
@@ -89,35 +146,420 @@ let TimePicker = TimePicker_1 = class TimePicker extends TimePickerBase {
         // @ts-ignore oFormatOptions is a private API of DateFormat
         return this.getFormat().oFormatOptions.pattern;
     }
-    get _placeholder() {
-        return this.placeholder !== undefined ? this.placeholder : this._displayFormat;
+    get _effectiveValue() {
+        return this.value;
+    }
+    get _timeSelectionValue() {
+        return this.tempValue;
+    }
+    get _isPhone() {
+        return isPhone();
+    }
+    onTimeSelectionChange(e) {
+        this.tempValue = e.detail.value; // every time the user changes the time selection -> update tempValue
     }
     /**
-     * Currently selected time represented as JavaScript Date instance
+     * Opens the picker.
      * @public
-     * @default null
+     * @returns Resolves when the picker is open
      */
-    get dateValue() {
-        return this.getFormat().parse(this._effectiveValue);
+    openPicker() {
+        this.tempValue = this.value && this.isValid(this.value) ? this.value : this.getFormat().format(UI5Date.getInstance());
+        const responsivePopover = this._getPopover();
+        responsivePopover.showAt(this);
     }
-    get accInfo() {
-        return {
-            "ariaRoledescription": this.dateAriaDescription,
-            "ariaHasPopup": "dialog",
-        };
+    /**
+     * Closes the picker
+     * @public
+     * @returns Resolves when the picker is closed
+     */
+    closePicker() {
+        const responsivePopover = this._getPopover();
+        responsivePopover.close();
+        this._isPickerOpen = false;
     }
-    get dateAriaDescription() {
-        return TimePicker_1.i18nBundle.getText(TIMEPICKER_INPUT_DESCRIPTION);
+    togglePicker() {
+        if (this.isOpen()) {
+            this.closePicker();
+        }
+        else if (this._canOpenPicker()) {
+            this.openPicker();
+        }
+    }
+    /**
+     * Checks if the picker is open
+     * @public
+     */
+    isOpen() {
+        return !!this._isPickerOpen;
+    }
+    submitPickers() {
+        this._updateValueAndFireEvents(this.tempValue, true, ["change", "value-changed"]);
+        this.closePicker();
+    }
+    onResponsivePopoverAfterClose() {
+        this._isPickerOpen = false;
+    }
+    onResponsivePopoverAfterOpen() {
+        this._isPickerOpen = true;
+        const responsivePopover = this._getPopover();
+        responsivePopover.querySelector("[ui5-time-selection-clocks]")._focusFirstButton();
+    }
+    /**
+     * Opens the Inputs popover.
+     * @private
+     * @returns Resolves when the Inputs popover is open
+     */
+    openInputsPopover() {
+        this.tempValue = this.value && this.isValid(this.value) ? this.value : this.getFormat().format(UI5Date.getInstance());
+        const popover = this._getInputsPopover();
+        popover.showAt(this);
+        this._isInputsPopoverOpen = true;
+    }
+    /**
+     * Closes the Inputs popover
+     * @private
+     * @returns Resolves when the Inputs popover is closed
+     */
+    closeInputsPopover() {
+        const popover = this._getInputsPopover();
+        popover.close();
+    }
+    toggleInputsPopover() {
+        if (this.isInputsPopoverOpen()) {
+            this.closeInputsPopover();
+        }
+        else if (this._canOpenInputsPopover()) {
+            this.openInputsPopover();
+        }
+    }
+    /**
+     * Checks if the inputs popover is open
+     * @private
+     */
+    isInputsPopoverOpen() {
+        return !!this._isInputsPopoverOpen;
+    }
+    submitInputsPopover() {
+        this._updateValueAndFireEvents(this.tempValue, true, ["change", "value-changed"]);
+        this.closeInputsPopover();
+    }
+    onInputsPopoverAfterOpen() {
+        const popover = this._getInputsPopover();
+        popover.querySelector("[ui5-time-selection-inputs]")._addNumericAttributes();
+    }
+    onInputsPopoverAfterClose() {
+        this._isInputsPopoverOpen = false;
+    }
+    _handleInputClick(evt) {
+        const target = evt.target;
+        if (this._isPickerOpen) {
+            return;
+        }
+        if (this._isPhone && target && !target.hasAttribute("ui5-icon")) {
+            this.toggleInputsPopover();
+        }
+        const inputField = this._getInputField();
+        if (inputField) {
+            inputField.select();
+        }
+    }
+    _updateValueAndFireEvents(value, normalizeValue, eventsNames) {
+        if (value === this.value) {
+            return;
+        }
+        const valid = this.isValid(value);
+        if (value !== undefined && valid && normalizeValue) { // if value === undefined, valid is guaranteed to be falsy
+            value = this.normalizeValue(value); // transform valid values (in any format) to the correct format
+        }
+        if (!eventsNames.includes("input")) {
+            this.value = ""; // Do not remove! DurationPicker (an external component extending TimePicker) use case -> value is 05:10, user tries 05:12, after normalization value is changed back to 05:10 so no invalidation happens, but the input still shows 05:12. Thus we enforce invalidation with the ""
+            this.value = value;
+        }
+        this.tempValue = value; // if the picker is open, sync it
+        this._updateValueState(); // Change the value state to Error/None, but only if needed
+        eventsNames.forEach(eventName => {
+            this.fireEvent(eventName, { value, valid });
+        });
+    }
+    _updateValueState() {
+        const isValid = this.isValid(this.value);
+        if (!isValid) { // If not valid - always set Error regardless of the current value state
+            this.valueState = ValueState.Negative;
+        }
+        else if (isValid && this.valueState === ValueState.Negative) { // However if valid, change only Error (but not the others) to None
+            this.valueState = ValueState.None;
+        }
+    }
+    _handleInputChange(e) {
+        const target = e.target;
+        this._updateValueAndFireEvents(target.value, true, ["change", "value-changed"]);
+    }
+    _handleInputLiveChange(e) {
+        const target = e.target;
+        this._updateValueAndFireEvents(target.value, false, ["input"]);
+    }
+    _canOpenPicker() {
+        return !this.disabled && !this.readonly;
+    }
+    _canOpenInputsPopover() {
+        return !this.disabled && this._isPhone;
+    }
+    _getPopover() {
+        return this.shadowRoot.querySelector("[ui5-responsive-popover]");
+    }
+    _getInputsPopover() {
+        return this.shadowRoot.querySelector("[ui5-popover]");
+    }
+    _getInput() {
+        return this.shadowRoot.querySelector("[ui5-input]");
+    }
+    _getInputField() {
+        const input = this._getInput();
+        return input && input.getInputDOMRef();
+    }
+    _onkeydown(e) {
+        if (this._isPhone && !this.isInputsPopoverOpen()) {
+            e.preventDefault();
+        }
+        if (isShow(e)) {
+            e.preventDefault();
+            this.togglePicker();
+        }
+        const target = e.target;
+        if ((this._getInput().isEqualNode(target) && this.isOpen()) && (isTabNext(e) || isTabPrevious(e) || isF6Next(e) || isF6Previous(e))) {
+            this.closePicker();
+        }
+        if (this.isOpen()) {
+            return;
+        }
+        if (isPageUpShiftCtrl(e)) {
+            e.preventDefault();
+            this._modifyValueBy(1, "second");
+        }
+        else if (isPageUpShift(e)) {
+            e.preventDefault();
+            this._modifyValueBy(1, "minute");
+        }
+        else if (isPageUp(e)) {
+            e.preventDefault();
+            this._modifyValueBy(1, "hour");
+        }
+        else if (isPageDownShiftCtrl(e)) {
+            e.preventDefault();
+            this._modifyValueBy(-1, "second");
+        }
+        else if (isPageDownShift(e)) {
+            e.preventDefault();
+            this._modifyValueBy(-1, "minute");
+        }
+        else if (isPageDown(e)) {
+            e.preventDefault();
+            this._modifyValueBy(-1, "hour");
+        }
+    }
+    get _isPattern() {
+        return this._formatPattern !== "medium" && this._formatPattern !== "short" && this._formatPattern !== "long";
+    }
+    getFormat() {
+        let dateFormat;
+        if (this._isPattern) {
+            dateFormat = DateFormat.getDateInstance({
+                pattern: this._formatPattern,
+            });
+        }
+        else {
+            dateFormat = DateFormat.getDateInstance({
+                style: this._formatPattern,
+            });
+        }
+        return dateFormat;
+    }
+    /**
+     * Formats a Java Script date object into a string representing a locale date and time
+     * according to the `formatPattern` property of the TimePicker instance
+     * @param date A Java Script date object to be formatted as string
+     * @public
+     * @returns formatted value
+     */
+    formatValue(date) {
+        return this.getFormat().format(date);
+    }
+    /**
+     * Checks if a value is valid against the current `formatPattern` value.
+     *
+     * **Note:** an empty string is considered as valid value.
+     * @param value The value to be tested against the current date format
+     * @public
+     */
+    isValid(value) {
+        if (value === "") {
+            return true;
+        }
+        return !!this.getFormat().parse(value);
+    }
+    normalizeValue(value) {
+        if (value === "") {
+            return value;
+        }
+        return this.getFormat().format(this.getFormat().parse(value));
+    }
+    _modifyValueBy(amount, unit) {
+        const date = this.getFormat().parse(this._effectiveValue);
+        if (!date) {
+            return;
+        }
+        if (unit === "hour") {
+            date.setHours(date.getHours() + amount);
+        }
+        else if (unit === "minute") {
+            date.setMinutes(date.getMinutes() + amount);
+        }
+        else if (unit === "second") {
+            date.setSeconds(date.getSeconds() + amount);
+        }
+        const newValue = this.formatValue(date);
+        this._updateValueAndFireEvents(newValue, true, ["change", "value-changed"]);
+    }
+    /**
+     * The listener for this event can't be passive as it calls preventDefault()
+     * @param e Wheel Event
+     * @private
+     */
+    _handleWheel(e) {
+        e.preventDefault();
+    }
+    /**
+     * Hides mobile device keyboard by temporary setting the input to readonly state.
+     */
+    _hideMobileKeyboard() {
+        this._getInput().readonly = true;
+        setTimeout(() => { this._getInput().readonly = false; }, 0);
+    }
+    _onfocusin(evt) {
+        if (this._isPhone) {
+            this._hideMobileKeyboard();
+            if (this._isInputsPopoverOpen) {
+                const popover = this._getInputsPopover();
+                popover.applyFocus();
+            }
+            evt.preventDefault();
+        }
+    }
+    _oninput(evt) {
+        if (this._isPhone) {
+            evt.preventDefault();
+        }
+    }
+    get submitButtonLabel() {
+        return TimePicker_1.i18nBundle.getText(TIMEPICKER_SUBMIT_BUTTON);
+    }
+    get cancelButtonLabel() {
+        return TimePicker_1.i18nBundle.getText(TIMEPICKER_CANCEL_BUTTON);
+    }
+    /**
+     * @protected
+     */
+    get openIconName() {
+        return "time-entry-request";
     }
 };
+__decorate([
+    property({ defaultValue: undefined })
+], TimePicker.prototype, "value", void 0);
+__decorate([
+    property({ type: ValueState, defaultValue: ValueState.None })
+], TimePicker.prototype, "valueState", void 0);
+__decorate([
+    property({ type: Boolean })
+], TimePicker.prototype, "disabled", void 0);
+__decorate([
+    property({ type: Boolean })
+], TimePicker.prototype, "readonly", void 0);
 __decorate([
     property({ defaultValue: undefined })
 ], TimePicker.prototype, "placeholder", void 0);
 __decorate([
     property()
 ], TimePicker.prototype, "formatPattern", void 0);
+__decorate([
+    property({ type: Boolean, noAttribute: true })
+], TimePicker.prototype, "_isPickerOpen", void 0);
+__decorate([
+    property({ type: Boolean, noAttribute: true })
+], TimePicker.prototype, "_isInputsPopoverOpen", void 0);
+__decorate([
+    slot()
+], TimePicker.prototype, "valueStateMessage", void 0);
 TimePicker = TimePicker_1 = __decorate([
-    customElement("ui5-time-picker")
+    customElement({
+        tag: "ui5-time-picker",
+        languageAware: true,
+        renderer: litRender,
+        template: TimePickerTemplate,
+        styles: [
+            TimePickerCss,
+            ResponsivePopoverCommonCss,
+            PopoverCss,
+            TimePickerPopoverCss,
+        ],
+        dependencies: [
+            Icon,
+            Popover,
+            ResponsivePopover,
+            TimeSelectionClocks,
+            TimeSelectionInputs,
+            Input,
+            Button,
+        ],
+    })
+    /**
+     * Fired when the input operation has finished by clicking the "OK" button or
+     * when the text in the input field has changed and the focus leaves the input field.
+     * @public
+     * @param {string} value The submitted value.
+     * @param {boolean} valid Indicator if the value is in correct format pattern and in valid range.
+     */
+    ,
+    event("change", {
+        detail: {
+            /**
+             * @public
+             */
+            value: {
+                type: String,
+            },
+            /**
+             * @public
+             */
+            valid: {
+                type: Boolean,
+            },
+        },
+    })
+    /**
+     * Fired when the value of the `ui5-time-picker` is changed at each key stroke.
+     * @public
+     * @param {string} value The current value.
+     * @param {boolean} valid Indicator if the value is in correct format pattern and in valid range.
+     */
+    ,
+    event("input", {
+        detail: {
+            /**
+             * @public
+             */
+            value: {
+                type: String,
+            },
+            /**
+             * @public
+             */
+            valid: {
+                type: Boolean,
+            },
+        },
+    })
 ], TimePicker);
 TimePicker.define();
 export default TimePicker;

package/dist/TimePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.js","sourceRoot":"","sources":["../src/TimePicker.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,SAAS,MAAM,kDAAkD,CAAC;AACzE,OAAO,2BAA2B,MAAM,qEAAqE,CAAC;AAC9G,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,cAAc,MAAM,qBAAqB,CAAC;AAOjD,OAAO,EACN,4BAA4B,GAC5B,MAAM,mCAAmC,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6DG;AAEH,IAAM,UAAU,kBAAhB,MAAM,UAAW,SAAQ,cAAc;IA0BtC,iBAAiB;QAChB,IAAI,IAAI,CAAC,KAAK,EAAE;YACf,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC;SAC3D;IACF,CAAC;IAED,IAAI,cAAc;QACjB,MAAM,QAAQ,GAAG,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAClD,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,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC;IAC5E,CAAC;IAED,IAAI,cAAc;QACjB,2DAA2D;QAC3D,OAAO,IAAI,CAAC,SAAS,EAAE,CAAC,cAAc,CAAC,OAAiB,CAAC;IAC1D,CAAC;IAED,IAAI,YAAY;QACf,OAAO,IAAI,CAAC,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC;IAChF,CAAC;IAED;;;;OAIG;IACH,IAAI,SAAS;QACZ,OAAO,IAAI,CAAC,SAAS,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,eAAyB,CAAC,CAAC;IAC/D,CAAC;IAED,IAAI,OAAO;QACV,OAAO;YACN,qBAAqB,EAAE,IAAI,CAAC,mBAAmB;YAC/C,cAAc,EAAE,QAAQ;SACxB,CAAC;IACH,CAAC;IAED,IAAI,mBAAmB;QACtB,OAAO,YAAU,CAAC,UAAU,CAAC,OAAO,CAAC,4BAA4B,CAAC,CAAC;IACpE,CAAC;CACD,CAAA;AAzDA;IADC,QAAQ,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC;+CACjB;AAarB;IADC,QAAQ,EAAE;iDACY;AAxBlB,UAAU;IADf,aAAa,CAAC,iBAAiB,CAAC;GAC3B,UAAU,CAoEf;AAED,UAAU,CAAC,MAAM,EAAE,CAAC;AAEpB,eAAe,UAAU,CAAC","sourcesContent":["import getLocale from \"@ui5/webcomponents-base/dist/locale/getLocale.js\";\nimport getCachedLocaleDataInstance from \"@ui5/webcomponents-localization/dist/getCachedLocaleDataInstance.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport TimePickerBase from \"./TimePickerBase.js\";\n\nimport type {\n\tTimePickerBaseChangeEventDetail as TimePickerChangeEventDetail,\n\tTimePickerBaseInputEventDetail as TimePickerInputEventDetail,\n} from \"./TimePickerBase.js\";\n\nimport {\n\tTIMEPICKER_INPUT_DESCRIPTION,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n/**\n * @class\n *\n * ### Overview\n * The `ui5-time-picker` component provides an input field with assigned clocks which are opened on user action.\n * The `ui5-time-picker` allows users to select a localized time using touch, mouse, or keyboard input.\n * It consists of two parts: the time input field and the clocks.\n *\n * ### Usage\n * The user can enter a time by:\n *\n * - Using the clocks that are displayed in a popup\n * - Typing it in directly in the input field\n *\n * When the user makes an entry and chooses the enter key, the clocks show the corresponding time (hours, minutes and seconds separately).\n * When the user directly triggers the clocks display, the actual time is displayed.\n * For the `ui5-time-picker`\n *\n * ### Formatting\n *\n * If a time is entered by typing it into\n * the input field, it must fit to the used 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](http://unicode.org/reports/tr35/#Date_Field_Symbol_Table).\n *\n * For example, if the `format-pattern` is \"HH:mm:ss\",\n * a valid value string is \"11:42:35\" and the same is displayed in the input.\n *\n * ### Keyboard handling\n * [F4], [Alt]+[Up], [Alt]+[Down] Open/Close picker dialog and move focus to it.\n *\n * When closed:\n *\n * - [Page Up] - Increments hours by 1. If 12 am is reached, increment hours to 1 pm and vice versa.\n * - [Page Down] - Decrements the corresponding field by 1. If 1 pm is reached, decrement hours to 12 am and vice versa.\n * - [Shift]+[Page Up] - Increments minutes by 1.\n * - [Shift]+[Page Down] - Decrements minutes by 1.\n * - [Shift]+[Ctrl]+[Page Up] - Increments seconds by 1.\n * - [Shift]+[Ctrl]+[Page Down] - Decrements seconds by 1.\n * -\n *\n * When opened:\n *\n * - [Page Up] - Increments hours by 1. If 12 am is reached, increment hours to 1 pm and vice versa.\n * - [Page Down] - Decrements the corresponding field by 1. If 1 pm is reached, decrement hours to 12 am and vice versa.\n * - [Shift]+[Page Up] - Increments minutes by 1.\n * - [Shift]+[Page Down] - Decrements minutes by 1.\n * - [Shift]+[Ctrl]+[Page Up] - Increments seconds by 1.\n * - [Shift]+[Ctrl]+[Page Down] - Decrements seconds by 1.\n * - [A] or [P] - Selects AM or PM respectively.\n * - [0]-[9] - Allows direct time selecting (hours/minutes/seconds).\n * - [:] - Allows switching between hours/minutes/seconds clocks. If the last clock is displayed and [:] is pressed, the first clock is beind displayed.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/TimePicker.js\";`\n * @constructor\n * @extends TimePickerBase\n * @public\n * @since 1.0.0-rc.6\n */\n@customElement(\"ui5-time-picker\")\nclass TimePicker extends TimePickerBase {\n\t/**\n\t * Defines a short hint, intended to aid the user with data entry when the\n\t * component has no value.\n\t *\n\t * **Note:** When no placeholder is set, the format pattern is displayed as a placeholder.\n\t * Passing an empty string as the value of this property will make the component appear empty - without placeholder or format pattern.\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ defaultValue: undefined })\n\tplaceholder?: string;\n\n\t/**\n\t * Determines the format, displayed in the input field.\n\t *\n\t * Example:\n\t * HH:mm:ss -> 11:42:35\n\t * hh:mm:ss a -> 2:23:15 PM\n\t * mm:ss -> 12:04 (only minutes and seconds)\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\tformatPattern!: string;\n\n\tonBeforeRendering() {\n\t\tif (this.value) {\n\t\t\tthis.value = this.normalizeValue(this.value) || 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.getTimePattern(\"medium\") : this.formatPattern;\n\t}\n\n\tget _displayFormat() {\n\t\t// @ts-ignore oFormatOptions is a private API of DateFormat\n\t\treturn this.getFormat().oFormatOptions.pattern as string;\n\t}\n\n\tget _placeholder() {\n\t\treturn this.placeholder !== undefined ? this.placeholder : this._displayFormat;\n\t}\n\n\t/**\n\t * Currently selected time represented as JavaScript Date instance\n\t * @public\n\t * @default null\n\t */\n\tget dateValue(): Date | Date[] | null {\n\t\treturn this.getFormat().parse(this._effectiveValue as string);\n\t}\n\n\tget accInfo() {\n\t\treturn {\n\t\t\t\"ariaRoledescription\": this.dateAriaDescription,\n\t\t\t\"ariaHasPopup\": \"dialog\",\n\t\t};\n\t}\n\n\tget dateAriaDescription() {\n\t\treturn TimePicker.i18nBundle.getText(TIMEPICKER_INPUT_DESCRIPTION);\n\t}\n}\n\nTimePicker.define();\n\nexport default TimePicker;\nexport type {\n\tTimePickerChangeEventDetail,\n\tTimePickerInputEventDetail,\n};\n"]}
+{"version":3,"file":"TimePicker.js","sourceRoot":"","sources":["../src/TimePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import { isPhone } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport getLocale from \"@ui5/webcomponents-base/dist/locale/getLocale.js\";\nimport ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport \"@ui5/webcomponents-localization/dist/features/calendar/Gregorian.js\"; // default calendar for bundling\nimport DateFormat from \"@ui5/webcomponents-localization/dist/DateFormat.js\";\nimport getCachedLocaleDataInstance from \"@ui5/webcomponents-localization/dist/getCachedLocaleDataInstance.js\";\nimport { fetchCldr } from \"@ui5/webcomponents-base/dist/asset-registries/LocaleData.js\";\nimport {\n\tisShow,\n\tisPageUp,\n\tisPageDown,\n\tisPageUpShift,\n\tisPageDownShift,\n\tisPageUpShiftCtrl,\n\tisPageDownShiftCtrl,\n\tisTabNext,\n\tisTabPrevious,\n\tisF6Next,\n\tisF6Previous,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport \"@ui5/webcomponents-icons/dist/time-entry-request.js\";\nimport UI5Date from \"@ui5/webcomponents-localization/dist/dates/UI5Date.js\";\nimport Icon from \"./Icon.js\";\nimport Popover from \"./Popover.js\";\nimport ResponsivePopover from \"./ResponsivePopover.js\";\nimport TimePickerTemplate from \"./generated/templates/TimePickerTemplate.lit.js\";\nimport Input from \"./Input.js\";\nimport Button from \"./Button.js\";\nimport TimeSelectionClocks from \"./TimeSelectionClocks.js\";\nimport TimeSelectionInputs from \"./TimeSelectionInputs.js\";\nimport type { TimeSelectionChangeEventDetail } from \"./TimePickerInternals.js\";\n\nimport {\n\tTIMEPICKER_SUBMIT_BUTTON,\n\tTIMEPICKER_CANCEL_BUTTON,\n\tTIMEPICKER_INPUT_DESCRIPTION,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport TimePickerCss from \"./generated/themes/TimePicker.css.js\";\nimport TimePickerPopoverCss from \"./generated/themes/TimePickerPopover.css.js\";\nimport PopoverCss from \"./generated/themes/Popover.css.js\";\nimport ResponsivePopoverCommonCss from \"./generated/themes/ResponsivePopoverCommon.css.js\";\n\ntype TimePickerChangeInputEventDetail = {\n\tvalue: string,\n\tvalid: boolean,\n}\n\ntype TimePickerChangeEventDetail = TimePickerChangeInputEventDetail;\ntype TimePickerInputEventDetail = TimePickerChangeInputEventDetail;\n\n/**\n * @class\n *\n * ### Overview\n * The `ui5-time-picker` component provides an input field with assigned clocks which are opened on user action.\n * The `ui5-time-picker` allows users to select a localized time using touch, mouse, or keyboard input.\n * It consists of two parts: the time input field and the clocks.\n *\n * ### Usage\n * The user can enter a time by:\n *\n * - Using the clocks that are displayed in a popup\n * - Typing it in directly in the input field\n *\n * When the user makes an entry and chooses the enter key, the clocks show the corresponding time (hours, minutes and seconds separately).\n * When the user directly triggers the clocks display, the actual time is displayed.\n * For the `ui5-time-picker`\n *\n * ### Formatting\n *\n * If a time is entered by typing it into\n * the input field, it must fit to the used 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](http://unicode.org/reports/tr35/#Date_Field_Symbol_Table).\n *\n * For example, if the `format-pattern` is \"HH:mm:ss\",\n * a valid value string is \"11:42:35\" and the same is displayed in the input.\n *\n * ### Keyboard handling\n * [F4], [Alt]+[Up], [Alt]+[Down] Open/Close picker dialog and move focus to it.\n *\n * When closed:\n *\n * - [Page Up] - Increments hours by 1. If 12 am is reached, increment hours to 1 pm and vice versa.\n * - [Page Down] - Decrements the corresponding field by 1. If 1 pm is reached, decrement hours to 12 am and vice versa.\n * - [Shift]+[Page Up] - Increments minutes by 1.\n * - [Shift]+[Page Down] - Decrements minutes by 1.\n * - [Shift]+[Ctrl]+[Page Up] - Increments seconds by 1.\n * - [Shift]+[Ctrl]+[Page Down] - Decrements seconds by 1.\n * -\n *\n * When opened:\n *\n * - [Page Up] - Increments hours by 1. If 12 am is reached, increment hours to 1 pm and vice versa.\n * - [Page Down] - Decrements the corresponding field by 1. If 1 pm is reached, decrement hours to 12 am and vice versa.\n * - [Shift]+[Page Up] - Increments minutes by 1.\n * - [Shift]+[Page Down] - Decrements minutes by 1.\n * - [Shift]+[Ctrl]+[Page Up] - Increments seconds by 1.\n * - [Shift]+[Ctrl]+[Page Down] - Decrements seconds by 1.\n * - [A] or [P] - Selects AM or PM respectively.\n * - [0]-[9] - Allows direct time selecting (hours/minutes/seconds).\n * - [:] - Allows switching between hours/minutes/seconds clocks. If the last clock is displayed and [:] is pressed, the first clock is beind displayed.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/TimePicker.js\";`\n * @constructor\n * @extends UI5Element\n * @public\n * @since 1.0.0-rc.6\n */\n@customElement({\n\ttag: \"ui5-time-picker\",\n\tlanguageAware: true,\n\trenderer: litRender,\n\ttemplate: TimePickerTemplate,\n\tstyles: [\n\t\tTimePickerCss,\n\t\tResponsivePopoverCommonCss,\n\t\tPopoverCss,\n\t\tTimePickerPopoverCss,\n\t],\n\tdependencies: [\n\t\tIcon,\n\t\tPopover,\n\t\tResponsivePopover,\n\t\tTimeSelectionClocks,\n\t\tTimeSelectionInputs,\n\t\tInput,\n\t\tButton,\n\t],\n})\n/**\n * Fired when the input operation has finished by clicking the \"OK\" button or\n * when the text in the input field has changed and the focus leaves the input field.\n * @public\n * @param {string} value The submitted value.\n * @param {boolean} valid Indicator if the value is in correct format pattern and in valid range.\n */\n@event<TimePickerChangeEventDetail>(\"change\", {\n\tdetail: {\n\t\t/**\n\t\t * @public\n\t\t */\n\t\tvalue: {\n\t\t\ttype: String,\n\t\t},\n\t\t/**\n\t\t * @public\n\t\t */\n\t\tvalid: {\n\t\t\ttype: Boolean,\n\t\t},\n\t},\n})\n\n/**\n * Fired when the value of the `ui5-time-picker` is changed at each key stroke.\n * @public\n * @param {string} value The current value.\n * @param {boolean} valid Indicator if the value is in correct format pattern and in valid range.\n */\n@event<TimePickerInputEventDetail>(\"input\", {\n\tdetail: {\n\t\t/**\n\t\t * @public\n\t\t */\n\t\tvalue: {\n\t\t\ttype: String,\n\t\t},\n\t\t/**\n\t\t * @public\n\t\t */\n\t\tvalid: {\n\t\t\ttype: Boolean,\n\t\t},\n\t},\n})\nclass TimePicker extends UI5Element {\n\t/**\n\t * Defines a formatted time value.\n\t * @default undefined\n\t * @formEvents change input\n\t * @formProperty\n\t * @public\n\t */\n\t@property({ defaultValue: undefined })\n\tvalue?: string;\n\n\t/**\n\t * Defines the value state of the component.\n\t * @default \"None\"\n\t * @public\n\t */\n\t@property({ type: ValueState, defaultValue: ValueState.None })\n\tvalueState!: `${ValueState}`;\n\n\t/**\n\t * Defines the disabled state of the comonent.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tdisabled!: boolean;\n\n\t/**\n\t * Defines the readonly state of the comonent.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\treadonly!: boolean;\n\n\t/**\n\t * Defines a short hint, intended to aid the user with data entry when the\n\t * component has no value.\n\t *\n\t * **Note:** When no placeholder is set, the format pattern is displayed as a placeholder.\n\t * Passing an empty string as the value of this property will make the component appear empty - without placeholder or format pattern.\n\t * @default undefined\n\t * @public\n\t */\n\t@property({ defaultValue: undefined })\n\tplaceholder?: string;\n\n\t/**\n\t * Determines the format, displayed in the input field.\n\t *\n\t * Example:\n\t * HH:mm:ss -> 11:42:35\n\t * hh:mm:ss a -> 2:23:15 PM\n\t * mm:ss -> 12:04 (only minutes and seconds)\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\tformatPattern!: string;\n\n\t@property({ type: Boolean, noAttribute: true })\n\t_isPickerOpen!: boolean;\n\n\t@property({ type: Boolean, noAttribute: true })\n\t_isInputsPopoverOpen!: boolean;\n\n\t/**\n\t * Defines the value state message that will be displayed as pop up under the `ui5-time-picker`.\n\t *\n\t * **Note:** If not specified, a default text (in the respective language) will be displayed.\n\t *\n\t * **Note:** The `valueStateMessage` would be displayed,\n\t * when the `ui5-time-picker` is in `Information`, `Warning` or `Error` value state.\n\t * @since 1.0.0-rc.8\n\t * @public\n\t */\n\t@slot()\n\tvalueStateMessage!: Array<HTMLElement>;\n\n\ttempValue?: string;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tstatic async onDefine() {\n\t\t[TimePicker.i18nBundle] = await Promise.all([\n\t\t\tgetI18nBundle(\"@ui5/webcomponents\"),\n\t\t\tfetchCldr(getLocale().getLanguage(), getLocale().getRegion(), getLocale().getScript()),\n\t\t]);\n\t}\n\n\tonBeforeRendering() {\n\t\tif (this.value) {\n\t\t\tthis.value = this.normalizeValue(this.value) || this.value;\n\t\t}\n\t}\n\n\tget dateAriaDescription() {\n\t\treturn TimePicker.i18nBundle.getText(TIMEPICKER_INPUT_DESCRIPTION);\n\t}\n\n\tget accInfo() {\n\t\treturn {\n\t\t\t\"ariaRoledescription\": this.dateAriaDescription,\n\t\t\t\"ariaHasPopup\": \"dialog\",\n\t\t};\n\t}\n\n\t/**\n\t * Currently selected time represented as JavaScript Date instance\n\t * @public\n\t * @default null\n\t */\n\tget dateValue(): Date | Date[] | null {\n\t\treturn this.getFormat().parse(this._effectiveValue as string);\n\t}\n\n\t/**\n\t * @protected\n\t */\n\tget _placeholder() {\n\t\treturn this.placeholder !== undefined ? this.placeholder : this._displayFormat;\n\t}\n\n\t/**\n\t * @protected\n\t */\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.getTimePattern(\"medium\") : this.formatPattern;\n\t}\n\n\tget _displayFormat() {\n\t\t// @ts-ignore oFormatOptions is a private API of DateFormat\n\t\treturn this.getFormat().oFormatOptions.pattern as string;\n\t}\n\n\tget _effectiveValue() {\n\t\treturn this.value;\n\t}\n\n\tget _timeSelectionValue() {\n\t\treturn this.tempValue;\n\t}\n\n\tget _isPhone() {\n\t\treturn isPhone();\n\t}\n\n\tonTimeSelectionChange(e: CustomEvent<TimeSelectionChangeEventDetail>) {\n\t\tthis.tempValue = e.detail.value; // every time the user changes the time selection -> update tempValue\n\t}\n\n\t/**\n\t * Opens the picker.\n\t * @public\n\t * @returns Resolves when the picker is open\n\t */\n\topenPicker(): void {\n\t\tthis.tempValue = this.value && this.isValid(this.value) ? this.value : this.getFormat().format(UI5Date.getInstance());\n\t\tconst responsivePopover = this._getPopover();\n\t\tresponsivePopover.showAt(this);\n\t}\n\n\t/**\n\t * Closes the picker\n\t * @public\n\t * @returns Resolves when the picker is closed\n\t */\n\tclosePicker(): void {\n\t\tconst responsivePopover = this._getPopover();\n\t\tresponsivePopover.close();\n\t\tthis._isPickerOpen = false;\n\t}\n\n\ttogglePicker() {\n\t\tif (this.isOpen()) {\n\t\t\tthis.closePicker();\n\t\t} else if (this._canOpenPicker()) {\n\t\t\tthis.openPicker();\n\t\t}\n\t}\n\n\t/**\n\t * Checks if the picker is open\n\t * @public\n\t */\n\tisOpen(): boolean {\n\t\treturn !!this._isPickerOpen;\n\t}\n\n\tsubmitPickers() {\n\t\tthis._updateValueAndFireEvents(this.tempValue!, true, [\"change\", \"value-changed\"]);\n\t\tthis.closePicker();\n\t}\n\n\tonResponsivePopoverAfterClose() {\n\t\tthis._isPickerOpen = false;\n\t}\n\n\tonResponsivePopoverAfterOpen() {\n\t\tthis._isPickerOpen = true;\n\t\tconst responsivePopover = this._getPopover();\n\t\tresponsivePopover.querySelector<TimeSelectionClocks>(\"[ui5-time-selection-clocks]\")!._focusFirstButton();\n\t}\n\n\t/**\n\t * Opens the Inputs popover.\n\t * @private\n\t * @returns Resolves when the Inputs popover is open\n\t */\n\topenInputsPopover() {\n\t\tthis.tempValue = this.value && this.isValid(this.value) ? this.value : this.getFormat().format(UI5Date.getInstance());\n\t\tconst popover = this._getInputsPopover();\n\t\tpopover.showAt(this);\n\t\tthis._isInputsPopoverOpen = true;\n\t}\n\n\t/**\n\t * Closes the Inputs popover\n\t * @private\n\t * @returns Resolves when the Inputs popover is closed\n\t */\n\tcloseInputsPopover() {\n\t\tconst popover = this._getInputsPopover();\n\t\tpopover.close();\n\t}\n\n\ttoggleInputsPopover() {\n\t\tif (this.isInputsPopoverOpen()) {\n\t\t\tthis.closeInputsPopover();\n\t\t} else if (this._canOpenInputsPopover()) {\n\t\t\tthis.openInputsPopover();\n\t\t}\n\t}\n\n\t/**\n\t * Checks if the inputs popover is open\n\t * @private\n\t */\n\tisInputsPopoverOpen(): boolean {\n\t\treturn !!this._isInputsPopoverOpen;\n\t}\n\n\tsubmitInputsPopover() {\n\t\tthis._updateValueAndFireEvents(this.tempValue!, true, [\"change\", \"value-changed\"]);\n\t\tthis.closeInputsPopover();\n\t}\n\n\tonInputsPopoverAfterOpen() {\n\t\tconst popover = this._getInputsPopover();\n\t\tpopover.querySelector<TimeSelectionInputs>(\"[ui5-time-selection-inputs]\")!._addNumericAttributes();\n\t}\n\n\tonInputsPopoverAfterClose() {\n\t\tthis._isInputsPopoverOpen = false;\n\t}\n\n\t_handleInputClick(evt: MouseEvent) {\n\t\tconst target = evt.target as HTMLElement;\n\t\tif (this._isPickerOpen) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._isPhone && target && !target.hasAttribute(\"ui5-icon\")) {\n\t\t\tthis.toggleInputsPopover();\n\t\t}\n\n\t\tconst inputField = this._getInputField();\n\n\t\tif (inputField) {\n\t\t\t(inputField as HTMLInputElement).select();\n\t\t}\n\t}\n\n\t_updateValueAndFireEvents(value: string, normalizeValue: boolean, eventsNames: Array<string>) {\n\t\tif (value === this.value) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst valid = this.isValid(value);\n\n\t\tif (value !== undefined && valid && normalizeValue) { // if value === undefined, valid is guaranteed to be falsy\n\t\t\tvalue = this.normalizeValue(value); // transform valid values (in any format) to the correct format\n\t\t}\n\t\tif (!eventsNames.includes(\"input\")) {\n\t\t\tthis.value = \"\"; // Do not remove! DurationPicker (an external component extending TimePicker) use case -> value is 05:10, user tries 05:12, after normalization value is changed back to 05:10 so no invalidation happens, but the input still shows 05:12. Thus we enforce invalidation with the \"\"\n\t\t\tthis.value = value;\n\t\t}\n\t\tthis.tempValue = value; // if the picker is open, sync it\n\t\tthis._updateValueState(); // Change the value state to Error/None, but only if needed\n\t\teventsNames.forEach(eventName => {\n\t\t\tthis.fireEvent<TimePickerChangeInputEventDetail>(eventName, { value, valid });\n\t\t});\n\t}\n\n\t_updateValueState() {\n\t\tconst isValid = this.isValid(this.value);\n\t\tif (!isValid) { // If not valid - always set Error regardless of the current value state\n\t\t\tthis.valueState = ValueState.Negative;\n\t\t} else if (isValid && this.valueState === ValueState.Negative) { // However if valid, change only Error (but not the others) to None\n\t\t\tthis.valueState = ValueState.None;\n\t\t}\n\t}\n\n\t_handleInputChange(e: CustomEvent) {\n\t\tconst target = e.target as Input;\n\t\tthis._updateValueAndFireEvents(target.value, true, [\"change\", \"value-changed\"]);\n\t}\n\n\t_handleInputLiveChange(e: CustomEvent) {\n\t\tconst target = e.target as Input;\n\t\tthis._updateValueAndFireEvents(target.value, false, [\"input\"]);\n\t}\n\n\t_canOpenPicker() {\n\t\treturn !this.disabled && !this.readonly;\n\t}\n\n\t_canOpenInputsPopover() {\n\t\treturn !this.disabled && this._isPhone;\n\t}\n\n\t_getPopover() {\n\t\treturn this.shadowRoot!.querySelector<ResponsivePopover>(\"[ui5-responsive-popover]\")!;\n\t}\n\n\t_getInputsPopover() {\n\t\treturn this.shadowRoot!.querySelector<Popover>(\"[ui5-popover]\")!;\n\t}\n\n\t_getInput(): Input {\n\t\treturn this.shadowRoot!.querySelector<Input>(\"[ui5-input]\")!;\n\t}\n\n\t_getInputField() {\n\t\tconst input = this._getInput();\n\t\treturn input && input.getInputDOMRef();\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (this._isPhone && !this.isInputsPopoverOpen()) {\n\t\t\te.preventDefault();\n\t\t}\n\t\tif (isShow(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis.togglePicker();\n\t\t}\n\n\t\tconst target = e.target as Node;\n\n\t\tif ((this._getInput().isEqualNode(target) && this.isOpen()) && (isTabNext(e) || isTabPrevious(e) || isF6Next(e) || isF6Previous(e))) {\n\t\t\tthis.closePicker();\n\t\t}\n\t\tif (this.isOpen()) {\n\t\t\treturn;\n\t\t}\n\t\tif (isPageUpShiftCtrl(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis._modifyValueBy(1, \"second\");\n\t\t} else if (isPageUpShift(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis._modifyValueBy(1, \"minute\");\n\t\t} else if (isPageUp(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis._modifyValueBy(1, \"hour\");\n\t\t} else if (isPageDownShiftCtrl(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis._modifyValueBy(-1, \"second\");\n\t\t} else if (isPageDownShift(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis._modifyValueBy(-1, \"minute\");\n\t\t} else if (isPageDown(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis._modifyValueBy(-1, \"hour\");\n\t\t}\n\t}\n\n\tget _isPattern() {\n\t\treturn this._formatPattern !== \"medium\" && this._formatPattern !== \"short\" && this._formatPattern !== \"long\";\n\t}\n\n\tgetFormat() {\n\t\tlet dateFormat;\n\n\t\tif (this._isPattern) {\n\t\t\tdateFormat = DateFormat.getDateInstance({\n\t\t\t\tpattern: this._formatPattern,\n\t\t\t});\n\t\t} else {\n\t\t\tdateFormat = DateFormat.getDateInstance({\n\t\t\t\tstyle: this._formatPattern,\n\t\t\t});\n\t\t}\n\n\t\treturn dateFormat;\n\t}\n\n\t/**\n\t * Formats a Java Script date object into a string representing a locale date and time\n\t * according to the `formatPattern` property of the TimePicker instance\n\t * @param date A Java Script date object to be formatted as string\n\t * @public\n\t * @returns formatted value\n\t */\n\tformatValue(date: Date): string {\n\t\treturn this.getFormat().format(date);\n\t}\n\n\t/**\n\t * Checks if a value is valid against the current `formatPattern` value.\n\t *\n\t * **Note:** an empty string is considered as valid value.\n\t * @param value The value to be tested against the current date format\n\t * @public\n\t */\n\tisValid(value: string | undefined): boolean {\n\t\tif (value === \"\") {\n\t\t\treturn true;\n\t\t}\n\t\treturn !!this.getFormat().parse(value as string);\n\t}\n\n\tnormalizeValue(value: string) {\n\t\tif (value === \"\") {\n\t\t\treturn value;\n\t\t}\n\t\treturn this.getFormat().format(this.getFormat().parse(value));\n\t}\n\n\t_modifyValueBy(amount: number, unit: string) {\n\t\tconst date = this.getFormat().parse(this._effectiveValue as string) as Date;\n\t\tif (!date) {\n\t\t\treturn;\n\t\t}\n\t\tif (unit === \"hour\") {\n\t\t\tdate.setHours(date.getHours() + amount);\n\t\t} else if (unit === \"minute\") {\n\t\t\tdate.setMinutes(date.getMinutes() + amount);\n\t\t} else if (unit === \"second\") {\n\t\t\tdate.setSeconds(date.getSeconds() + amount);\n\t\t}\n\n\t\tconst newValue = this.formatValue(date);\n\n\t\tthis._updateValueAndFireEvents(newValue, true, [\"change\", \"value-changed\"]);\n\t}\n\n\t/**\n\t * The listener for this event can't be passive as it calls preventDefault()\n\t * @param e Wheel Event\n\t * @private\n\t */\n\t_handleWheel(e: WheelEvent) {\n\t\te.preventDefault();\n\t}\n\n\t/**\n\t * Hides mobile device keyboard by temporary setting the input to readonly state.\n\t */\n\t_hideMobileKeyboard() {\n\t\tthis._getInput().readonly = true;\n\t\tsetTimeout(() => { this._getInput().readonly = false; }, 0);\n\t}\n\n\t_onfocusin(evt: FocusEvent) {\n\t\tif (this._isPhone) {\n\t\t\tthis._hideMobileKeyboard();\n\t\t\tif (this._isInputsPopoverOpen) {\n\t\t\t\tconst popover = this._getInputsPopover();\n\t\t\t\tpopover.applyFocus();\n\t\t\t}\n\t\t\tevt.preventDefault();\n\t\t}\n\t}\n\n\t_oninput(evt: CustomEvent) {\n\t\tif (this._isPhone) {\n\t\t\tevt.preventDefault();\n\t\t}\n\t}\n\n\tget submitButtonLabel() {\n\t\treturn TimePicker.i18nBundle.getText(TIMEPICKER_SUBMIT_BUTTON);\n\t}\n\n\tget cancelButtonLabel() {\n\t\treturn TimePicker.i18nBundle.getText(TIMEPICKER_CANCEL_BUTTON);\n\t}\n\n\t/**\n\t * @protected\n\t */\n\tget openIconName() {\n\t\treturn \"time-entry-request\";\n\t}\n}\n\nTimePicker.define();\n\nexport default TimePicker;\nexport type {\n\tTimeSelectionChangeEventDetail,\n\tTimePickerChangeEventDetail,\n\tTimePickerInputEventDetail,\n};\n"]}

package/dist/TimePickerInternals.d.ts

@@ -12,7 +12,7 @@ type TimePickerComponentIndexMap = {
 };
 type TimeSelectionPeriodProperties = {
     label: string;
-    pressed: boolean;
+    selected: boolean;
 };
 type TimeSelectionChangeEventDetail = {
     value: string | undefined;
@@ -122,8 +122,8 @@ declare class TimePickerInternals extends UI5Element {
     get _hasMinutesComponent(): boolean;
     get _hasSecondsComponent(): boolean;
     get _hasPeriodsComponent(): boolean;
-    get dateValue(): Date;
-    get validDateValue(): Date;
+    get dateValue(): Date | import("sap/ui/core/date/UI5Date").default;
+    get validDateValue(): Date | import("sap/ui/core/date/UI5Date").default;
     get periodsArray(): string[];
     get _hours(): string;
     get _minutes(): string;