From 325ad6f72145ebf8cd5a9e05dab5e394a497d9ab Mon Sep 17 00:00:00 2001
From: Bram Kragten <mail@bramkragten.nl>
Date: Mon, 18 Dec 2023 15:24:46 +0100
Subject: [PATCH] Fix step any in number selector (#19077)

---
 .../ha-selector/ha-selector-number.ts         | 24 +++++++++++++++----
 .../ha-selector/ha-selector-selector.ts       |  6 ++---
 2 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/src/components/ha-selector/ha-selector-number.ts b/src/components/ha-selector/ha-selector-number.ts
index 3bc9451e18..1d4d2b98d4 100644
--- a/src/components/ha-selector/ha-selector-number.ts
+++ b/src/components/ha-selector/ha-selector-number.ts
@@ -43,6 +43,22 @@ export class HaNumberSelector extends LitElement {
       this.selector.number?.min === undefined ||
       this.selector.number?.max === undefined;
 
+    let sliderStep;
+
+    if (!isBox) {
+      sliderStep = this.selector.number!.step ?? 1;
+      if (sliderStep === "any") {
+        sliderStep = 1;
+        // divide the range of the slider by 100 steps
+        const step =
+          (this.selector.number!.max! - this.selector.number!.min!) / 100;
+        // biggest step size is 1, round the step size to a division of 1
+        while (sliderStep > step) {
+          sliderStep /= 10;
+        }
+      }
+    }
+
     return html`
       <div class="input">
         ${!isBox
@@ -52,12 +68,10 @@ export class HaNumberSelector extends LitElement {
                 : ""}
               <ha-slider
                 labeled
-                .min=${this.selector.number?.min}
-                .max=${this.selector.number?.max}
+                .min=${this.selector.number!.min}
+                .max=${this.selector.number!.max}
                 .value=${this.value ?? ""}
-                .step=${this.selector.number?.step === "any"
-                  ? undefined
-                  : this.selector.number?.step ?? 1}
+                .step=${sliderStep}
                 .disabled=${this.disabled}
                 .required=${this.required}
                 @change=${this._handleSliderChange}
diff --git a/src/components/ha-selector/ha-selector-selector.ts b/src/components/ha-selector/ha-selector-selector.ts
index eb3aab9d38..93061f9ea4 100644
--- a/src/components/ha-selector/ha-selector-selector.ts
+++ b/src/components/ha-selector/ha-selector-selector.ts
@@ -70,15 +70,15 @@ const SELECTOR_SCHEMAS = {
   number: [
     {
       name: "min",
-      selector: { number: { mode: "box" } },
+      selector: { number: { mode: "box", step: "any" } },
     },
     {
       name: "max",
-      selector: { number: { mode: "box" } },
+      selector: { number: { mode: "box", step: "any" } },
     },
     {
       name: "step",
-      selector: { number: { mode: "box" } },
+      selector: { number: { mode: "box", step: "any" } },
     },
   ] as const,
   object: [] as const,