@ui5/webcomponents 2.11.0 → 2.12.0-rc.0

package/dist/SliderTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"SliderTemplate.js","sourceRoot":"","sources":["../src/SliderTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,MAAM,mDAAmD,CAAC;AAEhF,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AAEzD,MAAM,CAAC,OAAO,UAAU,cAAc;IACrC,OAAO,kBAAkB,CAAC,IAAI,CAAC,IAAI,EAAE;QACpC,WAAW;QACX,OAAO;KACP,CAAC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,WAAW;IAC1B,OAAO,CACN,cACC,KAAK,EAAC,+BAA+B,iBACzB,MAAM,EAClB,IAAI,EAAC,oBAAoB,YAEzB,cAAK,KAAK,EAAC,qBAAqB,EAC/B,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,EAC3B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,QAAQ,EAAE,CAAC,CAAC,EACZ,IAAI,EAAC,cAAc,GACb,GACF,CACN,CAAC;AACH,CAAC;AAED,MAAM,UAAU,OAAO;IACtB,OAAO,CACN,eAAK,KAAK,EAAC,6BAA6B,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,EAAC,kBAAkB,aAC1F,cAAK,KAAK,EAAC,mBAAmB,EAC7B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,IAAI,CAAC,SAAS,sBACP,YAAY,mBACd,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,KAAK,gBACb,IAAI,CAAC,UAAU,mBACZ,IAAI,CAAC,aAAa,uBACd,IAAI,CAAC,iBAAiB,sBACvB,IAAI,CAAC,0BAA0B,8BAEjD,IAAI,EAAC,QAAQ,YAEb,KAAC,IAAI,IAAC,IAAI,EAAE,eAAe,EAC1B,IAAI,EAAC,YAAY,EACjB,IAAI,EAAC,aAAa,wBAEX,GACH,EACL,IAAI,CAAC,WAAW;gBACjB,cAAK,KAAK,EAAC,oBAAoB,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,YACxD,IAAI,CAAC,eAAe,CAAC,CAAC;wBACtB,KAAC,KAAK,IACL,KAAK,EAAE,IAAI,CAAC,kBAAkB,EAC9B,UAAU,EAAE,IAAI,CAAC,uBAAuB,EACxC,IAAI,EAAC,QAAQ,EACb,iBAAiB,EAAC,uBAAuB,EACzC,UAAU,EAAE,IAAI,CAAC,gBAAgB,EACjC,SAAS,EAAE,IAAI,CAAC,eAAe,EAC/B,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,OAAO,EAAE,IAAI,CAAC,aAAa,iCAE3B,QAAQ,EAAE,CAAC,CAAC,GACJ;wBACT,CAAC;4BACD,eAAM,KAAK,EAAC,0BAA0B,YAAE,IAAI,CAAC,YAAY,GAAQ,GAE7D,IAED,CACN,CAAC;AACH,CAAC","sourcesContent":["import directionArrows from \"@ui5/webcomponents-icons/dist/direction-arrows.js\";\nimport type Slider from \"./Slider.js\";\nimport Icon from \"./Icon.js\";\nimport Input from \"./Input.js\";\nimport SliderBaseTemplate from \"./SliderBaseTemplate.js\";\n\nexport default function SliderTemplate(this: Slider) {\n\treturn SliderBaseTemplate.call(this, {\n\t\tprogressBar,\n\t\thandles,\n\t});\n}\n\nexport function progressBar(this: Slider) {\n\treturn (\n\t\t<div\n\t\t\tclass=\"ui5-slider-progress-container\"\n\t\t\taria-hidden=\"true\"\n\t\t\tpart=\"progress-container\"\n\t\t>\n\t\t\t<div class=\"ui5-slider-progress\"\n\t\t\t\tstyle={this.styles.progress}\n\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\ttabIndex={-1}\n\t\t\t\tpart=\"progress-bar\"\n\t\t\t></div>\n\t\t</div>\n\t);\n}\n\nexport function handles(this: Slider) {\n\treturn (\n\t\t<div class=\"ui5-slider-handle-container\" style={this.styles.handle} part=\"handle-container\">\n\t\t\t<div class=\"ui5-slider-handle\"\n\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonKeyUp={this._onkeyup}\n\t\t\t\trole=\"slider\"\n\t\t\t\ttabIndex={this._tabIndex}\n\t\t\t\taria-orientation=\"horizontal\"\n\t\t\t\taria-valuemin={this.min}\n\t\t\t\taria-valuemax={this.max}\n\t\t\t\taria-valuenow={this.value}\n\t\t\t\taria-label={this._ariaLabel}\n\t\t\t\taria-disabled={this._ariaDisabled}\n\t\t\t\taria-keyshortcuts={this._ariaKeyshortcuts}\n\t\t\t\taria-describedby={this._ariaDescribedByHandleText}\n\t\t\t\tdata-sap-focus-ref\n\t\t\t\tpart=\"handle\"\n\t\t\t>\n\t\t\t\t<Icon name={directionArrows}\n\t\t\t\t\tmode=\"Decorative\"\n\t\t\t\t\tpart=\"icon-slider\"\n\t\t\t\t\tslider-icon\n\t\t\t\t></Icon>\n\t\t\t</div>\n\t\t\t{this.showTooltip &&\n\t\t\t<div class=\"ui5-slider-tooltip\" style={this.styles.tooltip}>\n\t\t\t\t{this.editableTooltip ?\n\t\t\t\t\t<Input\n\t\t\t\t\t\tvalue={this._tooltipInputValue}\n\t\t\t\t\t\tvalueState={this._tooltipInputValueState}\n\t\t\t\t\t\ttype=\"Number\"\n\t\t\t\t\t\taccessibleNameRef=\"ui5-slider-InputLabel\"\n\t\t\t\t\t\tonFocusOut={this._onInputFocusOut}\n\t\t\t\t\t\tonKeyDown={this._onInputKeydown}\n\t\t\t\t\t\tonChange={this._onInputChange}\n\t\t\t\t\t\tonInput={this._onInputInput}\n\t\t\t\t\t\tdata-sap-ui-end-value\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t></Input>\n\t\t\t\t\t:\n\t\t\t\t\t<span class=\"ui5-slider-tooltip-value\">{this.tooltipValue}</span>\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t}\n\t\t</div>\n\t);\n}\n"]}
+{"version":3,"file":"SliderTemplate.js","sourceRoot":"","sources":["../src/SliderTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,MAAM,mDAAmD,CAAC;AAEhF,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,aAAa,MAAM,oBAAoB,CAAC;AAE/C,MAAM,CAAC,OAAO,UAAU,cAAc;IACrC,OAAO,kBAAkB,CAAC,IAAI,CAAC,IAAI,EAAE;QACpC,WAAW;QACX,OAAO;KACP,CAAC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,WAAW;IAC1B,OAAO,CACN,cACC,KAAK,EAAC,+BAA+B,iBACzB,MAAM,EAClB,IAAI,EAAC,oBAAoB,YAEzB,cAAK,KAAK,EAAC,qBAAqB,EAC/B,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,EAC3B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,QAAQ,EAAE,CAAC,CAAC,EACZ,IAAI,EAAC,cAAc,GACb,GACF,CACN,CAAC;AACH,CAAC;AAED,MAAM,UAAU,OAAO;IACtB,OAAO,CACN,eAAK,KAAK,EAAC,6BAA6B,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,EAAC,kBAAkB,aAC1F,cAAK,KAAK,EAAC,mBAAmB,EAC7B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,IAAI,CAAC,SAAS,sBACP,YAAY,mBACd,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,KAAK,gBACb,IAAI,CAAC,UAAU,mBACZ,IAAI,CAAC,aAAa,uBACd,IAAI,CAAC,iBAAiB,sBACvB,IAAI,CAAC,0BAA0B,8BAEjD,IAAI,EAAC,QAAQ,EACb,EAAE,EAAC,SAAS,YAEZ,KAAC,IAAI,IAAC,IAAI,EAAE,eAAe,EAC1B,IAAI,EAAC,YAAY,EACjB,IAAI,EAAC,aAAa,wBAEX,GACH,EAEN,KAAC,aAAa,IACb,IAAI,EAAE,IAAI,CAAC,aAAa,EACxB,KAAK,EAAE,IAAI,CAAC,YAAY,EACxB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,QAAQ,EAAE,IAAI,CAAC,eAAe,EAC9B,SAAS,EAAE,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,UAAU,CAAgB,EACpE,QAAQ,EAAE,IAAI,CAAC,gBAAgB,EAC/B,cAAc,EAAE,IAAI,CAAC,sBAAsB,GAE5B,IACX,CACN,CAAC;AACH,CAAC","sourcesContent":["import directionArrows from \"@ui5/webcomponents-icons/dist/direction-arrows.js\";\nimport type Slider from \"./Slider.js\";\nimport Icon from \"./Icon.js\";\nimport SliderBaseTemplate from \"./SliderBaseTemplate.js\";\nimport SliderTooltip from \"./SliderTooltip.js\";\n\nexport default function SliderTemplate(this: Slider) {\n\treturn SliderBaseTemplate.call(this, {\n\t\tprogressBar,\n\t\thandles,\n\t});\n}\n\nexport function progressBar(this: Slider) {\n\treturn (\n\t\t<div\n\t\t\tclass=\"ui5-slider-progress-container\"\n\t\t\taria-hidden=\"true\"\n\t\t\tpart=\"progress-container\"\n\t\t>\n\t\t\t<div class=\"ui5-slider-progress\"\n\t\t\t\tstyle={this.styles.progress}\n\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\ttabIndex={-1}\n\t\t\t\tpart=\"progress-bar\"\n\t\t\t></div>\n\t\t</div>\n\t);\n}\n\nexport function handles(this: Slider) {\n\treturn (\n\t\t<div class=\"ui5-slider-handle-container\" style={this.styles.handle} part=\"handle-container\">\n\t\t\t<div class=\"ui5-slider-handle\"\n\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonKeyUp={this._onkeyup}\n\t\t\t\trole=\"slider\"\n\t\t\t\ttabIndex={this._tabIndex}\n\t\t\t\taria-orientation=\"horizontal\"\n\t\t\t\taria-valuemin={this.min}\n\t\t\t\taria-valuemax={this.max}\n\t\t\t\taria-valuenow={this.value}\n\t\t\t\taria-label={this._ariaLabel}\n\t\t\t\taria-disabled={this._ariaDisabled}\n\t\t\t\taria-keyshortcuts={this._ariaKeyshortcuts}\n\t\t\t\taria-describedby={this._ariaDescribedByHandleText}\n\t\t\t\tdata-sap-focus-ref\n\t\t\t\tpart=\"handle\"\n\t\t\t\tid=\"handle1\"\n\t\t\t>\n\t\t\t\t<Icon name={directionArrows}\n\t\t\t\t\tmode=\"Decorative\"\n\t\t\t\t\tpart=\"icon-slider\"\n\t\t\t\t\tslider-icon\n\t\t\t\t></Icon>\n\t\t\t</div>\n\n\t\t\t<SliderTooltip\n\t\t\t\topen={this._tooltipsOpen}\n\t\t\t\tvalue={this.tooltipValue}\n\t\t\t\tmin={this.min}\n\t\t\t\tmax={this.max}\n\t\t\t\teditable={this.editableTooltip}\n\t\t\t\tfollowRef={this.shadowRoot?.querySelector(\"#handle1\") as HTMLElement}\n\t\t\t\tonChange={this._onTooltipChange}\n\t\t\t\tonForwardFocus={this._onTooltopForwardFocus}\n\t\t\t>\n\t\t\t</SliderTooltip>\n\t\t</div>\n\t);\n}\n"]}

package/dist/SliderTooltip.d.ts

@@ -0,0 +1,47 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import type Input from "./Input.js";
+import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import type { Interval } from "@ui5/webcomponents-base/dist/types.js";
+type SliderTooltipChangeEventDetails = {
+    value: string;
+};
+/**
+ * @class
+ *
+ * ### Overview
+ * @constructor
+ * @extends UI5Element
+ * @private
+ */
+declare class SliderTooltip extends UI5Element {
+    eventDetails: {
+        "change": SliderTooltipChangeEventDetails;
+        "forward-focus": void;
+    };
+    value?: string;
+    inputValue?: string;
+    open: boolean;
+    min: number;
+    max: number;
+    editable: boolean;
+    valueState: `${ValueState}`;
+    followRef?: HTMLElement;
+    _repoisitionInterval?: Interval;
+    _repositionTooltipBound: () => void;
+    static i18nBundle: I18nBundle;
+    constructor();
+    onBeforeRendering(): void;
+    onAfterRendering(): void;
+    repositionTooltip(): void;
+    isValueValid(value: string): boolean;
+    attachGlobalScrollHandler(): void;
+    detachGlobalScrollHandler(): void;
+    _keydown(e: KeyboardEvent): void;
+    _onInputFocusin(): void;
+    _onInputFocusOut(e: FocusEvent): void;
+    get inputRef(): Input;
+    get _ariaLabelledByInputText(): string;
+}
+export type { SliderTooltipChangeEventDetails, };
+export default SliderTooltip;

package/dist/SliderTooltip.js

@@ -0,0 +1,158 @@
+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;
+};
+var SliderTooltip_1;
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import { customElement, i18n, property } from "@ui5/webcomponents-base/dist/decorators.js";
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import SliderTooltipTemplate from "./SliderTooltipTemplate.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
+import SliderTooltipCss from "./generated/themes/SliderTooltip.css.js";
+import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
+import { isEnter, isF2, isTabNext } from "@ui5/webcomponents-base/dist/Keys.js";
+import { SLIDER_TOOLTIP_INPUT_LABEL, } from "./generated/i18n/i18n-defaults.js";
+/**
+ * @class
+ *
+ * ### Overview
+ * @constructor
+ * @extends UI5Element
+ * @private
+ */
+let SliderTooltip = SliderTooltip_1 = class SliderTooltip extends UI5Element {
+    constructor() {
+        super();
+        this.open = false;
+        this.min = 0;
+        this.max = 100;
+        this.editable = false;
+        this.valueState = "None";
+        this._repositionTooltipBound = this.repositionTooltip.bind(this);
+    }
+    onBeforeRendering() { }
+    onAfterRendering() {
+        if (!this.hasAttribute("popover")) {
+            this.setAttribute("popover", "manual");
+        }
+        if (this.isConnected) {
+            if (this.open) {
+                this.showPopover();
+                this.repositionTooltip();
+                this.attachGlobalScrollHandler();
+            }
+            else {
+                this.hidePopover();
+                this.detachGlobalScrollHandler();
+            }
+        }
+    }
+    repositionTooltip() {
+        const followRefRect = this.followRef?.getBoundingClientRect();
+        if (!followRefRect) {
+            return;
+        }
+        this.style.top = `${followRefRect.top}px`;
+        // center the tooltip's mid and opener's mid
+        const tooltipWidth = this.offsetWidth;
+        const followRefWidth = followRefRect.width;
+        const tooltipMidX = tooltipWidth / 2;
+        const followRefMidX = followRefWidth / 2;
+        this.style.left = `${followRefRect.left + followRefMidX - tooltipMidX}px`;
+        // enable RTL support
+        this.style.right = "auto";
+    }
+    isValueValid(value) {
+        return parseFloat(value) >= this.min && parseFloat(value) <= this.max;
+    }
+    attachGlobalScrollHandler() {
+        document.addEventListener("scroll", this._repositionTooltipBound, { capture: true });
+    }
+    detachGlobalScrollHandler() {
+        document.removeEventListener("scroll", this._repositionTooltipBound, { capture: true });
+    }
+    _keydown(e) {
+        if (isF2(e) || isTabNext(e)) {
+            e.preventDefault();
+            if (!this.isValueValid(this.inputRef.value)) {
+                const value = this.value;
+                this.inputRef.value = value || "";
+            }
+            this.valueState = ValueState.None;
+            this.fireDecoratorEvent("change", { value: this.inputRef.value });
+            this.fireDecoratorEvent("forward-focus");
+        }
+        if (isEnter(e)) {
+            if (!this.isValueValid(this.inputRef.value)) {
+                this.valueState = ValueState.Negative;
+                return;
+            }
+            this.valueState = ValueState.None;
+            this.fireDecoratorEvent("change", { value: this.inputRef.value });
+        }
+    }
+    _onInputFocusin() {
+        requestAnimationFrame(() => {
+            this.hidePopover();
+            this.showPopover();
+        });
+    }
+    _onInputFocusOut(e) {
+        if (!this.isValueValid(this.inputRef.value)) {
+            const value = this.value;
+            this.inputRef.value = value || "";
+        }
+        const relatedTarget = e.relatedTarget;
+        if (!this.parentElement?.contains(relatedTarget)) {
+            this.hidePopover();
+        }
+    }
+    get inputRef() {
+        return this.shadowRoot?.querySelector("ui5-input");
+    }
+    get _ariaLabelledByInputText() {
+        return SliderTooltip_1.i18nBundle.getText(SLIDER_TOOLTIP_INPUT_LABEL);
+    }
+};
+__decorate([
+    property()
+], SliderTooltip.prototype, "value", void 0);
+__decorate([
+    property()
+], SliderTooltip.prototype, "inputValue", void 0);
+__decorate([
+    property({ type: Boolean })
+], SliderTooltip.prototype, "open", void 0);
+__decorate([
+    property({ type: Number })
+], SliderTooltip.prototype, "min", void 0);
+__decorate([
+    property({ type: Number })
+], SliderTooltip.prototype, "max", void 0);
+__decorate([
+    property({ type: Boolean })
+], SliderTooltip.prototype, "editable", void 0);
+__decorate([
+    property()
+], SliderTooltip.prototype, "valueState", void 0);
+__decorate([
+    property({ type: Object })
+], SliderTooltip.prototype, "followRef", void 0);
+__decorate([
+    i18n("@ui5/webcomponents")
+], SliderTooltip, "i18nBundle", void 0);
+SliderTooltip = SliderTooltip_1 = __decorate([
+    customElement({
+        tag: "ui5-slider-tooltip",
+        renderer: jsxRenderer,
+        template: SliderTooltipTemplate,
+        styles: SliderTooltipCss,
+    }),
+    event("change"),
+    event("forward-focus")
+], SliderTooltip);
+SliderTooltip.define();
+export default SliderTooltip;
+//# sourceMappingURL=SliderTooltip.js.map

