ensure min/max/step are numbers; fixes #1823

packages/webawesome/docs/docs/resources/changelog.md

@@ -22,6 +22,7 @@ Components with the <wa-badge variant="warning">Experimental</wa-badge> badge sh
 - Fixed a bug in `<wa-dropdown>` that caused the browser to hang when cancelling the `wa-hide` event [issue:1483]
 - Fixed a bug in `<wa-dropdown-item>` that prevented the icon dependency from being imported [issue:1825]
 - Improved performance of `<wa-icon>` so initial rendering occurs faster, especially with multiple icons on the page [issue:1729]
+- Improved `<wa-slider>` to not throw an error when string values are passed to the `min`, `max`, and `step` properties [issue:1823]
 - Modified the default `transition` styles of `<wa-dropdown-item>` to use design tokens [pr:1693]
 
 ## 3.0.0

packages/webawesome/src/components/slider/slider.ts

@@ -437,8 +437,14 @@ export default class WaSlider extends WebAwesomeFormAssociatedElement {
   /** Clamps a number to min/max while ensuring it's a valid step interval. */
   private clampAndRoundToStep(value: number) {
     const stepPrecision = (String(this.step).split('.')[1] || '').replace(/0+$/g, '').length;
-    value = Math.round(value / this.step) * this.step;
-    value = clamp(value, this.min, this.max);
+
+    // Ensure we're working with numbers (in case the user passes strings to the respective properties)
+    const step = Number(this.step);
+    const min = Number(this.min);
+    const max = Number(this.max);
+
+    value = Math.round(value / step) * step;
+    value = clamp(value, min, max);
 
     return parseFloat(value.toFixed(stepPrecision));
   }