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>

src/renderer/extensions/vueNodes/widgets/components/WidgetSelectDefault.vue

@@ -1,7 +1,7 @@
 <template>
   <WidgetLayoutField :widget>
     <Select
-      v-model="localValue"
+      v-model="modelValue"
       :invalid
       :options="selectOptions"
       v-bind="combinedProps"
@@ -15,7 +15,6 @@
         overlay: 'w-fit min-w-full'
       }"
       data-capture-wheel="true"
-      @update:model-value="onChange"
     />
   </WidgetLayoutField>
 </template>
@@ -24,7 +23,6 @@
 import Select from 'primevue/select'
 import { computed } from 'vue'
 
-import { useWidgetValue } from '@/composables/graph/useWidgetValue'
 import { useTransformCompatOverlayProps } from '@/composables/useTransformCompatOverlayProps'
 import type { SimplifiedWidget } from '@/types/simplifiedWidget'
 import { cn } from '@/utils/tailwindUtil'
@@ -36,21 +34,16 @@ import {
 import { WidgetInputBaseClass } from './layout'
 import WidgetLayoutField from './layout/WidgetLayoutField.vue'
 
-const props = defineProps<{
-  widget: SimplifiedWidget<string | number | undefined>
-  modelValue: string | number | undefined
-}>()
+interface Props {
+  widget: SimplifiedWidget<string | undefined>
+}
 
-const emit = defineEmits<{
-  'update:modelValue': [value: string | number | undefined]
-}>()
+const props = defineProps<Props>()
 
-// Use the composable for consistent widget value handling
-const { localValue, onChange } = useWidgetValue({
-  widget: props.widget,
-  modelValue: props.modelValue,
-  defaultValue: props.widget.options?.values?.[0] || '',
-  emit
+const modelValue = defineModel<string | undefined>({
+  default(props: Props) {
+    return props.widget.options?.values?.[0] || ''
+  }
 })
 
 // Transform compatibility props for overlay positioning
@@ -67,12 +60,12 @@ const selectOptions = computed(() => {
   return []
 })
 const invalid = computed(
-  () => !!localValue.value && !selectOptions.value.includes(localValue.value)
+  () => !!modelValue.value && !selectOptions.value.includes(modelValue.value)
 )
 
 const combinedProps = computed(() => ({
   ...filterWidgetProps(props.widget.options, PANEL_EXCLUDED_PROPS),
   ...transformCompatProps.value,
-  ...(invalid.value ? { placeholder: `${localValue.value}` } : {})
+  ...(invalid.value ? { placeholder: `${modelValue.value}` } : {})
 }))
 </script>