package/dist/SliderTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderTooltip.js","sourceRoot":"","sources":["../src/SliderTooltip.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport { customElement, i18n, property } from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\n\nimport SliderTooltipTemplate from \"./SliderTooltipTemplate.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport SliderTooltipCss from \"./generated/themes/SliderTooltip.css.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport { isEnter, isF2, isTabNext } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport type Input from \"./Input.js\";\n\nimport {\n\tSLIDER_TOOLTIP_INPUT_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { Interval } from \"@ui5/webcomponents-base/dist/types.js\";\n\ntype SliderTooltipChangeEventDetails = {\n\tvalue: string,\n};\n\n/**\n * @class\n *\n * ### Overview\n * @constructor\n * @extends UI5Element\n * @private\n */\n@customElement({\n\ttag: \"ui5-slider-tooltip\",\n\trenderer: jsxRenderer,\n\ttemplate: SliderTooltipTemplate,\n\tstyles: SliderTooltipCss,\n})\n\n@event(\"change\")\n\n@event(\"forward-focus\")\n\nclass SliderTooltip extends UI5Element {\n\teventDetails!: {\n\t\t\"change\": SliderTooltipChangeEventDetails,\n\t\t\"forward-focus\": void\n\t};\n\n\t@property()\n\tvalue?: string;\n\n\t@property()\n\tinputValue?: string;\n\n\t@property({ type: Boolean })\n\topen = false;\n\n\t@property({ type: Number })\n\tmin = 0;\n\n\t@property({ type: Number })\n\tmax = 100;\n\n\t@property({ type: Boolean })\n\teditable = false;\n\n\t@property()\n\tvalueState: `${ValueState}` = \"None\";\n\n\t@property({ type: Object })\n\tfollowRef?: HTMLElement;\n\n\t_repoisitionInterval?: Interval;\n\t_repositionTooltipBound: () => void;\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._repositionTooltipBound = this.repositionTooltip.bind(this);\n\t}\n\n\tonBeforeRendering(): void { }\n\n\tonAfterRendering(): void {\n\t\tif (!this.hasAttribute(\"popover\")) {\n\t\t\tthis.setAttribute(\"popover\", \"manual\");\n\t\t}\n\n\t\tif (this.isConnected) {\n\t\t\tif (this.open) {\n\t\t\t\tthis.showPopover();\n\t\t\t\tthis.repositionTooltip();\n\t\t\t\tthis.attachGlobalScrollHandler();\n\t\t\t} else {\n\t\t\t\tthis.hidePopover();\n\t\t\t\tthis.detachGlobalScrollHandler();\n\t\t\t}\n\t\t}\n\t}\n\n\trepositionTooltip(): void {\n\t\tconst followRefRect = this.followRef?.getBoundingClientRect();\n\t\tif (!followRefRect) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.style.top = `${followRefRect.top}px`;\n\n\t\t// center the tooltip's mid and opener's mid\n\t\tconst tooltipWidth = this.offsetWidth;\n\t\tconst followRefWidth = followRefRect.width;\n\n\t\tconst tooltipMidX = tooltipWidth / 2;\n\t\tconst followRefMidX = followRefWidth / 2;\n\n\t\tthis.style.left = `${followRefRect.left + followRefMidX - tooltipMidX}px`;\n\n\t\t// enable RTL support\n\t\tthis.style.right = \"auto\";\n\t}\n\n\tisValueValid(value: string): boolean {\n\t\treturn parseFloat(value) >= this.min && parseFloat(value) <= this.max;\n\t}\n\n\tattachGlobalScrollHandler() {\n\t\tdocument.addEventListener(\"scroll\", this._repositionTooltipBound, { capture: true });\n\t}\n\n\tdetachGlobalScrollHandler() {\n\t\tdocument.removeEventListener(\"scroll\", this._repositionTooltipBound, { capture: true });\n\t}\n\n\t_keydown(e: KeyboardEvent) {\n\t\tif (isF2(e) || isTabNext(e)) {\n\t\t\te.preventDefault();\n\n\t\t\tif (!this.isValueValid(this.inputRef.value)) {\n\t\t\t\tconst value = this.value;\n\t\t\t\tthis.inputRef.value = value || \"\";\n\t\t\t}\n\n\t\t\tthis.valueState = ValueState.None;\n\n\t\t\tthis.fireDecoratorEvent(\"change\", { value: this.inputRef.value });\n\t\t\tthis.fireDecoratorEvent(\"forward-focus\");\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tif (!this.isValueValid(this.inputRef.value)) {\n\t\t\t\tthis.valueState = ValueState.Negative;\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tthis.valueState = ValueState.None;\n\n\t\t\tthis.fireDecoratorEvent(\"change\", { value: this.inputRef.value });\n\t\t}\n\t}\n\n\t_onInputFocusin() {\n\t\trequestAnimationFrame(() => {\n\t\t\tthis.hidePopover();\n\t\t\tthis.showPopover();\n\t\t});\n\t}\n\n\t_onInputFocusOut(e: FocusEvent) {\n\t\tif (!this.isValueValid(this.inputRef.value)) {\n\t\t\tconst value = this.value;\n\t\t\tthis.inputRef.value = value || \"\";\n\t\t}\n\n\t\tconst relatedTarget = e.relatedTarget as HTMLElement;\n\n\t\tif (!this.parentElement?.contains(relatedTarget)) {\n\t\t\tthis.hidePopover();\n\t\t}\n\t}\n\n\tget inputRef() {\n\t\treturn this.shadowRoot?.querySelector(\"ui5-input\") as Input;\n\t}\n\n\tget _ariaLabelledByInputText() {\n\t\treturn SliderTooltip.i18nBundle.getText(SLIDER_TOOLTIP_INPUT_LABEL);\n\t}\n}\n\nSliderTooltip.define();\n\nexport type {\n\tSliderTooltipChangeEventDetails,\n};\n\nexport default SliderTooltip;\n"]}

