fix(Range): progress style (#385)

nuxt · Jul 4, 2023 · a79c165 · a79c165 · vercel · Jul 4, 2023
1 parent cd2b671
commit a79c165
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/src/runtime/components/forms/Range.vue b/src/runtime/components/forms/Range.vue
@@ -128,8 +128,11 @@ export default defineComponent({
     })
 
     const progressStyle = computed(() => {
+      const { modelValue, min, max } = props
+      const clampedValue = Math.max(min, Math.min(modelValue, max))
+      const relativeValue = (clampedValue - min) / (max - min)
       return {
-        width: `${(props.modelValue / props.max) * 100}%`
+        width: `${relativeValue * 100}%`
       }
     })