@ui5/webcomponents 0.0.0-a3eca7ade → 0.0.0-a8a75c830

package/dist/Slider.js.map

@@ -0,0 +1 @@
+{"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,IAAI,EAAE,MAAM,sCAAsC,CAAC;AAGtE,OAAO,UAAU,MAAM,iBAAiB,CAAC;AAGzC,WAAW;AACX,OAAO,cAAc,MAAM,qBAAqB,CAAC;AAEjD,OAAO,MAAM,MAAM,kCAAkC,CAAC;AAEtD,QAAQ;AACR,OAAO,EACN,uBAAuB,EACvB,gCAAgC,EAChC,0BAA0B,GAC1B,MAAM,mCAAmC,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AAQH,IAAM,MAAM,cAAZ,MAAM,MAAO,SAAQ,UAAU;IAiC9B,IAAI,kBAAkB;QACrB,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;IAC9B,CAAC;IAKD;QACC,KAAK,EAAE,CAAC;QAxCT;;;;;;WAMG;QAEH,UAAK,GAAG,CAAC,CAAC;QAEV;;;;;;WAMG;QAEH,SAAI,GAAG,CAAC,CAAC;QAGT,sBAAiB,GAAoB,MAAM,CAAC;QAG5C,iBAAY,GAAG,EAAE,CAAC;QAIlB,wBAAmB,GAAG,CAAC,CAAC;QACxB,6BAAwB,GAAG,CAAC,CAAC;QAY5B,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;IACjD,CAAC;IAED;;;OAGG;IACH,iBAAiB;QAChB,mEAAmE;QACnE,MAAM,IAAI,GAAG,IAAI,CAAC,WAA4B,CAAC;QAC/C,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;QACpE,IAAI,CAAC,wBAAwB,CAAC,YAAY,CAAC,CAAC;IAC7C,CAAC;IAED,gBAAgB;QACf,KAAK,CAAC,gBAAgB,EAAE,CAAC;QAEzB,IAAI,CAAC,OAAO,EAAE,iBAAiB,EAAE,CAAC;IACnC,CAAC;IAED,aAAa;QACZ,sDAAsD;IACvD,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,MAAM,aAAa,GAAG,IAAI,CAAC,4BAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACnE,IAAI,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC;YACxC,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC;YACtB,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;YACpD,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,gBAAgB,CAAC,CAA+C;QAC/D,MAAM,KAAK,GAAG,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACzC,MAAM,SAAS,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,IAAI,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAEhF,IAAI,SAAS,EAAE,CAAC;YACf,IAAI,CAAC,iBAAiB,GAAG,UAAU,CAAC;YACpC,IAAI,CAAC,YAAY,GAAG,GAAG,KAAK,EAAE,CAAC;YAC/B,OAAO;QACR,CAAC;QAED,IAAI,CAAC,iBAAiB,GAAG,MAAM,CAAC;QAChC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IACnC,CAAC;IAED,qBAAqB;QACpB,MAAM,KAAK,GAAG,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAC5C,MAAM,SAAS,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,IAAI,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAEhF,IAAI,SAAS,EAAE,CAAC;YACf,IAAI,CAAC,iBAAiB,GAAG,MAAM,CAAC;YAChC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;QAC3C,CAAC;IACF,CAAC;IAED,iBAAiB,CAAC,CAAgB;QACjC,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;YACb,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;QAC5B,CAAC;IACF,CAAC;IAED,cAAc;QACb,MAAM,IAAI,GAAG,IAAI,CAAC,WAA4B,CAAC;QAC/C,MAAM,aAAa,GAAG,IAAI,CAAC,4BAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACnE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IACvD,CAAC;IAED,eAAe,CAAC,CAAc;QAC7B,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;IACpC,CAAC;IAED;;;OAGG;IACH,WAAW,CAAC,CAA0B;QACrC,CAAC,CAAC,cAAc,EAAE,CAAC;QAEnB,MAAM,IAAI,GAAG,IAAI,CAAC,WAA4B,CAAC;QAC/C,MAAM,QAAQ,GAAG,IAAI,CAAC,uBAAuB,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,qBAAqB,EAAE,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QACnI,MAAM,aAAa,GAAG,IAAI,CAAC,4BAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAEnE,IAAI,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC;QACxC,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC;QACtB,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QACpD,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,GAAG,CAAC;QACrB,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC;QAErB,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,GAAG,CAAC;QACrB,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC;QACrB,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,MAAM,aAAa,GAAG,IAAI,CAAC,4BAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACnE,IAAI,CAAC,wBAAwB,CAAC,QAAS,CAAC,CAAC;YACzC,IAAI,CAAC,KAAK,GAAG,QAAS,CAAC;YACvB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;YACtD,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,OAAO;QACV,OAAO,IAAI,CAAC,SAAS,EAAE,EAAE,aAAa,CAAgB,sBAAsB,CAAC,CAAC;IAC/E,CAAC;IAED,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC,UAAW,CAAC,aAAa,CAAC,qBAAqB,CAAE,CAAC;IAC/D,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,+DAA+D;IAC/D,IAAI,eAAe;QAClB,OAAO,EAAE,CAAC;IACX,CAAC;IAED,UAAU,CAAC,CAAgB;QAC1B,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAC;QAEvC,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,YAAY,CAAC,mBAAmB,CAAC,EAAE,CAAC;YACxD,MAAM,CAAC,UAAW,CAAC,aAAa,CAAC,sBAAsB,CAAiB,CAAC,KAAK,EAAE,CAAC;QACnF,CAAC;QAED,IAAI,UAAU,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,MAAM,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,oBAAoB,CAAC,EAAE,CAAC;YACxF,CAAC,CAAC,cAAc,EAAE,CAAC;YAEnB,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;YAC/B,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;QAC/B,CAAC;IACF,CAAC;CACD,CAAA;AAlSA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCACjB;AAUV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCAClB;AAGT;IADC,QAAQ,EAAE;iDACiC;AAG5C;IADC,QAAQ,EAAE;4CACO;AAaX;IADN,IAAI,CAAC,oBAAoB,CAAC;gCACG;AAtCzB,MAAM;IAPX,aAAa,CAAC;QACd,GAAG,EAAE,YAAY;QACjB,aAAa,EAAE,IAAI;QACnB,cAAc,EAAE,IAAI;QACpB,MAAM,EAAE,CAAC,MAAM,CAAC;QAChB,QAAQ,EAAE,cAAc;KACxB,CAAC;GACI,MAAM,CA2SX;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, isF2 } 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\";\nimport type { SliderTooltipChangeEventDetails } from \"./SliderTooltip.js\";\nimport styles from \"./generated/themes/Slider.css.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\tstyles: [styles],\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/**\n\t * Defines the size of the slider's selection intervals (e.g. min = 0, max = 10, step = 5 would result in possible selection of the values 0, 5, 10).\n\t *\n\t * **Note:** If set to 0 the slider handle movement is disabled.\n\t * @default 1\n\t * @public\n\t */\n\t@property({ type: Number })\n\tstep = 1;\n\n\t@property()\n\ttooltipValueState: `${ValueState}` = \"None\";\n\n\t@property()\n\ttooltipValue = \"\";\n\n\t_valueInitial?: number;\n\t_valueOnInteractionStart?: number;\n\t_progressPercentage = 0;\n\t_handlePositionFromStart = 0;\n\t_lastValidInputValue: string;\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._lastValidInputValue = this.min.toString();\n\t}\n\n\t/**\n\t * The value is visually clamped to min/max but the property is not modified.\n\t * @private\n\t */\n\tonBeforeRendering() {\n\t\t// Clamp value visually without modifying the actual value property\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tconst clampedValue = ctor.clipValue(this.value, this.min, this.max);\n\t\tthis._updateHandleAndProgress(clampedValue);\n\t}\n\n\tonAfterRendering(): void {\n\t\tsuper.onAfterRendering();\n\n\t\tthis.tooltip?.repositionTooltip();\n\t}\n\n\t_handleResize() {\n\t\t// TODO: Remove after refactoring Base and RangeSlider\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\tconst stepPrecision = ctor._getDecimalPrecisionOfNumber(this.step);\n\t\t\tthis._updateHandleAndProgress(newValue);\n\t\t\tthis.value = newValue;\n\t\t\tthis.tooltipValue = newValue.toFixed(stepPrecision);\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_onTooltipChange(e: CustomEvent<SliderTooltipChangeEventDetails>) {\n\t\tconst value = parseFloat(e.detail.value);\n\t\tconst isInvalid = (value < this.min || value > this.max) || Number.isNaN(value);\n\n\t\tif (isInvalid) {\n\t\t\tthis.tooltipValueState = \"Negative\";\n\t\t\tthis.tooltipValue = `${value}`;\n\t\t\treturn;\n\t\t}\n\n\t\tthis.tooltipValueState = \"None\";\n\t\tthis.value = value;\n\t\tthis.fireDecoratorEvent(\"change\");\n\t}\n\n\t_onTooltipFocusChange() {\n\t\tconst value = parseFloat(this.tooltipValue);\n\t\tconst isInvalid = (value < this.min || value > this.max) || Number.isNaN(value);\n\n\t\tif (isInvalid) {\n\t\t\tthis.tooltipValueState = \"None\";\n\t\t\tthis.tooltipValue = this.value.toString();\n\t\t}\n\t}\n\n\t_onTooltipKeydown(e: KeyboardEvent) {\n\t\tif (isF2(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis._sliderHandle.focus();\n\t\t}\n\t}\n\n\t_onTooltipOpen() {\n\t\tconst ctor = this.constructor as typeof Slider;\n\t\tconst stepPrecision = ctor._getDecimalPrecisionOfNumber(this.step);\n\t\tthis.tooltipValue = this.value.toFixed(stepPrecision);\n\t}\n\n\t_onTooltipInput(e: CustomEvent) {\n\t\tthis.tooltipValue = e.detail.value;\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\tconst ctor = this.constructor as typeof Slider;\n\t\tconst newValue = ctor.getValueFromInteraction(e, this.step, this.min, this.max, this.getBoundingClientRect(), this.directionStart);\n\t\tconst stepPrecision = ctor._getDecimalPrecisionOfNumber(this.step);\n\n\t\tthis._updateHandleAndProgress(newValue);\n\t\tthis.value = newValue;\n\t\tthis.tooltipValue = newValue.toFixed(stepPrecision);\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.max;\n\t\tconst min = this.min;\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.min;\n\t\tconst max = this.max;\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\tconst stepPrecision = ctor._getDecimalPrecisionOfNumber(this.step);\n\t\t\tthis._updateHandleAndProgress(newValue!);\n\t\t\tthis.value = newValue!;\n\t\t\tthis.tooltipValue = this.value.toFixed(stepPrecision);\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 tooltip() {\n\t\treturn this.getDomRef()?.querySelector<SliderTooltip>(\"[ui5-slider-tooltip]\");\n\t}\n\n\tget _sliderHandle() : HTMLElement {\n\t\treturn this.shadowRoot!.querySelector(\"[ui5-slider-handle]\")!;\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\t// TODO: Refactor these methods after RangeSlider is refactored\n\tget tickmarksObject() {\n\t\treturn [];\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tconst target = e.target as HTMLElement;\n\n\t\tif (isF2(e) && target.hasAttribute(\"ui5-slider-handle\")) {\n\t\t\t(target.parentNode!.querySelector(\"[ui5-slider-tooltip]\") as HTMLElement).focus();\n\t\t}\n\n\t\tif (SliderBase._isActionKey(e) && target && !target.hasAttribute(\"ui5-slider-tooltip\")) {\n\t\t\te.preventDefault();\n\n\t\t\tthis._isUserInteraction = true;\n\t\t\tthis._handleActionKeyPress(e);\n\t\t}\n\t}\n}\n\nSlider.define();\n\nexport default Slider;\n"]}