package/dist/SliderTooltipTemplate.d.ts

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

package/dist/SliderTooltipTemplate.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import Input from "./Input.js";
+export default function SliderTooltipTemplate() {
+    return (_jsxs("div", { class: "ui5-slider-tooltip-root", children: [this.editable ?
+                _jsx(Input, { value: this.value, type: "Number", accessibleNameRef: "ui5-slider-InputLabel", onKeyDown: this._keydown, onFocusIn: this._onInputFocusin, onFocusOut: this._onInputFocusOut, tabIndex: -1, "data-sap-focus-ref": true, valueState: this.valueState }) :
+                _jsx("span", { class: "ui5-slider-tooltip-value", children: this.value }), this.editable && _jsx(_Fragment, { children: _jsx("span", { id: "ui5-slider-InputLabel", class: "ui5-hidden-text", children: this._ariaLabelledByInputText }) })] }));
+}
+//# sourceMappingURL=SliderTooltipTemplate.js.map

package/dist/SliderTooltipTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderTooltipTemplate.js","sourceRoot":"","sources":["../src/SliderTooltipTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,YAAY,CAAC;AAG/B,MAAM,CAAC,OAAO,UAAU,qBAAqB;IAC5C,OAAO,CACN,eAAK,KAAK,EAAC,yBAAyB,aAClC,IAAI,CAAC,QAAQ,CAAC,CAAC;gBACf,KAAC,KAAK,IACL,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAC,QAAQ,EACb,iBAAiB,EAAC,uBAAuB,EACzC,SAAS,EAAE,IAAI,CAAC,QAAQ,EACxB,SAAS,EAAE,IAAI,CAAC,eAAe,EAC/B,UAAU,EAAE,IAAI,CAAC,gBAAgB,EACjC,QAAQ,EAAE,CAAC,CAAC,8BAEZ,UAAU,EAAE,IAAI,CAAC,UAAU,GACnB,CAAC,CAAC;gBACX,eAAM,KAAK,EAAC,0BAA0B,YAAE,IAAI,CAAC,KAAK,GAAQ,EAG1D,IAAI,CAAC,QAAQ,IAAI,4BACjB,eAAM,EAAE,EAAC,uBAAuB,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,wBAAwB,GAAQ,GAC7F,IACE,CACN,CAAC;AACH,CAAC","sourcesContent":["import Input from \"./Input.js\";\nimport type SliderTooltip from \"./SliderTooltip.js\";\n\nexport default function SliderTooltipTemplate(this: SliderTooltip) {\n\treturn (\n\t\t<div class=\"ui5-slider-tooltip-root\">\n\t\t\t{this.editable ?\n\t\t\t\t<Input\n\t\t\t\t\tvalue={this.value}\n\t\t\t\t\ttype=\"Number\"\n\t\t\t\t\taccessibleNameRef=\"ui5-slider-InputLabel\"\n\t\t\t\t\tonKeyDown={this._keydown}\n\t\t\t\t\tonFocusIn={this._onInputFocusin}\n\t\t\t\t\tonFocusOut={this._onInputFocusOut}\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\tdata-sap-focus-ref\n\t\t\t\t\tvalueState={this.valueState}\n\t\t\t\t></Input> :\n\t\t\t\t<span class=\"ui5-slider-tooltip-value\">{this.value}</span>\n\t\t\t}\n\n\t\t\t{this.editable && <>\n\t\t\t\t<span id=\"ui5-slider-InputLabel\" class=\"ui5-hidden-text\">{this._ariaLabelledByInputText}</span>\n\t\t\t</>}\n\t\t</div>\n\t);\n}\n"]}

