refactor: use emit events pattern instead of mutating props in widget components (#8549)

src/components/rightSidePanel/parameters/SectionWidgets.vue

@@ -118,6 +118,15 @@ function handleLocateNode() {
   }
 }
 
+function handleWidgetValueUpdate(
+  widget: IBaseWidget,
+  newValue: string | number | boolean | object
+) {
+  widget.value = newValue
+  widget.callback?.(newValue)
+  canvasStore.canvas?.setDirty(true, true)
+}
+
 defineExpose({
   widgetsContainer,
   rootElement
@@ -179,6 +188,7 @@ defineExpose({
             :show-node-name="showNodeName"
             :parents="parents"
             :is-shown-on-parents="isWidgetShownOnParents(node, widget)"
+            @update:widget-value="handleWidgetValueUpdate(widget, $event)"
           />
         </TransitionGroup>
       </div>

src/components/rightSidePanel/parameters/TabSubgraphInputs.vue

@@ -32,6 +32,10 @@ const { node } = defineProps<{
   node: SubgraphNode
 }>()
 
+const emit = defineEmits<{
+  'update:proxyWidgets': [value: ProxyWidgetsProperty]
+}>()
+
 const { t } = useI18n()
 const canvasStore = useCanvasStore()
 const rightSidePanelStore = useRightSidePanelStore()
@@ -51,8 +55,7 @@ const proxyWidgets = customRef<ProxyWidgetsProperty>((track, trigger) => ({
   set(value?: ProxyWidgetsProperty) {
     trigger()
     if (!value) return
-    // eslint-disable-next-line vue/no-mutating-props
-    node.properties.proxyWidgets = value
+    emit('update:proxyWidgets', value)
   }
 }))
 

src/components/rightSidePanel/parameters/WidgetItem.vue

@@ -41,6 +41,10 @@ const {
   isShownOnParents?: boolean
 }>()
 
+const emit = defineEmits<{
+  'update:widgetValue': [value: string | number | boolean | object]
+}>()
+
 const { t } = useI18n()
 const canvasStore = useCanvasStore()
 const favoritedWidgetsStore = useFavoritedWidgetsStore()
@@ -83,10 +87,7 @@ const widgetValue = computed({
     return widget.value
   },
   set: (newValue: string | number | boolean | object) => {
-    // eslint-disable-next-line vue/no-mutating-props
-    widget.value = newValue
-    widget.callback?.(newValue)
-    canvasStore.canvas?.setDirty(true, true)
+    emit('update:widgetValue', newValue)
   }
 })