From f7b620e828f76a78207866575eb99830c07ea148 Mon Sep 17 00:00:00 2001
From: Alexandre Rousseau <alexandre@rsseau.fr>
Date: Sat, 28 Sep 2024 21:16:17 +0200
Subject: [PATCH] fix(ui): support initial empty value for slider

When importing a slider, the initial value is `''`, which throws an
error like `TypeError: "".toFixed is not a function`.

I just handle this edge case.
---
 src/ui/src/components/core/base/BaseInputRange.vue | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/ui/src/components/core/base/BaseInputRange.vue b/src/ui/src/components/core/base/BaseInputRange.vue
index 580080c37..c23db79e6 100644
--- a/src/ui/src/components/core/base/BaseInputRange.vue
+++ b/src/ui/src/components/core/base/BaseInputRange.vue
@@ -65,8 +65,11 @@ const thumbRadius = 9;
 const thumb = ref<HTMLElement>();
 const slider = ref<HTMLElement>();
 
-const precision = computed(() => Math.ceil(-Math.log10(props.step)));
-const displayValue = computed(() => model.value.toFixed(precision.value));
+const precision = computed(() => String(props.step).split(".")[1]?.length ?? 0);
+const displayValue = computed(() => {
+	if (typeof model.value !== "number") return "";
+	return Number(model.value).toFixed(precision.value);
+});
 
 const progress = computed(() => {
 	if (typeof model.value !== "number") return 50;
@@ -215,6 +218,8 @@ function handleMouseDown(initialEvent: MouseEvent) {
 	justify-content: center;
 	padding: 0 4px;
 	transform: translateX(-50%);
+
+	min-width: 12px;
 }
 
 .BaseInputRange__popover::after {