@ui5/webcomponents 2.11.0 → 2.12.0-rc.1

package/dist/RangeSliderTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"RangeSliderTemplate.js","sourceRoot":"","sources":["../src/RangeSliderTemplate.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,mBAAmB;IAC1C,OAAO,kBAAkB,CAAC,IAAI,CAAC,IAAI,EAAE;QACpC,eAAe;QACf,WAAW;QACX,OAAO;KACP,CAAC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,eAAe;IAC9B,OAAO,CAAC,8BACP,eAAM,EAAE,EAAC,4BAA4B,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,gBAAgB,CAAC,eAAe,GAAQ,EAC5G,eAAM,EAAE,EAAC,0BAA0B,EAAC,KAAK,EAAC,iBAAiB,YAAE,IAAI,CAAC,gBAAgB,CAAC,aAAa,GAAQ,IACtG,CAAC,CAAC;AACN,CAAC;AAED,MAAM,UAAU,WAAW;IAC1B,OAAO,CACN,cACC,KAAK,EAAC,+BAA+B,EACrC,IAAI,EAAC,oBAAoB,YAEzB,cAAK,KAAK,EAAC,qBAAqB,EAC/B,IAAI,EAAC,cAAc,EACnB,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,EAC3B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,IAAI,CAAC,SAAS,sBACP,YAAY,mBACd,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,aAAa,oBACjB,QAAQ,IAAI,CAAC,UAAU,OAAO,IAAI,CAAC,QAAQ,EAAE,gBACjD,IAAI,CAAC,UAAU,mBACZ,IAAI,CAAC,aAAa,GAC3B,GACF,CACN,CAAC;AACH,CAAC;AAED,MAAM,UAAU,OAAO;IACtB,OAAO,CAAC,8BACP,eAAK,KAAK,EAAC,6BAA6B,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE,IAAI,EAAC,kBAAkB,aAC/F,cAAK,KAAK,EAAC,4CAA4C,EACtD,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,IAAI,CAAC,SAAS,sBACP,YAAY,mBACd,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,UAAU,qBACb,IAAI,CAAC,8BAA8B,mBACrC,IAAI,CAAC,aAAa,sBACf,IAAI,CAAC,0BAA0B,uBAC9B,IAAI,CAAC,iBAAiB,YAEzC,KAAC,IAAI,IAAC,IAAI,EAAE,eAAe,EAC1B,IAAI,EAAC,YAAY,wBAEV,GACH,EAEL,IAAI,CAAC,WAAW;wBAChB,cAAK,KAAK,EAAC,8CAA8C,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,YAClF,IAAI,CAAC,eAAe,CAAC,CAAC;gCACtB,KAAC,KAAK,IACL,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,EACjC,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,mCAE3B,QAAQ,EAAE,CAAC,CAAC,GACJ;gCACT,CAAC;oCACD,eAAM,KAAK,EAAC,0BAA0B,YAAE,IAAI,CAAC,iBAAiB,GAAQ,GAElE,IAEF,EACN,eAAK,KAAK,EAAC,6BAA6B,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,IAAI,EAAC,kBAAkB,aAC7F,cAAK,KAAK,EAAC,0CAA0C,EACpD,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,EAC5B,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,IAAI,CAAC,SAAS,sBACP,YAAY,mBACd,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,GAAG,mBACR,IAAI,CAAC,QAAQ,qBACX,IAAI,CAAC,4BAA4B,sBAChC,IAAI,CAAC,0BAA0B,mBAClC,IAAI,CAAC,aAAa,uBACf,IAAI,YAEtB,KAAC,IAAI,IAAC,IAAI,EAAE,eAAe,EAC1B,IAAI,EAAC,YAAY,wBAEV,GACH,EAEL,IAAI,CAAC,WAAW;wBAChB,cAAK,KAAK,EAAC,4CAA4C,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,YAChF,IAAI,CAAC,eAAe,CAAC,CAAC;gCACtB,KAAC,KAAK,IACL,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,EAC/B,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;gCACT,CAAC;oCACD,eAAM,KAAK,EAAC,0BAA0B,YAAE,IAAI,CAAC,eAAe,GAAQ,GAEhE,IAEF,IACJ,CAAC,CAAC;AACN,CAAC","sourcesContent":["import directionArrows from \"@ui5/webcomponents-icons/dist/direction-arrows.js\";\nimport type RangeSlider from \"./RangeSlider.js\";\nimport Icon from \"./Icon.js\";\nimport Input from \"./Input.js\";\nimport SliderBaseTemplate from \"./SliderBaseTemplate.js\";\n\nexport default function RangeSliderTemplate(this: RangeSlider) {\n\treturn SliderBaseTemplate.call(this, {\n\t\thandlesAriaText,\n\t\tprogressBar,\n\t\thandles,\n\t});\n}\n\nexport function handlesAriaText(this: RangeSlider) {\n\treturn (<>\n\t\t<span id=\"ui5-slider-startHandleDesc\" class=\"ui5-hidden-text\">{this._ariaHandlesText.startHandleText}</span>\n\t\t<span id=\"ui5-slider-endHandleDesc\" class=\"ui5-hidden-text\">{this._ariaHandlesText.endHandleText}</span>\n\t</>);\n}\n\nexport function progressBar(this: RangeSlider) {\n\treturn (\n\t\t<div\n\t\t\tclass=\"ui5-slider-progress-container\"\n\t\t\tpart=\"progress-container\"\n\t\t>\n\t\t\t<div class=\"ui5-slider-progress\"\n\t\t\t\tpart=\"progress-bar\"\n\t\t\t\tstyle={this.styles.progress}\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonFocusOut={this._onfocusout}\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._ariaValueNow}\n\t\t\t\taria-valuetext={`From ${this.startValue} to ${this.endValue}`}\n\t\t\t\taria-label={this._ariaLabel}\n\t\t\t\taria-disabled={this._ariaDisabled}\n\t\t\t></div>\n\t\t</div>\n\t);\n}\n\nexport function handles(this: RangeSlider) {\n\treturn (<>\n\t\t<div class=\"ui5-slider-handle-container\" style={this.styles.startHandle} part=\"handle-container\">\n\t\t\t<div class=\"ui5-slider-handle ui5-slider-handle--start\"\n\t\t\t\tpart=\"handle\"\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonFocusOut={this._onfocusout}\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.startValue}\n\t\t\t\taria-labelledby={this._ariaLabelledByStartHandleText}\n\t\t\t\taria-disabled={this._ariaDisabled}\n\t\t\t\taria-describedby={this._ariaDescribedByHandleText}\n\t\t\t\taria-keyshortcuts={this._ariaKeyshortcuts}\n\t\t\t>\n\t\t\t\t<Icon name={directionArrows}\n\t\t\t\t\tmode=\"Decorative\"\n\t\t\t\t\tslider-icon\n\t\t\t\t></Icon>\n\t\t\t</div>\n\n\t\t\t{this.showTooltip &&\n\t\t\t\t<div class=\"ui5-slider-tooltip ui5-slider-tooltip--start\" style={this.styles.tooltip}>\n\t\t\t\t\t{this.editableTooltip ?\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\ttype=\"Number\"\n\t\t\t\t\t\t\tvalue={this.startValue.toString()}\n\t\t\t\t\t\t\taccessibleNameRef=\"ui5-slider-InputLabel\"\n\t\t\t\t\t\t\tonFocusOut={this._onInputFocusOut}\n\t\t\t\t\t\t\tonKeyDown={this._onInputKeydown}\n\t\t\t\t\t\t\tonChange={this._onInputChange}\n\t\t\t\t\t\t\tonInput={this._onInputInput}\n\t\t\t\t\t\t\tdata-sap-ui-start-value\n\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t></Input>\n\t\t\t\t\t\t:\n\t\t\t\t\t\t<span class=\"ui5-slider-tooltip-value\">{this.tooltipStartValue}</span>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t}\n\t\t</div>\n\t\t<div class=\"ui5-slider-handle-container\" style={this.styles.endHandle} part=\"handle-container\">\n\t\t\t<div class=\"ui5-slider-handle ui5-slider-handle--end\"\n\t\t\t\tpart=\"handle\"\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonFocusOut={this._onfocusout}\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.endValue}\n\t\t\t\taria-labelledby={this._ariaLabelledByEndHandleText}\n\t\t\t\taria-describedby={this._ariaDescribedByHandleText}\n\t\t\t\taria-disabled={this._ariaDisabled}\n\t\t\t\taria-keyshortcuts=\"F2\"\n\t\t\t>\n\t\t\t\t<Icon name={directionArrows}\n\t\t\t\t\tmode=\"Decorative\"\n\t\t\t\t\tslider-icon\n\t\t\t\t></Icon>\n\t\t\t</div>\n\n\t\t\t{this.showTooltip &&\n\t\t\t\t<div class=\"ui5-slider-tooltip ui5-slider-tooltip--end\" style={this.styles.tooltip}>\n\t\t\t\t\t{this.editableTooltip ?\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\ttype=\"Number\"\n\t\t\t\t\t\t\tvalue={this.endValue.toString()}\n\t\t\t\t\t\t\taccessibleNameRef=\"ui5-slider-InputLabel\"\n\t\t\t\t\t\t\tonFocusOut={this._onInputFocusOut}\n\t\t\t\t\t\t\tonKeyDown={this._onInputKeydown}\n\t\t\t\t\t\t\tonChange={this._onInputChange}\n\t\t\t\t\t\t\tonInput={this._onInputInput}\n\t\t\t\t\t\t\tdata-sap-ui-end-value\n\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t></Input>\n\t\t\t\t\t\t:\n\t\t\t\t\t\t<span class=\"ui5-slider-tooltip-value\">{this.tooltipEndValue}</span>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t}\n\t\t</div>\n\t</>);\n}\n"]}
+{"version":3,"file":"RangeSliderTemplate.js","sourceRoot":"","sources":["../src/RangeSliderTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import directionArrows from \"@ui5/webcomponents-icons/dist/direction-arrows.js\";\nimport type RangeSlider from \"./RangeSlider.js\";\nimport Icon from \"./Icon.js\";\nimport SliderBaseTemplate from \"./SliderBaseTemplate.js\";\nimport SliderTooltip from \"./SliderTooltip.js\";\n\nexport default function RangeSliderTemplate(this: RangeSlider) {\n\treturn SliderBaseTemplate.call(this, {\n\t\thandlesAriaText,\n\t\tprogressBar,\n\t\thandles,\n\t});\n}\n\nexport function handlesAriaText(this: RangeSlider) {\n\treturn (<>\n\t\t<span id=\"ui5-slider-startHandleDesc\" class=\"ui5-hidden-text\">{this._ariaHandlesText.startHandleText}</span>\n\t\t<span id=\"ui5-slider-endHandleDesc\" class=\"ui5-hidden-text\">{this._ariaHandlesText.endHandleText}</span>\n\t</>);\n}\n\nexport function progressBar(this: RangeSlider) {\n\treturn (\n\t\t<div\n\t\t\tclass=\"ui5-slider-progress-container\"\n\t\t\tpart=\"progress-container\"\n\t\t>\n\t\t\t<div class=\"ui5-slider-progress\"\n\t\t\t\tpart=\"progress-bar\"\n\t\t\t\tstyle={this.styles.progress}\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonFocusOut={this._onfocusout}\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._ariaValueNow}\n\t\t\t\taria-valuetext={`From ${this.startValue} to ${this.endValue}`}\n\t\t\t\taria-label={this._ariaLabel}\n\t\t\t\taria-disabled={this._ariaDisabled}\n\t\t\t></div>\n\t\t</div>\n\t);\n}\n\nexport function handles(this: RangeSlider) {\n\treturn (<>\n\t\t<div class=\"ui5-slider-handle-container\" style={this.styles.startHandle} part=\"handle-container\">\n\t\t\t<div class=\"ui5-slider-handle ui5-slider-handle--start\"\n\t\t\t\tpart=\"handle\"\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonFocusOut={this._onfocusout}\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.startValue}\n\t\t\t\taria-labelledby={this._ariaLabelledByStartHandleText}\n\t\t\t\taria-disabled={this._ariaDisabled}\n\t\t\t\taria-describedby={this._ariaDescribedByHandleText}\n\t\t\t\taria-keyshortcuts={this._ariaKeyshortcuts}\n\t\t\t>\n\t\t\t\t<Icon name={directionArrows}\n\t\t\t\t\tmode=\"Decorative\"\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.startValue.toString()}\n\t\t\t\tmin={this.min}\n\t\t\t\tmax={this.max}\n\t\t\t\tdata-sap-ui-start-value\n\t\t\t\teditable={this.editableTooltip}\n\t\t\t\tfollowRef={this._startHandle}\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\t<div class=\"ui5-slider-handle-container\" style={this.styles.endHandle} part=\"handle-container\">\n\t\t\t<div class=\"ui5-slider-handle ui5-slider-handle--end\"\n\t\t\t\tpart=\"handle\"\n\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\tonFocusOut={this._onfocusout}\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.endValue}\n\t\t\t\taria-labelledby={this._ariaLabelledByEndHandleText}\n\t\t\t\taria-describedby={this._ariaDescribedByHandleText}\n\t\t\t\taria-disabled={this._ariaDisabled}\n\t\t\t\taria-keyshortcuts=\"F2\"\n\t\t\t>\n\t\t\t\t<Icon name={directionArrows}\n\t\t\t\t\tmode=\"Decorative\"\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.endValue.toString()}\n\t\t\t\tmin={this.min}\n\t\t\t\tmax={this.max}\n\t\t\t\tdata-sap-ui-end-value\n\t\t\t\teditable={this.editableTooltip}\n\t\t\t\tfollowRef={this._endHandle}\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/ResponsivePopoverTemplate.js

@@ -8,7 +8,7 @@ export default function ResponsivePopoverTemplate() {
     if (!this._isPhone) {
         return PopoverTemplate.call(this);
     }
-    return (_jsxs(Dialog, { "root-element": true, accessibleName: this.accessibleName, accessibleNameRef: this.accessibleNameRef, accessibleRole: this.accessibleRole, stretch: true, preventInitialFocus: this.preventInitialFocus, preventFocusRestore: this.preventFocusRestore, initialFocus: this.initialFocus, onBeforeOpen: this._beforeDialogOpen, onOpen: this._afterDialogOpen, onBeforeClose: this._beforeDialogClose, onClose: this._afterDialogClose, exportparts: "content, header, footer", open: this.open, children: [!this._hideHeader && _jsx(_Fragment, { children: this.header.length ?
+    return (_jsxs(Dialog, { "root-element": true, accessibleName: this.accessibleName, accessibleNameRef: this.accessibleNameRef, accessibleDescription: this.accessibleDescription, accessibleDescriptionRef: this.accessibleDescriptionRef, accessibleRole: this.accessibleRole, stretch: true, preventInitialFocus: this.preventInitialFocus, preventFocusRestore: this.preventFocusRestore, initialFocus: this.initialFocus, onBeforeOpen: this._beforeDialogOpen, onOpen: this._afterDialogOpen, onBeforeClose: this._beforeDialogClose, onClose: this._afterDialogClose, exportparts: "content, header, footer", open: this.open, children: [!this._hideHeader && _jsx(_Fragment, { children: this.header.length ?
                     _jsx("slot", { slot: "header", name: "header" })
                     :
                         _jsxs("div", { class: this.classes.header, slot: "header", children: [this.headerText &&

package/dist/ResponsivePopoverTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResponsivePopoverTemplate.js","sourceRoot":"","sources":["../src/ResponsivePopoverTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,OAAO,MAAM,0CAA0C,CAAC;AAC/D,OAAO,eAAe,MAAM,sBAAsB,CAAC;AAEnD,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,MAAM,CAAC,OAAO,UAAU,yBAAyB;IAChD,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;QACpB,OAAO,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnC,CAAC;IAED,OAAO,CACN,MAAC,MAAM,0BAEN,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,OAAO,EAAE,IAAI,EACb,mBAAmB,EAAE,IAAI,CAAC,mBAAmB,EAC7C,mBAAmB,EAAE,IAAI,CAAC,mBAAmB,EAC7C,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,YAAY,EAAE,IAAI,CAAC,iBAAiB,EACpC,MAAM,EAAE,IAAI,CAAC,gBAAgB,EAC7B,aAAa,EAAE,IAAI,CAAC,kBAAkB,EACtC,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,WAAW,EAAC,yBAAyB,EACrC,IAAI,EAAE,IAAI,CAAC,IAAI,aAEd,CAAC,IAAI,CAAC,WAAW,IAAI,4BACpB,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;oBACpB,eAAM,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,GAAQ;oBACzC,CAAC;wBACD,eAAK,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,EAAC,QAAQ,aAC5C,IAAI,CAAC,UAAU;oCACf,KAAC,KAAK,IACL,KAAK,EAAC,IAAI,EACV,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,0DAA0D,YAE/D,IAAI,CAAC,UAAU,GACT,EAER,CAAC,IAAI,CAAC,gBAAgB;oCACtB,KAAC,MAAM,IACN,IAAI,EAAE,OAAO,EACb,MAAM,EAAC,aAAa,EACpB,cAAc,EAAE,IAAI,CAAC,qBAAqB,EAC1C,OAAO,EAAE,IAAI,CAAC,uBAAuB,GAC5B,IAEN,GAEL,EAEH,gBAAa,EAEb,eAAM,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,GAAQ,IACjC,CACT,CAAC;AACH,CAAC","sourcesContent":["import decline from \"@ui5/webcomponents-icons/dist/decline.js\";\nimport PopoverTemplate from \"./PopoverTemplate.js\";\nimport type ResponsivePopover from \"./ResponsivePopover.js\";\nimport Dialog from \"./Dialog.js\";\nimport Title from \"./Title.js\";\nimport Button from \"./Button.js\";\n\nexport default function ResponsivePopoverTemplate(this: ResponsivePopover) {\n\tif (!this._isPhone) {\n\t\treturn PopoverTemplate.call(this);\n\t}\n\n\treturn (\n\t\t<Dialog\n\t\t\troot-element\n\t\t\taccessibleName={this.accessibleName}\n\t\t\taccessibleNameRef={this.accessibleNameRef}\n\t\t\taccessibleRole={this.accessibleRole}\n\t\t\tstretch={true}\n\t\t\tpreventInitialFocus={this.preventInitialFocus}\n\t\t\tpreventFocusRestore={this.preventFocusRestore}\n\t\t\tinitialFocus={this.initialFocus}\n\t\t\tonBeforeOpen={this._beforeDialogOpen}\n\t\t\tonOpen={this._afterDialogOpen}\n\t\t\tonBeforeClose={this._beforeDialogClose}\n\t\t\tonClose={this._afterDialogClose}\n\t\t\texportparts=\"content, header, footer\"\n\t\t\topen={this.open}\n\t\t>\n\t\t\t{!this._hideHeader && <>\n\t\t\t\t{this.header.length ?\n\t\t\t\t\t<slot slot=\"header\" name=\"header\"></slot>\n\t\t\t\t\t:\n\t\t\t\t\t<div class={this.classes.header} slot=\"header\">\n\t\t\t\t\t\t{this.headerText &&\n\t\t\t\t\t\t\t<Title\n\t\t\t\t\t\t\t\tlevel=\"H1\"\n\t\t\t\t\t\t\t\twrappingType=\"None\"\n\t\t\t\t\t\t\t\tclass=\"ui5-popup-header-text ui5-responsive-popover-header-text\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{this.headerText}\n\t\t\t\t\t\t\t</Title>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{!this._hideCloseButton &&\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\ticon={decline}\n\t\t\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\t\t\taccessibleName={this._closeDialogAriaLabel}\n\t\t\t\t\t\t\t\tonClick={this._dialogCloseButtonClick}\n\t\t\t\t\t\t\t></Button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t}\n\t\t\t</>}\n\n\t\t\t<slot></slot>\n\n\t\t\t<slot slot=\"footer\" name=\"footer\"></slot>\n\t\t</Dialog>\n\t);\n}\n"]}
+{"version":3,"file":"ResponsivePopoverTemplate.js","sourceRoot":"","sources":["../src/ResponsivePopoverTemplate.tsx"],"names":[],"mappings":";AAAA,OAAO,OAAO,MAAM,0CAA0C,CAAC;AAC/D,OAAO,eAAe,MAAM,sBAAsB,CAAC;AAEnD,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,MAAM,CAAC,OAAO,UAAU,yBAAyB;IAChD,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;QACpB,OAAO,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnC,CAAC;IAED,OAAO,CACN,MAAC,MAAM,0BAEN,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,qBAAqB,EAAE,IAAI,CAAC,qBAAqB,EACjD,wBAAwB,EAAE,IAAI,CAAC,wBAAwB,EACvD,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,OAAO,EAAE,IAAI,EACb,mBAAmB,EAAE,IAAI,CAAC,mBAAmB,EAC7C,mBAAmB,EAAE,IAAI,CAAC,mBAAmB,EAC7C,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,YAAY,EAAE,IAAI,CAAC,iBAAiB,EACpC,MAAM,EAAE,IAAI,CAAC,gBAAgB,EAC7B,aAAa,EAAE,IAAI,CAAC,kBAAkB,EACtC,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,WAAW,EAAC,yBAAyB,EACrC,IAAI,EAAE,IAAI,CAAC,IAAI,aAEd,CAAC,IAAI,CAAC,WAAW,IAAI,4BACpB,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;oBACpB,eAAM,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,GAAQ;oBACzC,CAAC;wBACD,eAAK,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,EAAC,QAAQ,aAC5C,IAAI,CAAC,UAAU;oCACf,KAAC,KAAK,IACL,KAAK,EAAC,IAAI,EACV,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,0DAA0D,YAE/D,IAAI,CAAC,UAAU,GACT,EAER,CAAC,IAAI,CAAC,gBAAgB;oCACtB,KAAC,MAAM,IACN,IAAI,EAAE,OAAO,EACb,MAAM,EAAC,aAAa,EACpB,cAAc,EAAE,IAAI,CAAC,qBAAqB,EAC1C,OAAO,EAAE,IAAI,CAAC,uBAAuB,GAC5B,IAEN,GAEL,EAEH,gBAAa,EAEb,eAAM,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,GAAQ,IACjC,CACT,CAAC;AACH,CAAC","sourcesContent":["import decline from \"@ui5/webcomponents-icons/dist/decline.js\";\nimport PopoverTemplate from \"./PopoverTemplate.js\";\nimport type ResponsivePopover from \"./ResponsivePopover.js\";\nimport Dialog from \"./Dialog.js\";\nimport Title from \"./Title.js\";\nimport Button from \"./Button.js\";\n\nexport default function ResponsivePopoverTemplate(this: ResponsivePopover) {\n\tif (!this._isPhone) {\n\t\treturn PopoverTemplate.call(this);\n\t}\n\n\treturn (\n\t\t<Dialog\n\t\t\troot-element\n\t\t\taccessibleName={this.accessibleName}\n\t\t\taccessibleNameRef={this.accessibleNameRef}\n\t\t\taccessibleDescription={this.accessibleDescription}\n\t\t\taccessibleDescriptionRef={this.accessibleDescriptionRef}\n\t\t\taccessibleRole={this.accessibleRole}\n\t\t\tstretch={true}\n\t\t\tpreventInitialFocus={this.preventInitialFocus}\n\t\t\tpreventFocusRestore={this.preventFocusRestore}\n\t\t\tinitialFocus={this.initialFocus}\n\t\t\tonBeforeOpen={this._beforeDialogOpen}\n\t\t\tonOpen={this._afterDialogOpen}\n\t\t\tonBeforeClose={this._beforeDialogClose}\n\t\t\tonClose={this._afterDialogClose}\n\t\t\texportparts=\"content, header, footer\"\n\t\t\topen={this.open}\n\t\t>\n\t\t\t{!this._hideHeader && <>\n\t\t\t\t{this.header.length ?\n\t\t\t\t\t<slot slot=\"header\" name=\"header\"></slot>\n\t\t\t\t\t:\n\t\t\t\t\t<div class={this.classes.header} slot=\"header\">\n\t\t\t\t\t\t{this.headerText &&\n\t\t\t\t\t\t\t<Title\n\t\t\t\t\t\t\t\tlevel=\"H1\"\n\t\t\t\t\t\t\t\twrappingType=\"None\"\n\t\t\t\t\t\t\t\tclass=\"ui5-popup-header-text ui5-responsive-popover-header-text\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{this.headerText}\n\t\t\t\t\t\t\t</Title>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{!this._hideCloseButton &&\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\ticon={decline}\n\t\t\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\t\t\taccessibleName={this._closeDialogAriaLabel}\n\t\t\t\t\t\t\t\tonClick={this._dialogCloseButtonClick}\n\t\t\t\t\t\t\t></Button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t}\n\t\t\t</>}\n\n\t\t\t<slot></slot>\n\n\t\t\t<slot slot=\"footer\" name=\"footer\"></slot>\n\t\t</Dialog>\n\t);\n}\n"]}

package/dist/SelectTemplate.js

@@ -10,14 +10,20 @@ export default function SelectTemplate() {
                         _jsx(Icon, { mode: "Decorative", class: "ui5-select-option-icon", name: this.selectedOptionIcon }), _jsx("div", { class: "ui5-select-label-root", "data-sap-focus-ref": true, tabindex: this._effectiveTabIndex, role: "combobox", "aria-haspopup": "listbox", "aria-label": this.ariaLabelText, "aria-describedby": this.valueStateTextId, "aria-disabled": this.isDisabled, "aria-required": this.required, "aria-readonly": this.readonly, "aria-expanded": this._isPickerOpen, "aria-roledescription": this._ariaRoleDescription, onKeyDown: this._onkeydown, onKeyPress: this._handleKeyboardNavigation, onKeyUp: this._onkeyup, onFocusIn: this._onfocusin, onFocusOut: this._onfocusout, children: this.hasCustomLabel
                             ? _jsx("slot", { name: "label" })
                             : this.text }), this.icon &&
-                        _jsx(Icon, { name: this.icon, class: {
+                        _jsx("div", { class: {
+                                "ui5-select-icon-root": true,
                                 "inputIcon": true,
                                 "inputIcon--pressed": this._iconPressed,
-                            } }), !this.icon && !this.readonly &&
-                        _jsx(Icon, { part: "icon", name: slimArrowDown, class: {
+                            }, children: _jsx(Icon, { name: this.icon, class: {
+                                    "ui5-select-icon": true,
+                                } }) }), !this.icon && !this.readonly &&
+                        _jsx("div", { class: {
+                                "ui5-select-icon-root": true,
                                 "inputIcon": true,
                                 "inputIcon--pressed": this._iconPressed,
-                            } }), this.hasValueState &&
+                            }, children: _jsx(Icon, { part: "icon", name: slimArrowDown, class: {
+                                    "ui5-select-icon": true,
+                                } }) }), this.hasValueState &&
                         _jsx("span", { id: `${this._id}-valueStateDesc`, class: "ui5-hidden-text", children: this.valueStateText })] }), SelectPopoverTemplate.call(this)] }));
 }
 //# sourceMappingURL=SelectTemplate.js.map

package/dist/SelectTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectTemplate.js","sourceRoot":"","sources":["../src/SelectTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,aAAa,MAAM,kDAAkD,CAAC;AAC7E,OAAO,qBAAqB,MAAM,4BAA4B,CAAC;AAE/D,MAAM,CAAC,OAAO,UAAU,cAAc;IACrC,OAAO,CACN,8BACC,eACC,KAAK,EAAE;oBACN,iBAAiB,EAAE,IAAI;oBACvB,6BAA6B,EAAE,IAAI;iBACnC,EACD,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,SAAS,EACxB,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,KAAK,EAAE,IAAI,CAAC,OAAO,aAElB,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,kBAAkB;wBACrC,KAAC,IAAI,IACJ,IAAI,EAAC,YAAY,EACjB,KAAK,EAAC,wBAAwB,EAC9B,IAAI,EAAE,IAAI,CAAC,kBAAkB,GAAI,EAGnC,cACC,KAAK,EAAC,uBAAuB,8BAE7B,QAAQ,EAAE,IAAI,CAAC,kBAAkB,EACjC,IAAI,EAAC,UAAU,mBACD,SAAS,gBACX,IAAI,CAAC,aAAa,sBACZ,IAAI,CAAC,gBAAgB,mBACxB,IAAI,CAAC,UAAU,mBACf,IAAI,CAAC,QAAQ,mBACb,IAAI,CAAC,QAAQ,mBACb,IAAI,CAAC,aAAa,0BACX,IAAI,CAAC,oBAAoB,EAC/C,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,yBAAyB,EAC1C,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,YAE3B,IAAI,CAAC,cAAc;4BACnB,CAAC,CAAC,eAAM,IAAI,EAAC,OAAO,GAAQ;4BAC5B,CAAC,CAAC,IAAI,CAAC,IAAI,GAEP,EAEL,IAAI,CAAC,IAAI;wBACT,KAAC,IAAI,IACJ,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE;gCACN,WAAW,EAAE,IAAI;gCACjB,oBAAoB,EAAE,IAAI,CAAC,YAAY;6BACvC,GAAI,EAGN,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ;wBAC5B,KAAC,IAAI,IACJ,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,aAAa,EACnB,KAAK,EAAE;gCACN,WAAW,EAAE,IAAI;gCACjB,oBAAoB,EAAE,IAAI,CAAC,YAAY;6BACvC,GAAI,EAGN,IAAI,CAAC,aAAa;wBAClB,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,iBAAiB,EAAE,KAAK,EAAC,iBAAiB,YAC7D,IAAI,CAAC,cAAc,GACd,IAEH,EACL,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,IAC/B,CACH,CAAC;AACH,CAAC","sourcesContent":["import type Select from \"./Select.js\";\nimport Icon from \"./Icon.js\";\nimport slimArrowDown from \"@ui5/webcomponents-icons/dist/slim-arrow-down.js\";\nimport SelectPopoverTemplate from \"./SelectPopoverTemplate.js\";\n\nexport default function SelectTemplate(this: Select) {\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tclass={{\n\t\t\t\t\t\"ui5-select-root\": true,\n\t\t\t\t\t\"ui5-input-focusable-element\": true,\n\t\t\t\t}}\n\t\t\t\tid={`${this._id}-select`}\n\t\t\t\tonClick={this._onclick}\n\t\t\t\ttitle={this.tooltip}\n\t\t\t>\n\t\t\t\t{!this.icon && this.selectedOptionIcon &&\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tmode=\"Decorative\"\n\t\t\t\t\t\tclass=\"ui5-select-option-icon\"\n\t\t\t\t\t\tname={this.selectedOptionIcon} />\n\t\t\t\t}\n\n\t\t\t\t<div\n\t\t\t\t\tclass=\"ui5-select-label-root\"\n\t\t\t\t\tdata-sap-focus-ref\n\t\t\t\t\ttabindex={this._effectiveTabIndex}\n\t\t\t\t\trole=\"combobox\"\n\t\t\t\t\taria-haspopup=\"listbox\"\n\t\t\t\t\taria-label={this.ariaLabelText}\n\t\t\t\t\taria-describedby={this.valueStateTextId}\n\t\t\t\t\taria-disabled={this.isDisabled}\n\t\t\t\t\taria-required={this.required}\n\t\t\t\t\taria-readonly={this.readonly}\n\t\t\t\t\taria-expanded={this._isPickerOpen}\n\t\t\t\t\taria-roledescription={this._ariaRoleDescription}\n\t\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\t\tonKeyPress={this._handleKeyboardNavigation}\n\t\t\t\t\tonKeyUp={this._onkeyup}\n\t\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t\t>\n\t\t\t\t\t{this.hasCustomLabel\n\t\t\t\t\t\t? <slot name=\"label\"></slot>\n\t\t\t\t\t\t: this.text\n\t\t\t\t\t}\n\t\t\t\t</div>\n\n\t\t\t\t{this.icon &&\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tname={this.icon}\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\"inputIcon\": true,\n\t\t\t\t\t\t\t\"inputIcon--pressed\": this._iconPressed,\n\t\t\t\t\t\t}} />\n\t\t\t\t}\n\n\t\t\t\t{!this.icon && !this.readonly &&\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tpart=\"icon\"\n\t\t\t\t\t\tname={slimArrowDown}\n\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\"inputIcon\": true,\n\t\t\t\t\t\t\t\"inputIcon--pressed\": this._iconPressed,\n\t\t\t\t\t\t}} />\n\t\t\t\t}\n\n\t\t\t\t{this.hasValueState &&\n\t\t\t\t\t<span id={`${this._id}-valueStateDesc`} class=\"ui5-hidden-text\">\n\t\t\t\t\t\t{this.valueStateText}\n\t\t\t\t\t</span>\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t{SelectPopoverTemplate.call(this)}\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"file":"SelectTemplate.js","sourceRoot":"","sources":["../src/SelectTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,aAAa,MAAM,kDAAkD,CAAC;AAC7E,OAAO,qBAAqB,MAAM,4BAA4B,CAAC;AAE/D,MAAM,CAAC,OAAO,UAAU,cAAc;IACrC,OAAO,CACN,8BACC,eACC,KAAK,EAAE;oBACN,iBAAiB,EAAE,IAAI;oBACvB,6BAA6B,EAAE,IAAI;iBACnC,EACD,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,SAAS,EACxB,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,KAAK,EAAE,IAAI,CAAC,OAAO,aAElB,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,kBAAkB;wBACrC,KAAC,IAAI,IACJ,IAAI,EAAC,YAAY,EACjB,KAAK,EAAC,wBAAwB,EAC9B,IAAI,EAAE,IAAI,CAAC,kBAAkB,GAAI,EAGnC,cACC,KAAK,EAAC,uBAAuB,8BAE7B,QAAQ,EAAE,IAAI,CAAC,kBAAkB,EACjC,IAAI,EAAC,UAAU,mBACD,SAAS,gBACX,IAAI,CAAC,aAAa,sBACZ,IAAI,CAAC,gBAAgB,mBACxB,IAAI,CAAC,UAAU,mBACf,IAAI,CAAC,QAAQ,mBACb,IAAI,CAAC,QAAQ,mBACb,IAAI,CAAC,aAAa,0BACX,IAAI,CAAC,oBAAoB,EAC/C,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,yBAAyB,EAC1C,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,UAAU,EAAE,IAAI,CAAC,WAAW,YAE3B,IAAI,CAAC,cAAc;4BACnB,CAAC,CAAC,eAAM,IAAI,EAAC,OAAO,GAAQ;4BAC5B,CAAC,CAAC,IAAI,CAAC,IAAI,GAEP,EAEL,IAAI,CAAC,IAAI;wBACT,cAAK,KAAK,EAAE;gCACX,sBAAsB,EAAE,IAAI;gCAC5B,WAAW,EAAE,IAAI;gCACjB,oBAAoB,EAAE,IAAI,CAAC,YAAY;6BACvC,YACA,KAAC,IAAI,IACJ,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE;oCACN,iBAAiB,EAAE,IAAI;iCACvB,GAAI,GACD,EAGN,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ;wBAC5B,cAAK,KAAK,EAAE;gCACX,sBAAsB,EAAE,IAAI;gCAC5B,WAAW,EAAE,IAAI;gCACjB,oBAAoB,EAAE,IAAI,CAAC,YAAY;6BACvC,YACA,KAAC,IAAI,IACJ,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,aAAa,EACnB,KAAK,EAAE;oCACN,iBAAiB,EAAE,IAAI;iCACvB,GAAI,GACD,EAGN,IAAI,CAAC,aAAa;wBAClB,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,iBAAiB,EAAE,KAAK,EAAC,iBAAiB,YAC7D,IAAI,CAAC,cAAc,GACd,IAEH,EACL,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,IAC/B,CACH,CAAC;AACH,CAAC","sourcesContent":["import type Select from \"./Select.js\";\nimport Icon from \"./Icon.js\";\nimport slimArrowDown from \"@ui5/webcomponents-icons/dist/slim-arrow-down.js\";\nimport SelectPopoverTemplate from \"./SelectPopoverTemplate.js\";\n\nexport default function SelectTemplate(this: Select) {\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tclass={{\n\t\t\t\t\t\"ui5-select-root\": true,\n\t\t\t\t\t\"ui5-input-focusable-element\": true,\n\t\t\t\t}}\n\t\t\t\tid={`${this._id}-select`}\n\t\t\t\tonClick={this._onclick}\n\t\t\t\ttitle={this.tooltip}\n\t\t\t>\n\t\t\t\t{!this.icon && this.selectedOptionIcon &&\n\t\t\t\t\t<Icon\n\t\t\t\t\t\tmode=\"Decorative\"\n\t\t\t\t\t\tclass=\"ui5-select-option-icon\"\n\t\t\t\t\t\tname={this.selectedOptionIcon} />\n\t\t\t\t}\n\n\t\t\t\t<div\n\t\t\t\t\tclass=\"ui5-select-label-root\"\n\t\t\t\t\tdata-sap-focus-ref\n\t\t\t\t\ttabindex={this._effectiveTabIndex}\n\t\t\t\t\trole=\"combobox\"\n\t\t\t\t\taria-haspopup=\"listbox\"\n\t\t\t\t\taria-label={this.ariaLabelText}\n\t\t\t\t\taria-describedby={this.valueStateTextId}\n\t\t\t\t\taria-disabled={this.isDisabled}\n\t\t\t\t\taria-required={this.required}\n\t\t\t\t\taria-readonly={this.readonly}\n\t\t\t\t\taria-expanded={this._isPickerOpen}\n\t\t\t\t\taria-roledescription={this._ariaRoleDescription}\n\t\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\t\tonKeyPress={this._handleKeyboardNavigation}\n\t\t\t\t\tonKeyUp={this._onkeyup}\n\t\t\t\t\tonFocusIn={this._onfocusin}\n\t\t\t\t\tonFocusOut={this._onfocusout}\n\t\t\t\t>\n\t\t\t\t\t{this.hasCustomLabel\n\t\t\t\t\t\t? <slot name=\"label\"></slot>\n\t\t\t\t\t\t: this.text\n\t\t\t\t\t}\n\t\t\t\t</div>\n\n\t\t\t\t{this.icon &&\n\t\t\t\t\t<div class={{\n\t\t\t\t\t\t\"ui5-select-icon-root\": true,\n\t\t\t\t\t\t\"inputIcon\": true,\n\t\t\t\t\t\t\"inputIcon--pressed\": this._iconPressed,\n\t\t\t\t\t}}>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tname={this.icon}\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\"ui5-select-icon\": true,\n\t\t\t\t\t\t\t}} />\n\t\t\t\t\t</div>\n\t\t\t\t}\n\n\t\t\t\t{!this.icon && !this.readonly &&\n\t\t\t\t\t<div class={{\n\t\t\t\t\t\t\"ui5-select-icon-root\": true,\n\t\t\t\t\t\t\"inputIcon\": true,\n\t\t\t\t\t\t\"inputIcon--pressed\": this._iconPressed,\n\t\t\t\t\t}}>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tpart=\"icon\"\n\t\t\t\t\t\t\tname={slimArrowDown}\n\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\"ui5-select-icon\": true,\n\t\t\t\t\t\t\t}} />\n\t\t\t\t\t</div>\n\t\t\t\t}\n\n\t\t\t\t{this.hasValueState &&\n\t\t\t\t\t<span id={`${this._id}-valueStateDesc`} class=\"ui5-hidden-text\">\n\t\t\t\t\t\t{this.valueStateText}\n\t\t\t\t\t</span>\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t{SelectPopoverTemplate.call(this)}\n\t\t</>\n\t);\n}\n"]}

package/dist/Slider.d.ts

@@ -103,10 +103,8 @@ declare class Slider extends SliderBase implements IFormInputElement {
     /** Called when the user finish interacting with the slider
      * @private
      */
-    _handleUp(e: TouchEvent | MouseEvent): void;
+    _handleUp(): void;
     _onkeyup(e: KeyboardEvent): void;
-    _onInputFocusOut(e: FocusEvent): void;
-    _updateInputValue(): void;
     /** Determines if the press is over the handle
      * @private
      */
@@ -116,6 +114,7 @@ declare class Slider extends SliderBase implements IFormInputElement {
      */
     _updateHandleAndProgress(newValue: number): void;
     _handleActionKeyPress(e: KeyboardEvent): void;
+    _onTooltopForwardFocus(e: CustomEvent): void;
     get inputValue(): string;
     get styles(): {
         progress: {
@@ -132,9 +131,6 @@ declare class Slider extends SliderBase implements IFormInputElement {
             [x: string]: string;
             width: string;
         };
-        tooltip: {
-            visibility: string;
-        };
     };
     get _sliderHandle(): Element;
     get tooltipValue(): string;

package/dist/Slider.js

@@ -101,9 +101,6 @@ let Slider = Slider_1 = class Slider extends SliderBase {
      *
      */
     onBeforeRendering() {
-        if (this.editableTooltip) {
-            this._updateInputValue();
-        }
         if (!this.isCurrentStateOutdated()) {
             return;
         }
@@ -143,7 +140,7 @@ let Slider = Slider_1 = class Slider extends SliderBase {
     _onmousedown(e) {
         // If step is 0 no interaction is available because there is no constant
         // (equal for all user environments) quantitative representation of the value
-        if (this.disabled || this.step === 0 || e.target.hasAttribute("ui5-input")) {
+        if (this.disabled || this.step === 0 || e.target.hasAttribute("ui5-slider-tooltip")) {
             return;
         }
         const newValue = this.handleDownBase(e);
@@ -168,7 +165,7 @@ let Slider = Slider_1 = class Slider extends SliderBase {
             this._valueInitial = this.value;
         }
         if (this.showTooltip) {
-            this._tooltipVisibility = SliderBase.TOOLTIP_VISIBILITY.VISIBLE;
+            this._tooltipsOpen = true;
         }
     }
     _onfocusout(e) {
@@ -181,8 +178,8 @@ let Slider = Slider_1 = class Slider extends SliderBase {
         // Reset focus state and the stored Slider's initial
         // value that was saved when it was first focused in
         this._valueInitial = undefined;
-        if (this.showTooltip && !e.relatedTarget?.hasAttribute("ui5-input")) {
-            this._tooltipVisibility = SliderBase.TOOLTIP_VISIBILITY.HIDDEN;
+        if (this.showTooltip && !e.relatedTarget?.hasAttribute("ui5-slider-tooltip")) {
+            this._tooltipsOpen = false;
         }
     }
     /**
@@ -190,9 +187,6 @@ let Slider = Slider_1 = class Slider extends SliderBase {
      * @private
      */
     _handleMove(e) {
-        if (e.target.hasAttribute("ui5-input")) {
-            return;
-        }
         e.preventDefault();
         // If step is 0 no interaction is available because there is no constant
         // (equal for all user environments) quantitative representation of the value
@@ -208,10 +202,7 @@ let Slider = Slider_1 = class Slider extends SliderBase {
     /** Called when the user finish interacting with the slider
      * @private
      */
-    _handleUp(e) {
-        if (e.target.hasAttribute("ui5-input")) {
-            return;
-        }
+    _handleUp() {
         if (this._valueOnInteractionStart !== this.value) {
             this.fireDecoratorEvent("change");
         }
@@ -226,32 +217,6 @@ let Slider = Slider_1 = class Slider extends SliderBase {
         }
         this._valueOnInteractionStart = this.value;
     }
-    _onInputFocusOut(e) {
-        const tooltipInput = this.shadowRoot.querySelector("[ui5-input]");
-        this._tooltipVisibility = SliderBase.TOOLTIP_VISIBILITY.HIDDEN;
-        this._updateValueFromInput(e);
-        if (!this._isInputValueValid) {
-            tooltipInput.value = this._lastValidInputValue;
-            this._isInputValueValid = true;
-            this._tooltipInputValueState = "None";
-        }
-    }
-    _updateInputValue() {
-        const tooltipInput = this.shadowRoot.querySelector("[ui5-input]");
-        if (!tooltipInput) {
-            return;
-        }
-        this._isInputValueValid = parseFloat(tooltipInput.value) >= this.min && parseFloat(tooltipInput.value) <= this.max;
-        if (!this._isInputValueValid) {
-            this._tooltipInputValue = this._lastValidInputValue;
-            this._isInputValueValid = true;
-            this._tooltipInputValueState = "Negative";
-            return;
-        }
-        this._tooltipInputValue = this.value.toString();
-        this._lastValidInputValue = this._tooltipInputValue;
-        this._tooltipInputValueState = "None";
-    }
     /** Determines if the press is over the handle
      * @private
      */
@@ -282,6 +247,10 @@ let Slider = Slider_1 = class Slider extends SliderBase {
             this.updateStateStorageAndFireInputEvent("value");
         }
     }
+    _onTooltopForwardFocus(e) {
+        const tooltip = e.target;
+        tooltip.followRef?.focus();
+    }
     get inputValue() {
         return this.value.toString();
     }
@@ -301,9 +270,6 @@ let Slider = Slider_1 = class Slider extends SliderBase {
                 "width": `100%`,
                 [this.directionStart]: `-${this._labelWidth / 2}%`,
             },
-            tooltip: {
-                "visibility": `${this._tooltipVisibility}`,
-            },
         };
     }
     get _sliderHandle() {

package/dist/Slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../src/Slider.ts"],"names":[],"mappings":"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","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isEscape } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport type ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport SliderBase from \"./SliderBase.js\";\nimport type Input from \"./Input.js\";\n\n// Template\nimport SliderTemplate from \"./SliderTemplate.js\";\n\n// Texts\nimport {\n\tSLIDER_ARIA_DESCRIPTION,\n\tSLIDER_TOOLTIP_INPUT_DESCRIPTION,\n\tSLIDER_TOOLTIP_INPUT_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n/**\n * @class\n *\n * ### Overview\n * The Slider component represents a numerical range and a handle (grip).\n * The purpose of the component is to enable visual selection of a value in\n * a continuous numerical range by moving an adjustable handle.\n *\n * ### Structure\n * The most important properties of the Slider are:\n *\n * - min - The minimum value of the slider range.\n * - max - The maximum value of the slider range.\n * - value - The current value of the slider range.\n * - step - Determines the increments in which the slider will move.\n * - showTooltip - Determines if a tooltip should be displayed above the handle.\n * - showTickmarks - Displays a visual divider between the step values.\n * - labelInterval - Labels some or all of the tickmarks with their values.\n *\n * ### Usage\n * The most common use case is to select values on a continuous numerical scale (e.g. temperature, volume, etc. ).\n *\n * ### Responsive Behavior\n * The `ui5-slider` component adjusts to the size of its parent container by recalculating and\n * resizing the width of the control. You can move the slider handle in several different ways:\n *\n * - Drag and drop the handle to the desired value.\n * - Click/tap on the range bar to move the handle to that location.\n *\n * ### Keyboard Handling\n *\n * - `Left or Down Arrow` - Moves the handle one step to the left, effectively decreasing the component's value by `step` amount;\n * - `Right or Up Arrow` - Moves the handle one step to the right, effectively increasing the component's value by `step` amount;\n * - `Left or Down Arrow + Ctrl/Cmd` - Moves the handle to the left with step equal to 1/10th of the entire range, effectively decreasing the component's value by 1/10th of the range;\n * - `Right or Up Arrow + Ctrl/Cmd` - Moves the handle to the right with step equal to 1/10th of the entire range, effectively increasing the component's value by 1/10th of the range;\n * - `Plus` - Same as `Right or Up Arrow`;\n * - `Minus` - Same as `Left or Down Arrow`;\n * - `Home` - Moves the handle to the beginning of the range;\n * - `End` - Moves the handle to the end of the range;\n * - `Page Up` - Same as `Right or Up + Ctrl/Cmd`;\n * - `Page Down` - Same as `Left or Down + Ctrl/Cmd`;\n * - `Escape` - Resets the value property after interaction, to the position prior the component's focusing;\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/Slider.js\";`\n * @constructor\n * @extends SliderBase\n * @since 1.0.0-rc.11\n * @public\n * @csspart progress-container - Used to style the progress container, the horizontal bar that visually represents the range between the minimum and maximum values, of the `ui5-slider`.\n * @csspart progress-bar - Used to style the progress bar, which shows the progress of the `ui5-slider`.\n * @csspart handle - Used to style the handle of the `ui5-slider`.\n */\n@customElement({\n\ttag: \"ui5-slider\",\n\tlanguageAware: true,\n\tformAssociated: true,\n\ttemplate: SliderTemplate,\n})\nclass Slider extends SliderBase implements IFormInputElement {\n\t/**\n\t * Current value of the slider\n\t * @default 0\n\t * @formEvents change input\n\t * @formProperty\n\t * @public\n\t */\n\t@property({ type: Number })\n\tvalue = 0;\n\n\t_valueInitial?: number;\n\t_valueOnInteractionStart?: number;\n\t_progressPercentage = 0;\n\t_handlePositionFromStart = 0;\n\t_lastValidInputValue: string;\n\t_tooltipInputValue: string = this.value.toString();\n\t_tooltipInputValueState: `${ValueState}` = \"None\";\n\n\tget formFormattedValue() {\n\t\treturn this.value.toString();\n\t}\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._stateStorage.value = undefined;\n\t\tthis._lastValidInputValue = this.min.toString();\n\t}\n\n\t/**\n\t *\n\t * Check if the previously saved state is outdated. That would mean\n\t * either it is the initial rendering or that a property has been changed\n\t * programmatically - because the previous state is always updated in\n\t * the interaction handlers.\n\t *\n\t * Normalize current properties, update the previously stored state.\n\t * Update the visual UI representation of the Slider.\n\t *\n\t */\n\tonBeforeRendering() {\n\t\tif (this.editableTooltip) {\n\t\t\tthis._updateInputValue();\n\t\t}\n\n\t\tif (!this.isCurrentStateOutdated()) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.notResized = true;\n\t\tthis.syncUIAndState();\n\t\tthis._updateHandleAndProgress(this.value);\n\t}\n\n\tsyncUIAndState() {\n\t\t// Validate step and update the stored state for the step property.\n\t\tif (this.isPropertyUpdated(\"step\")) {\n\t\t\tthis._validateStep(this.step);\n\t\t\tthis.storePropertyState(\"step\");\n\t\t}\n\n\t\t// Recalculate the tickmarks and labels and update the stored state.\n\t\tif (this.isPropertyUpdated(\"min\", \"max\", \"value\")) {\n\t\t\tthis.storePropertyState(\"min\", \"max\");\n\n\t\t\t// Here the value props are changed programmatically (not by user interaction)\n\t\t\t// and it won't be \"stepified\" (rounded to the nearest step). 'Clip' them within\n\t\t\t// min and max bounderies and update the previous state reference.\n\t\t\tthis.value = SliderBase.clipValue(this.value, this._effectiveMin, this._effectiveMax);\n\t\t\tthis.updateStateStorageAndFireInputEvent(\"value\");\n\t\t\tthis.storePropertyState(\"value\");\n\t\t}\n\n\t\t// Labels must be updated if any of the min/max/step/labelInterval props are changed\n\t\tif (this.labelInterval && this.showTickmarks) {\n\t\t\tthis._createLabels();\n\t\t}\n\n\t\t// Update the stored state for the labelInterval, if changed\n\t\tif (this.isPropertyUpdated(\"labelInterval\")) {\n\t\t\tthis.storePropertyState(\"labelInterval\");\n\t\t}\n\t}\n\n\t/**\n\t * Called when the user starts interacting with the slider\n\t * @private\n\t */\n\t_onmousedown(e: TouchEvent | MouseEvent) {\n\t\t// If step is 0 no interaction is available because there is no constant\n\t\t// (equal for all user environments) quantitative representation of the value\n\t\tif (this.disabled || this.step === 0 || (e.target as HTMLElement).hasAttribute(\"ui5-input\")) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst newValue = this.handleDownBase(e);\n\t\tthis._valueOnInteractionStart = this.value;\n\n\t\t// Set initial value if one is not set previously on focus in.\n\t\t// It will be restored if ESC key is pressed.\n\t\tif (this._valueInitial === undefined) {\n\t\t\tthis._valueInitial = this.value;\n\t\t}\n\n\t\t// Do not yet update the Slider if press is over a handle. It will be updated if the user drags the mouse.\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tif (!this._isHandlePressed(ctor.getPageXValueFromEvent(e))) {\n\t\t\tthis._updateHandleAndProgress(newValue);\n\t\t\tthis.value = newValue;\n\t\t\tthis.updateStateStorageAndFireInputEvent(\"value\");\n\t\t}\n\t}\n\n\t_onfocusin() {\n\t\t// Set initial value if one is not set previously on focus in.\n\t\t// It will be restored if ESC key is pressed.\n\t\tif (this._valueInitial === undefined) {\n\t\t\tthis._valueInitial = this.value;\n\t\t}\n\n\t\tif (this.showTooltip) {\n\t\t\tthis._tooltipVisibility = SliderBase.TOOLTIP_VISIBILITY.VISIBLE;\n\t\t}\n\t}\n\n\t_onfocusout(e: FocusEvent) {\n\t\t// Prevent focusout when the focus is getting set within the slider internal\n\t\t// element (on the handle), before the Slider' customElement itself is finished focusing\n\t\tif (this._isFocusing()) {\n\t\t\tthis._preventFocusOut();\n\t\t\treturn;\n\t\t}\n\n\t\t// Reset focus state and the stored Slider's initial\n\t\t// value that was saved when it was first focused in\n\t\tthis._valueInitial = undefined;\n\n\t\tif (this.showTooltip && !(e.relatedTarget as HTMLInputElement)?.hasAttribute(\"ui5-input\")) {\n\t\t\tthis._tooltipVisibility = SliderBase.TOOLTIP_VISIBILITY.HIDDEN;\n\t\t}\n\t}\n\n\t/**\n\t * Called when the user moves the slider\n\t * @private\n\t */\n\t_handleMove(e: TouchEvent | MouseEvent) {\n\t\tif ((e.target as HTMLElement).hasAttribute(\"ui5-input\")) {\n\t\t\treturn;\n\t\t}\n\n\t\te.preventDefault();\n\n\t\t// If step is 0 no interaction is available because there is no constant\n\t\t// (equal for all user environments) quantitative representation of the value\n\t\tif (this.disabled || this._effectiveStep === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tconst newValue = ctor.getValueFromInteraction(e, this._effectiveStep, this._effectiveMin, this._effectiveMax, this.getBoundingClientRect(), this.directionStart);\n\n\t\tthis._updateHandleAndProgress(newValue);\n\t\tthis.value = newValue;\n\t\tthis.updateStateStorageAndFireInputEvent(\"value\");\n\t}\n\n\t/** Called when the user finish interacting with the slider\n\t * @private\n\t */\n\t_handleUp(e: TouchEvent | MouseEvent) {\n\t\tif ((e.target as HTMLElement).hasAttribute(\"ui5-input\")) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this._valueOnInteractionStart !== this.value) {\n\t\t\tthis.fireDecoratorEvent(\"change\");\n\t\t}\n\n\t\tthis.handleUpBase();\n\t\tthis._valueOnInteractionStart = undefined;\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tconst isActionKey = SliderBase._isActionKey(e);\n\n\t\tthis._onKeyupBase();\n\n\t\tif (isActionKey && this._valueOnInteractionStart !== this.value) {\n\t\t\tthis.fireDecoratorEvent(\"change\");\n\t\t}\n\n\t\tthis._valueOnInteractionStart = this.value;\n\t}\n\n\t_onInputFocusOut(e: FocusEvent) {\n\t\tconst tooltipInput = this.shadowRoot!.querySelector(\"[ui5-input]\") as Input;\n\n\t\tthis._tooltipVisibility = SliderBase.TOOLTIP_VISIBILITY.HIDDEN;\n\t\tthis._updateValueFromInput(e);\n\n\t\tif (!this._isInputValueValid) {\n\t\t\ttooltipInput.value = this._lastValidInputValue;\n\t\t\tthis._isInputValueValid = true;\n\t\t\tthis._tooltipInputValueState = \"None\";\n\t\t}\n\t}\n\n\t_updateInputValue() {\n\t\tconst tooltipInput = this.shadowRoot!.querySelector(\"[ui5-input]\") as Input;\n\n\t\tif (!tooltipInput) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._isInputValueValid = parseFloat(tooltipInput.value) >= this.min && parseFloat(tooltipInput.value) <= this.max;\n\n\t\tif (!this._isInputValueValid) {\n\t\t\tthis._tooltipInputValue = this._lastValidInputValue;\n\t\t\tthis._isInputValueValid = true;\n\t\t\tthis._tooltipInputValueState = \"Negative\";\n\n\t\t\treturn;\n\t\t}\n\n\t\tthis._tooltipInputValue = this.value.toString();\n\t\tthis._lastValidInputValue = this._tooltipInputValue;\n\t\tthis._tooltipInputValueState = \"None\";\n\t}\n\n\t/** Determines if the press is over the handle\n\t * @private\n\t */\n\t_isHandlePressed(clientX: number) {\n\t\tconst sliderHandleDomRect = this._sliderHandle.getBoundingClientRect();\n\t\treturn clientX >= sliderHandleDomRect.left && clientX <= sliderHandleDomRect.right;\n\t}\n\n\t/** Updates the UI representation of the progress bar and handle position\n\t * @private\n\t */\n\t_updateHandleAndProgress(newValue: number) {\n\t\tconst max = this._effectiveMax;\n\t\tconst min = this._effectiveMin;\n\n\t\t// The progress (completed) percentage of the slider.\n\t\tthis._progressPercentage = (newValue - min) / (max - min);\n\t\t// How many pixels from the left end of the slider will be the placed the affected  by the user action handle\n\t\tthis._handlePositionFromStart = this._progressPercentage * 100;\n\t}\n\n\t_handleActionKeyPress(e: KeyboardEvent) {\n\t\tconst min = this._effectiveMin;\n\t\tconst max = this._effectiveMax;\n\t\tconst currentValue = this.value;\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tconst newValue = isEscape(e) ? this._valueInitial : ctor.clipValue(this._handleActionKeyPressBase(e, \"value\") + currentValue, min, max);\n\n\t\tif (newValue !== currentValue) {\n\t\t\tthis._updateHandleAndProgress(newValue!);\n\t\t\tthis.value = newValue!;\n\t\t\tthis.updateStateStorageAndFireInputEvent(\"value\");\n\t\t}\n\t}\n\n\tget inputValue() {\n\t\treturn this.value.toString();\n\t}\n\n\tget styles() {\n\t\treturn {\n\t\t\tprogress: {\n\t\t\t\t\"transform\": `scaleX(${this._progressPercentage})`,\n\t\t\t\t\"transform-origin\": `${this.directionStart} top`,\n\t\t\t},\n\t\t\thandle: {\n\t\t\t\t[this.directionStart]: `${this._handlePositionFromStart}%`,\n\t\t\t},\n\t\t\tlabel: {\n\t\t\t\t\"width\": `${this._labelWidth}%`,\n\t\t\t},\n\t\t\tlabelContainer: {\n\t\t\t\t\"width\": `100%`,\n\t\t\t\t[this.directionStart]: `-${this._labelWidth / 2}%`,\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\t\"visibility\": `${this._tooltipVisibility}`,\n\t\t\t},\n\t\t};\n\t}\n\n\tget _sliderHandle() {\n\t\treturn this.shadowRoot!.querySelector(\".ui5-slider-handle\")!;\n\t}\n\n\tget tooltipValue() {\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tconst stepPrecision = ctor._getDecimalPrecisionOfNumber(this._effectiveStep);\n\t\treturn this.value.toFixed(stepPrecision);\n\t}\n\n\tget _ariaDisabled() {\n\t\treturn this.disabled || undefined;\n\t}\n\n\tget _ariaLabelledByText() {\n\t\treturn Slider.i18nBundle.getText(SLIDER_ARIA_DESCRIPTION);\n\t}\n\n\tget _ariaDescribedByInputText() {\n\t\treturn Slider.i18nBundle.getText(SLIDER_TOOLTIP_INPUT_DESCRIPTION);\n\t}\n\n\tget _ariaLabelledByInputText() {\n\t\treturn Slider.i18nBundle.getText(SLIDER_TOOLTIP_INPUT_LABEL);\n\t}\n\n\tget tickmarksObject() {\n\t\tconst count = this._tickmarksCount;\n\t\tconst arr = [];\n\n\t\tif (this._hiddenTickmarks) {\n\t\t\treturn [true, false];\n\t\t}\n\n\t\tfor (let i = 0; i <= count; i++) {\n\t\t\tarr.push(this._effectiveMin + (i * this.step) <= this.value);\n\t\t}\n\n\t\treturn arr;\n\t}\n}\n\nSlider.define();\n\nexport default Slider;\n"]}
+{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../src/Slider.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AAEnE,OAAO,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAGhE,OAAO,UAAU,MAAM,iBAAiB,CAAC;AAGzC,WAAW;AACX,OAAO,cAAc,MAAM,qBAAqB,CAAC;AAEjD,QAAQ;AACR,OAAO,EACN,uBAAuB,EACvB,gCAAgC,EAChC,0BAA0B,GAC1B,MAAM,mCAAmC,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AAOH,IAAM,MAAM,cAAZ,MAAM,MAAO,SAAQ,UAAU;IAmB9B,IAAI,kBAAkB;QACrB,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;IAC9B,CAAC;IAKD;QACC,KAAK,EAAE,CAAC;QA1BT;;;;;;WAMG;QAEH,UAAK,GAAG,CAAC,CAAC;QAIV,wBAAmB,GAAG,CAAC,CAAC;QACxB,6BAAwB,GAAG,CAAC,CAAC;QAE7B,uBAAkB,GAAW,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;QACnD,4BAAuB,GAAoB,MAAM,CAAC;QAWjD,IAAI,CAAC,aAAa,CAAC,KAAK,GAAG,SAAS,CAAC;QACrC,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;IACjD,CAAC;IAED;;;;;;;;;;OAUG;IACH,iBAAiB;QAChB,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE,EAAE,CAAC;YACpC,OAAO;QACR,CAAC;QAED,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC3C,CAAC;IAED,cAAc;QACb,mEAAmE;QACnE,IAAI,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,EAAE,CAAC;YACpC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAC9B,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;QACjC,CAAC;QAED,oEAAoE;QACpE,IAAI,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,EAAE,CAAC;YACnD,IAAI,CAAC,kBAAkB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;YAEtC,8EAA8E;YAC9E,gFAAgF;YAChF,kEAAkE;YAClE,IAAI,CAAC,KAAK,GAAG,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;YACtF,IAAI,CAAC,mCAAmC,CAAC,OAAO,CAAC,CAAC;YAClD,IAAI,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC;QAClC,CAAC;QAED,oFAAoF;QACpF,IAAI,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YAC9C,IAAI,CAAC,aAAa,EAAE,CAAC;QACtB,CAAC;QAED,4DAA4D;QAC5D,IAAI,IAAI,CAAC,iBAAiB,CAAC,eAAe,CAAC,EAAE,CAAC;YAC7C,IAAI,CAAC,kBAAkB,CAAC,eAAe,CAAC,CAAC;QAC1C,CAAC;IACF,CAAC;IAED;;;OAGG;IACH,YAAY,CAAC,CAA0B;QACtC,wEAAwE;QACxE,6EAA6E;QAC7E,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,KAAK,CAAC,IAAK,CAAC,CAAC,MAAsB,CAAC,YAAY,CAAC,oBAAoB,CAAC,EAAE,CAAC;YACtG,OAAO;QACR,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;QACxC,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC,KAAK,CAAC;QAE3C,8DAA8D;QAC9D,6CAA6C;QAC7C,IAAI,IAAI,CAAC,aAAa,KAAK,SAAS,EAAE,CAAC;YACtC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC;QACjC,CAAC;QAED,0GAA0G;QAC1G,MAAM,IAAI,GAAG,IAAI,CAAC,WAA4B,CAAC;QAC/C,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;YAC5D,IAAI,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC;YACxC,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC;YACtB,IAAI,CAAC,mCAAmC,CAAC,OAAO,CAAC,CAAC;QACnD,CAAC;IACF,CAAC;IAED,UAAU;QACT,8DAA8D;QAC9D,6CAA6C;QAC7C,IAAI,IAAI,CAAC,aAAa,KAAK,SAAS,EAAE,CAAC;YACtC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC;QACjC,CAAC;QAED,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACtB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;QAC3B,CAAC;IACF,CAAC;IAED,WAAW,CAAC,CAAa;QACxB,4EAA4E;QAC5E,wFAAwF;QACxF,IAAI,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC;YACxB,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,OAAO;QACR,CAAC;QAED,oDAAoD;QACpD,oDAAoD;QACpD,IAAI,CAAC,aAAa,GAAG,SAAS,CAAC;QAE/B,IAAI,IAAI,CAAC,WAAW,IAAI,CAAE,CAAC,CAAC,aAA6B,EAAE,YAAY,CAAC,oBAAoB,CAAC,EAAE,CAAC;YAC/F,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;QAC5B,CAAC;IACF,CAAC;IAED;;;OAGG;IACH,WAAW,CAAC,CAA0B;QACrC,CAAC,CAAC,cAAc,EAAE,CAAC;QAEnB,wEAAwE;QACxE,6EAA6E;QAC7E,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,cAAc,KAAK,CAAC,EAAE,CAAC;YAChD,OAAO;QACR,CAAC;QAED,MAAM,IAAI,GAAG,IAAI,CAAC,WAA4B,CAAC;QAC/C,MAAM,QAAQ,GAAG,IAAI,CAAC,uBAAuB,CAAC,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,qBAAqB,EAAE,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QAEjK,IAAI,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC;QACxC,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC;QACtB,IAAI,CAAC,mCAAmC,CAAC,OAAO,CAAC,CAAC;IACnD,CAAC;IAED;;OAEG;IACH,SAAS;QACR,IAAI,IAAI,CAAC,wBAAwB,KAAK,IAAI,CAAC,KAAK,EAAE,CAAC;YAClD,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;QACnC,CAAC;QAED,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,wBAAwB,GAAG,SAAS,CAAC;IAC3C,CAAC;IAED,QAAQ,CAAC,CAAgB;QACxB,MAAM,WAAW,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAE/C,IAAI,CAAC,YAAY,EAAE,CAAC;QAEpB,IAAI,WAAW,IAAI,IAAI,CAAC,wBAAwB,KAAK,IAAI,CAAC,KAAK,EAAE,CAAC;YACjE,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;QACnC,CAAC;QAED,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC,KAAK,CAAC;IAC5C,CAAC;IAED;;OAEG;IACH,gBAAgB,CAAC,OAAe;QAC/B,MAAM,mBAAmB,GAAG,IAAI,CAAC,aAAa,CAAC,qBAAqB,EAAE,CAAC;QACvE,OAAO,OAAO,IAAI,mBAAmB,CAAC,IAAI,IAAI,OAAO,IAAI,mBAAmB,CAAC,KAAK,CAAC;IACpF,CAAC;IAED;;OAEG;IACH,wBAAwB,CAAC,QAAgB;QACxC,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC;QAC/B,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC;QAE/B,qDAAqD;QACrD,IAAI,CAAC,mBAAmB,GAAG,CAAC,QAAQ,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC;QAC1D,6GAA6G;QAC7G,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC,mBAAmB,GAAG,GAAG,CAAC;IAChE,CAAC;IAED,qBAAqB,CAAC,CAAgB;QACrC,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC;QAC/B,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC;QAC/B,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC;QAChC,MAAM,IAAI,GAAG,IAAI,CAAC,WAA4B,CAAC;QAC/C,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC,EAAE,OAAO,CAAC,GAAG,YAAY,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;QAExI,IAAI,QAAQ,KAAK,YAAY,EAAE,CAAC;YAC/B,IAAI,CAAC,wBAAwB,CAAC,QAAS,CAAC,CAAC;YACzC,IAAI,CAAC,KAAK,GAAG,QAAS,CAAC;YACvB,IAAI,CAAC,mCAAmC,CAAC,OAAO,CAAC,CAAC;QACnD,CAAC;IACF,CAAC;IAED,sBAAsB,CAAC,CAAc;QACpC,MAAM,OAAO,GAAG,CAAC,CAAC,MAAuB,CAAC;QAE1C,OAAO,CAAC,SAAS,EAAE,KAAK,EAAE,CAAC;IAC5B,CAAC;IAED,IAAI,UAAU;QACb,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;IAC9B,CAAC;IAED,IAAI,MAAM;QACT,OAAO;YACN,QAAQ,EAAE;gBACT,WAAW,EAAE,UAAU,IAAI,CAAC,mBAAmB,GAAG;gBAClD,kBAAkB,EAAE,GAAG,IAAI,CAAC,cAAc,MAAM;aAChD;YACD,MAAM,EAAE;gBACP,CAAC,IAAI,CAAC,cAAc,CAAC,EAAE,GAAG,IAAI,CAAC,wBAAwB,GAAG;aAC1D;YACD,KAAK,EAAE;gBACN,OAAO,EAAE,GAAG,IAAI,CAAC,WAAW,GAAG;aAC/B;YACD,cAAc,EAAE;gBACf,OAAO,EAAE,MAAM;gBACf,CAAC,IAAI,CAAC,cAAc,CAAC,EAAE,IAAI,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG;aAClD;SACD,CAAC;IACH,CAAC;IAED,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC,UAAW,CAAC,aAAa,CAAC,oBAAoB,CAAE,CAAC;IAC9D,CAAC;IAED,IAAI,YAAY;QACf,MAAM,IAAI,GAAG,IAAI,CAAC,WAA4B,CAAC;QAC/C,MAAM,aAAa,GAAG,IAAI,CAAC,4BAA4B,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAC7E,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IAC1C,CAAC;IAED,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC,QAAQ,IAAI,SAAS,CAAC;IACnC,CAAC;IAED,IAAI,mBAAmB;QACtB,OAAO,QAAM,CAAC,UAAU,CAAC,OAAO,CAAC,uBAAuB,CAAC,CAAC;IAC3D,CAAC;IAED,IAAI,yBAAyB;QAC5B,OAAO,QAAM,CAAC,UAAU,CAAC,OAAO,CAAC,gCAAgC,CAAC,CAAC;IACpE,CAAC;IAED,IAAI,wBAAwB;QAC3B,OAAO,QAAM,CAAC,UAAU,CAAC,OAAO,CAAC,0BAA0B,CAAC,CAAC;IAC9D,CAAC;IAED,IAAI,eAAe;QAClB,MAAM,KAAK,GAAG,IAAI,CAAC,eAAe,CAAC;QACnC,MAAM,GAAG,GAAG,EAAE,CAAC;QAEf,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC3B,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QACtB,CAAC;QAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC;YACjC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC;QAC9D,CAAC;QAED,OAAO,GAAG,CAAC;IACZ,CAAC;CACD,CAAA;AAzRA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCACjB;AAeH;IADN,IAAI,CAAC,oBAAoB,CAAC;gCACG;AAxBzB,MAAM;IANX,aAAa,CAAC;QACd,GAAG,EAAE,YAAY;QACjB,aAAa,EAAE,IAAI;QACnB,cAAc,EAAE,IAAI;QACpB,QAAQ,EAAE,cAAc;KACxB,CAAC;GACI,MAAM,CAkSX;AAED,MAAM,CAAC,MAAM,EAAE,CAAC;AAEhB,eAAe,MAAM,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isEscape } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport type ValueState from \"@ui5/webcomponents-base/dist/types/ValueState.js\";\nimport SliderBase from \"./SliderBase.js\";\nimport type SliderTooltip from \"./SliderTooltip.js\";\n\n// Template\nimport SliderTemplate from \"./SliderTemplate.js\";\n\n// Texts\nimport {\n\tSLIDER_ARIA_DESCRIPTION,\n\tSLIDER_TOOLTIP_INPUT_DESCRIPTION,\n\tSLIDER_TOOLTIP_INPUT_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n/**\n * @class\n *\n * ### Overview\n * The Slider component represents a numerical range and a handle (grip).\n * The purpose of the component is to enable visual selection of a value in\n * a continuous numerical range by moving an adjustable handle.\n *\n * ### Structure\n * The most important properties of the Slider are:\n *\n * - min - The minimum value of the slider range.\n * - max - The maximum value of the slider range.\n * - value - The current value of the slider range.\n * - step - Determines the increments in which the slider will move.\n * - showTooltip - Determines if a tooltip should be displayed above the handle.\n * - showTickmarks - Displays a visual divider between the step values.\n * - labelInterval - Labels some or all of the tickmarks with their values.\n *\n * ### Usage\n * The most common use case is to select values on a continuous numerical scale (e.g. temperature, volume, etc. ).\n *\n * ### Responsive Behavior\n * The `ui5-slider` component adjusts to the size of its parent container by recalculating and\n * resizing the width of the control. You can move the slider handle in several different ways:\n *\n * - Drag and drop the handle to the desired value.\n * - Click/tap on the range bar to move the handle to that location.\n *\n * ### Keyboard Handling\n *\n * - `Left or Down Arrow` - Moves the handle one step to the left, effectively decreasing the component's value by `step` amount;\n * - `Right or Up Arrow` - Moves the handle one step to the right, effectively increasing the component's value by `step` amount;\n * - `Left or Down Arrow + Ctrl/Cmd` - Moves the handle to the left with step equal to 1/10th of the entire range, effectively decreasing the component's value by 1/10th of the range;\n * - `Right or Up Arrow + Ctrl/Cmd` - Moves the handle to the right with step equal to 1/10th of the entire range, effectively increasing the component's value by 1/10th of the range;\n * - `Plus` - Same as `Right or Up Arrow`;\n * - `Minus` - Same as `Left or Down Arrow`;\n * - `Home` - Moves the handle to the beginning of the range;\n * - `End` - Moves the handle to the end of the range;\n * - `Page Up` - Same as `Right or Up + Ctrl/Cmd`;\n * - `Page Down` - Same as `Left or Down + Ctrl/Cmd`;\n * - `Escape` - Resets the value property after interaction, to the position prior the component's focusing;\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/Slider.js\";`\n * @constructor\n * @extends SliderBase\n * @since 1.0.0-rc.11\n * @public\n * @csspart progress-container - Used to style the progress container, the horizontal bar that visually represents the range between the minimum and maximum values, of the `ui5-slider`.\n * @csspart progress-bar - Used to style the progress bar, which shows the progress of the `ui5-slider`.\n * @csspart handle - Used to style the handle of the `ui5-slider`.\n */\n@customElement({\n\ttag: \"ui5-slider\",\n\tlanguageAware: true,\n\tformAssociated: true,\n\ttemplate: SliderTemplate,\n})\nclass Slider extends SliderBase implements IFormInputElement {\n\t/**\n\t * Current value of the slider\n\t * @default 0\n\t * @formEvents change input\n\t * @formProperty\n\t * @public\n\t */\n\t@property({ type: Number })\n\tvalue = 0;\n\n\t_valueInitial?: number;\n\t_valueOnInteractionStart?: number;\n\t_progressPercentage = 0;\n\t_handlePositionFromStart = 0;\n\t_lastValidInputValue: string;\n\t_tooltipInputValue: string = this.value.toString();\n\t_tooltipInputValueState: `${ValueState}` = \"None\";\n\n\tget formFormattedValue() {\n\t\treturn this.value.toString();\n\t}\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._stateStorage.value = undefined;\n\t\tthis._lastValidInputValue = this.min.toString();\n\t}\n\n\t/**\n\t *\n\t * Check if the previously saved state is outdated. That would mean\n\t * either it is the initial rendering or that a property has been changed\n\t * programmatically - because the previous state is always updated in\n\t * the interaction handlers.\n\t *\n\t * Normalize current properties, update the previously stored state.\n\t * Update the visual UI representation of the Slider.\n\t *\n\t */\n\tonBeforeRendering() {\n\t\tif (!this.isCurrentStateOutdated()) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.notResized = true;\n\t\tthis.syncUIAndState();\n\t\tthis._updateHandleAndProgress(this.value);\n\t}\n\n\tsyncUIAndState() {\n\t\t// Validate step and update the stored state for the step property.\n\t\tif (this.isPropertyUpdated(\"step\")) {\n\t\t\tthis._validateStep(this.step);\n\t\t\tthis.storePropertyState(\"step\");\n\t\t}\n\n\t\t// Recalculate the tickmarks and labels and update the stored state.\n\t\tif (this.isPropertyUpdated(\"min\", \"max\", \"value\")) {\n\t\t\tthis.storePropertyState(\"min\", \"max\");\n\n\t\t\t// Here the value props are changed programmatically (not by user interaction)\n\t\t\t// and it won't be \"stepified\" (rounded to the nearest step). 'Clip' them within\n\t\t\t// min and max bounderies and update the previous state reference.\n\t\t\tthis.value = SliderBase.clipValue(this.value, this._effectiveMin, this._effectiveMax);\n\t\t\tthis.updateStateStorageAndFireInputEvent(\"value\");\n\t\t\tthis.storePropertyState(\"value\");\n\t\t}\n\n\t\t// Labels must be updated if any of the min/max/step/labelInterval props are changed\n\t\tif (this.labelInterval && this.showTickmarks) {\n\t\t\tthis._createLabels();\n\t\t}\n\n\t\t// Update the stored state for the labelInterval, if changed\n\t\tif (this.isPropertyUpdated(\"labelInterval\")) {\n\t\t\tthis.storePropertyState(\"labelInterval\");\n\t\t}\n\t}\n\n\t/**\n\t * Called when the user starts interacting with the slider\n\t * @private\n\t */\n\t_onmousedown(e: TouchEvent | MouseEvent) {\n\t\t// If step is 0 no interaction is available because there is no constant\n\t\t// (equal for all user environments) quantitative representation of the value\n\t\tif (this.disabled || this.step === 0 || (e.target as HTMLElement).hasAttribute(\"ui5-slider-tooltip\")) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst newValue = this.handleDownBase(e);\n\t\tthis._valueOnInteractionStart = this.value;\n\n\t\t// Set initial value if one is not set previously on focus in.\n\t\t// It will be restored if ESC key is pressed.\n\t\tif (this._valueInitial === undefined) {\n\t\t\tthis._valueInitial = this.value;\n\t\t}\n\n\t\t// Do not yet update the Slider if press is over a handle. It will be updated if the user drags the mouse.\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tif (!this._isHandlePressed(ctor.getPageXValueFromEvent(e))) {\n\t\t\tthis._updateHandleAndProgress(newValue);\n\t\t\tthis.value = newValue;\n\t\t\tthis.updateStateStorageAndFireInputEvent(\"value\");\n\t\t}\n\t}\n\n\t_onfocusin() {\n\t\t// Set initial value if one is not set previously on focus in.\n\t\t// It will be restored if ESC key is pressed.\n\t\tif (this._valueInitial === undefined) {\n\t\t\tthis._valueInitial = this.value;\n\t\t}\n\n\t\tif (this.showTooltip) {\n\t\t\tthis._tooltipsOpen = true;\n\t\t}\n\t}\n\n\t_onfocusout(e: FocusEvent) {\n\t\t// Prevent focusout when the focus is getting set within the slider internal\n\t\t// element (on the handle), before the Slider' customElement itself is finished focusing\n\t\tif (this._isFocusing()) {\n\t\t\tthis._preventFocusOut();\n\t\t\treturn;\n\t\t}\n\n\t\t// Reset focus state and the stored Slider's initial\n\t\t// value that was saved when it was first focused in\n\t\tthis._valueInitial = undefined;\n\n\t\tif (this.showTooltip && !(e.relatedTarget as HTMLElement)?.hasAttribute(\"ui5-slider-tooltip\")) {\n\t\t\tthis._tooltipsOpen = false;\n\t\t}\n\t}\n\n\t/**\n\t * Called when the user moves the slider\n\t * @private\n\t */\n\t_handleMove(e: TouchEvent | MouseEvent) {\n\t\te.preventDefault();\n\n\t\t// If step is 0 no interaction is available because there is no constant\n\t\t// (equal for all user environments) quantitative representation of the value\n\t\tif (this.disabled || this._effectiveStep === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tconst newValue = ctor.getValueFromInteraction(e, this._effectiveStep, this._effectiveMin, this._effectiveMax, this.getBoundingClientRect(), this.directionStart);\n\n\t\tthis._updateHandleAndProgress(newValue);\n\t\tthis.value = newValue;\n\t\tthis.updateStateStorageAndFireInputEvent(\"value\");\n\t}\n\n\t/** Called when the user finish interacting with the slider\n\t * @private\n\t */\n\t_handleUp() {\n\t\tif (this._valueOnInteractionStart !== this.value) {\n\t\t\tthis.fireDecoratorEvent(\"change\");\n\t\t}\n\n\t\tthis.handleUpBase();\n\t\tthis._valueOnInteractionStart = undefined;\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tconst isActionKey = SliderBase._isActionKey(e);\n\n\t\tthis._onKeyupBase();\n\n\t\tif (isActionKey && this._valueOnInteractionStart !== this.value) {\n\t\t\tthis.fireDecoratorEvent(\"change\");\n\t\t}\n\n\t\tthis._valueOnInteractionStart = this.value;\n\t}\n\n\t/** Determines if the press is over the handle\n\t * @private\n\t */\n\t_isHandlePressed(clientX: number) {\n\t\tconst sliderHandleDomRect = this._sliderHandle.getBoundingClientRect();\n\t\treturn clientX >= sliderHandleDomRect.left && clientX <= sliderHandleDomRect.right;\n\t}\n\n\t/** Updates the UI representation of the progress bar and handle position\n\t * @private\n\t */\n\t_updateHandleAndProgress(newValue: number) {\n\t\tconst max = this._effectiveMax;\n\t\tconst min = this._effectiveMin;\n\n\t\t// The progress (completed) percentage of the slider.\n\t\tthis._progressPercentage = (newValue - min) / (max - min);\n\t\t// How many pixels from the left end of the slider will be the placed the affected  by the user action handle\n\t\tthis._handlePositionFromStart = this._progressPercentage * 100;\n\t}\n\n\t_handleActionKeyPress(e: KeyboardEvent) {\n\t\tconst min = this._effectiveMin;\n\t\tconst max = this._effectiveMax;\n\t\tconst currentValue = this.value;\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tconst newValue = isEscape(e) ? this._valueInitial : ctor.clipValue(this._handleActionKeyPressBase(e, \"value\") + currentValue, min, max);\n\n\t\tif (newValue !== currentValue) {\n\t\t\tthis._updateHandleAndProgress(newValue!);\n\t\t\tthis.value = newValue!;\n\t\t\tthis.updateStateStorageAndFireInputEvent(\"value\");\n\t\t}\n\t}\n\n\t_onTooltopForwardFocus(e: CustomEvent) {\n\t\tconst tooltip = e.target as SliderTooltip;\n\n\t\ttooltip.followRef?.focus();\n\t}\n\n\tget inputValue() {\n\t\treturn this.value.toString();\n\t}\n\n\tget styles() {\n\t\treturn {\n\t\t\tprogress: {\n\t\t\t\t\"transform\": `scaleX(${this._progressPercentage})`,\n\t\t\t\t\"transform-origin\": `${this.directionStart} top`,\n\t\t\t},\n\t\t\thandle: {\n\t\t\t\t[this.directionStart]: `${this._handlePositionFromStart}%`,\n\t\t\t},\n\t\t\tlabel: {\n\t\t\t\t\"width\": `${this._labelWidth}%`,\n\t\t\t},\n\t\t\tlabelContainer: {\n\t\t\t\t\"width\": `100%`,\n\t\t\t\t[this.directionStart]: `-${this._labelWidth / 2}%`,\n\t\t\t},\n\t\t};\n\t}\n\n\tget _sliderHandle() {\n\t\treturn this.shadowRoot!.querySelector(\".ui5-slider-handle\")!;\n\t}\n\n\tget tooltipValue() {\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tconst stepPrecision = ctor._getDecimalPrecisionOfNumber(this._effectiveStep);\n\t\treturn this.value.toFixed(stepPrecision);\n\t}\n\n\tget _ariaDisabled() {\n\t\treturn this.disabled || undefined;\n\t}\n\n\tget _ariaLabelledByText() {\n\t\treturn Slider.i18nBundle.getText(SLIDER_ARIA_DESCRIPTION);\n\t}\n\n\tget _ariaDescribedByInputText() {\n\t\treturn Slider.i18nBundle.getText(SLIDER_TOOLTIP_INPUT_DESCRIPTION);\n\t}\n\n\tget _ariaLabelledByInputText() {\n\t\treturn Slider.i18nBundle.getText(SLIDER_TOOLTIP_INPUT_LABEL);\n\t}\n\n\tget tickmarksObject() {\n\t\tconst count = this._tickmarksCount;\n\t\tconst arr = [];\n\n\t\tif (this._hiddenTickmarks) {\n\t\t\treturn [true, false];\n\t\t}\n\n\t\tfor (let i = 0; i <= count; i++) {\n\t\t\tarr.push(this._effectiveMin + (i * this.step) <= this.value);\n\t\t}\n\n\t\treturn arr;\n\t}\n}\n\nSlider.define();\n\nexport default Slider;\n"]}

package/dist/SliderBase.d.ts

@@ -1,5 +1,6 @@
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
+import type { SliderTooltipChangeEventDetails } from "./SliderTooltip.js";
 type StateStorage = {
     [key: string]: number | undefined;
 };
@@ -96,7 +97,7 @@ declare abstract class SliderBase extends UI5Element {
     /**
      * @private
      */
-    _tooltipVisibility: string;
+    _tooltipsOpen: boolean;
     _labelsOverlapping: boolean;
     _hiddenTickmarks: boolean;
     _isInputValueValid: boolean;
@@ -119,7 +120,6 @@ declare abstract class SliderBase extends UI5Element {
     _handleUp(e: TouchEvent | MouseEvent): void;
     _onmousedown(e: TouchEvent | MouseEvent): void;
     _handleActionKeyPress(e: Event): void;
-    _updateInputValue(): void;
     abstract styles: {
         label: Record<string, string>;
         labelContainer: Record<string, string>;
@@ -155,10 +155,8 @@ declare abstract class SliderBase extends UI5Element {
      */
     _onmouseout(): void;
     _onkeydown(e: KeyboardEvent): void;
-    _onInputKeydown(e: KeyboardEvent): void;
-    _onInputChange(): void;
-    _onInputInput(): void;
-    _updateValueFromInput(e: Event): void;
+    _onTooltipChange(e: CustomEvent<SliderTooltipChangeEventDetails>): void;
+    _updateValueFromInput(fieldValue: string): void;
     _onKeyupBase(): void;
     /**
      * Flags if an inner element is currently being focused

package/dist/SliderBase.js

@@ -11,7 +11,7 @@ import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
 import jsxRender from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
 import { isPhone, supportsTouch } from "@ui5/webcomponents-base/dist/Device.js";
-import { isEscape, isHome, isEnd, isUp, isDown, isRight, isLeft, isUpCtrl, isDownCtrl, isRightCtrl, isLeftCtrl, isPlus, isMinus, isPageUp, isPageDown, isF2, isEnter, } from "@ui5/webcomponents-base/dist/Keys.js";
+import { isEscape, isHome, isEnd, isUp, isDown, isRight, isLeft, isUpCtrl, isDownCtrl, isRightCtrl, isLeftCtrl, isPlus, isMinus, isPageUp, isPageDown, isF2, } from "@ui5/webcomponents-base/dist/Keys.js";
 // Styles
 import sliderBaseStyles from "./generated/themes/SliderBase.css.js";
 import { getAssociatedLabelForTexts } from "@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js";
@@ -101,7 +101,7 @@ class SliderBase extends UI5Element {
         /**
          * @private
          */
-        this._tooltipVisibility = "hidden";
+        this._tooltipsOpen = false;
         this._labelsOverlapping = false;
         this._hiddenTickmarks = false;
         this._isInputValueValid = false;
@@ -123,7 +123,6 @@ class SliderBase extends UI5Element {
     _handleUp(e) { } // eslint-disable-line
     _onmousedown(e) { } // eslint-disable-line
     _handleActionKeyPress(e) { } // eslint-disable-line
-    _updateInputValue() { }
     static get ACTION_KEYS() {
         return [
             isLeft,
@@ -185,9 +184,7 @@ class SliderBase extends UI5Element {
      * @private
      */
     _onmouseover() {
-        if (this.showTooltip) {
-            this._tooltipVisibility = SliderBase_1.TOOLTIP_VISIBILITY.VISIBLE;
-        }
+        this._tooltipsOpen = this.showTooltip;
     }
     /**
      * Hides the tooltip(s) if the `showTooltip` property is set to true
@@ -195,49 +192,35 @@ class SliderBase extends UI5Element {
      */
     _onmouseout() {
         if (this.showTooltip && !this.shadowRoot.activeElement) {
-            this._tooltipVisibility = SliderBase_1.TOOLTIP_VISIBILITY.HIDDEN;
+            this._tooltipsOpen = false;
         }
     }
     _onkeydown(e) {
         const target = e.target;
         if (isF2(e) && target.classList.contains("ui5-slider-handle")) {
-            target.parentNode.querySelector(".ui5-slider-handle-container ui5-input").focus();
+            target.parentNode.querySelector("[ui5-slider-tooltip]").focus();
         }
         if (this.disabled || this._effectiveStep === 0 || target.hasAttribute("ui5-slider-handle")) {
             return;
         }
-        if (SliderBase_1._isActionKey(e) && target && !target.hasAttribute("ui5-input")) {
+        if (SliderBase_1._isActionKey(e) && target && !target.hasAttribute("ui5-slider-tooltip")) {
             e.preventDefault();
             this._isUserInteraction = true;
             this._handleActionKeyPress(e);
         }
     }
-    _onInputKeydown(e) {
-        const target = e.target;
-        if (isF2(e) && target.hasAttribute("ui5-input")) {
-            target.parentNode.parentNode.querySelector(".ui5-slider-handle").focus();
-        }
-        if (isEnter(e)) {
-            this._updateInputValue();
-            this._updateValueFromInput(e);
-        }
+    _onTooltipChange(e) {
+        const value = e.detail.value;
+        this._updateValueFromInput(value);
     }
-    _onInputChange() {
-        if (this._valueOnInteractionStart !== this.value) {
-            this.fireDecoratorEvent("change");
-        }
-    }
-    _onInputInput() {
-        this.fireDecoratorEvent("input");
-    }
-    _updateValueFromInput(e) {
-        const input = e.target;
-        const value = parseFloat(input.value);
+    _updateValueFromInput(fieldValue) {
+        const value = parseFloat(fieldValue);
         this._isInputValueValid = value >= this._effectiveMin && value <= this._effectiveMax;
         if (!this._isInputValueValid) {
             return;
         }
         this.value = value;
+        this.fireDecoratorEvent("change");
     }
     _onKeyupBase() {
         if (this.disabled) {
@@ -663,8 +646,8 @@ __decorate([
     property({ type: Number })
 ], SliderBase.prototype, "value", void 0);
 __decorate([
-    property()
-], SliderBase.prototype, "_tooltipVisibility", void 0);
+    property({ type: Boolean })
+], SliderBase.prototype, "_tooltipsOpen", void 0);
 __decorate([
     property({ type: Boolean })
 ], SliderBase.prototype, "_labelsOverlapping", void 0);