@umbraco-ui/uui-range-slider 1.11.0 → 1.12.0

package/lib/index.js

@@ -30,18 +30,21 @@ var __decorateClass = (decorators, target, key, kind) => {
   return result;
 };
 var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _UUIRangeSliderElement_instances, transferValueToInternalValues_fn;
+var _UUIRangeSliderElement_instances, transferValueToInternalValues_fn, _onKeyDown;
 const Z_INDEX = {
   TOP: 3,
-  CENTER: 2,
-  BACK: 1
-};
+  CENTER: 2};
 const THUMB_SIZE = 18;
 const TRACK_HEIGHT = 3;
 const TRACK_PADDING = 12;
 const STEP_MIN_WIDTH = 24;
+const CountDecimalPlaces = (num) => {
+  const decimalIndex = num.toString().indexOf(".");
+  return decimalIndex >= 0 ? num.toString().length - decimalIndex - 1 : 0;
+};
 let UUIRangeSliderElement = class extends UUIFormControlMixin(LitElement, "") {
   /** Constructor and Validator */
   constructor() {
@@ -65,11 +68,11 @@ let UUIRangeSliderElement = class extends UUIFormControlMixin(LitElement, "") {
     this._lowValuePercentStart = 0;
     this._highValuePercentEnd = 100;
     /** Events */
-    this._onKeypress = (e) => {
+    __privateAdd(this, _onKeyDown, (e) => {
       if (e.key == "Enter") {
         this.submit();
       }
-    };
+    });
     /** Touch Event */
     this._onTouchStart = (e) => {
       if (this.disabled) return;
@@ -134,7 +137,7 @@ let UUIRangeSliderElement = class extends UUIFormControlMixin(LitElement, "") {
       window.removeEventListener("mouseup", this._onMouseUp);
       window.removeEventListener("mousemove", this._onMouseMove);
     };
-    this.addEventListener("keypress", this._onKeypress);
+    this.addEventListener("keydown", __privateGet(this, _onKeyDown));
     this.addEventListener("mousedown", this._onMouseDown);
     this.addEventListener("touchstart", this._onTouchStart);
     window.addEventListener("resize", () => {
@@ -393,8 +396,16 @@ let UUIRangeSliderElement = class extends UUIFormControlMixin(LitElement, "") {
   }
   _renderThumbValues() {
     return html`<div class="thumb-values">
-      <span><span>${this._lowInputValue}</span></span>
-      <span><span>${this._highInputValue}</span></span>
+      <span
+        ><span
+          >${this._lowInputValue.toFixed(CountDecimalPlaces(this._step))}</span
+        ></span
+      >
+      <span
+        ><span
+          >${this._highInputValue.toFixed(CountDecimalPlaces(this._step))}</span
+        ></span
+      >
     </div>`;
   }
   _renderSteps() {
@@ -415,7 +426,9 @@ let UUIRangeSliderElement = class extends UUIFormControlMixin(LitElement, "") {
   _renderStepValues(stepAmount) {
     if (this.hideStepValues || stepAmount > 20) return;
     let index = 0;
-    const stepValues = new Array(stepAmount + 1).fill(this._step).map((step) => this._min + step * index++);
+    const stepValues = new Array(stepAmount + 1).fill(this._step).map(
+      (step) => (this._min + step * index++).toFixed(CountDecimalPlaces(this._step))
+    );
     return html`<div class="step-values">
       ${stepValues.map((value) => html`<span><span>${value}</span></span>`)}
     </div>`;
@@ -483,6 +496,7 @@ transferValueToInternalValues_fn = function() {
   this._updateInnerColor();
   this.requestUpdate();
 };
+_onKeyDown = new WeakMap();
 UUIRangeSliderElement.formAssociated = true;
 /** Style */
 UUIRangeSliderElement.styles = [

package/lib/uui-range-slider.element.d.ts

@@ -117,8 +117,6 @@ export declare class UUIRangeSliderElement extends UUIRangeSliderElement_base {
     private _runPropertiesChecks;
     private _updateInnerColor;
     private _getClickedValue;
-    /** Events */
-    private _onKeypress;
     /** Touch Event */
     private _onTouchStart;
     private _onTouchMove;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umbraco-ui/uui-range-slider",
-  "version": "1.11.0",
+  "version": "1.12.0",
   "license": "MIT",
   "keywords": [
     "Umbraco",
@@ -30,7 +30,7 @@
     "custom-elements.json"
   ],
   "dependencies": {
-    "@umbraco-ui/uui-base": "1.11.0"
+    "@umbraco-ui/uui-base": "1.12.0"
   },
   "scripts": {
     "build": "npm run analyze && tsc --build && rollup -c rollup.config.js",
@@ -41,5 +41,5 @@
     "access": "public"
   },
   "homepage": "https://uui.umbraco.com/?path=/story/uui-range-slider",
-  "gitHead": "414ce88901f82c5fc7d6be942779047bb34a1407"
+  "gitHead": "0ac5219b2765bf6c90fe4943a6620b46a7fced4e"
 }