package/dist/ToggleButton.d.ts

@@ -27,7 +27,7 @@ declare class ToggleButton extends Button {
      * @public
      */
     pressed: boolean;
-    _onclick(): void;
+    _onclick(e: MouseEvent): void;
     _onkeyup(e: KeyboardEvent): void;
 }
 export default ToggleButton;

package/dist/ToggleButton.js

@@ -43,8 +43,27 @@ let ToggleButton = class ToggleButton extends Button {
          */
         this.pressed = false;
     }
-    _onclick() {
-        this.pressed = !this.pressed;
+    _onclick(e) {
+        e.stopImmediatePropagation();
+        if (this.nonInteractive) {
+            return;
+        }
+        const { altKey, ctrlKey, metaKey, shiftKey, } = e;
+        const oldValue = this.pressed;
+        this.pressed = !oldValue;
+        const prevented = !this.fireDecoratorEvent("click", {
+            originalEvent: e,
+            altKey,
+            ctrlKey,
+            metaKey,
+            shiftKey,
+        });
+        if (prevented) {
+            e.preventDefault();
+            // value should be restored if click is prevented
+            this.pressed = oldValue;
+            return;
+        }
         if (isSafari()) {
             this.getDomRef().focus();
         }

package/dist/ToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleButton.js","sourceRoot":"","sources":["../src/ToggleButton.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAE3E,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAClE,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,oBAAoB,MAAM,2BAA2B,CAAC;AAE7D,SAAS;AACT,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE;;;;;;;;;;;;;;;;;;;;GAoBG;AAMH,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,MAAM;IAAjC;;QACC;;;;WAIG;QAEH,YAAO,GAAG,KAAK,CAAC;IAkBjB,CAAC;IAhBA,QAAQ;QACP,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;QAE7B,IAAI,QAAQ,EAAE,EAAE,CAAC;YAChB,IAAI,CAAC,SAAS,EAAG,CAAC,KAAK,EAAE,CAAC;QAC3B,CAAC;IACF,CAAC;IAED,QAAQ,CAAC,CAAgB;QACxB,IAAI,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;YACrB,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,OAAO;QACR,CAAC;QAED,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IACnB,CAAC;CACD,CAAA;AAlBA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CACZ;AAPX,YAAY;IALjB,aAAa,CAAC;QACd,GAAG,EAAE,mBAAmB;QACxB,QAAQ,EAAE,oBAAoB;QAC9B,MAAM,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC;KACrC,CAAC;GACI,YAAY,CAyBjB;AAED,YAAY,CAAC,MAAM,EAAE,CAAC;AAEtB,eAAe,YAAY,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\n\nimport { isSpaceShift } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport { isSafari } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport Button from \"./Button.js\";\nimport ToggleButtonTemplate from \"./ToggleButtonTemplate.js\";\n\n// Styles\nimport toggleBtnCss from \"./generated/themes/ToggleButton.css.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-toggle-button` component is an enhanced `ui5-button`\n * that can be toggled between pressed and normal states.\n * Users can use the `ui5-toggle-button` as a switch to turn a setting on or off.\n * It can also be used to represent an independent choice similar to a check box.\n *\n * Clicking or tapping on a `ui5-toggle-button` changes its state to `pressed`. The button returns to\n * its initial state when the user clicks or taps on it again.\n * By applying additional custom CSS-styling classes, apps can give a different style to any `ui5-toggle-button`.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/ToggleButton.js\";`\n * @constructor\n * @extends Button\n * @public\n */\n@customElement({\n\ttag: \"ui5-toggle-button\",\n\ttemplate: ToggleButtonTemplate,\n\tstyles: [Button.styles, toggleBtnCss],\n})\nclass ToggleButton extends Button {\n\t/**\n\t * Determines whether the component is displayed as pressed.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tpressed = false;\n\n\t_onclick() {\n\t\tthis.pressed = !this.pressed;\n\n\t\tif (isSafari()) {\n\t\t\tthis.getDomRef()!.focus();\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (isSpaceShift(e)) {\n\t\t\te.preventDefault();\n\t\t\treturn;\n\t\t}\n\n\t\tsuper._onkeyup(e);\n\t}\n}\n\nToggleButton.define();\n\nexport default ToggleButton;\n"]}
+{"version":3,"file":"ToggleButton.js","sourceRoot":"","sources":["../src/ToggleButton.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAE3E,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAClE,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,oBAAoB,MAAM,2BAA2B,CAAC;AAE7D,SAAS;AACT,OAAO,YAAY,MAAM,wCAAwC,CAAC;AAElE;;;;;;;;;;;;;;;;;;;;GAoBG;AAMH,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,MAAM;IAAjC;;QACC;;;;WAIG;QAEH,YAAO,GAAG,KAAK,CAAC;IA+CjB,CAAC;IA7CA,QAAQ,CAAC,CAAa;QACrB,CAAC,CAAC,wBAAwB,EAAE,CAAC;QAE7B,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACzB,OAAO;QACR,CAAC;QAED,MAAM,EACL,MAAM,EACN,OAAO,EACP,OAAO,EACP,QAAQ,GACR,GAAG,CAAC,CAAC;QAEN,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC;QAC9B,IAAI,CAAC,OAAO,GAAG,CAAC,QAAQ,CAAC;QAEzB,MAAM,SAAS,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE;YACnD,aAAa,EAAE,CAAC;YAChB,MAAM;YACN,OAAO;YACP,OAAO;YACP,QAAQ;SACR,CAAC,CAAC;QAEH,IAAI,SAAS,EAAE,CAAC;YACf,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,iDAAiD;YACjD,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC;YACxB,OAAO;QACR,CAAC;QAED,IAAI,QAAQ,EAAE,EAAE,CAAC;YAChB,IAAI,CAAC,SAAS,EAAG,CAAC,KAAK,EAAE,CAAC;QAC3B,CAAC;IACF,CAAC;IAED,QAAQ,CAAC,CAAgB;QACxB,IAAI,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;YACrB,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,OAAO;QACR,CAAC;QAED,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IACnB,CAAC;CACD,CAAA;AA/CA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CACZ;AAPX,YAAY;IALjB,aAAa,CAAC;QACd,GAAG,EAAE,mBAAmB;QACxB,QAAQ,EAAE,oBAAoB;QAC9B,MAAM,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC;KACrC,CAAC;GACI,YAAY,CAsDjB;AAED,YAAY,CAAC,MAAM,EAAE,CAAC;AAEtB,eAAe,YAAY,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\n\nimport { isSpaceShift } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport { isSafari } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport Button from \"./Button.js\";\nimport ToggleButtonTemplate from \"./ToggleButtonTemplate.js\";\n\n// Styles\nimport toggleBtnCss from \"./generated/themes/ToggleButton.css.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-toggle-button` component is an enhanced `ui5-button`\n * that can be toggled between pressed and normal states.\n * Users can use the `ui5-toggle-button` as a switch to turn a setting on or off.\n * It can also be used to represent an independent choice similar to a check box.\n *\n * Clicking or tapping on a `ui5-toggle-button` changes its state to `pressed`. The button returns to\n * its initial state when the user clicks or taps on it again.\n * By applying additional custom CSS-styling classes, apps can give a different style to any `ui5-toggle-button`.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/ToggleButton.js\";`\n * @constructor\n * @extends Button\n * @public\n */\n@customElement({\n\ttag: \"ui5-toggle-button\",\n\ttemplate: ToggleButtonTemplate,\n\tstyles: [Button.styles, toggleBtnCss],\n})\nclass ToggleButton extends Button {\n\t/**\n\t * Determines whether the component is displayed as pressed.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tpressed = false;\n\n\t_onclick(e: MouseEvent) {\n\t\te.stopImmediatePropagation();\n\n\t\tif (this.nonInteractive) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst {\n\t\t\taltKey,\n\t\t\tctrlKey,\n\t\t\tmetaKey,\n\t\t\tshiftKey,\n\t\t} = e;\n\n\t\tconst oldValue = this.pressed;\n\t\tthis.pressed = !oldValue;\n\n\t\tconst prevented = !this.fireDecoratorEvent(\"click\", {\n\t\t\toriginalEvent: e,\n\t\t\taltKey,\n\t\t\tctrlKey,\n\t\t\tmetaKey,\n\t\t\tshiftKey,\n\t\t});\n\n\t\tif (prevented) {\n\t\t\te.preventDefault();\n\t\t\t// value should be restored if click is prevented\n\t\t\tthis.pressed = oldValue;\n\t\t\treturn;\n\t\t}\n\n\t\tif (isSafari()) {\n\t\t\tthis.getDomRef()!.focus();\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (isSpaceShift(e)) {\n\t\t\te.preventDefault();\n\t\t\treturn;\n\t\t}\n\n\t\tsuper._onkeyup(e);\n\t}\n}\n\nToggleButton.define();\n\nexport default ToggleButton;\n"]}

package/dist/Tokenizer.js

@@ -346,12 +346,6 @@ let Tokenizer = Tokenizer_1 = class Tokenizer extends UI5Element {
         }
     }
     handleBeforeClose() {
-        const tokensArray = this._tokens;
-        if (isPhone()) {
-            tokensArray.forEach(token => {
-                token.selected = false;
-            });
-        }
         if (!this._tokenDeleting && !this._preventCollapse) {
             this._preventCollapse = false;
             this.expanded = false;