@ui5/webcomponents 0.0.0-037d08c67

package/dist/TimePickerClock.js

@@ -0,0 +1,560 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+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-strict.js";
+import query from "@ui5/webcomponents-base/dist/decorators/query.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
+// Template
+import TimePickerClockTemplate from "./TimePickerClockTemplate.js";
+// Styles
+import TimePickerClockCss from "./generated/themes/TimePickerClock.css.js";
+const CLOCK_NUMBER_CLASS = "ui5-tp-clock-number";
+const CLOCK_NUMBER_SELECTED_CLASS = "ui5-tp-clock-selected";
+const CLOCK_NUMBER_HOVERED_CLASS = "ui5-tp-clock-hovered";
+const CLOCK_MIDDOT_CLASS = "ui5-tp-clock-mid-dot";
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * `ui5-time-picker-clock` allows selecting of hours,minutes or seconds (depending on property set).
+ * The component supports interactions with mouse, touch and mouse wheel.
+ * The step for displaying or selecting of items can be configured.
+ *
+ * `ui5-time-picker-clock` is used as part of `ui5-time-selection-clocks` component, which
+ * is used in `ui5-time-picker` component respectively.
+ *
+ * ### Usage
+ *
+ * `ui5-time-picker-clock` can display hours, minutes or seconds
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/TimePickerClock.js";`
+ * @constructor
+ * @extends UI5Element
+ * @since 1.15.0
+ * @private
+ */
+let TimePickerClock = class TimePickerClock extends UI5Element {
+    constructor() {
+        super();
+        /**
+         * Determines whether the component is displayed as disabled.
+         * @default false
+         */
+        this.disabled = false;
+        /**
+         * Determines whether the component is active (visible).
+         * @default false
+         */
+        this.active = false;
+        /**
+         * Minimum item value for the circle of the clock.
+         * @default -1
+         */
+        this.itemMin = -1;
+        /**
+         * Maximum item value for the circle of the clock.
+         * @default -1
+         */
+        this.itemMax = -1;
+        /**
+         * If set to `true`, a surrounding circle with markers (dots) will be hidden.
+         * (for example, on the 'Minutes' clock-dial, markers represent minutes).
+         * @default false
+         */
+        this.hideFractions = false;
+        /**
+         * If provided, this will replace the last item displayed. Usually, the last item ('12', '24' or '60') is replaced with '0'.
+         * @default -1
+         */
+        this.lastItemReplacement = -1;
+        /**
+         * Prepend with zero flag. If `true`, values less than 10 will be prepend with 0.
+         * @default false
+         */
+        this.prependZero = false;
+        /**
+         * The currently selected value of the clock.
+         * @default -1
+         */
+        this.selectedValue = -1;
+        /**
+         * The step for displaying of one unit of items.
+         * 1 means 1/60 of the circle.
+         * The default display step is 5 which means minutes and seconds are displayed as "0", "5", "10", etc.
+         * For hours the display step must be set to 1.
+         * @default 5
+         */
+        this.displayStep = 5;
+        /**
+         * The step for selection of items.
+         * 1 means 1 unit:
+         * - if the clock displays hours - 1 unit = 1 hour
+         * - if the clock displays minutes/seconds - 1 unit = 1 minute/second
+         * @default 1
+         */
+        this.valueStep = 1;
+        /**
+         * Defines the currently available Time Picker Clock items depending on Clock setup.
+         */
+        this._items = [];
+        /**
+         * Defines the currently selected Time Picker Clock item.
+         */
+        this._selectedItem = {};
+        /**
+         * Defines the currently hovered Time Picker Clock item.
+         */
+        this._hoveredItem = {};
+        /**
+         * Keeps variables used in interaction calculations.
+         */
+        this._dimensionParameters = {
+            radius: 0,
+            centerX: 0,
+            centerY: 0,
+            dotHeight: 0,
+            numberHeight: 0,
+            activeRadiusMax: 0,
+            activeRadiusMin: 0,
+            offsetX: 0,
+            offsetY: 0,
+        };
+        /**
+         * Mousedown or Touchstart event flag.
+         * @default false
+         */
+        this._mouseOrTouchDown = false;
+        /**
+         * Cancel Mouseout flag.
+         * @default false
+         */
+        this._cancelTouchOut = false;
+        /**
+         * Calculated selected value of the clock during interactions.
+         * @default -1
+         */
+        this._selectedValue = -1;
+        /**
+         * Selected value of the clock during interactions.
+         * @default -1
+         */
+        this._movSelectedValue = -1;
+        /**
+         * Hovered value of the clock during interactions.
+         * @default -1
+         */
+        this._hoveredValue = -1;
+        /**
+         * Previously hovered value of the clock during interactions.
+         * @default -1
+         */
+        this._prevHoveredValue = -1;
+        /**
+         * Animation skip flag. If set to `true`, the component will not have transition animation when displayed.
+         * @default false
+         */
+        this._skipAnimation = false;
+        this._fnOnMouseOutUp = () => {
+            this._mouseOrTouchDown = false;
+        };
+    }
+    onEnterDOM() {
+        document.addEventListener("mouseup", this._fnOnMouseOutUp, false);
+    }
+    onExitDOM() {
+        document.removeEventListener("mouseup", this._fnOnMouseOutUp, false);
+    }
+    onBeforeRendering() {
+        this._prepareClockItems();
+        this._selectedItem = this._updateSelectedOrHoveredItem(this._fixReplacementValue(this.selectedValue), CLOCK_NUMBER_SELECTED_CLASS);
+        this._hoveredItem = this._updateSelectedOrHoveredItem(this._fixReplacementValue(this._hoveredValue), CLOCK_NUMBER_HOVERED_CLASS);
+    }
+    get _itemsCount() {
+        return this.itemMax - this.itemMin + 1;
+    }
+    get _angleStep() {
+        return this.hideFractions ? 360 / this._itemsCount : 6;
+    }
+    /**
+     * Returns the real value of the passed clock item, if the replacement must be done, returns the replaced value.
+     * @param value The value of the clock item
+     * @returns The real/replaced value
+     */
+    _fixReplacementValue(value) {
+        let realValue = value;
+        if (realValue === 0) {
+            realValue = this.itemMax;
+        }
+        if (realValue === this.itemMax && this.lastItemReplacement !== -1) {
+            realValue = this.lastItemReplacement;
+        }
+        return realValue;
+    }
+    /**
+     * Returns internally selected or hovered value object constructed for rendering purposes.
+     * @param value currently selected or hovered value.
+     * @returns Selected or hovered value object
+     */
+    _updateSelectedOrHoveredItem(value, cssClass) {
+        if (value === -1) {
+            return {
+                showMarker: false,
+            };
+        }
+        const selectedOrHoveredItem = (value >= this.itemMin && value <= this.itemMax) || value === this.lastItemReplacement;
+        const stepAngle = 360 / (this.itemMax - this.itemMin + 1);
+        let currentAngle = selectedOrHoveredItem ? value * stepAngle : undefined;
+        if (currentAngle !== undefined) {
+            currentAngle %= 360;
+        }
+        return {
+            "angle": currentAngle,
+            "item": selectedOrHoveredItem ? value.toString() : "",
+            "showMarker": selectedOrHoveredItem,
+            "itemClasses": `${CLOCK_NUMBER_CLASS} ${selectedOrHoveredItem ? cssClass : ""}`,
+        };
+    }
+    /**
+     * Prepares clock items objects according to current clock settings. Item objects are used for rendering purposes.
+     */
+    _prepareClockItems() {
+        const values = [];
+        const angleStep = this._angleStep;
+        const visualItemsCount = 360 / angleStep;
+        const multiplier = visualItemsCount / this._itemsCount;
+        let item;
+        let i;
+        this._items = [];
+        for (i = this.itemMin; i <= this.itemMax; i++) {
+            values.push({
+                "item": i.toString(),
+            });
+        }
+        if (this.lastItemReplacement !== -1) {
+            values[values.length - 1].item = this.lastItemReplacement.toString();
+        }
+        for (i = 1; i <= visualItemsCount; i++) {
+            item = i % (this.displayStep * multiplier) !== 0 ? {} : values[i / multiplier - 1];
+            item.angle = i * angleStep;
+            this._items.push(item);
+        }
+    }
+    /**
+     * Returns the DOM Reference of the clock cover element
+     * @returns the DOM Reference
+     */
+    _getClockCoverContainerDomRef() {
+        const domRef = this.getDomRef();
+        return domRef && domRef.querySelector(".ui5-tp-clock-cover");
+    }
+    /**
+     * Calculates the outer height of a HTML element.
+     * @param element The element which outer height to be calculated
+     * @returns Outer height of the passed HTML element
+     */
+    _outerHeight(element) {
+        if (!element) {
+            return 0;
+        }
+        const style = window.getComputedStyle(element);
+        return element.offsetHeight + parseInt(style.marginTop) + parseInt(style.marginBottom);
+    }
+    /**
+     * Returns the Id of the DOM element of the clock item that display specific value.
+     * @param value The value of the clock item
+     * @returns Id of the clock item element
+     */
+    _hoveredId(value) {
+        if (value === this.itemMax && this.lastItemReplacement !== -1) {
+            value = this.lastItemReplacement;
+        }
+        return `#${this._id}-${value.toString()}`;
+    }
+    /**
+     * Returns provided value as string. Padding with additional zero is applied if necessary.
+     * @param value The value that should be returned as string
+     * @returns The value as string
+     */
+    _getStringValue(value) {
+        return this.prependZero ? value.toString().padStart(2, "0") : value.toString();
+    }
+    /**
+     * Calculates dimension variables necessary for determining of item selection.
+     * @returns Dimensions object
+     */
+    _calculateDimensions() {
+        const cover = this.getDomRef();
+        const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
+        const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
+        if (!cover) {
+            return;
+        }
+        const domRef = this.getDomRef();
+        const dotElement = domRef.querySelector(`.${CLOCK_MIDDOT_CLASS}`);
+        const numberElement = domRef.querySelector(`.${CLOCK_NUMBER_CLASS}`);
+        const radius = Math.round(cover.offsetHeight / 2);
+        const dotHeight = this._outerHeight(dotElement);
+        const numberHeight = this._outerHeight(numberElement);
+        const offset = cover.getBoundingClientRect();
+        this._dimensionParameters = {
+            "radius": radius,
+            "centerX": radius,
+            "centerY": radius,
+            "dotHeight": dotHeight,
+            "numberHeight": numberHeight,
+            "activeRadiusMax": radius,
+            "activeRadiusMin": radius - numberHeight * 1.5 - 1,
+            "offsetX": offset.left + scrollLeft,
+            "offsetY": offset.top + scrollTop,
+        };
+    }
+    /**
+     * Calculates selected and hovered values based on click/touch position.
+     * @param x X position of click/touch returned by the event
+     * @param y Y position of click/touch returned by the event
+     */
+    _calculatePosition(x, y) {
+        const dX = x - this._dimensionParameters.offsetX + 1 - this._dimensionParameters.radius;
+        const dY = y - this._dimensionParameters.offsetY + 1 - this._dimensionParameters.radius;
+        const mod = dX >= 0 ? 0 : 180;
+        const angle = ((Math.atan(dY / dX) * 180) / Math.PI) + 90 + mod;
+        const angleStep = (360 / this.itemMax) * this.valueStep;
+        const radius = Math.sqrt(dX * dX + dY * dY);
+        const isInActiveZone = radius <= this._dimensionParameters.activeRadiusMax && radius > this._dimensionParameters.activeRadiusMin;
+        let finalAngle = Math.round((angle === 0 ? 360 : angle) / angleStep) * angleStep;
+        if (finalAngle === 0) {
+            finalAngle = 360;
+        }
+        // selected item calculations
+        this._selectedValue = isInActiveZone ? (finalAngle / angleStep) * this.valueStep : -1;
+        // hover simulation calculations
+        this._hoveredValue = isInActiveZone ? this._selectedValue : -1;
+        if (this._selectedValue === this.itemMax && this.lastItemReplacement !== -1) {
+            this._selectedValue = this.lastItemReplacement;
+        }
+    }
+    /**
+     * Mousewheel handler. Increases/decreases value of the clock.
+     * @param increase whether to increase or decrease the value
+     */
+    _modifyValue(increase) {
+        let selectedValue = this.selectedValue;
+        const replacementValue = this.lastItemReplacement;
+        let step = this.valueStep;
+        let newValue;
+        // fix step in order to change value to the nearest possible if step is > 1
+        if (selectedValue % step !== 0) {
+            newValue = increase ? Math.ceil(selectedValue / step) * step : Math.floor(selectedValue / step) * step;
+            step = Math.abs(selectedValue - newValue);
+        }
+        if (selectedValue === replacementValue) {
+            selectedValue = this.itemMax;
+        }
+        if (increase) {
+            selectedValue += step;
+            if (selectedValue > this.itemMax) {
+                selectedValue -= this.itemMax;
+            }
+        }
+        else {
+            selectedValue -= step;
+            if (selectedValue < this.itemMin) {
+                selectedValue = this.itemMax;
+            }
+        }
+        this._setSelectedValue(selectedValue);
+    }
+    /**
+     * Sets new selected value, fires change event and updates selected value object used for rendering purposes.
+     * @param value a value to be set
+     * @param bFinalChange whether the change is final or not
+     */
+    _setSelectedValue(value, bFinalChange = false) {
+        const realValue = this._fixReplacementValue(value);
+        this.selectedValue = realValue;
+        this.fireDecoratorEvent("change", {
+            value: realValue,
+            stringValue: this._getStringValue(realValue),
+            finalChange: bFinalChange,
+        });
+        this._selectedItem = this._updateSelectedOrHoveredItem(realValue, CLOCK_NUMBER_SELECTED_CLASS);
+    }
+    /**
+     * TouchStart/MouseDown event handler.
+     * @param evt Event object
+     */
+    _onTouchStart(evt) {
+        this._cancelTouchOut = false;
+        if (this.disabled || this._mouseOrTouchDown) {
+            return;
+        }
+        const x = evt.type === "touchstart" ? evt.touches[0].pageX : evt.pageX;
+        const y = evt.type === "touchstart" ? evt.touches[0].pageY : evt.pageY;
+        this._movSelectedValue = this.selectedValue;
+        this._calculateDimensions();
+        this._calculatePosition(x, y);
+        this._mouseOrTouchDown = true;
+    }
+    /**
+     * TouchMove/MouseMove event handler.
+     * @param evt Event object
+     */
+    _onTouchMove(evt) {
+        evt.preventDefault();
+        if (this._mouseOrTouchDown) {
+            const x = evt.type === "touchmove" ? evt.touches[0].pageX : evt.pageX;
+            const y = evt.type === "touchmove" ? evt.touches[0].pageY : evt.pageY;
+            this._calculatePosition(x, y);
+            if (!this.disabled && this._selectedValue !== -1 && this._selectedValue !== this._movSelectedValue) {
+                this._setSelectedValue(this._selectedValue);
+                this._movSelectedValue = 0 + this._selectedValue;
+            }
+        }
+        else if (evt.type === "mousemove") {
+            if (!this._dimensionParameters.radius) {
+                this._calculateDimensions();
+            }
+            this._calculatePosition(evt.pageX, evt.pageY);
+        }
+    }
+    /**
+     * TouchEnd/MouseUp event handler.
+     * @param evt Event object
+     */
+    _onTouchEnd(evt) {
+        if (!this._mouseOrTouchDown) {
+            return;
+        }
+        this._mouseOrTouchDown = false;
+        evt.preventDefault();
+        if (this.disabled || this._selectedValue === -1) {
+            return;
+        }
+        if (!this._cancelTouchOut) {
+            this._setSelectedValue(this._selectedValue, true);
+        }
+    }
+    /**
+     * Mouse Wheel event handler.
+     * @param evt Event object
+     */
+    _onMouseWheel(evt) {
+        const increase = evt.detail ? (evt.detail > 0) : (evt.deltaY > 0 || evt.deltaX > 0);
+        evt.preventDefault();
+        if (!this._mouseOrTouchDown) {
+            this._modifyValue(increase);
+        }
+    }
+    /**
+     * MouseOut event handler.
+     */
+    _onMouseOut() {
+        this._hoveredValue = -1;
+        this._prevHoveredValue = -1;
+    }
+    noop() {
+        return false;
+    }
+};
+__decorate([
+    property({ type: Boolean })
+], TimePickerClock.prototype, "disabled", void 0);
+__decorate([
+    property({ type: Boolean })
+], TimePickerClock.prototype, "active", void 0);
+__decorate([
+    property({ type: Number })
+], TimePickerClock.prototype, "itemMin", void 0);
+__decorate([
+    property({ type: Number })
+], TimePickerClock.prototype, "itemMax", void 0);
+__decorate([
+    property()
+], TimePickerClock.prototype, "label", void 0);
+__decorate([
+    property({ type: Boolean })
+], TimePickerClock.prototype, "hideFractions", void 0);
+__decorate([
+    property({ type: Number })
+], TimePickerClock.prototype, "lastItemReplacement", void 0);
+__decorate([
+    property({ type: Boolean })
+], TimePickerClock.prototype, "prependZero", void 0);
+__decorate([
+    property({ type: Number })
+], TimePickerClock.prototype, "selectedValue", void 0);
+__decorate([
+    property({ type: Number })
+], TimePickerClock.prototype, "displayStep", void 0);
+__decorate([
+    property({ type: Number })
+], TimePickerClock.prototype, "valueStep", void 0);
+__decorate([
+    property({ type: Array })
+], TimePickerClock.prototype, "_items", void 0);
+__decorate([
+    property({ type: Object })
+], TimePickerClock.prototype, "_selectedItem", void 0);
+__decorate([
+    property({ type: Object })
+], TimePickerClock.prototype, "_hoveredItem", void 0);
+__decorate([
+    property({ type: Object })
+], TimePickerClock.prototype, "_dimensionParameters", void 0);
+__decorate([
+    property({ type: Boolean, noAttribute: true })
+], TimePickerClock.prototype, "_mouseOrTouchDown", void 0);
+__decorate([
+    property({ type: Boolean, noAttribute: true })
+], TimePickerClock.prototype, "_cancelTouchOut", void 0);
+__decorate([
+    property({ type: Number, noAttribute: true })
+], TimePickerClock.prototype, "_selectedValue", void 0);
+__decorate([
+    property({ type: Number, noAttribute: true })
+], TimePickerClock.prototype, "_movSelectedValue", void 0);
+__decorate([
+    property({ type: Number, noAttribute: true })
+], TimePickerClock.prototype, "_hoveredValue", void 0);
+__decorate([
+    property({ type: Number, noAttribute: true })
+], TimePickerClock.prototype, "_prevHoveredValue", void 0);
+__decorate([
+    property({ type: Boolean })
+], TimePickerClock.prototype, "_skipAnimation", void 0);
+__decorate([
+    query(".ui5-tp-clock-number")
+], TimePickerClock.prototype, "_firstNumberElement", void 0);
+__decorate([
+    query(".ui5-tp-clock")
+], TimePickerClock.prototype, "_clockWrapper", void 0);
+TimePickerClock = __decorate([
+    customElement({
+        tag: "ui5-time-picker-clock",
+        renderer: jsxRenderer,
+        styles: TimePickerClockCss,
+        template: TimePickerClockTemplate,
+    })
+    /**
+     * Fired when a value of clock is changed.
+     * @param { integer } value The new `value` of the clock.
+     * @param { string } stringValue The new `value` of the clock, as string, zero-prepended when necessary.
+     * @param { boolean } finalChange `true` when a value is selected and confirmed, `false` when a value is only selected but not confirmed.
+     */
+    ,
+    event("change", {
+        bubbles: true,
+    })
+], TimePickerClock);
+TimePickerClock.define();
+export default TimePickerClock;
+//# sourceMappingURL=TimePickerClock.js.map

