fix(core): use correct prop value when watcher triggers

packages/core/src/composables/useWatchProps.ts

@@ -1,5 +1,5 @@
-import type { Ref, ToRefs } from 'vue'
+import type { ToRefs } from 'vue'
-import { effectScope, nextTick, onScopeDispose, watch } from 'vue'
+import { effectScope, isRef, nextTick, onScopeDispose, watch } from 'vue'
 import type { WatchPausableReturn } from '@vueuse/core'
 import { toRef, watchPausable } from '@vueuse/core'
 import type { Connection, FlowProps, VueFlowStore } from '~/types'
@@ -10,7 +10,7 @@ export function useWatchProps(
   props: FlowProps,
   store: VueFlowStore,
 ) {
-  const scope = effectScope()
+  const scope = effectScope(true)
 
   scope.run(() => {
     const watchModelValue = () => {
@@ -285,22 +285,26 @@ export function useWatchProps(
         'autoConnect',
       ]
 
-      Object.keys(props).forEach((prop) => {
+      Object.keys(props).forEach((key) => {
-        if (!skip.includes(prop as keyof typeof props)) {
+        const propKey = key as keyof typeof props
-          const model = toRef(() => prop)
+        if (!skip.includes(propKey)) {
-          const storeRef = store[prop as keyof typeof store] as typeof model as Ref<any>
+          const propValue = toRef(() => props[propKey])
 
-          scope.run(() => {
+          const storeRef = store[propKey as keyof typeof store]
-            watch(
+
-              model,
+          if (isRef(storeRef)) {
-              (nextValue) => {
+            scope.run(() => {
-                if (isDef(nextValue)) {
+              watch(
-                  storeRef.value = nextValue
+                propValue,
-                }
+                (nextValue) => {
-              },
+                  if (isDef(nextValue)) {
-              { flush: 'pre' },
+                    ;(storeRef.value as any) = nextValue
-            )
+                  }
-          })
+                },
+                { immediate: true, flush: 'pre' },
+              )
+            })
+          }
         }
       })
     }