package/dist/SliderBase.d.ts

@@ -0,0 +1,309 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
+type StateStorage = {
+    [key: string]: number | undefined;
+};
+type DirectionStart = "left" | "right";
+/**
+ * Fired when the value changes and the user has finished interacting with the slider.
+ * @public
+ */
+declare abstract class SliderBase extends UI5Element {
+    eventDetails: {
+        "change": void;
+        "input": void;
+    };
+    /**
+     * Defines the minimum value of the slider.
+     * @default 0
+     * @public
+     */
+    min: number;
+    /**
+     * Defines the maximum value of the slider.
+     * @default 100
+     * @public
+     */
+    max: number;
+    /**
+     * Determines the name by which the component will be identified upon submission in an HTML form.
+     *
+     * **Note:** This property is only applicable within the context of an HTML Form element.
+     * @default undefined
+     * @public
+     * @since 2.0.0
+     */
+    name?: string;
+    /**
+     * Defines the size of the slider's selection intervals (e.g. min = 0, max = 10, step = 5 would result in possible selection of the values 0, 5, 10).
+     *
+     * **Note:** If set to 0 the slider handle movement is disabled. When negative number or value other than a number, the component fallbacks to its default value.
+     * @default 1
+     * @public
+     */
+    step: number;
+    /**
+     * Displays a label with a value on every N-th step.
+     *
+     * **Note:** The step and tickmarks properties must be enabled.
+     * Example - if the step value is set to 2 and the label interval is also specified to 2 - then every second
+     * tickmark will be labelled, which means every 4th value number.
+     * @default 0
+     * @public
+     */
+    labelInterval: number;
+    /**
+     * Enables tickmarks visualization for each step.
+     *
+     * **Note:** The step must be a positive number.
+     * @default false
+     * @public
+     */
+    showTickmarks: boolean;
+    /**
+     * Enables handle tooltip displaying the current value.
+     * @default false
+     * @public
+     */
+    showTooltip: boolean;
+    /**
+     *
+     * Indicates whether input fields should be used as tooltips for the handles.
+     *
+     * **Note:** Setting this option to true will only work if showTooltip is set to true.
+     * **Note:** In order for the component to comply with the accessibility standard, it is recommended to set the editableTooltip property to true.
+     * @default false
+     * @public
+     */
+    editableTooltip: boolean;
+    /**
+     * Defines whether the slider is in disabled state.
+     * @default false
+     * @public
+     */
+    disabled: boolean;
+    /**
+     * Defines the accessible ARIA name of the component.
+     * @default undefined
+     * @public
+     * @since 1.4.0
+     */
+    accessibleName?: string;
+    /**
+     * @private
+     */
+    value: number;
+    /**
+     * @private
+     */
+    _tooltipsOpen: boolean;
+    _labelsOverlapping: boolean;
+    _hiddenTickmarks: boolean;
+    _resizeHandler: ResizeObserverCallback;
+    _moveHandler: (e: TouchEvent | MouseEvent) => void;
+    _upHandler: (e: TouchEvent | MouseEvent) => void;
+    _windowMouseoutHandler: (e: MouseEvent) => void;
+    _stateStorage: StateStorage;
+    notResized: boolean;
+    _isUserInteraction: boolean;
+    _isInnerElementFocusing: boolean;
+    _oldNumberOfLabels?: number;
+    _oldMin?: number;
+    _oldMax?: number;
+    _labelWidth: number;
+    _labelValues?: Array<string>;
+    _valueOnInteractionStart?: number;
+    formElementAnchor(): Promise<HTMLElement | undefined>;
+    constructor();
+    _handleMove(e: TouchEvent | MouseEvent): void;
+    _handleUp(e: TouchEvent | MouseEvent): void;
+    _onmousedown(e: TouchEvent | MouseEvent): void;
+    _handleActionKeyPress(e: Event): void;
+    abstract tickmarksObject: Array<boolean>;
+    abstract _ariaLabelledByText: string;
+    static get ACTION_KEYS(): ((event: KeyboardEvent) => boolean)[];
+    static get MIN_SPACE_BETWEEN_TICKMARKS(): number;
+    static get TOOLTIP_VISIBILITY(): {
+        VISIBLE: string;
+        HIDDEN: string;
+    };
+    static get renderer(): import("@ui5/webcomponents-base/dist/UI5Element.js").Renderer;
+    static get styles(): string;
+    get classes(): {
+        root: {
+            "ui5-slider-root-phone": boolean;
+        };
+        labelContainer: {
+            "ui5-slider-hidden-labels": boolean;
+        };
+    };
+    onEnterDOM(): void;
+    onExitDOM(): void;
+    onAfterRendering(): void;
+    /** Shows the tooltip(s) if the `showTooltip` property is set to true
+     * @private
+     */
+    _onmouseover(): void;
+    /**
+     * Hides the tooltip(s) if the `showTooltip` property is set to true
+     * @private
+     */
+    _onmouseout(): void;
+    _onkeydown(e: KeyboardEvent): void;
+    _onKeyupBase(): void;
+    /**
+     * Flags if an inner element is currently being focused
+     * @private
+     */
+    _preserveFocus(isFocusing: boolean): void;
+    /**
+     * Return if an inside element within the component is currently being focused
+     * @private
+     */
+    _isFocusing(): boolean;
+    /**
+     * Prevent focus out when inner element within the component is currently being in process of focusing in.
+     * @private
+     */
+    _preventFocusOut(): void;
+    /**
+     * Manages the focus between the component's inner elements
+     * @protected
+     */
+    focusInnerElement(): void;
+    /**
+     * Handle the responsiveness of the Slider's UI elements when resizing
+     * @private
+     */
+    _handleResize(): void;
+    /**
+     * Called when the user starts interacting with the slider.
+     * After a down event on the slider root, listen for move events on window, so the slider value
+     * is updated even if the user drags the pointer outside the slider root.
+     * @protected
+     */
+    handleDownBase(e: TouchEvent | MouseEvent): number;
+    /**
+     * Forward the focus to an inner inner part within the component on press
+     * @private
+     */
+    _handleFocusOnMouseDown(e: TouchEvent | MouseEvent): void;
+    /**
+     * Called when the user finish interacting with the slider
+     * Fires an `change` event indicating a final value change, after user interaction is finished.
+     * @protected
+     */
+    handleUpBase(): void;
+    /**
+     * Updates state storage for the value-related property
+     * Fires an `input` event indicating a value change via interaction that is not yet finished.
+     * @protected
+     */
+    updateStateStorageAndFireInputEvent(valueType: string): void;
+    /**
+     * Goes through the key shortcuts available for the component and returns 'true' if the event is triggered by one.
+     * @private
+     */
+    static _isActionKey(e: KeyboardEvent): boolean;
+    /**
+     * Locks the given value between min and max boundaries based on slider properties
+     * @protected
+     */
+    static clipValue(value: number, min: number, max: number): number;
+    /**
+     * Sets the slider value from an event
+     * @protected
+     */
+    static getValueFromInteraction(e: TouchEvent | MouseEvent, stepSize: number, min: number, max: number, boundingClientRect: DOMRect, directionStart: DirectionStart): number;
+    /**
+     * "Stepify" the raw value - calculate the new value depending on the specified step property
+     * @protected
+     */
+    static getSteppedValue(value: number, stepSize: number, min: number): number;
+    /**
+     * Gets pageX value from event on user interaction with the Slider
+     * @protected
+     */
+    static getPageXValueFromEvent(e: TouchEvent | MouseEvent): number;
+    /**
+     * Computes the new value (in %) from the pageX position of the cursor.
+     * Returns the value rounded to a precision of at most 2 digits after decimal point.
+     * @protected
+     */
+    static computedValueFromPageX(pageX: number, min: number, max: number, boundingClientRect: DOMRect, directionStart: DirectionStart): number;
+    /**
+     * Calculates the precision (decimal places) of a number, returns 0 if integer
+     * Handles scientific notation cases.
+     * @private
+     */
+    static _getDecimalPrecisionOfNumber(value: number): number;
+    /**
+     * In order to always keep the visual UI representation and the internal
+     * state in sync, the component has a 'state storage' that is updated when the
+     * current state is changed due to a user action.
+     *
+     * Check if the previously saved state is outdated. That would mean
+     * a property has been changed programmatically because the previous state
+     * is always updated in the interaction handlers.
+     *
+     * Will return true if any of the properties is not equal to its previously
+     * stored value.
+     * @protected
+     */
+    isCurrentStateOutdated(): boolean;
+    /**
+     * Returns the last stored value of a property
+     * @protected
+     */
+    getStoredPropertyState(prop: string): number | undefined;
+    /**
+     * Check if one or more properties have been updated compared to their last
+     * saved values in the state storage.
+     * @protected
+     */
+    isPropertyUpdated(...props: Array<string>): boolean;
+    /**
+     * Updates the previously saved in the _stateStorage values of one or more properties.
+     * @protected
+     */
+    storePropertyState(...props: Array<string>): void;
+    /**
+     * Returns the start side of a direction - left for LTR, right for RTL
+     */
+    get directionStart(): "left" | "right";
+    /**
+     * Calculates the labels amount, width and text and creates them
+     * @private
+     */
+    _createLabels(): void;
+    _handleActionKeyPressBase(e: KeyboardEvent, affectedPropName: string): number;
+    static _isIncreaseValueAction(e: KeyboardEvent, directionStart: DirectionStart): boolean;
+    static _isBigStepAction(e: KeyboardEvent): boolean;
+    get _tickmarksCount(): number;
+    /**
+     * Calculates space between tickmarks
+     * @private
+     */
+    _spaceBetweenTickmarks(): number;
+    /**
+     * Notify in case of a invalid step value type
+     * @private
+     */
+    _validateStep(step: number): void;
+    get _labels(): string[];
+    /**
+     * Normalizes a new `step` property value.
+     * If tickmarks are enabled recreates them according to it.
+     * @private
+     */
+    get _effectiveStep(): number;
+    get _effectiveMin(): number;
+    get _effectiveMax(): number;
+    get _tabIndex(): 0 | -1;
+    get _ariaKeyshortcuts(): "F2" | undefined;
+    get _ariaDescribedByHandleText(): "ui5-slider-InputDesc" | undefined;
+    get _ariaLabel(): string;
+    get _ariaDescribedByInputText(): string;
+    get _ariaLabelledByInputText(): string;
+}
+export default SliderBase;