package/dist/TimePickerClock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePickerClock.js","sourceRoot":"","sources":["../src/TimePickerClock.ts"],"names":[],"mappings":"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","sourcesContent":["import 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-strict.js\";\nimport query from \"@ui5/webcomponents-base/dist/decorators/query.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\n\n// Template\nimport TimePickerClockTemplate from \"./TimePickerClockTemplate.js\";\n\n// Styles\nimport TimePickerClockCss from \"./generated/themes/TimePickerClock.css.js\";\n\ntype TimePickerClockChangeEventDetail = {\n\tvalue: number,\n\tstringValue: string,\n\tfinalChange: boolean,\n}\n\ntype TimePickerClockItem = {\n\tangle?: number,\n\titem?: string,\n}\n\ntype TimePickerClockSelection = {\n\tshowMarker?: boolean,\n\titemClasses?: string,\n}\n\ntype TimePickerClockDimensions = {\n\tradius: number,\n\tcenterX: number,\n\tcenterY: number,\n\tdotHeight: number,\n\tnumberHeight: number,\n\tactiveRadiusMax: number,\n\tactiveRadiusMin: number,\n\toffsetX: number,\n\toffsetY: number,\n}\n\ntype TimePickerClockSelectedItem = TimePickerClockItem & TimePickerClockSelection;\n\nconst CLOCK_NUMBER_CLASS = \"ui5-tp-clock-number\";\nconst CLOCK_NUMBER_SELECTED_CLASS = \"ui5-tp-clock-selected\";\nconst CLOCK_NUMBER_HOVERED_CLASS = \"ui5-tp-clock-hovered\";\nconst CLOCK_MIDDOT_CLASS = \"ui5-tp-clock-mid-dot\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * `ui5-time-picker-clock` allows selecting of hours,minutes or seconds (depending on property set).\n * The component supports interactions with mouse, touch and mouse wheel.\n * The step for displaying or selecting of items can be configured.\n *\n * `ui5-time-picker-clock` is used as part of `ui5-time-selection-clocks` component, which\n * is used in `ui5-time-picker` component respectively.\n *\n * ### Usage\n *\n * `ui5-time-picker-clock` can display hours, minutes or seconds\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/TimePickerClock.js\";`\n * @constructor\n * @extends UI5Element\n * @since 1.15.0\n * @private\n */\n@customElement({\n\ttag: \"ui5-time-picker-clock\",\n\trenderer: jsxRenderer,\n\tstyles: TimePickerClockCss,\n\ttemplate: TimePickerClockTemplate,\n})\n\n/**\n * Fired when a value of clock is changed.\n * @param { integer } value The new `value` of the clock.\n * @param { string } stringValue The new `value` of the clock, as string, zero-prepended when necessary.\n * @param { boolean } finalChange `true` when a value is selected and confirmed, `false` when a value is only selected but not confirmed.\n */\n@event(\"change\", {\n\tbubbles: true,\n})\n\nclass TimePickerClock extends UI5Element {\n\teventDetails!: {\n\t\tchange: TimePickerClockChangeEventDetail,\n\t};\n\n\t/**\n\t * Determines whether the component is displayed as disabled.\n\t * @default false\n\t */\n\t@property({ type: Boolean })\n\tdisabled = false;\n\n\t/**\n\t * Determines whether the component is active (visible).\n\t * @default false\n\t */\n\t@property({ type: Boolean })\n\tactive = false;\n\n\t/**\n\t * Minimum item value for the circle of the clock.\n\t * @default -1\n\t */\n\t@property({ type: Number })\n\titemMin = -1;\n\n\t/**\n\t * Maximum item value for the circle of the clock.\n\t * @default -1\n\t */\n\t@property({ type: Number })\n\titemMax = -1;\n\n\t/**\n\t * Label of the clock dial - for example, 'Hours', 'Minutes', or 'Seconds'.\n\t * @default undefined\n\t */\n\t@property()\n\tlabel?: string;\n\n\t/**\n\t * If set to `true`, a surrounding circle with markers (dots) will be hidden.\n\t * (for example, on the 'Minutes' clock-dial, markers represent minutes).\n\t * @default false\n\t */\n\t@property({ type: Boolean })\n\thideFractions = false;\n\n\t/**\n\t * If provided, this will replace the last item displayed. Usually, the last item ('12', '24' or '60') is replaced with '0'.\n\t * @default -1\n\t */\n\t@property({ type: Number })\n\tlastItemReplacement = -1;\n\n\t/**\n\t * Prepend with zero flag. If `true`, values less than 10 will be prepend with 0.\n\t * @default false\n\t */\n\t@property({ type: Boolean })\n\tprependZero = false;\n\n\t/**\n\t * The currently selected value of the clock.\n\t * @default -1\n\t */\n\t@property({ type: Number })\n\tselectedValue = -1\n\n\t/**\n\t * The step for displaying of one unit of items.\n\t * 1 means 1/60 of the circle.\n\t * The default display step is 5 which means minutes and seconds are displayed as \"0\", \"5\", \"10\", etc.\n\t * For hours the display step must be set to 1.\n\t * @default 5\n\t */\n\t@property({ type: Number })\n\tdisplayStep = 5;\n\n\t/**\n\t * The step for selection of items.\n\t * 1 means 1 unit:\n\t * - if the clock displays hours - 1 unit = 1 hour\n\t * - if the clock displays minutes/seconds - 1 unit = 1 minute/second\n\t * @default 1\n\t */\n\t@property({ type: Number })\n\tvalueStep = 1;\n\n\t/**\n\t * Defines the currently available Time Picker Clock items depending on Clock setup.\n\t */\n\t@property({ type: Array })\n\t_items: Array<TimePickerClockItem> = [];\n\n\t/**\n\t * Defines the currently selected Time Picker Clock item.\n\t */\n\t@property({ type: Object })\n\t_selectedItem: TimePickerClockSelectedItem = {};\n\n\t/**\n\t * Defines the currently hovered Time Picker Clock item.\n\t */\n\t@property({ type: Object })\n\t_hoveredItem: TimePickerClockSelectedItem = {};\n\n\t/**\n\t * Keeps variables used in interaction calculations.\n\t */\n\t@property({ type: Object })\n\t_dimensionParameters: TimePickerClockDimensions = {\n\t\tradius: 0,\n\t\tcenterX: 0,\n\t\tcenterY: 0,\n\t\tdotHeight: 0,\n\t\tnumberHeight: 0,\n\t\tactiveRadiusMax: 0,\n\t\tactiveRadiusMin: 0,\n\t\toffsetX: 0,\n\t\toffsetY: 0,\n\t};\n\n\t/**\n\t * Mousedown or Touchstart event flag.\n\t * @default false\n\t */\n\t@property({ type: Boolean, noAttribute: true })\n\t_mouseOrTouchDown = false;\n\n\t/**\n\t * Cancel Mouseout flag.\n\t * @default false\n\t */\n\t@property({ type: Boolean, noAttribute: true })\n\t_cancelTouchOut = false;\n\n\t/**\n\t * Calculated selected value of the clock during interactions.\n\t * @default -1\n\t */\n\t@property({ type: Number, noAttribute: true })\n\t_selectedValue = -1;\n\n\t/**\n\t * Selected value of the clock during interactions.\n\t * @default -1\n\t */\n\t@property({ type: Number, noAttribute: true })\n\t_movSelectedValue = -1;\n\n\t/**\n\t * Hovered value of the clock during interactions.\n\t * @default -1\n\t */\n\t@property({ type: Number, noAttribute: true })\n\t_hoveredValue = -1;\n\n\t/**\n\t * Previously hovered value of the clock during interactions.\n\t * @default -1\n\t */\n\t@property({ type: Number, noAttribute: true })\n\t_prevHoveredValue = -1;\n\n\t/**\n\t * Animation skip flag. If set to `true`, the component will not have transition animation when displayed.\n\t * @default false\n\t */\n\t@property({ type: Boolean })\n\t_skipAnimation = false;\n\n\t@query(\".ui5-tp-clock-number\")\n\t_firstNumberElement?: HTMLElement;\n\n\t@query(\".ui5-tp-clock\")\n\t_clockWrapper?: HTMLElement;\n\n\t_fnOnMouseOutUp: () => void;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._fnOnMouseOutUp = () => {\n\t\t\tthis._mouseOrTouchDown = false;\n\t\t};\n\t}\n\n\tonEnterDOM() {\n\t\tdocument.addEventListener(\"mouseup\", this._fnOnMouseOutUp, false);\n\t}\n\n\tonExitDOM() {\n\t\tdocument.removeEventListener(\"mouseup\", this._fnOnMouseOutUp, false);\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._prepareClockItems();\n\t\tthis._selectedItem = this._updateSelectedOrHoveredItem(this._fixReplacementValue(this.selectedValue), CLOCK_NUMBER_SELECTED_CLASS);\n\t\tthis._hoveredItem = this._updateSelectedOrHoveredItem(this._fixReplacementValue(this._hoveredValue), CLOCK_NUMBER_HOVERED_CLASS);\n\t}\n\n\tget _itemsCount(): number {\n\t\treturn this.itemMax - this.itemMin + 1;\n\t}\n\n\tget _angleStep(): number {\n\t\treturn this.hideFractions ? 360 / this._itemsCount : 6;\n\t}\n\n\t/**\n\t * Returns the real value of the passed clock item, if the replacement must be done, returns the replaced value.\n\t * @param value The value of the clock item\n\t * @returns The real/replaced value\n\t */\n\t_fixReplacementValue(value: number): number {\n\t\tlet realValue = value;\n\n\t\tif (realValue === 0) {\n\t\t\trealValue = this.itemMax;\n\t\t}\n\t\tif (realValue === this.itemMax && this.lastItemReplacement !== -1) {\n\t\t\trealValue = this.lastItemReplacement;\n\t\t}\n\n\t\treturn realValue;\n\t}\n\n\t/**\n\t * Returns internally selected or hovered value object constructed for rendering purposes.\n\t * @param value currently selected or hovered value.\n\t * @returns Selected or hovered value object\n\t */\n\t_updateSelectedOrHoveredItem(value: number, cssClass?: string): TimePickerClockSelectedItem {\n\t\tif (value === -1) {\n\t\t\treturn {\n\t\t\t\tshowMarker: false,\n\t\t\t};\n\t\t}\n\n\t\tconst selectedOrHoveredItem = (value >= this.itemMin && value <= this.itemMax) || value === this.lastItemReplacement;\n\t\tconst stepAngle = 360 / (this.itemMax - this.itemMin + 1);\n\t\tlet currentAngle: number | undefined = selectedOrHoveredItem ? value * stepAngle : undefined;\n\n\t\tif (currentAngle !== undefined) {\n\t\t\tcurrentAngle %= 360;\n\t\t}\n\n\t\treturn {\n\t\t\t\"angle\": currentAngle,\n\t\t\t\"item\": selectedOrHoveredItem ? value.toString() : \"\",\n\t\t\t\"showMarker\": selectedOrHoveredItem,\n\t\t\t\"itemClasses\": `${CLOCK_NUMBER_CLASS} ${selectedOrHoveredItem ? cssClass : \"\"}`,\n\t\t};\n\t}\n\n\t/**\n\t * Prepares clock items objects according to current clock settings. Item objects are used for rendering purposes.\n\t */\n\t_prepareClockItems() {\n\t\tconst values = [];\n\t\tconst angleStep = this._angleStep;\n\t\tconst visualItemsCount = 360 / angleStep;\n\t\tconst multiplier = visualItemsCount / this._itemsCount;\n\t\tlet item: TimePickerClockItem;\n\t\tlet i;\n\n\t\tthis._items = [];\n\n\t\tfor (i = this.itemMin; i <= this.itemMax; i++) {\n\t\t\tvalues.push({\n\t\t\t\t\"item\": i.toString(),\n\t\t\t});\n\t\t}\n\t\tif (this.lastItemReplacement !== -1) {\n\t\t\tvalues[values.length - 1].item = this.lastItemReplacement.toString();\n\t\t}\n\n\t\tfor (i = 1; i <= visualItemsCount; i++) {\n\t\t\titem = i % (this.displayStep * multiplier) !== 0 ? {} : values[i / multiplier - 1];\n\t\t\titem.angle = i * angleStep;\n\t\t\tthis._items.push(item);\n\t\t}\n\t}\n\n\t/**\n\t * Returns the DOM Reference of the clock cover element\n\t * @returns the DOM Reference\n\t */\n\t_getClockCoverContainerDomRef(): Element | null | undefined {\n\t\tconst domRef = this.getDomRef();\n\t\treturn domRef && domRef.querySelector(\".ui5-tp-clock-cover\");\n\t}\n\n\t/**\n\t * Calculates the outer height of a HTML element.\n\t * @param element The element which outer height to be calculated\n\t * @returns Outer height of the passed HTML element\n\t */\n\t_outerHeight(element: HTMLElement): number {\n\t\tif (!element) {\n\t\t\treturn 0;\n\t\t}\n\n\t\tconst style = window.getComputedStyle(element);\n\n\t\treturn element.offsetHeight + parseInt(style.marginTop) + parseInt(style.marginBottom);\n\t}\n\n\t/**\n\t * Returns the Id of the DOM element of the clock item that display specific value.\n\t * @param value The value of the clock item\n\t * @returns Id of the clock item element\n\t */\n\t_hoveredId(value: number): string {\n\t\tif (value === this.itemMax && this.lastItemReplacement !== -1) {\n\t\t\tvalue = this.lastItemReplacement;\n\t\t}\n\n\t\treturn `#${this._id}-${value.toString()}`;\n\t}\n\n\t/**\n\t * Returns provided value as string. Padding with additional zero is applied if necessary.\n\t * @param value The value that should be returned as string\n\t * @returns The value as string\n\t */\n\t_getStringValue(value: number): string {\n\t\treturn this.prependZero ? value.toString().padStart(2, \"0\") : value.toString();\n\t}\n\n\t/**\n\t * Calculates dimension variables necessary for determining of item selection.\n\t * @returns Dimensions object\n\t */\n\t_calculateDimensions(): TimePickerClockDimensions | undefined {\n\t\tconst cover = this.getDomRef() as HTMLElement;\n\t\tconst scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;\n\t\tconst scrollTop = window.pageYOffset || document.documentElement.scrollTop;\n\n\t\tif (!cover) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst domRef = this.getDomRef() as HTMLElement;\n\t\tconst dotElement = domRef.querySelector(`.${CLOCK_MIDDOT_CLASS}`) as HTMLElement;\n\t\tconst numberElement = domRef.querySelector(`.${CLOCK_NUMBER_CLASS}`) as HTMLElement;\n\t\tconst radius = Math.round(cover.offsetHeight / 2);\n\t\tconst dotHeight = this._outerHeight(dotElement);\n\t\tconst numberHeight = this._outerHeight(numberElement);\n\t\tconst offset = cover.getBoundingClientRect();\n\n\t\tthis._dimensionParameters = {\n\t\t\t\"radius\": radius,\n\t\t\t\"centerX\": radius,\n\t\t\t\"centerY\": radius,\n\t\t\t\"dotHeight\": dotHeight,\n\t\t\t\"numberHeight\": numberHeight,\n\t\t\t\"activeRadiusMax\": radius,\n\t\t\t\"activeRadiusMin\": radius - numberHeight * 1.5 - 1,\n\t\t\t\"offsetX\": offset.left + scrollLeft,\n\t\t\t\"offsetY\": offset.top + scrollTop,\n\t\t};\n\t}\n\n\t/**\n\t * Calculates selected and hovered values based on click/touch position.\n\t * @param x X position of click/touch returned by the event\n\t * @param y Y position of click/touch returned by the event\n\t */\n\t_calculatePosition(x: number, y: number) {\n\t\tconst dX = x - this._dimensionParameters.offsetX + 1 - this._dimensionParameters.radius;\n\t\tconst dY = y - this._dimensionParameters.offsetY + 1 - this._dimensionParameters.radius;\n\t\tconst mod = dX >= 0 ? 0 : 180;\n\t\tconst angle = ((Math.atan(dY / dX) * 180) / Math.PI) + 90 + mod;\n\t\tconst angleStep = (360 / this.itemMax) * this.valueStep;\n\t\tconst radius = Math.sqrt(dX * dX + dY * dY);\n\t\tconst isInActiveZone = radius <= this._dimensionParameters.activeRadiusMax && radius > this._dimensionParameters.activeRadiusMin;\n\t\tlet finalAngle = Math.round((angle === 0 ? 360 : angle) / angleStep) * angleStep;\n\n\t\tif (finalAngle === 0) {\n\t\t\tfinalAngle = 360;\n\t\t}\n\n\t\t// selected item calculations\n\t\tthis._selectedValue = isInActiveZone ? (finalAngle / angleStep) * this.valueStep : -1;\n\n\t\t// hover simulation calculations\n\t\tthis._hoveredValue = isInActiveZone ? this._selectedValue : -1;\n\n\t\tif (this._selectedValue === this.itemMax && this.lastItemReplacement !== -1) {\n\t\t\tthis._selectedValue = this.lastItemReplacement;\n\t\t}\n\t}\n\n\t/**\n\t * Mousewheel handler. Increases/decreases value of the clock.\n\t * @param increase whether to increase or decrease the value\n\t */\n\t_modifyValue(increase: boolean) {\n\t\tlet selectedValue = this.selectedValue;\n\t\tconst replacementValue = this.lastItemReplacement;\n\t\tlet step = this.valueStep;\n\t\tlet newValue;\n\n\t\t// fix step in order to change value to the nearest possible if step is > 1\n\t\tif (selectedValue % step !== 0) {\n\t\t\tnewValue = increase ? Math.ceil(selectedValue / step) * step : Math.floor(selectedValue / step) * step;\n\t\t\tstep = Math.abs(selectedValue - newValue);\n\t\t}\n\n\t\tif (selectedValue === replacementValue) {\n\t\t\tselectedValue = this.itemMax;\n\t\t}\n\t\tif (increase) {\n\t\t\tselectedValue += step;\n\t\t\tif (selectedValue > this.itemMax) {\n\t\t\t\tselectedValue -= this.itemMax;\n\t\t\t}\n\t\t} else {\n\t\t\tselectedValue -= step;\n\t\t\tif (selectedValue < this.itemMin) {\n\t\t\t\tselectedValue = this.itemMax;\n\t\t\t}\n\t\t}\n\n\t\tthis._setSelectedValue(selectedValue);\n\t}\n\n\t/**\n\t * Sets new selected value, fires change event and updates selected value object used for rendering purposes.\n\t * @param value a value to be set\n\t * @param bFinalChange whether the change is final or not\n\t */\n\t_setSelectedValue(value: number, bFinalChange = false) {\n\t\tconst realValue: number = this._fixReplacementValue(value);\n\t\tthis.selectedValue = realValue;\n\t\tthis.fireDecoratorEvent(\"change\", {\n\t\t\tvalue: realValue,\n\t\t\tstringValue: this._getStringValue(realValue),\n\t\t\tfinalChange: bFinalChange,\n\t\t});\n\t\tthis._selectedItem = this._updateSelectedOrHoveredItem(realValue, CLOCK_NUMBER_SELECTED_CLASS);\n\t}\n\n\t/**\n\t * TouchStart/MouseDown event handler.\n\t * @param evt Event object\n\t */\n\t_onTouchStart(evt: Event) {\n\t\tthis._cancelTouchOut = false;\n\t\tif (this.disabled || this._mouseOrTouchDown) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst x = evt.type === \"touchstart\" ? (evt as TouchEvent).touches[0].pageX : (evt as MouseEvent).pageX;\n\t\tconst y = evt.type === \"touchstart\" ? (evt as TouchEvent).touches[0].pageY : (evt as MouseEvent).pageY;\n\n\t\tthis._movSelectedValue = this.selectedValue;\n\t\tthis._calculateDimensions();\n\t\tthis._calculatePosition(x, y);\n\t\tthis._mouseOrTouchDown = true;\n\t}\n\n\t/**\n\t * TouchMove/MouseMove event handler.\n\t * @param evt Event object\n\t */\n\t_onTouchMove(evt: Event) {\n\t\tevt.preventDefault();\n\t\tif (this._mouseOrTouchDown) {\n\t\t\tconst x = evt.type === \"touchmove\" ? (evt as TouchEvent).touches[0].pageX : (evt as MouseEvent).pageX;\n\t\t\tconst y = evt.type === \"touchmove\" ? (evt as TouchEvent).touches[0].pageY : (evt as MouseEvent).pageY;\n\t\t\tthis._calculatePosition(x, y);\n\t\t\tif (!this.disabled && this._selectedValue !== -1 && this._selectedValue !== this._movSelectedValue) {\n\t\t\t\tthis._setSelectedValue(this._selectedValue);\n\t\t\t\tthis._movSelectedValue = 0 + this._selectedValue;\n\t\t\t}\n\t\t} else if (evt.type === \"mousemove\") {\n\t\t\tif (!this._dimensionParameters.radius) {\n\t\t\t\tthis._calculateDimensions();\n\t\t\t}\n\t\t\tthis._calculatePosition((evt as MouseEvent).pageX, (evt as MouseEvent).pageY);\n\t\t}\n\t}\n\n\t/**\n\t * TouchEnd/MouseUp event handler.\n\t * @param evt Event object\n\t */\n\t_onTouchEnd(evt: Event) {\n\t\tif (!this._mouseOrTouchDown) {\n\t\t\treturn;\n\t\t}\n\t\tthis._mouseOrTouchDown = false;\n\t\tevt.preventDefault();\n\t\tif (this.disabled || this._selectedValue === -1) {\n\t\t\treturn;\n\t\t}\n\t\tif (!this._cancelTouchOut) {\n\t\t\tthis._setSelectedValue(this._selectedValue, true);\n\t\t}\n\t}\n\n\t/**\n\t * Mouse Wheel event handler.\n\t * @param evt Event object\n\t */\n\t_onMouseWheel(evt: WheelEvent) {\n\t\tconst increase = evt.detail ? (evt.detail > 0) : (evt.deltaY > 0 || evt.deltaX > 0);\n\n\t\tevt.preventDefault();\n\n\t\tif (!this._mouseOrTouchDown) {\n\t\t\tthis._modifyValue(increase);\n\t\t}\n\t}\n\n\t/**\n\t * MouseOut event handler.\n\t */\n\t_onMouseOut() {\n\t\tthis._hoveredValue = -1;\n\t\tthis._prevHoveredValue = -1;\n\t}\n\n\tnoop() {\n\t\treturn false;\n\t}\n}\n\nTimePickerClock.define();\n\nexport default TimePickerClock;\nexport type { TimePickerClockChangeEventDetail };\n"]}

