Fix decimal steps for Number input

VolkovLabs · May 15, 2024 · 0de05a6 · 0de05a6
1 parent 3576b8a
commit 0de05a6
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 8 deletions.
diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -1,6 +1,6 @@
 # Change Log
 
-## 2.0.0 (2024-05-15)
+## 2.0.1 (2024-05-15)
 
 ### Features
 

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -86,5 +86,5 @@
     "typecheck": "tsc --emitDeclarationOnly false --noEmit"
   },
   "types": "dist/index.d.ts",
-  "version": "2.0.0"
+  "version": "2.0.1"
 }
diff --git a/packages/components/src/components/Form/Form.story.tsx b/packages/components/src/components/Form/Form.story.tsx
@@ -28,6 +28,7 @@ const meta = {
       const form = useFormBuilder<{
         opacity: number;
         step: number;
+        decimal: number;
         normalize: [number, number];
         custom: string;
         color: string;
@@ -62,7 +63,26 @@ const meta = {
               9: '9',
             },
             label: 'Step',
-            description: 'Move to 2 points',
+            description: 'Move by 2 step',
+            view: {
+              grow: true,
+            },
+          })
+          .addSlider({
+            path: 'decimal',
+            defaultValue: 1,
+            step: 0.01,
+            min: 1,
+            max: 9,
+            marks: {
+              1: '1',
+              3: '3',
+              5: '5',
+              7: '7',
+              9: '9',
+            },
+            label: 'Decimal step',
+            description: 'Move by 0.01 step',
             view: {
               grow: true,
             },

diff --git a/packages/components/src/components/NumberInput/NumberInput.tsx b/packages/components/src/components/NumberInput/NumberInput.tsx
@@ -77,22 +77,22 @@ export const NumberInput: React.FC<Props> = ({ value, onChange, min, max, step,
      * Round value by step
      */
     if (step !== undefined) {
-      let availableValue = step;
+      let availableValue = step * 1000;
 
       if (min !== undefined) {
-        availableValue = min;
+        availableValue = min * 1000;
       }
 
       /**
        * Find nearest available value
        * Next available value will be taken if entered value between allowed range
        * 7 will be used for 6 entered value with 5,7 available values
        */
-      while (availableValue * 1000 < v * 1000) {
-        availableValue += step;
+      while (availableValue < v * 1000) {
+        availableValue += step * 1000;
       }
 
-      v = availableValue;
+      v = availableValue / 1000;
     }
 
     if (max !== undefined && v > max) {