Fix: Simplify the widget state logic (#6741)

## Summary

Fixes the case where a value is updated in the graph but the result
doesn't reflect on the widget representation on the relevant node.

## Changes

- **What**: Uses vanilla Vue utilities instead of a special utility
- **What**: Fewer places where state could be desynced.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6741-Fix-WIP-Simplify-the-widget-state-logic-2af6d73d36508160b729db50608a2ea9)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
Alexander Brown
2025-11-18 14:32:22 -08:00
committed by GitHub
parent 0cff8eb357
commit 00fa9b691b
41 changed files with 86 additions and 3184 deletions

View File

@@ -2,7 +2,7 @@
<WidgetLayoutField :widget="widget">
<div :class="cn(WidgetInputBaseClass, 'flex items-center gap-2 pl-3 pr-2')">
<Slider
:model-value="[localValue]"
:model-value="[modelValue]"
v-bind="filteredProps"
class="flex-grow text-xs"
:step="stepValue"
@@ -11,7 +11,7 @@
/>
<InputNumber
:key="timesEmptied"
:model-value="localValue"
:model-value="modelValue"
v-bind="filteredProps"
:step="stepValue"
:min-fraction-digits="precision"
@@ -32,7 +32,6 @@ import InputNumber from 'primevue/inputnumber'
import { computed, ref } from 'vue'
import Slider from '@/components/ui/slider/Slider.vue'
import { useNumberWidgetValue } from '@/composables/graph/useWidgetValue'
import type { SimplifiedWidget } from '@/types/simplifiedWidget'
import { cn } from '@/utils/tailwindUtil'
import {
@@ -44,22 +43,16 @@ import { useNumberWidgetButtonPt } from '../composables/useNumberWidgetButtonPt'
import { WidgetInputBaseClass } from './layout'
import WidgetLayoutField from './layout/WidgetLayoutField.vue'
const { widget, modelValue } = defineProps<{
const { widget } = defineProps<{
widget: SimplifiedWidget<number>
modelValue: number
}>()
const emit = defineEmits<{
'update:modelValue': [value: number]
}>()
// Use the composable for consistent widget value handling
const { localValue, onChange } = useNumberWidgetValue(widget, modelValue, emit)
const modelValue = defineModel<number>({ default: 0 })
const timesEmptied = ref(0)
const updateLocalValue = (newValue: number[] | undefined): void => {
onChange(newValue ?? [localValue.value])
if (newValue?.length) modelValue.value = newValue[0]
}
const handleNumberInputUpdate = (newValue: number | undefined) => {