From bf22fb41cfaee1ddc6f7be2f4e1397d0d763d5da Mon Sep 17 00:00:00 2001 From: Robert Kossessa Date: Wed, 13 Mar 2024 01:03:11 +0100 Subject: [PATCH] FIX: Update value sliders on color change Slight issue with color accuracy, see TODO --- src/renderer/src/components/common/HSVInput.vue | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/renderer/src/components/common/HSVInput.vue b/src/renderer/src/components/common/HSVInput.vue index 624c16f..4a15d42 100644 --- a/src/renderer/src/components/common/HSVInput.vue +++ b/src/renderer/src/components/common/HSVInput.vue @@ -198,6 +198,13 @@ const props = defineProps({ } }) +// TODO: Currently color updates are passed up with input events and then passed back down as props +// This is the vue way, but that also means that the color is converted into a number and then back into a color +// This causes a loss of precision and the sliders to jump around a bit when the color is updated +// It would be better to pass the color number here and convert it to a color object here as well +// Then we can use the color object to update the sliders and inputs +// And only pass the color number up when it actually changes + const emit = defineEmits(['input']) const hueSliderValue = ref(0) @@ -328,7 +335,7 @@ function updateInputs() { valueSliderValue.value = props.color.value() } -watch(props.color, updateInputs) +watch(() => props.color, updateInputs) onBeforeMount(updateInputs) const colorFieldText = ref(null)