@flowgram.ai/free-layout-core 0.1.0-alpha.7 → 0.1.0-alpha.9

package/dist/esm/typings/index.js

@@ -11,7 +11,7 @@ import {
 import {
   LineColors,
   LineType
-} from "../chunk-PT4ZVDZZ.js";
+} from "../chunk-6DKK25L7.js";
 import "../chunk-DDJTYHXN.js";
 import {
   WorkflowOperationBaseService

package/dist/esm/typings/workflow-line.js

@@ -1,7 +1,7 @@
 import {
   LineColors,
   LineType
-} from "../chunk-PT4ZVDZZ.js";
+} from "../chunk-6DKK25L7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   LineColors,

package/dist/index.d.mts

@@ -2,8 +2,8 @@ import { PlaygroundConfigEntity, CommandService, PlaygroundDragEvent, EntityData
 export { bindConfigEntity, useConfigEntity, useEntities, useEntityDataFromContext, useEntityFromContext, useListenEvents, usePlayground, usePlaygroundContainer, usePlaygroundContext, usePlaygroundLatest, useRefresh, useService } from '@flowgram.ai/core';
 import { NodeFormProps } from '@flowgram.ai/node';
 import { FlowOperationBaseService, FlowNodeType, FlowOperationBaseServiceImpl, FlowNodeEntityOrId, FlowNodeEntity } from '@flowgram.ai/document';
-import { W as WorkflowHoverService, a as WorkflowDocument, b as WorkflowLinesManager, c as WorkflowSelectService, d as WorkflowDocumentOptions, L as LineEventProps, N as NodesDragEvent, e as WorkflowNodeJSON, f as WorkflowPortEntity, g as WorkflowLineEntity, O as OnDragLineEnd, h as WorkflowPorts, i as WorkflowPortType, j as WorkflowPort, k as LineRenderType, l as WorkflowLineRenderContribution, m as LinePosition } from './workflow-line-entity-DgCmDX1d.mjs';
-export { C as LINE_HOVER_DISTANCE, v as LineColor, w as LineColors, u as LineType, z as NodesDragEndEvent, y as NodesDragStartEvent, A as NodesDraggingEvent, P as POINT_RADIUS, G as PORT_SIZE, o as WORKFLOW_LINE_ENTITY, I as WorkfloEntityHoverable, s as WorkflowContentChangeEvent, r as WorkflowContentChangeType, K as WorkflowDocumentOptionsDefault, J as WorkflowDocumentProvider, q as WorkflowJSON, E as WorkflowLineEntityOpts, F as WorkflowLineInfo, D as WorkflowLinePortInfo, x as WorkflowLineRenderContributionFactory, t as WorkflowNodeMeta, H as WorkflowPortEntityOpts, p as domReactToBounds, n as getPortEntityId, B as onDragLineEndParams } from './workflow-line-entity-DgCmDX1d.mjs';
+import { W as WorkflowHoverService, a as WorkflowDocument, b as WorkflowLinesManager, c as WorkflowSelectService, d as WorkflowDocumentOptions, L as LineEventProps, N as NodesDragEvent, e as WorkflowNodeJSON, f as WorkflowPortEntity, g as WorkflowLineEntity, O as OnDragLineEnd, h as WorkflowPorts, i as WorkflowPortType, j as WorkflowPort, k as LineRenderType, l as WorkflowLineRenderContribution, m as LinePosition } from './workflow-line-entity-BcD7CpoN.mjs';
+export { C as LINE_HOVER_DISTANCE, v as LineColor, w as LineColors, u as LineType, z as NodesDragEndEvent, y as NodesDragStartEvent, A as NodesDraggingEvent, P as POINT_RADIUS, G as PORT_SIZE, o as WORKFLOW_LINE_ENTITY, J as WorkfloEntityHoverable, s as WorkflowContentChangeEvent, r as WorkflowContentChangeType, M as WorkflowDocumentOptionsDefault, K as WorkflowDocumentProvider, I as WorkflowEntityHoverable, q as WorkflowJSON, E as WorkflowLineEntityOpts, F as WorkflowLineInfo, D as WorkflowLinePortInfo, x as WorkflowLineRenderContributionFactory, t as WorkflowNodeMeta, H as WorkflowPortEntityOpts, p as domReactToBounds, n as getPortEntityId, B as onDragLineEndParams } from './workflow-line-entity-BcD7CpoN.mjs';
 import { W as WorkflowNodeEntity } from './workflow-sub-canvas-DOVla1mw.mjs';
 export { a as WorkflowSubCanvas } from './workflow-sub-canvas-DOVla1mw.mjs';
 import * as _flowgram_ai_utils from '@flowgram.ai/utils';

package/dist/index.d.ts

@@ -2,8 +2,8 @@ import { PlaygroundConfigEntity, CommandService, PlaygroundDragEvent, EntityData
 export { bindConfigEntity, useConfigEntity, useEntities, useEntityDataFromContext, useEntityFromContext, useListenEvents, usePlayground, usePlaygroundContainer, usePlaygroundContext, usePlaygroundLatest, useRefresh, useService } from '@flowgram.ai/core';
 import { NodeFormProps } from '@flowgram.ai/node';
 import { FlowOperationBaseService, FlowNodeType, FlowOperationBaseServiceImpl, FlowNodeEntityOrId, FlowNodeEntity } from '@flowgram.ai/document';
-import { W as WorkflowHoverService, a as WorkflowDocument, b as WorkflowLinesManager, c as WorkflowSelectService, d as WorkflowDocumentOptions, L as LineEventProps, N as NodesDragEvent, e as WorkflowNodeJSON, f as WorkflowPortEntity, g as WorkflowLineEntity, O as OnDragLineEnd, h as WorkflowPorts, i as WorkflowPortType, j as WorkflowPort, k as LineRenderType, l as WorkflowLineRenderContribution, m as LinePosition } from './workflow-line-entity-B8wC-OVt.js';
-export { C as LINE_HOVER_DISTANCE, v as LineColor, w as LineColors, u as LineType, z as NodesDragEndEvent, y as NodesDragStartEvent, A as NodesDraggingEvent, P as POINT_RADIUS, G as PORT_SIZE, o as WORKFLOW_LINE_ENTITY, I as WorkfloEntityHoverable, s as WorkflowContentChangeEvent, r as WorkflowContentChangeType, K as WorkflowDocumentOptionsDefault, J as WorkflowDocumentProvider, q as WorkflowJSON, E as WorkflowLineEntityOpts, F as WorkflowLineInfo, D as WorkflowLinePortInfo, x as WorkflowLineRenderContributionFactory, t as WorkflowNodeMeta, H as WorkflowPortEntityOpts, p as domReactToBounds, n as getPortEntityId, B as onDragLineEndParams } from './workflow-line-entity-B8wC-OVt.js';
+import { W as WorkflowHoverService, a as WorkflowDocument, b as WorkflowLinesManager, c as WorkflowSelectService, d as WorkflowDocumentOptions, L as LineEventProps, N as NodesDragEvent, e as WorkflowNodeJSON, f as WorkflowPortEntity, g as WorkflowLineEntity, O as OnDragLineEnd, h as WorkflowPorts, i as WorkflowPortType, j as WorkflowPort, k as LineRenderType, l as WorkflowLineRenderContribution, m as LinePosition } from './workflow-line-entity-CXh_ddVD.js';
+export { C as LINE_HOVER_DISTANCE, v as LineColor, w as LineColors, u as LineType, z as NodesDragEndEvent, y as NodesDragStartEvent, A as NodesDraggingEvent, P as POINT_RADIUS, G as PORT_SIZE, o as WORKFLOW_LINE_ENTITY, J as WorkfloEntityHoverable, s as WorkflowContentChangeEvent, r as WorkflowContentChangeType, M as WorkflowDocumentOptionsDefault, K as WorkflowDocumentProvider, I as WorkflowEntityHoverable, q as WorkflowJSON, E as WorkflowLineEntityOpts, F as WorkflowLineInfo, D as WorkflowLinePortInfo, x as WorkflowLineRenderContributionFactory, t as WorkflowNodeMeta, H as WorkflowPortEntityOpts, p as domReactToBounds, n as getPortEntityId, B as onDragLineEndParams } from './workflow-line-entity-CXh_ddVD.js';
 import { W as WorkflowNodeEntity } from './workflow-sub-canvas-DOVla1mw.js';
 export { a as WorkflowSubCanvas } from './workflow-sub-canvas-DOVla1mw.js';
 import * as _flowgram_ai_utils from '@flowgram.ai/utils';

package/dist/index.js

@@ -1089,8 +1089,8 @@ WorkflowSelectService = __decorateClass([
 
 // src/service/workflow-hover-service.ts
 var import_inversify2 = require("inversify");
-var import_core10 = require("@flowgram.ai/core");
 var import_utils11 = require("@flowgram.ai/utils");
+var import_core10 = require("@flowgram.ai/core");
 var WorkflowHoverService = class {
   constructor() {
     this.onHoveredChangeEmitter = new import_utils11.Emitter();
@@ -1187,11 +1187,12 @@ var LineType = /* @__PURE__ */ ((LineType2) => {
   return LineType2;
 })(LineType || {});
 var LineColors = /* @__PURE__ */ ((LineColors2) => {
-  LineColors2["HIDDEN"] = "transparent";
-  LineColors2["DEFUALT"] = "#4d53e8";
-  LineColors2["DRAWING"] = "#5DD6E3";
-  LineColors2["HOVER"] = "#37d0ff";
-  LineColors2["ERROR"] = "red";
+  LineColors2["HIDDEN"] = "var(--g-line-color-hidden,transparent)";
+  LineColors2["DEFUALT"] = "var(--g-line-color-default,#4d53e8)";
+  LineColors2["DRAWING"] = "var(--g-line-color-drawing, #5DD6E3)";
+  LineColors2["HOVER"] = "var(--g-line-color-hover,#37d0ff)";
+  LineColors2["SELECTED"] = "var(--g-line-color-selected,#37d0ff)";
+  LineColors2["ERROR"] = "var(--g-line-color-error,red)";
   return LineColors2;
 })(LineColors || {});
 
@@ -1210,19 +1211,23 @@ function toFormJSON(node) {
   if (!formData || !node.getNodeRegistry().formMeta) return void 0;
   return formData.toJSON();
 }
-function initFormDataFromJSON(node, json) {
+function initFormDataFromJSON(node, json, isFirstCreate) {
   const formData = node.getData(import_form_core.FlowNodeFormData);
   const registry = node.getNodeRegistry();
   const { formMeta } = registry;
   if (formData && formMeta) {
-    formData.createForm(formMeta, json.data);
-    formData.onDataChange(() => {
-      node.document.fireContentChange({
-        type: "NODE_DATA_CHANGE" /* NODE_DATA_CHANGE */,
-        toJSON: () => formData.toJSON(),
-        entity: node
+    if (isFirstCreate) {
+      formData.createForm(formMeta, json.data);
+      formData.onDataChange(() => {
+        node.document.fireContentChange({
+          type: "NODE_DATA_CHANGE" /* NODE_DATA_CHANGE */,
+          toJSON: () => formData.toJSON(),
+          entity: node
+        });
       });
-    });
+    } else {
+      formData.updateFormValues(json.data);
+    }
   }
 }
 
@@ -1233,8 +1238,8 @@ var WorkflowDocumentOptionsDefault = {
     grab: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMCAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMC40ODczIDIuNjIzNzhDOS45MDczMSAyLjYyMzc4IDkuNDM3MTMgMy4wOTM5NiA5LjQzNzEzIDMuNjczOTZWNS4xNDM3NkM5LjM5NDI4IDQuNDAyNzQgOC43Nzk3OCAzLjgxNTA0IDguMDI4MDIgMy44MTUwNEM3LjI0ODQ4IDMuODE1MDQgNi42MTY1MyA0LjQ0Njk5IDYuNjE2NTMgNS4yMjY1M1YxMS44Mjg5TDUuNjc0MTggMTEuMDA0OUM1LjE1NDg3IDEwLjU1MDkgNC40MDk1IDEwLjQ2MzYgMy43OTkzOCAxMC43ODU1TDMuNjk2OTQgMTAuODM5NkMzLjA2MjE3IDExLjE3NDUgMi45MjI2IDEyLjAyMjggMy40MTY2MiAxMi41NDM0TDcuMzM5NTkgMTYuNjc3NVYxNy4zMjU5QzcuMzM5NTkgMTcuNzg2MiA3LjcxMjY5IDE4LjE1OTMgOC4xNzI5MiAxOC4xNTkzSDEzLjgwODRDMTQuMjY4NyAxOC4xNTkzIDE0LjY0MTcgMTcuNzg2MiAxNC42NDE3IDE3LjMyNTlWMTYuNzkzNUMxNS44MDk0IDE1LjY0ODUgMTYuNDY3MyAxNC4wODE5IDE2LjQ2NzMgMTIuNDQ2NVYxMS40OTY3TDE2LjQ2NzEgNi42MzY4NUMxNi40NjcxIDUuOTU2MyAxNS45MTU0IDUuNDA0NjEgMTUuMjM0OCA1LjQwNDYxQzE0LjU1NDMgNS40MDQ2MSAxNC4wMDI2IDUuOTU2MyAxNC4wMDI2IDYuNjM2ODVMMTQuMDAyMSA1LjA0NzI4QzE0LjAwMjEgNC4zNjY3MyAxMy40NTA0IDMuODE1MDQgMTIuNzY5OCAzLjgxNTA0QzEyLjA4OTMgMy44MTUwNCAxMS41Mzc2IDQuMzY2NzMgMTEuNTM3NiA1LjA0NzI4TDExLjUzNzUgMy42NzM5NUMxMS41Mzc1IDMuMDkzOTYgMTEuMDY3MyAyLjYyMzc4IDEwLjQ4NzMgMi42MjM3OFoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTAuNDg3NCAxLjM3NDAyQzExLjM2MTIgMS4zNzQwMiAxMi4xMjExIDEuODYxMTggMTIuNTEwNSAyLjU3ODY4QzEyLjU5NTggMi41Njk4MyAxMi42ODIzIDIuNTY1MjggMTIuNzcgMi41NjUyOEMxMy44Mjc4IDIuNTY1MjggMTQuNzMxMSAzLjIyNzAxIDE1LjA4ODUgNC4xNTkxMUMxNS4xMzcgNC4xNTYyOSAxNS4xODU4IDQuMTU0ODYgMTUuMjM1IDQuMTU0ODZDMTYuNjA1OSA0LjE1NDg2IDE3LjcxNzIgNS4yNjYxOSAxNy43MTcyIDYuNjM3MDlMMTcuNzE3NCAxMi40NDY3QzE3LjcxNzQgMTQuMjM1NSAxNy4wNjQ0IDE1Ljk1NTkgMTUuODkxOSAxNy4yOTA0VjE3LjMyNjJDMTUuODkxOSAxOC40NzY4IDE0Ljk1OTEgMTkuNDA5NSAxMy44MDg1IDE5LjQwOTVIOC4xNzMwNkM3LjAyMjQ3IDE5LjQwOTUgNi4wODk3MyAxOC40NzY4IDYuMDg5NzMgMTcuMzI2MlYxNy4xNzY0TDIuNTEwMDMgMTMuNDA0MUMxLjQ0NTk5IDEyLjI4MjggMS43NDY2IDEwLjQ1NTUgMy4xMTM3OSA5LjczNDI0TDMuMjE2MjQgOS42ODAxOUMzLjg5MTY4IDkuMzIzODMgNC42NjE4NSA5LjI1NDAxIDUuMzY2NjYgOS40NTE5OFY1LjIyNjc4QzUuMzY2NjYgMy43NTY4NyA2LjU1ODI2IDIuNTY1MjggOC4wMjgxNiAyLjU2NTI4QzguMTcyOTMgMi41NjUyOCA4LjMxNDk5IDIuNTc2ODQgOC40NTM0NyAyLjU5OTA3QzguODM5NDMgMS44NzA0MiA5LjYwNTQ2IDEuMzc0MDIgMTAuNDg3NCAxLjM3NDAyWk0xMi40NDc2IDMuODU3ODdWOS40NzY0NkMxMi40NDc2IDkuNzI4NTIgMTIuMjQzMyA5LjkzMjg1IDExLjk5MTMgOS45MzI4NUMxMS43MzkyIDkuOTMyODUgMTEuNTM0OSA5LjcyODUyIDExLjUzNDkgOS40NzY0NlYzLjc5NjU1QzExLjUzNDkgMy43Nzk1NiAxMS41MzU4IDMuNzYyNzcgMTEuNTM3NiAzLjc0NjI2VjMuNjc0MkMxMS41Mzc2IDMuNDMyODIgMTEuNDU2MiAzLjIxMDQ2IDExLjMxOTMgMy4wMzMwOUMxMS4xMjcyIDIuNzg0MjggMTAuODI2MSAyLjYyNDAyIDEwLjQ4NzQgMi42MjQwMkMxMC4xMjM4IDIuNjI0MDIgOS44MDMzMiAyLjgwODg2IDkuNjE0ODMgMy4wODk3QzkuNTAyNjkgMy4yNTY3OSA5LjQzNzI2IDMuNDU3ODUgOS40MzcyNiAzLjY3NDJWMy43ODU3M0M5LjQzNzM1IDMuNzg5MzMgOS40MzczOSAzLjc5Mjk0IDkuNDM3MzkgMy43OTY1NVY5LjkwMTdDOS40MzczOSAxMC4xNTM3IDkuMjMzMDYgMTAuMzU4MSA4Ljk4MTAxIDEwLjM1ODFDOC43Mjg5NSAxMC4zNTgxIDguNTI0NjIgMTAuMTUzNyA4LjUyNDYyIDkuOTAxN1YzLjkwNTA3QzguNDE3NzMgMy44NjQ5IDguMzA0NjggMy44MzczMiA4LjE4NzI2IDMuODI0MTVDOC4xMzUwNCAzLjgxODI5IDguMDgxOTUgMy44MTUyOCA4LjAyODE2IDMuODE1MjhDNy4yNDg2MSAzLjgxNTI4IDYuNjE2NjYgNC40NDcyMyA2LjYxNjY2IDUuMjI2NzhWMTEuODI5Mkw1LjY3NDMxIDExLjAwNTJDNS41Nzg2OCAxMC45MjE2IDUuNDc1MzcgMTAuODUwNCA1LjM2NjY2IDEwLjc5MTlDNC44ODUwNiAxMC41MzI5IDQuMjk3MjggMTAuNTIzMSAzLjc5OTUyIDEwLjc4NThMMy42OTcwNyAxMC44Mzk4QzMuMDYyMzEgMTEuMTc0NyAyLjkyMjczIDEyLjAyMzEgMy40MTY3NSAxMi41NDM3TDcuMzM5NzMgMTYuNjc3N1YxNy4zMjYyQzcuMzM5NzMgMTcuNzg2NCA3LjcxMjgyIDE4LjE1OTUgOC4xNzMwNiAxOC4xNTk1SDEzLjgwODVDMTQuMjY4OCAxOC4xNTk1IDE0LjY0MTkgMTcuNzg2NCAxNC42NDE5IDE3LjMyNjJWMTYuNzkzOEMxNS43Mzc5IDE1LjcxOSAxNi4zODQ3IDE0LjI3MjggMTYuNDYgMTIuNzQ3QzE2LjQ2NDEgMTIuNjY0MSAxNi40NjY1IDEyLjU4MDkgMTYuNDY3MiAxMi40OTc1TDE2LjQ2NzQgMTIuNDQ2N0wxNi40NjcyIDYuNjM3MDlDMTYuNDY3MiA1Ljk2MjMgMTUuOTI0OCA1LjQxNDE5IDE1LjI1MjIgNS40MDQ5N0wxNS4yMzUgNS40MDQ4NkMxNS4xMjQ2IDUuNDA0ODYgMTUuMDE3NyA1LjQxOTM2IDE0LjkxNTkgNS40NDY1NlY5LjYwMjI2QzE0LjkxNTkgOS44NTQzMSAxNC43MTE2IDEwLjA1ODYgMTQuNDU5NSAxMC4wNTg2QzE0LjIwNzUgMTAuMDU4NiAxNC4wMDMxIDkuODU0MzEgMTQuMDAzMSA5LjYwMjI2VjYuNjA1MTRDMTQuMDAyOSA2LjYxNTc2IDE0LjAwMjcgNi42MjY0MSAxNC4wMDI3IDYuNjM3MDlWOS4yNzcwNUwxNC4wMDIyIDUuMDQ3NTJDMTQuMDAyMiA0Ljg2OTEzIDEzLjk2NDMgNC42OTk2IDEzLjg5NjEgNC41NDY1M0MxMy43MDY0IDQuMTIwNzIgMTMuMjgyMiAzLjgyMjM1IDEyLjc4NzYgMy44MTU0MUwxMi43NyAzLjgxNTI4QzEyLjY1ODQgMy44MTUyOCAxMi41NTA0IDMuODMwMSAxMi40NDc2IDMuODU3ODdaIiBmaWxsPSIjMUQxQzIzIi8+Cjwvc3ZnPg=="), auto',
     grabbing: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMCAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik02LjYxODE3IDUuNTk4NzVDNi42MTgxNyA0LjgxOTIgNy4yNTAxMiA0LjE4NzI2IDguMDI5NjcgNC4xODcyNkM4Ljc3ODczIDQuMTg3MjYgOS4zOTE1MiA0Ljc3MDc1IDkuNDM4MjkgNS41MDgwMUM5LjQ1OTkyIDQuOTQ3MSA5LjkyMTQ3IDQuNDk5MDIgMTAuNDg3NyA0LjQ5OTAyQzExLjA2NzcgNC40OTkwMiAxMS41Mzc4IDQuOTY5MiAxMS41Mzc4IDUuNTQ5MTlWOC43NjI0NkwxMS41Mzc5IDYuNzExNUMxMS41Mzc5IDYuMDMwOTUgMTIuMDg5NiA1LjQ3OTI2IDEyLjc3MDIgNS40NzkyNkMxMy40NTA3IDUuNDc5MjYgMTQuMDAyNCA2LjAzMDk1IDE0LjAwMjQgNi43MTE1TDE0LjAwMjQgOC43NjI0NkwxNC4wMDI5IDguMDE5ODNDMTQuMDAyOSA3LjMzOTI5IDE0LjU1NDYgNi43ODc1OSAxNS4yMzUyIDYuNzg3NTlDMTUuOTE1NyA2Ljc4NzU5IDE2LjQ2NzQgNy4zMzkyOCAxNi40Njc0IDguMDE5ODNWMTEuNDk3TDE2LjQ2NzUgMTIuNDQ2N0MxNi40Njc1IDE0LjA4MjEgMTUuODA5NiAxNS42NDg3IDE0LjY0MiAxNi43OTM4VjE3LjMyNjJDMTQuNjQyIDE3Ljc4NjQgMTQuMjY4OSAxOC4xNTk1IDEzLjgwODcgMTguMTU5NUg4LjE3MzE3QzcuNzEyOTMgMTguMTU5NSA3LjMzOTg0IDE3Ljc4NjQgNy4zMzk4NCAxNy4zMjYyVjE1Ljk0MjRMNS4zNDU2MiAxNC43NTM0QzQuNTg5MjQgMTQuMzAyNCA0LjEyNTkxIDEzLjQ4NjcgNC4xMjU4OSAxMi42MDYxTDQuMTI1ODMgOS4yODM4M0M0LjEyNTgyIDguOTU0MjcgNC4zMjAwMyA4LjY1NTY2IDQuNjIxMjkgOC41MjIwNUw2LjYxODE3IDcuNjM2MzRWNS41OTg3NVoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTAuNDg3OCAzLjI0OTAyQzExLjI3OTYgMy4yNDkwMiAxMS45Nzc4IDMuNjQ5MDIgMTIuMzkxNyA0LjI1Nzk2QzEyLjUxNTEgNC4yMzkwNiAxMi42NDE2IDQuMjI5MjYgMTIuNzcwMyA0LjIyOTI2QzEzLjcyMjQgNC4yMjkyNiAxNC41NDkzIDQuNzY1MzEgMTQuOTY1NyA1LjU1MjA3QzE1LjA1NDMgNS41NDI1IDE1LjE0NDIgNS41Mzc1OSAxNS4yMzUzIDUuNTM3NTlDMTYuNjA2MiA1LjUzNzU5IDE3LjcxNzYgNi42NDg5MyAxNy43MTc2IDguMDE5ODNMMTcuNzE3NyAxMi40NDY3QzE3LjcxNzcgMTQuMjM1NSAxNy4wNjQ3IDE1Ljk1NTkgMTUuODkyMSAxNy4yOTA0VjE3LjMyNjJDMTUuODkyMSAxOC40NzY4IDE0Ljk1OTQgMTkuNDA5NSAxMy44MDg4IDE5LjQwOTVIOC4xNzMzMkM3LjAyMjczIDE5LjQwOTUgNi4wODk5OCAxOC40NzY4IDYuMDg5OTggMTcuMzI2MlYxNi42NTI0TDQuNzA1NjMgMTUuODI3QzMuNTcxMDYgMTUuMTUwNSAyLjg3NjA3IDEzLjkyNzEgMi44NzYwNCAxMi42MDYxTDIuODc1OTggOS4yODM4NUMyLjg3NTk2IDguNDU5OTYgMy4zNjE0OSA3LjcxMzQ1IDQuMTE0NjIgNy4zNzk0TDUuMzY4MzIgNi44MjMzM1Y1LjU5ODc1QzUuMzY4MzIgNC4xMjg4NSA2LjU1OTkxIDIuOTM3MjYgOC4wMjk4MiAyLjkzNzI2QzguNjA4MzEgMi45MzcyNiA5LjE0MzU1IDMuMTIxNyA5LjU4MDA1IDMuNDM1MDVDOS44NTg1MyAzLjMxNTMyIDEwLjE2NTQgMy4yNDkwMiAxMC40ODc4IDMuMjQ5MDJaTTEyLjQ0NzkgNS41MjE4NlY5LjQ3NTU3QzEyLjQ0NzkgOS43Mjc2MiAxMi4yNDM2IDkuOTMxOTUgMTEuOTkxNiA5LjkzMTk1QzExLjc1NjggOS45MzE5NSAxMS41NjM0IDkuNzU0NjUgMTEuNTM4IDkuNTI2NjNDMTEuNTM2MSA5LjUwOTg3IDExLjUzNTIgOS40OTI4MyAxMS41MzUyIDkuNDc1NTdWNS40NzE1OEMxMS41MTU0IDUuMjAwODMgMTEuMzkzIDQuOTU4NTggMTEuMjA2NiA0Ljc4MzU4QzExLjAxODggNC42MDcxMSAxMC43NjU5IDQuNDk5MDIgMTAuNDg3OCA0LjQ5OTAyQzEwLjQ3NjYgNC40OTkwMiAxMC40NjU0IDQuNDk5MTkgMTAuNDU0MiA0LjQ5OTU0QzkuOTAzNDcgNC41MTY4NCA5LjQ1OTY0IDQuOTU4MjQgOS40Mzg0NCA1LjUwODAxQzkuNDM4MiA1LjUwNDMgOS40Mzc5NSA1LjUwMDU4IDkuNDM3NjkgNS40OTY4OFY5LjkwMjQzQzkuNDM3NjkgMTAuMTU0NSA5LjIzMzM2IDEwLjM1ODggOC45ODEzMSAxMC4zNTg4QzguNzI5MjUgMTAuMzU4OCA4LjUyNDkyIDEwLjE1NDUgOC41MjQ5MiA5LjkwMjQzVjQuMjc2NTNDOC4zNzA4NiA0LjIxODgyIDguMjA0MDIgNC4xODcyNiA4LjAyOTgyIDQuMTg3MjZDNy4yNTAyNyA0LjE4NzI2IDYuNjE4MzIgNC44MTkyIDYuNjE4MzIgNS41OTg3NUw2LjYxODI3IDkuOTc1OTlDNi42MTgyNyAxMC4yMjggNi40MTM5NCAxMC40MzI0IDYuMTYxODkgMTAuNDMyNEM1LjkwOTgzIDEwLjQzMjQgNS43MDU1IDEwLjIyOCA1LjcwNTUgOS45NzU5OVY4LjA0MTIyTDQuNjIxNDQgOC41MjIwNUM0LjMyMDE4IDguNjU1NjYgNC4xMjU5NyA4Ljk1NDI3IDQuMTI1OTggOS4yODM4M0w0LjEyNjA0IDEyLjYwNjFDNC4xMjYwNiAxMy40ODY3IDQuNTg5MzkgMTQuMzAyNCA1LjM0NTc2IDE0Ljc1MzRMNy4zMzk5OCAxNS45NDI0VjE3LjMyNjJDNy4zMzk5OCAxNy43ODY0IDcuNzEzMDggMTguMTU5NSA4LjE3MzMyIDE4LjE1OTVIMTMuODA4OEMxNC4yNjkgMTguMTU5NSAxNC42NDIxIDE3Ljc4NjQgMTQuNjQyMSAxNy4zMjYyVjE2Ljc5MzhDMTUuNzM4MSAxNS43MTkgMTYuMzg1IDE0LjI3MjggMTYuNDYwMyAxMi43NDdDMTYuNDY0NiAxMi42NiAxNi40NjcgMTIuNTcyOCAxNi40Njc2IDEyLjQ4NTRMMTYuNDY3NyAxMi40NDY3TDE2LjQ2NzYgOC4wMTk4M0MxNi40Njc2IDcuMzQ1MDQgMTUuOTI1MiA2Ljc5NjkzIDE1LjI1MjUgNi43ODc3MUwxNS4yMzUzIDYuNzg3NTlDMTUuMTI1IDYuNzg3NTkgMTUuMDE4IDYuODAyMSAxNC45MTYyIDYuODI5MzFWOS42MDEzNkMxNC45MTYyIDkuODUzNDIgMTQuNzExOSAxMC4wNTc3IDE0LjQ1OTggMTAuMDU3N0MxNC4yMDc4IDEwLjA1NzcgMTQuMDAzNCA5Ljg1MzQxIDE0LjAwMzQgOS42MDEzNlY3Ljk4OTg1QzE0LjAwMzIgNy45OTk4MiAxNC4wMDMxIDguMDA5ODEgMTQuMDAzMSA4LjAxOTgzTDE0LjAwMzQgOS42MDEzNkwxNC4wMDI1IDYuNzExNUMxNC4wMDI1IDYuNDQ5NzQgMTMuOTIwOSA2LjIwNzA1IDEzLjc4MTggNi4wMDc0OEMxMy41NjIgNS42OTI0MiAxMy4xOTg5IDUuNDg0ODMgMTIuNzg3IDUuNDc5MzdMMTIuNzcwMyA1LjQ3OTI2QzEyLjY1ODggNS40NzkyNiAxMi41NTA3IDUuNDk0MDggMTIuNDQ3OSA1LjUyMTg2WiIgZmlsbD0iIzFEMUMyMyIvPgo8L3N2Zz4="), auto'
   },
-  fromNodeJSON(node, json) {
-    initFormDataFromJSON(node, json);
+  fromNodeJSON(node, json, isFirstCreate) {
+    initFormDataFromJSON(node, json, isFirstCreate);
     return;
   },
   toNodeJSON(node) {
@@ -1298,12 +1303,12 @@ var WorkflowLinesManager = class {
   }
   get lineColor() {
     const color = {
-      default: "#4d53e8" /* DEFUALT */,
-      error: "red" /* ERROR */,
-      hidden: "transparent" /* HIDDEN */,
-      drawing: "#5DD6E3" /* DRAWING */,
-      hovered: "#37d0ff" /* HOVER */,
-      selected: "#37d0ff" /* HOVER */
+      default: "var(--g-line-color-default,#4d53e8)" /* DEFUALT */,
+      error: "var(--g-line-color-error,red)" /* ERROR */,
+      hidden: "var(--g-line-color-hidden,transparent)" /* HIDDEN */,
+      drawing: "var(--g-line-color-drawing, #5DD6E3)" /* DRAWING */,
+      hovered: "var(--g-line-color-hover,#37d0ff)" /* HOVER */,
+      selected: "var(--g-line-color-selected,#37d0ff)" /* SELECTED */
     };
     if (this.options.lineColor) {
       Object.assign(color, this.options.lineColor);
@@ -1386,17 +1391,15 @@ var WorkflowLinesManager = class {
       toNode?.removeLine(line);
       line.validate();
     });
-    line.toDispose.push(
-      import_utils12.Disposable.create(() => {
-        if (available) {
-          this.onAvailableLinesChangeEmitter.fire({
-            type: "DELETE_LINE" /* DELETE_LINE */,
-            toJSON: () => line.toJSON(),
-            entity: line
-          });
-        }
-      })
-    );
+    line.onDispose(() => {
+      if (available) {
+        this.onAvailableLinesChangeEmitter.fire({
+          type: "DELETE_LINE" /* DELETE_LINE */,
+          toJSON: () => line.toJSON(),
+          entity: line
+        });
+      }
+    });
     if (available) {
       this.onAvailableLinesChangeEmitter.fire({
         type: "ADD_LINE" /* ADD_LINE */,
@@ -1604,9 +1607,9 @@ var import_core14 = require("@flowgram.ai/core");
 
 // src/layout/free-layout.ts
 var import_inversify4 = require("inversify");
+var import_utils13 = require("@flowgram.ai/utils");
 var import_document6 = require("@flowgram.ai/document");
 var import_core13 = require("@flowgram.ai/core");
-var import_utils13 = require("@flowgram.ai/utils");
 var FREE_LAYOUT_KEY = "free-layout";
 var FreeLayout = class {
   constructor() {
@@ -1641,6 +1644,21 @@ var FreeLayout = class {
     const parentTransform = node.parent.getData(import_document6.FlowNodeTransformData);
     parentTransform.transform.fireChange();
   }
+  /**
+   * 更新所有受影响的上下游节点
+   */
+  updateAffectedTransform(node) {
+    const transformData = node.transform;
+    if (!transformData.localDirty) {
+      return;
+    }
+    const allParents = this.getAllParents(node);
+    const allBlocks = this.getAllBlocks(node).reverse();
+    const affectedNodes = [...allBlocks, ...allParents];
+    affectedNodes.forEach((node2) => {
+      this.fireChange(node2);
+    });
+  }
   /**
    * 获取节点的 padding 数据
    * @param node
@@ -1686,6 +1704,30 @@ var FreeLayout = class {
   getDefaultNodeOrigin() {
     return { x: 0.5, y: 0 };
   }
+  getAllParents(node) {
+    const parents = [];
+    let current = node.parent;
+    while (current) {
+      parents.push(current);
+      current = current.parent;
+    }
+    return parents;
+  }
+  getAllBlocks(node) {
+    return node.blocks.reduce(
+      (acc, child) => [...acc, ...this.getAllBlocks(child)],
+      [node]
+    );
+  }
+  fireChange(node) {
+    const transformData = node?.transform;
+    if (!node || !transformData?.localDirty) {
+      return;
+    }
+    node.clearMemoGlobal();
+    node.clearMemoLocal();
+    transformData.transform.fireChange();
+  }
 };
 __decorateClass([
   (0, import_inversify4.inject)(import_core13.PlaygroundConfigEntity)
@@ -1708,7 +1750,6 @@ var WorkflowDocument = class extends import_document7.FlowDocument {
     this.onContentChange = this._onContentChangeEmitter.event;
     this._onReloadEmitter = new import_utils14.Emitter();
     this.onReload = this._onReloadEmitter.event;
-    this.disposed = false;
     /**
      * 数据加载完成
      */
@@ -1737,12 +1778,14 @@ var WorkflowDocument = class extends import_document7.FlowDocument {
     });
   }
   async load() {
+    if (this.disposed) return;
     this._loading = true;
     await super.load();
     this._loading = false;
     this.onLoadedEmitter.fire();
   }
   async reload(json, delayTime = 0) {
+    if (this.disposed) return;
     this._loading = true;
     this.clear();
     this.fromJSON(json);
@@ -1755,6 +1798,7 @@ var WorkflowDocument = class extends import_document7.FlowDocument {
    * @param json
    */
   fromJSON(json, fireRender = true) {
+    if (this.disposed) return;
     const workflowJSON = {
       nodes: json.nodes ?? [],
       edges: json.edges ?? []
@@ -1797,9 +1841,11 @@ var WorkflowDocument = class extends import_document7.FlowDocument {
     const formData = getFlowNodeFormData(node);
     const transform = node.getData(import_document7.FlowNodeTransformData);
     const freeLayout = this.layout;
-    transform.onDataChange(() => {
-      freeLayout.syncTransform(node);
-    });
+    if (!isExistedNode) {
+      transform.onDataChange(() => {
+        freeLayout.syncTransform(node);
+      });
+    }
     let { position } = meta;
     if (!position) {
       position = this.getNodeDefaultPosition(json.type);
@@ -1818,13 +1864,15 @@ var WorkflowDocument = class extends import_document7.FlowDocument {
       });
     }
     const positionData = node.getData(import_core14.PositionData);
-    positionData.onDataChange(() => {
-      this.fireContentChange({
-        type: "MOVE_NODE" /* MOVE_NODE */,
-        toJSON: () => positionData.toJSON(),
-        entity: node
+    if (!isExistedNode) {
+      positionData.onDataChange(() => {
+        this.fireContentChange({
+          type: "MOVE_NODE" /* MOVE_NODE */,
+          toJSON: () => positionData.toJSON(),
+          entity: node
+        });
       });
-    });
+    }
     const subCanvas = this.getNodeSubCanvas(node);
     if (!isExistedNode && !subCanvas?.isCanvas) {
       this.fireContentChange({
@@ -1832,26 +1880,24 @@ var WorkflowDocument = class extends import_document7.FlowDocument {
         entity: node,
         toJSON: () => this.toNodeJSON(node)
       });
-      node.toDispose.push(
-        import_utils14.Disposable.create(() => {
-          this.fireContentChange({
-            type: "DELETE_NODE" /* DELETE_NODE */,
-            entity: node,
-            toJSON: () => this.toNodeJSON(node)
-          });
-        })
-      );
-      node.toDispose.push(
-        import_utils14.Disposable.create(() => {
-          if (!node.parent || node.parent.flowNodeType === import_document7.FlowNodeBaseType.ROOT) {
-            return;
-          }
-          const parentTransform = node.parent.getData(import_document7.FlowNodeTransformData);
-          setTimeout(() => {
-            parentTransform.fireChange();
-          }, 0);
-        })
-      );
+      node.onDispose(() => {
+        if (!node.parent || node.parent.flowNodeType === import_document7.FlowNodeBaseType.ROOT) {
+          return;
+        }
+        const parentTransform = node.parent.getData(import_document7.FlowNodeTransformData);
+        parentTransform.fireChange();
+      });
+      let lastDeleteNodeData;
+      node.preDispose.onDispose(() => {
+        lastDeleteNodeData = this.toNodeJSON(node);
+      });
+      node.onDispose(() => {
+        this.fireContentChange({
+          type: "DELETE_NODE" /* DELETE_NODE */,
+          entity: node,
+          toJSON: () => lastDeleteNodeData
+        });
+      });
     }
     if (json.blocks) {
       this.renderJSON(
@@ -1867,19 +1913,95 @@ var WorkflowDocument = class extends import_document7.FlowDocument {
       canvasTransform.update({
         position: subCanvas.parentNode.getNodeMeta()?.canvasPosition
       });
-      subCanvas.parentNode.onDispose(() => {
-        subCanvas.canvasNode.dispose();
+      if (!isExistedNode) {
+        subCanvas.parentNode.onDispose(() => {
+          subCanvas.canvasNode.dispose();
+        });
+        subCanvas.canvasNode.onDispose(() => {
+          subCanvas.parentNode.dispose();
+        });
+      }
+    }
+    if (!isExistedNode) {
+      this.onNodeCreateEmitter.fire({
+        node,
+        data: json,
+        json
       });
-      subCanvas.canvasNode.onDispose(() => {
-        subCanvas.parentNode.dispose();
+    } else {
+      this.onNodeUpdateEmitter.fire({
+        node,
+        data: json,
+        json
       });
     }
-    this.onNodeCreateEmitter.fire({
-      node,
-      data: json
+    return node;
+  }
+  /**
+   * 添加节点，如果节点已经存在则不会重复创建
+   * @param data
+   * @param addedNodes
+   */
+  addNode(data, addedNodes, ignoreCreateAndUpdateEvent) {
+    const { id, type = "block", originParent, parent, meta, hidden, index } = data;
+    let node = this.getNode(id);
+    let isNew = false;
+    const register = this.getNodeRegistry(type, data.originParent);
+    if (node && node.flowNodeType !== data.type) {
+      node.dispose();
+      node = void 0;
+    }
+    if (!node) {
+      const { dataRegistries } = register;
+      node = this.entityManager.createEntity(WorkflowNodeEntity, {
+        id,
+        document: this,
+        flowNodeType: type,
+        originParent,
+        meta
+      });
+      const datas = dataRegistries ? this.nodeDataRegistries.concat(...dataRegistries) : this.nodeDataRegistries;
+      node.addInitializeData(datas);
+      node.onDispose(() => this.onNodeDisposeEmitter.fire({ node }));
+      this.options.fromNodeJSON?.(node, data, true);
+      isNew = true;
+    } else {
+      this.options.fromNodeJSON?.(node, data, false);
+    }
+    node.initData({
+      originParent,
+      parent,
+      meta,
+      hidden,
+      index
     });
+    addedNodes?.push(node);
+    if (register.onCreate) {
+      const extendNodes = register.onCreate(node, data);
+      if (extendNodes && addedNodes) {
+        addedNodes.push(...extendNodes);
+      }
+    }
+    if (!ignoreCreateAndUpdateEvent) {
+      if (isNew) {
+        this.onNodeCreateEmitter.fire({
+          node,
+          data,
+          json: data
+        });
+      } else {
+        this.onNodeUpdateEmitter.fire({ node, data, json: data });
+      }
+    }
     return node;
   }
+  get layout() {
+    const layout = this.layouts.find((layout2) => layout2.name == this.currentLayoutKey);
+    if (!layout) {
+      throw new Error(`Unknown flow layout: ${this.currentLayoutKey}`);
+    }
+    return layout;
+  }
   /**
    * 获取默认的 x y 坐标, 默认为当前画布可视区域中心
    * @param type
@@ -2091,11 +2213,7 @@ var WorkflowDocument = class extends import_document7.FlowDocument {
     };
   }
   dispose() {
-    if (this.disposed) {
-      return;
-    }
     super.dispose();
-    this.disposed = true;
     this._onReloadEmitter.dispose();
   }
   /**
@@ -2293,15 +2411,10 @@ var WorkflowDragService = class {
             x: nodeStartPosition.x + offset.x,
             y: nodeStartPosition.y + offset.y
           };
-          if (node.collapsedChildren?.length > 0) {
-            node.collapsedChildren.forEach((childNode) => {
-              const childNodeTransformData = childNode.getData(import_document8.FlowNodeTransformData);
-              childNodeTransformData.fireChange();
-            });
-          }
           transform.update({
             position: newPosition
           });
+          this.document.layout.updateAffectedTransform(node);
           positions.push(newPosition);
         });
         this._nodesDragEmitter.fire({
@@ -2822,18 +2935,14 @@ var layoutToPositions = async (nodes, nodePositionMap) => {
           const transform = node.getData(import_core16.TransformData);
           const deltaX = (nodePositionMap[node.id].x - transform.position.x) * v.d / 100;
           const deltaY = (nodePositionMap[node.id].y - transform.bounds.height / 2 - transform.position.y) * v.d / 100;
-          if (node.collapsedChildren?.length > 0) {
-            node.collapsedChildren.forEach((childNode) => {
-              const childNodeTransformData = childNode.getData(import_document10.FlowNodeTransformData);
-              childNodeTransformData.fireChange();
-            });
-          }
           transform.update({
             position: {
               x: transform.position.x + deltaX,
               y: transform.position.y + deltaY
             }
           });
+          const document2 = node.document;
+          document2.layout.updateAffectedTransform(node);
         });
       },
       onComplete: () => {