@flowgram.ai/free-layout-core 0.2.11 → 0.2.12

package/dist/esm/index.js

@@ -3045,6 +3045,9 @@ function useNodeRender(nodeFromProps) {
   const dragService = useService(WorkflowDragService);
   const selectionService = useService(WorkflowSelectService);
   const isDragging = useRef(false);
+  const [formValueVersion, updateFormValueVersion] = useState(0);
+  const formValueDependRef = useRef(false);
+  formValueDependRef.current = false;
   const nodeRef = useRef(null);
   const [linkingNodeId, setLinkingNodeId] = useState("");
   useEffect2(() => {
@@ -3120,36 +3123,86 @@ function useNodeRender(nodeFromProps) {
   const toggleExpand = useCallback(() => {
     renderData.toggleExpand();
   }, [renderData]);
-  return {
-    node,
-    selected: selectionService.isSelected(node.id),
-    activated: selectionService.isActivated(node.id),
-    expanded: renderData.expanded,
-    startDrag,
-    ports: portsData.allPorts,
-    deleteNode,
-    selectNode,
-    readonly,
-    linkingNodeId,
-    nodeRef,
-    onFocus,
-    onBlur,
-    getExtInfo,
-    updateExtInfo,
-    toggleExpand,
-    get form() {
-      if (!form) return void 0;
-      return {
-        ...form,
-        get values() {
+  const selected = selectionService.isSelected(node.id);
+  const activated = selectionService.isActivated(node.id);
+  const expanded = renderData.expanded;
+  useEffect2(() => {
+    const toDispose = form?.onFormValuesChange(() => {
+      if (formValueDependRef.current) {
+        updateFormValueVersion((v) => v + 1);
+      }
+    });
+    return () => toDispose?.dispose();
+  }, [form]);
+  return useMemo(
+    () => ({
+      id: node.id,
+      type: node.flowNodeType,
+      get data() {
+        if (form) {
+          formValueDependRef.current = true;
           return form.values;
-        },
-        get state() {
-          return formState;
         }
-      };
-    }
-  };
+        return getExtInfo();
+      },
+      updateData(values) {
+        if (form) {
+          form.updateFormValues(values);
+        } else {
+          updateExtInfo(values);
+        }
+      },
+      node,
+      selected,
+      activated,
+      expanded,
+      startDrag,
+      get ports() {
+        return portsData.allPorts;
+      },
+      deleteNode,
+      selectNode,
+      readonly,
+      linkingNodeId,
+      nodeRef,
+      onFocus,
+      onBlur,
+      getExtInfo,
+      updateExtInfo,
+      toggleExpand,
+      get form() {
+        if (!form) return void 0;
+        return {
+          ...form,
+          get values() {
+            formValueDependRef.current = true;
+            return form.values;
+          },
+          get state() {
+            return formState;
+          }
+        };
+      }
+    }),
+    [
+      node,
+      selected,
+      activated,
+      expanded,
+      startDrag,
+      deleteNode,
+      selectNode,
+      readonly,
+      linkingNodeId,
+      nodeRef,
+      onFocus,
+      onBlur,
+      getExtInfo,
+      updateExtInfo,
+      toggleExpand,
+      formValueVersion
+    ]
+  );
 }
 
 // src/hooks/use-current-dom-node.ts