package/dist/TimePickerClockTemplate.d.ts

@@ -0,0 +1,2 @@
+import type TimePickerClock from "./TimePickerClock.js";
+export default function TimePickerClockTemplate(this: TimePickerClock): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/TimePickerClockTemplate.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+export default function TimePickerClockTemplate() {
+    return (_jsxs("div", { id: `${this._id}`, onDragStart: this.noop, onDrop: this.noop, "aria-hidden": "true", class: {
+            "ui5-tp-clock": true,
+            "ui5-tp-clock-active": this.active,
+        }, children: [_jsx("div", { "data-label": this.label, class: "ui5-tp-clock-dial" }), _jsx("div", { class: "ui5-tp-clock-items", children: this._items.map((item, i) => (_jsx("div", { class: "ui5-tp-clock-item", style: { transform: `translate(-50%) rotate(${(i + 1) * this._angleStep}deg` }, children: item.item ?
+                        _jsxs(_Fragment, { children: [_jsx("span", { class: "ui5-tp-clock-dot" }), _jsx("span", { id: `${this._id}-${item.item}`, class: "ui5-tp-clock-number", style: { transform: `rotate(-${(i + 1) * this._angleStep}deg)` }, children: item.item })] })
+                        :
+                            _jsx("span", { class: "ui5-tp-clock-mid-dot" }) }))) }), _jsxs("div", { class: "ui5-tp-clock-markers", children: [this._selectedItem.showMarker &&
+                        _jsxs("div", { class: "ui5-tp-clock-item", style: { transform: `translate(-50%) rotate(${this._selectedItem.angle || 0}deg)` }, children: [_jsx("div", { class: "ui5-tp-clock-select-marker" }), _jsx("div", { class: this._selectedItem.itemClasses, style: { transform: `rotate(-${this._selectedItem.angle || 0}deg)` }, children: this._selectedItem.item })] }), this._hoveredItem.showMarker &&
+                        _jsxs("div", { class: "ui5-tp-clock-item", style: { transform: `translate(-50%) rotate(${this._hoveredItem.angle || 0}deg)` }, children: [_jsx("div", { class: "ui5-tp-clock-hover-marker" }), _jsx("div", { class: this._hoveredItem.itemClasses, style: { transform: `rotate(-${this._hoveredItem.angle || 0}deg)` }, children: this._hoveredItem.item })] })] }), _jsx("div", { class: {
+                    "ui5-tp-clock-cover": true,
+                    "ui5-tp-clock-pointer": this._hoveredItem.showMarker,
+                }, onTouchStart: this._onTouchStart, onTouchMove: this._onTouchMove, onTouchEnd: this._onTouchEnd, onMouseDown: this._onTouchStart, onMouseMove: this._onTouchMove, onMouseUp: this._onTouchEnd, onMouseOut: this._onMouseOut, onWheel: this._onMouseWheel })] }));
+}
+//# sourceMappingURL=TimePickerClockTemplate.js.map

package/dist/TimePickerClockTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePickerClockTemplate.js","sourceRoot":"","sources":["../src/TimePickerClockTemplate.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,uBAAuB;IAC9C,OAAO,CACN,eACC,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,EACjB,WAAW,EAAE,IAAI,CAAC,IAAI,EACtB,MAAM,EAAE,IAAI,CAAC,IAAI,iBACL,MAAM,EAClB,KAAK,EAAE;YACN,cAAc,EAAE,IAAI;YACpB,qBAAqB,EAAE,IAAI,CAAC,MAAM;SAClC,aAGD,4BAAiB,IAAI,CAAC,KAAK,EAAE,KAAK,EAAC,mBAAmB,GAAO,EAE7D,cAAK,KAAK,EAAC,oBAAoB,YAC7B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CAC7B,cAAK,KAAK,EAAC,mBAAmB,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,0BAA0B,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,KAAK,EAAE,YAC1G,IAAI,CAAC,IAAI,CAAC,CAAC;wBACZ,8BACC,eAAM,KAAK,EAAC,kBAAkB,GAAQ,EACtC,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,IAAI,EAAE,EACnC,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAE,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,MAAM,EAAE,YAE/D,IAAI,CAAC,IAAI,GACJ,IACL;wBACH,CAAC;4BACD,eAAM,KAAK,EAAC,sBAAsB,GAAQ,GAEtC,CACN,CAAC,GACG,EAEN,eAAK,KAAK,EAAC,sBAAsB,aAC/B,IAAI,CAAC,aAAa,CAAC,UAAU;wBAC9B,eACC,KAAK,EAAC,mBAAmB,EACzB,KAAK,EAAE,EAAE,SAAS,EAAE,0BAA0B,IAAI,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC,MAAM,EAAE,aAEnF,cAAK,KAAK,EAAC,4BAA4B,GAAO,EAC9C,cACC,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC,WAAW,EACrC,KAAK,EAAE,EAAE,SAAS,EAAE,WAAW,IAAI,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC,MAAM,EAAE,YACnE,IAAI,CAAC,aAAa,CAAC,IAAI,GAAO,IAC3B,EAGL,IAAI,CAAC,YAAY,CAAC,UAAU;wBAC7B,eACC,KAAK,EAAC,mBAAmB,EACzB,KAAK,EAAE,EAAE,SAAS,EAAE,0BAA0B,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC,MAAM,EAAE,aAElF,cAAK,KAAK,EAAC,2BAA2B,GAAO,EAC7C,cACC,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,WAAW,EACpC,KAAK,EAAE,EAAE,SAAS,EAAE,WAAW,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC,MAAM,EAAE,YAClE,IAAI,CAAC,YAAY,CAAC,IAAI,GAAO,IAC1B,IAED,EAEN,cACC,KAAK,EAAE;oBACN,oBAAoB,EAAE,IAAI;oBAC1B,sBAAsB,EAAE,IAAI,CAAC,YAAY,CAAC,UAAU;iBACpD,EACD,YAAY,EAAE,IAAI,CAAC,aAAa,EAChC,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,WAAW,EAAE,IAAI,CAAC,aAAa,EAC/B,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,SAAS,EAAE,IAAI,CAAC,WAAW,EAC3B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,OAAO,EAAE,IAAI,CAAC,aAAa,GACrB,IACF,CAAC,CAAC;AACV,CAAC","sourcesContent":["import type TimePickerClock from \"./TimePickerClock.js\";\n\nexport default function TimePickerClockTemplate(this: TimePickerClock) {\n\treturn (\n\t\t<div\n\t\t\tid={`${this._id}`}\n\t\t\tonDragStart={this.noop}\n\t\t\tonDrop={this.noop}\n\t\t\taria-hidden=\"true\"\n\t\t\tclass={{\n\t\t\t\t\"ui5-tp-clock\": true,\n\t\t\t\t\"ui5-tp-clock-active\": this.active,\n\t\t\t}}\n\t\t>\n\n\t\t\t<div data-label={this.label} class=\"ui5-tp-clock-dial\"></div>\n\n\t\t\t<div class=\"ui5-tp-clock-items\">\n\t\t\t\t{this._items.map((item, i) => (\n\t\t\t\t\t<div class=\"ui5-tp-clock-item\" style={{ transform: `translate(-50%) rotate(${(i + 1) * this._angleStep}deg` }}>\n\t\t\t\t\t\t{ item.item ?\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<span class=\"ui5-tp-clock-dot\"></span>\n\t\t\t\t\t\t\t\t<span id={`${this._id}-${item.item}`}\n\t\t\t\t\t\t\t\t\tclass=\"ui5-tp-clock-number\"\n\t\t\t\t\t\t\t\t\tstyle={{ transform: `rotate(-${(i + 1) * this._angleStep}deg)` }}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{item.item}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t:\n\t\t\t\t\t\t\t<span class=\"ui5-tp-clock-mid-dot\"></span>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</div>\n\n\t\t\t<div class=\"ui5-tp-clock-markers\">\n\t\t\t\t{this._selectedItem.showMarker &&\n\t\t\t\t<div\n\t\t\t\t\tclass=\"ui5-tp-clock-item\"\n\t\t\t\t\tstyle={{ transform: `translate(-50%) rotate(${this._selectedItem.angle || 0}deg)` }}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"ui5-tp-clock-select-marker\"></div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={this._selectedItem.itemClasses}\n\t\t\t\t\t\tstyle={{ transform: `rotate(-${this._selectedItem.angle || 0}deg)` }}\n\t\t\t\t\t>{this._selectedItem.item}</div>\n\t\t\t\t</div>\n\t\t\t\t}\n\n\t\t\t\t{this._hoveredItem.showMarker &&\n\t\t\t\t<div\n\t\t\t\t\tclass=\"ui5-tp-clock-item\"\n\t\t\t\t\tstyle={{ transform: `translate(-50%) rotate(${this._hoveredItem.angle || 0}deg)` }}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"ui5-tp-clock-hover-marker\"></div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass={this._hoveredItem.itemClasses}\n\t\t\t\t\t\tstyle={{ transform: `rotate(-${this._hoveredItem.angle || 0}deg)` }}\n\t\t\t\t\t>{this._hoveredItem.item}</div>\n\t\t\t\t</div>\n\t\t\t\t}\n\t\t\t</div>\n\n\t\t\t<div\n\t\t\t\tclass={{\n\t\t\t\t\t\"ui5-tp-clock-cover\": true,\n\t\t\t\t\t\"ui5-tp-clock-pointer\": this._hoveredItem.showMarker,\n\t\t\t\t}}\n\t\t\t\tonTouchStart={this._onTouchStart}\n\t\t\t\tonTouchMove={this._onTouchMove}\n\t\t\t\tonTouchEnd={this._onTouchEnd}\n\t\t\t\tonMouseDown={this._onTouchStart}\n\t\t\t\tonMouseMove={this._onTouchMove}\n\t\t\t\tonMouseUp={this._onTouchEnd}\n\t\t\t\tonMouseOut={this._onMouseOut}\n\t\t\t\tonWheel={this._onMouseWheel}\n\t\t\t></div>\n\t\t</div>);\n}\n"]}