@flowgram.ai/free-layout-core 0.1.0

package/dist/esm/index.js

@@ -0,0 +1,3432 @@
+import {
+  URLParams
+} from "./chunk-DE4324TR.js";
+import "./chunk-CGOMTQ3G.js";
+import {
+  WorkflowContentChangeType
+} from "./chunk-J5FVRRUV.js";
+import {
+  LineColors,
+  LineType
+} from "./chunk-KAL7YCC2.js";
+import {
+  __decorateClass
+} from "./chunk-EUXUH3YW.js";
+import "./chunk-DDJTYHXN.js";
+import "./chunk-KNYZRMIO.js";
+import "./chunk-NU6G5HF4.js";
+
+// src/workflow-commands.ts
+var WorkflowCommands = /* @__PURE__ */ ((WorkflowCommands2) => {
+  WorkflowCommands2["DELETE_NODES"] = "DELETE_NODES";
+  WorkflowCommands2["COPY_NODES"] = "COPY_NODES";
+  WorkflowCommands2["PASTE_NODES"] = "PASTE_NODES";
+  WorkflowCommands2["ZOOM_IN"] = "ZOOM_IN";
+  WorkflowCommands2["ZOOM_OUT"] = "ZOOM_OUT";
+  WorkflowCommands2["UNDO"] = "UNDO";
+  WorkflowCommands2["REDO"] = "REDO";
+  return WorkflowCommands2;
+})(WorkflowCommands || {});
+
+// src/hooks/index.ts
+import {
+  useConfigEntity,
+  useService as useService3,
+  usePlayground as usePlayground2,
+  useListenEvents as useListenEvents2,
+  usePlaygroundContainer,
+  usePlaygroundContext,
+  useEntities,
+  useEntityFromContext as useEntityFromContext3,
+  useEntityDataFromContext,
+  useRefresh as useRefresh2,
+  usePlaygroundLatest
+} from "@flowgram.ai/core";
+
+// src/hooks/use-node-render.tsx
+import { useCallback, useEffect as useEffect2, useRef, useState, useContext, useMemo } from "react";
+import { useObserve } from "@flowgram.ai/reactive";
+import { getNodeForm } from "@flowgram.ai/node";
+import { FlowNodeRenderData as FlowNodeRenderData2 } from "@flowgram.ai/document";
+import { PlaygroundEntityContext, useListenEvents, useService } from "@flowgram.ai/core";
+
+// src/service/workflow-select-service.ts
+import { inject, injectable } from "inversify";
+import {
+  Playground,
+  SelectionService,
+  TransformData as TransformData4
+} from "@flowgram.ai/core";
+import { Rectangle as Rectangle7, SizeSchema } from "@flowgram.ai/utils";
+
+// src/utils/index.ts
+import { bindConfigEntity } from "@flowgram.ai/core";
+import { delay } from "@flowgram.ai/utils";
+
+// src/utils/fold-line.ts
+import { Point, Rectangle } from "@flowgram.ai/utils";
+function pointLineDistance(p1, p2, p3) {
+  let len;
+  if (p1.x - p2.x === 0) {
+    len = Math.abs(p3.x - p1.x);
+  } else {
+    const A = (p1.y - p2.y) / (p1.x - p2.x);
+    const B = p1.y - A * p1.x;
+    len = Math.abs((A * p3.x + B - p3.y) / Math.sqrt(A * A + 1));
+  }
+  return len;
+}
+var FoldLine;
+((FoldLine2) => {
+  const EDGE_RADIUS = 5;
+  const OFFSET = 20;
+  function getEdgeCenter({ source, target }) {
+    const xOffset = Math.abs(target.x - source.x) / 2;
+    const centerX = target.x < source.x ? target.x + xOffset : target.x - xOffset;
+    const yOffset = Math.abs(target.y - source.y) / 2;
+    const centerY = target.y < source.y ? target.y + yOffset : target.y - yOffset;
+    return [centerX, centerY];
+  }
+  const getDirection = ({ source, target }) => source.x < target.x ? { x: 1, y: 0 } : { x: -1, y: 0 };
+  function getPoints({ source, target }) {
+    const sourceDir = { x: 1, y: 0 };
+    const targetDir = { x: -1, y: 0 };
+    const sourceGapped = {
+      x: source.x + sourceDir.x * OFFSET,
+      y: source.y + sourceDir.y * OFFSET
+    };
+    const targetGapped = {
+      x: target.x + targetDir.x * OFFSET,
+      y: target.y + targetDir.y * OFFSET
+    };
+    const dir = getDirection({
+      source: sourceGapped,
+      target: targetGapped
+    });
+    const dirAccessor = dir.x !== 0 ? "x" : "y";
+    const currDir = dir[dirAccessor];
+    let points = [];
+    let centerX, centerY;
+    const [defaultCenterX, defaultCenterY] = getEdgeCenter({
+      source,
+      target
+    });
+    if (sourceDir[dirAccessor] * targetDir[dirAccessor] === -1) {
+      centerX = defaultCenterX;
+      centerY = defaultCenterY;
+      const verticalSplit = [
+        { x: centerX, y: sourceGapped.y },
+        { x: centerX, y: targetGapped.y }
+      ];
+      const horizontalSplit = [
+        { x: sourceGapped.x, y: centerY },
+        { x: targetGapped.x, y: centerY }
+      ];
+      if (sourceDir[dirAccessor] === currDir) {
+        points = dirAccessor === "x" ? verticalSplit : horizontalSplit;
+      } else {
+        points = dirAccessor === "x" ? horizontalSplit : verticalSplit;
+      }
+    } else {
+      const sourceTarget = [{ x: sourceGapped.x, y: targetGapped.y }];
+      const targetSource = [{ x: targetGapped.x, y: sourceGapped.y }];
+      if (dirAccessor === "x") {
+        points = sourceDir.x === currDir ? targetSource : sourceTarget;
+      } else {
+        points = sourceDir.y === currDir ? sourceTarget : targetSource;
+      }
+      const dirAccessorOpposite = dirAccessor === "x" ? "y" : "x";
+      const isSameDir = sourceDir[dirAccessor] === targetDir[dirAccessorOpposite];
+      const sourceGtTargetOppo = sourceGapped[dirAccessorOpposite] > targetGapped[dirAccessorOpposite];
+      const sourceLtTargetOppo = sourceGapped[dirAccessorOpposite] < targetGapped[dirAccessorOpposite];
+      const flipSourceTarget = sourceDir[dirAccessor] === 1 && (!isSameDir && sourceGtTargetOppo || isSameDir && sourceLtTargetOppo) || sourceDir[dirAccessor] !== 1 && (!isSameDir && sourceLtTargetOppo || isSameDir && sourceGtTargetOppo);
+      if (flipSourceTarget) {
+        points = dirAccessor === "x" ? sourceTarget : targetSource;
+      }
+      const sourceGapPoint = { x: sourceGapped.x, y: sourceGapped.y };
+      const targetGapPoint = { x: targetGapped.x, y: targetGapped.y };
+      const maxXDistance = Math.max(
+        Math.abs(sourceGapPoint.x - points[0].x),
+        Math.abs(targetGapPoint.x - points[0].x)
+      );
+      const maxYDistance = Math.max(
+        Math.abs(sourceGapPoint.y - points[0].y),
+        Math.abs(targetGapPoint.y - points[0].y)
+      );
+      if (maxXDistance >= maxYDistance) {
+        centerX = (sourceGapPoint.x + targetGapPoint.x) / 2;
+        centerY = points[0].y;
+      } else {
+        centerX = points[0].x;
+        centerY = (sourceGapPoint.y + targetGapPoint.y) / 2;
+      }
+    }
+    const pathPoints = [
+      source,
+      { x: sourceGapped.x, y: sourceGapped.y },
+      ...points,
+      { x: targetGapped.x, y: targetGapped.y },
+      target
+    ];
+    return pathPoints;
+  }
+  FoldLine2.getPoints = getPoints;
+  function getBend(a, b, c) {
+    const bendSize = Math.min(
+      Point.getDistance(a, b) / 2,
+      Point.getDistance(b, c) / 2,
+      EDGE_RADIUS
+    );
+    const { x, y } = b;
+    if (a.x === x && x === c.x || a.y === y && y === c.y) {
+      return `L${x} ${y}`;
+    }
+    if (a.y === y) {
+      const xDir2 = a.x < c.x ? -1 : 1;
+      const yDir2 = a.y < c.y ? 1 : -1;
+      return `L ${x + bendSize * xDir2},${y}Q ${x},${y} ${x},${y + bendSize * yDir2}`;
+    }
+    const xDir = a.x < c.x ? 1 : -1;
+    const yDir = a.y < c.y ? -1 : 1;
+    return `L ${x},${y + bendSize * yDir}Q ${x},${y} ${x + bendSize * xDir},${y}`;
+  }
+  function getSmoothStepPath(points) {
+    const path = points.reduce((res, p, i) => {
+      let segment = "";
+      if (i > 0 && i < points.length - 1) {
+        segment = getBend(points[i - 1], p, points[i + 1]);
+      } else {
+        segment = `${i === 0 ? "M" : "L"}${p.x} ${p.y}`;
+      }
+      res += segment;
+      return res;
+    }, "");
+    return path;
+  }
+  FoldLine2.getSmoothStepPath = getSmoothStepPath;
+  function getBounds(points) {
+    const xList = points.map((p) => p.x);
+    const yList = points.map((p) => p.y);
+    const left = Math.min(...xList);
+    const right = Math.max(...xList);
+    const top = Math.min(...yList);
+    const bottom = Math.max(...yList);
+    return Rectangle.createRectangleWithTwoPoints(
+      {
+        x: left,
+        y: top
+      },
+      {
+        x: right,
+        y: bottom
+      }
+    );
+  }
+  FoldLine2.getBounds = getBounds;
+  function getFoldLineToPointDistance(points, pos) {
+    const bounds = getBounds(points);
+    if (bounds.contains(pos.x, pos.y)) {
+      const lines = points.reduce((res, point, index) => {
+        if (index === 0) {
+          return res;
+        }
+        res.push([points[index - 1], point]);
+        return res;
+      }, []);
+      return Math.min(...lines.map((l) => pointLineDistance(...l, pos)));
+    }
+    return Math.min(...points.map((p) => Point.getDistance(p, pos)));
+  }
+  FoldLine2.getFoldLineToPointDistance = getFoldLineToPointDistance;
+})(FoldLine || (FoldLine = {}));
+
+// src/utils/bezier.ts
+import { Rectangle as Rectangle2 } from "@flowgram.ai/utils";
+var BezierControlType = /* @__PURE__ */ ((BezierControlType2) => {
+  BezierControlType2[BezierControlType2["RIGHT_TOP"] = 0] = "RIGHT_TOP";
+  BezierControlType2[BezierControlType2["RIGHT_BOTTOM"] = 1] = "RIGHT_BOTTOM";
+  BezierControlType2[BezierControlType2["LEFT_TOP"] = 2] = "LEFT_TOP";
+  BezierControlType2[BezierControlType2["LEFT_BOTTOM"] = 3] = "LEFT_BOTTOM";
+  return BezierControlType2;
+})(BezierControlType || {});
+var CONTROL_MAX = 300;
+function getBezierHorizontalControlPoints(fromPos, toPos) {
+  const rect = Rectangle2.createRectangleWithTwoPoints(fromPos, toPos);
+  let type;
+  if (fromPos.x <= toPos.x) {
+    type = fromPos.y <= toPos.y ? 1 /* RIGHT_BOTTOM */ : 0 /* RIGHT_TOP */;
+  } else {
+    type = fromPos.y <= toPos.y ? 3 /* LEFT_BOTTOM */ : 2 /* LEFT_TOP */;
+  }
+  let controls;
+  switch (type) {
+    case 0 /* RIGHT_TOP */:
+      controls = [
+        {
+          x: rect.rightBottom.x - rect.width / 2,
+          y: rect.rightBottom.y
+        },
+        {
+          x: rect.leftTop.x + rect.width / 2,
+          y: rect.leftTop.y
+        }
+      ];
+      break;
+    case 1 /* RIGHT_BOTTOM */:
+      controls = [
+        {
+          x: rect.rightTop.x - rect.width / 2,
+          y: rect.rightTop.y
+        },
+        {
+          x: rect.leftBottom.x + rect.width / 2,
+          y: rect.leftBottom.y
+        }
+      ];
+      break;
+    case 2 /* LEFT_TOP */:
+      controls = [
+        {
+          x: rect.rightBottom.x + Math.min(rect.width, CONTROL_MAX),
+          y: rect.rightBottom.y
+        },
+        {
+          x: rect.leftTop.x - Math.min(rect.width, CONTROL_MAX),
+          y: rect.leftTop.y
+        }
+      ];
+      break;
+    case 3 /* LEFT_BOTTOM */:
+      controls = [
+        {
+          x: rect.rightTop.x + Math.min(rect.width, CONTROL_MAX),
+          y: rect.rightTop.y
+        },
+        {
+          x: rect.leftBottom.x - Math.min(rect.width, CONTROL_MAX),
+          y: rect.leftBottom.y
+        }
+      ];
+  }
+  return controls;
+}
+function getBezierVerticalControlPoints(fromPos, toPos) {
+  const rect = Rectangle2.createRectangleWithTwoPoints(fromPos, toPos);
+  let type;
+  if (fromPos.y <= toPos.y) {
+    type = fromPos.x <= toPos.x ? 1 /* RIGHT_BOTTOM */ : 3 /* LEFT_BOTTOM */;
+  } else {
+    type = fromPos.x <= toPos.x ? 0 /* RIGHT_TOP */ : 2 /* LEFT_TOP */;
+  }
+  let controls;
+  switch (type) {
+    case 1 /* RIGHT_BOTTOM */:
+      controls = [
+        {
+          x: rect.leftTop.x,
+          y: rect.leftTop.y + rect.height / 2
+        },
+        {
+          x: rect.rightBottom.x,
+          y: rect.rightBottom.y - rect.height / 2
+        }
+      ];
+      break;
+    case 3 /* LEFT_BOTTOM */:
+      controls = [
+        {
+          x: rect.rightTop.x,
+          y: rect.rightTop.y + rect.height / 2
+        },
+        {
+          x: rect.leftBottom.x,
+          y: rect.leftBottom.y - rect.height / 2
+        }
+      ];
+      break;
+    case 0 /* RIGHT_TOP */:
+      controls = [
+        {
+          x: rect.leftBottom.x,
+          y: rect.leftBottom.y + Math.min(rect.height, CONTROL_MAX)
+        },
+        {
+          x: rect.rightTop.x,
+          y: rect.rightTop.y - Math.min(rect.height, CONTROL_MAX)
+        }
+      ];
+      break;
+    case 2 /* LEFT_TOP */:
+      controls = [
+        {
+          x: rect.rightBottom.x,
+          y: rect.rightBottom.y + Math.min(rect.height, CONTROL_MAX)
+        },
+        {
+          x: rect.leftTop.x,
+          y: rect.leftTop.y - Math.min(rect.height, CONTROL_MAX)
+        }
+      ];
+      break;
+  }
+  return controls;
+}
+
+// src/utils/nanoid.ts
+import { nanoid as nanoidOrigin } from "nanoid";
+function nanoid(n) {
+  return nanoidOrigin(n);
+}
+
+// src/utils/compose.ts
+import { compose, composeAsync } from "@flowgram.ai/utils";
+
+// src/utils/fit-view.ts
+import { TransformData } from "@flowgram.ai/core";
+import { Rectangle as Rectangle3 } from "@flowgram.ai/utils";
+var fitView = (doc, playgroundConfig, easing = true) => {
+  const bounds = Rectangle3.enlarge(
+    doc.getAllNodes().map((node) => node.getData(TransformData).bounds)
+  );
+  return playgroundConfig.fitView(bounds, easing, 30);
+};
+
+// src/utils/get-anti-overlap-position.ts
+import { TransformData as TransformData2 } from "@flowgram.ai/core";
+function getAntiOverlapPosition(doc, position, containerNode) {
+  let { x, y } = position;
+  const nodes = containerNode ? containerNode.collapsedChildren : doc.getAllNodes();
+  const positions = nodes.map((n) => {
+    const transform = n.getData(TransformData2);
+    return { x: transform.position.x, y: transform.position.y };
+  }).sort((a, b) => a.y - b.y);
+  const minDistance = 3;
+  for (const pos of positions) {
+    const { x: posX, y: posY } = pos;
+    if (y - posY < -minDistance) {
+      break;
+    }
+    const deltaX = Math.abs(x - posX);
+    const deltaY = Math.abs(y - posY);
+    if (deltaX <= minDistance && deltaY <= minDistance) {
+      x += 30;
+      y += 30;
+    }
+  }
+  return { x, y };
+}
+
+// src/utils/statics.ts
+import { Rectangle as Rectangle4 } from "@flowgram.ai/utils";
+var getPortEntityId = (node, portType, portID = "") => `port_${portType}_${node.id}_${portID}`;
+var WORKFLOW_LINE_ENTITY = "WorkflowLineEntity";
+function domReactToBounds(react) {
+  return new Rectangle4(react.x, react.y, react.width, react.height);
+}
+
+// src/entities/workflow-node-entity.ts
+import { FlowNodeEntity } from "@flowgram.ai/document";
+var WorkflowNodeEntity = FlowNodeEntity;
+
+// src/entities/workflow-line-entity.ts
+import { isEqual as isEqual2 } from "lodash-es";
+import { Bezier } from "bezier-js";
+import { domUtils, Point as Point2, Rectangle as Rectangle6 } from "@flowgram.ai/utils";
+import { Entity as Entity2 } from "@flowgram.ai/core";
+
+// src/entity-datas/workflow-node-ports-data.ts
+import { isEqual } from "lodash-es";
+import { FlowNodeRenderData } from "@flowgram.ai/document";
+import { EntityData, SizeData } from "@flowgram.ai/core";
+
+// src/entities/workflow-port-entity.ts
+import { Rectangle as Rectangle5, Emitter } from "@flowgram.ai/utils";
+import {
+  Entity,
+  PlaygroundConfigEntity,
+  TransformData as TransformData3
+} from "@flowgram.ai/core";
+var PORT_SIZE = 24;
+var WorkflowPortEntity = class extends Entity {
+  // relativePosition
+  constructor(opts) {
+    super(opts);
+    this.portID = "";
+    this._disabled = false;
+    this._hasError = false;
+    this._onErrorChangedEmitter = new Emitter();
+    this.onErrorChanged = this._onErrorChangedEmitter.event;
+    this.portID = opts.portID || "";
+    this.portType = opts.type;
+    this._disabled = opts.disabled ?? false;
+    this.node = opts.node;
+    this.updateTargetElement(opts.targetElement);
+    this.toDispose.push(this.node.getData(TransformData3).onDataChange(() => this.fireChange()));
+    this.toDispose.push(this.node.onDispose(this.dispose.bind(this)));
+  }
+  static getPortEntityId(node, portType, portID = "") {
+    return getPortEntityId(node, portType, portID);
+  }
+  // 获取连线是否为错误态
+  get hasError() {
+    return this._hasError;
+  }
+  // 设置连线的错误态，外部应使用 validate 进行更新
+  set hasError(hasError) {
+    this._hasError = hasError;
+    this._onErrorChangedEmitter.fire();
+  }
+  validate() {
+    const anyLineHasError = this.allLines.some((line) => {
+      if (line.disposed || line.isHidden) {
+        return false;
+      }
+      line.validateSelf();
+      return line.hasError;
+    });
+    const isPortHasError = this.node.document.isErrorPort(this);
+    this.hasError = anyLineHasError || isPortHasError;
+  }
+  isErrorPort() {
+    return this.node.document.isErrorPort(this);
+  }
+  get point() {
+    const { targetElement } = this;
+    const { bounds } = this.node.getData(TransformData3);
+    if (targetElement) {
+      const pos = domReactToBounds(targetElement.getBoundingClientRect()).center;
+      return this.entityManager.getEntity(PlaygroundConfigEntity).getPosFromMouseEvent({
+        clientX: pos.x,
+        clientY: pos.y
+      });
+    }
+    if (this.portType === "input") {
+      return bounds.leftCenter;
+    }
+    return bounds.rightCenter;
+  }
+  /**
+   * 点的区域
+   */
+  get bounds() {
+    const { point } = this;
+    const halfSize = PORT_SIZE / 2;
+    return new Rectangle5(point.x - halfSize, point.y - halfSize, PORT_SIZE, PORT_SIZE);
+  }
+  isHovered(x, y) {
+    return this.bounds.contains(x, y);
+  }
+  /**
+   * 相对节点左上角的位置
+   */
+  get relativePosition() {
+    const { point } = this;
+    const { bounds } = this.node.getData(TransformData3);
+    return {
+      x: point.x - bounds.x,
+      y: point.y - bounds.y
+    };
+  }
+  updateTargetElement(el) {
+    if (el !== this.targetElement) {
+      this.targetElement = el;
+      this.fireChange();
+    }
+  }
+  /**
+   * 是否被禁用
+   */
+  get disabled() {
+    const document2 = this.node.document;
+    if (typeof document2.options.isDisabledPort === "function") {
+      return document2.options.isDisabledPort(this);
+    }
+    if (this._disabled) {
+      return true;
+    }
+    const meta = this.node.getNodeMeta();
+    if (this.portType === "input") {
+      return !!meta.inputDisable;
+    }
+    return !!meta.outputDisable;
+  }
+  /**
+   * 当前点位上连接的线条
+   */
+  get lines() {
+    return this.allLines.filter((line) => !line.isDrawing);
+  }
+  /**
+   * 当前点位上连接的线条（包含 isDrawing === true 的线条）
+   */
+  get allLines() {
+    const lines = [];
+    const allLines = this.entityManager.getEntities({
+      type: WORKFLOW_LINE_ENTITY
+    });
+    allLines.forEach((line) => {
+      if (line.toPort === this || line.fromPort === this) {
+        lines.push(line);
+      }
+    });
+    return lines;
+  }
+  dispose() {
+    this.lines.forEach((l) => l.dispose());
+    super.dispose();
+  }
+};
+WorkflowPortEntity.type = "WorkflowPortEntity";
+
+// src/entity-datas/workflow-node-ports-data.ts
+var WorkflowNodePortsData = class extends EntityData {
+  constructor(entity) {
+    super(entity);
+    /** 静态的 ports 数据 */
+    this._staticPorts = [];
+    /** 存储 port 实体的 id，用于判断 port 是否存在 */
+    this._portIDSet = /* @__PURE__ */ new Set();
+    this.entity = entity;
+    const meta = entity.getNodeMeta();
+    const defaultPorts = meta.useDynamicPort ? [] : [{ type: "input" }, { type: "output" }];
+    this._staticPorts = meta.defaultPorts?.slice() || defaultPorts;
+    this.updatePorts(this._staticPorts);
+    if (meta.useDynamicPort) {
+      this.toDispose.push(
+        // 只需要监听节点的大小，因为算的是相对位置
+        entity.getData(SizeData).onDataChange(() => {
+          if (entity.getData(SizeData).width && entity.getData(SizeData).height) {
+            this.updateDynamicPorts();
+          }
+        })
+      );
+    }
+    this.onDispose(() => {
+      this.allPorts.forEach((port) => port.dispose());
+    });
+  }
+  getDefaultData() {
+    return {};
+  }
+  /**
+   * 更新静态的 ports 数据
+   */
+  updateStaticPorts(ports) {
+    const meta = this.entity.getNodeMeta();
+    this._staticPorts = ports;
+    if (meta.useDynamicPort) {
+      this.updateDynamicPorts();
+    } else {
+      this.updatePorts(this._staticPorts);
+    }
+  }
+  /**
+   * 动态计算点位，通过 dom 的 data-port-key
+   */
+  updateDynamicPorts() {
+    const domNode = this.entity.getData(FlowNodeRenderData).node;
+    const elements = domNode.querySelectorAll("[data-port-id]");
+    const staticPorts = this._staticPorts;
+    const dynamicPorts = [];
+    if (elements.length > 0) {
+      dynamicPorts.push(
+        ...Array.from(elements).map((element) => ({
+          portID: element.getAttribute("data-port-id"),
+          type: element.getAttribute("data-port-type"),
+          targetElement: element
+        }))
+      );
+    }
+    this.updatePorts(staticPorts.concat(dynamicPorts));
+  }
+  /**
+   * 根据 key 获取 port 实体
+   */
+  getPortEntityByKey(portType, portKey) {
+    const entity = this.getOrCreatePortEntity({
+      type: portType,
+      portID: portKey
+    });
+    return entity;
+  }
+  /**
+   * 更新 ports 数据
+   */
+  updatePorts(ports) {
+    if (!isEqual(this._prePorts, ports)) {
+      const portKeys = ports.map((port) => this.getPortId(port.type, port.portID));
+      this._portIDSet.forEach((portId) => {
+        if (!portKeys.includes(portId)) {
+          this.getPortEntity(portId)?.dispose();
+        }
+      });
+      ports.forEach((port) => this.updatePortEntity(port));
+      this._prePorts = ports;
+      this.fireChange();
+    }
+    this.allPorts.forEach((port) => {
+      port.allLines.forEach((line) => {
+        line.validate();
+      });
+      port.validate();
+    });
+  }
+  /**
+   * 获取所有 port entities
+   */
+  get allPorts() {
+    return Array.from(this._portIDSet).map((portId) => this.getPortEntity(portId)).filter(Boolean);
+  }
+  /**
+   * 获取输入点位
+   */
+  get inputPorts() {
+    return this.allPorts.filter((port) => port.portType === "input");
+  }
+  /**
+   * 获取输出点位
+   */
+  get outputPorts() {
+    return this.allPorts.filter((port) => port.portType === "output");
+  }
+  /**
+   * 获取输入点位置
+   */
+  get inputPoints() {
+    return this.inputPorts.map((port) => port.point);
+  }
+  /**
+   * 获取输出点位置
+   */
+  get outputPoints() {
+    return this.inputPorts.map((port) => port.point);
+  }
+  /**
+   * 根据 key 获取 输入点位置
+   */
+  getInputPoint(key) {
+    return this.getPortEntityByKey("input", key).point;
+  }
+  /**
+   * 根据 key 获取输出点位置
+   */
+  getOutputPoint(key) {
+    return this.getPortEntityByKey("output", key).point;
+  }
+  /**
+   * 获取 port 实体
+   */
+  getPortEntity(portId) {
+    if (!this._portIDSet.has(portId)) {
+      return void 0;
+    }
+    return this.entity.entityManager.getEntityById(portId);
+  }
+  /**
+   * 拼接 port 实体的 id
+   */
+  getPortId(portType, portKey = "") {
+    return getPortEntityId(this.entity, portType, portKey);
+  }
+  /**
+   * 创建 port 实体
+   */
+  createPortEntity(portInfo) {
+    const id = this.getPortId(portInfo.type, portInfo.portID);
+    let portEntity = this.entity.entityManager.getEntityById(id);
+    if (!portEntity) {
+      portEntity = this.entity.entityManager.createEntity(WorkflowPortEntity, {
+        id,
+        node: this.entity,
+        ...portInfo
+      });
+    }
+    portEntity.onDispose(() => {
+      this._portIDSet.delete(id);
+    });
+    this._portIDSet.add(id);
+    return portEntity;
+  }
+  /**
+   * 获取或创建 port 实体
+   */
+  getOrCreatePortEntity(portInfo) {
+    const id = this.getPortId(portInfo.type, portInfo.portID);
+    return this.getPortEntity(id) ?? this.createPortEntity(portInfo);
+  }
+  /**
+   * 更新 port 实体
+   */
+  updatePortEntity(portInfo) {
+    const portEntity = this.getOrCreatePortEntity(portInfo);
+    if (portInfo.targetElement) {
+      portEntity.updateTargetElement(portInfo.targetElement);
+    }
+    return portEntity;
+  }
+};
+WorkflowNodePortsData.type = "WorkflowNodePortsData";
+
+// src/entities/workflow-line-entity.ts
+var LINE_HOVER_DISTANCE = 8;
+var POINT_RADIUS = 10;
+var _WorkflowLineEntity = class _WorkflowLineEntity extends Entity2 {
+  constructor(opts) {
+    super(opts);
+    this._processing = false;
+    this._hasError = false;
+    /**
+     * 线条数据
+     */
+    this.info = {
+      from: ""
+    };
+    /**
+     * 贝塞尔线条版本
+     */
+    this._bezierVersion = "";
+    this.document = opts.document;
+    this.linesManager = opts.linesManager;
+    this.initInfo({
+      from: opts.from,
+      to: opts.to,
+      drawingTo: opts.drawingTo,
+      fromPort: opts.fromPort,
+      toPort: opts.toPort
+    });
+    if (opts.drawingTo) {
+      this.isDrawing = true;
+    }
+  }
+  /**
+   * 转成线条 id
+   * @param info
+   */
+  static portInfoToLineId(info) {
+    const { from, to, fromPort, toPort } = info;
+    return `${from}_${fromPort || ""}-${to || ""}_${toPort || ""}`;
+  }
+  /**
+   * 获取线条的前置节点
+   */
+  get from() {
+    return this._from;
+  }
+  /**
+   * 获取线条的后置节点
+   */
+  get to() {
+    return this._to;
+  }
+  get isHidden() {
+    return this.highlightColor === this.linesManager.lineColor.hidden;
+  }
+  get inContainer() {
+    const nodeInContainer = (node) => !!node?.parent && node.parent.flowNodeType !== "root";
+    return nodeInContainer(this.from) || nodeInContainer(this.to);
+  }
+  /**
+   * 获取是否 testrun processing
+   */
+  get processing() {
+    return this._processing;
+  }
+  /**
+   * 设置 testrun processing 状态
+   */
+  set processing(status) {
+    if (this._processing !== status) {
+      this._processing = status;
+      this.fireChange();
+    }
+  }
+  // 获取连线是否为错误态
+  get hasError() {
+    return this._hasError;
+  }
+  // 设置连线的错误态
+  set hasError(hasError) {
+    if (this._hasError !== hasError) {
+      this._hasError = hasError;
+      this.fireChange();
+    }
+    if (this._node) {
+      this._node.dataset.hasError = this.hasError ? "true" : "false";
+    }
+  }
+  /**
+   * 设置线条的后置节点
+   */
+  setToPort(toPort) {
+    if (!this.isDrawing) {
+      throw new Error("[setToPort] only support drawing line.");
+    }
+    if (this.toPort === toPort) {
+      return;
+    }
+    if (toPort && toPort.portType === "input" && this.linesManager.canAddLine(this.fromPort, toPort, true)) {
+      const { node, portID } = toPort;
+      this._to = node;
+      this.info.drawingTo = void 0;
+      this.info.isDefaultLine = false;
+      this.info.to = node.id;
+      this.info.toPort = portID;
+    } else {
+      this._to = void 0;
+      this.info.to = void 0;
+      this.info.toPort = "";
+    }
+    this.fireChange();
+  }
+  /**
+   * 设置线条画线时的目标位置
+   */
+  set drawingTo(pos) {
+    const oldDrawingTo = this.info.drawingTo;
+    if (!pos) {
+      this.info.drawingTo = void 0;
+      this.fireChange();
+      return;
+    }
+    if (!oldDrawingTo || pos.x !== oldDrawingTo.x || pos.y !== oldDrawingTo.y) {
+      this.info.to = void 0;
+      this.info.isDefaultLine = false;
+      this.info.drawingTo = pos;
+      this.fireChange();
+    }
+  }
+  /**
+   * 获取线条正在画线的位置
+   */
+  get drawingTo() {
+    return this.info.drawingTo;
+  }
+  get highlightColor() {
+    return this.info.highlightColor || "";
+  }
+  set highlightColor(color) {
+    if (this.info.highlightColor !== color) {
+      this.info.highlightColor = color;
+      this.fireChange();
+    }
+  }
+  /**
+   * 创建贝塞尔线条
+   * @param fromPos 前置节点位置
+   * @param toPos 后置节点位置
+   * @returns 贝塞尔线条数据
+   */
+  createBezier(fromPos, toPos) {
+    const controls = this.vertical ? getBezierVerticalControlPoints(fromPos, toPos) : getBezierHorizontalControlPoints(fromPos, toPos);
+    const bezier = new Bezier([fromPos, ...controls, toPos]);
+    const bbox = bezier.bbox();
+    const bboxBounds = new Rectangle6(
+      bbox.x.min,
+      bbox.y.min,
+      bbox.x.max - bbox.x.min,
+      bbox.y.max - bbox.y.min
+    );
+    const foldPoints = FoldLine.getPoints({
+      source: {
+        x: fromPos.x + POINT_RADIUS,
+        y: fromPos.y
+      },
+      target: {
+        x: toPos.x - POINT_RADIUS,
+        y: toPos.y
+      }
+    });
+    const foldPath = FoldLine.getSmoothStepPath(foldPoints);
+    this._bezier = {
+      fromPos,
+      toPos,
+      bezier,
+      bbox: bboxBounds,
+      controls,
+      foldPath,
+      foldPoints,
+      foldBounds: FoldLine.getBounds(foldPoints)
+    };
+    return this._bezier;
+  }
+  /**
+   * 获取线条的边框位置大小
+   */
+  get bounds() {
+    return this.bezier.bbox;
+  }
+  /**
+   * 获取点和线最接近的距离
+   */
+  getHoverDist(pos, lineType = 0 /* BEZIER */) {
+    if (lineType === 0 /* BEZIER */) {
+      return Point2.getDistance(pos, this.bezier.bezier.project(pos));
+    }
+    return FoldLine.getFoldLineToPointDistance(this.bezier.foldPoints, pos);
+  }
+  get fromPort() {
+    return this.from.getData(WorkflowNodePortsData).getPortEntityByKey("output", this.info.fromPort);
+  }
+  get toPort() {
+    if (!this.to) {
+      return void 0;
+    }
+    return this.to.getData(WorkflowNodePortsData).getPortEntityByKey("input", this.info.toPort);
+  }
+  /**
+   * 获取线条真实的输入输出节点坐标
+   */
+  get position() {
+    const { bezier } = this;
+    return {
+      from: bezier.fromPos,
+      to: bezier.toPos
+    };
+  }
+  /**
+   * 获取贝塞尔数据
+   * 根据两边节点的位置信息创建贝塞尔曲线
+   */
+  get bezier() {
+    if (!this._bezier) {
+      this.refreshBezier();
+    }
+    return this._bezier;
+  }
+  refreshBezier() {
+    const fromPos = this.from.getData(WorkflowNodePortsData).getOutputPoint(this.info.fromPort);
+    const toPos = this.info.drawingTo || this.to.getData(WorkflowNodePortsData).getInputPoint(this.info.toPort);
+    const bezierVersion = [fromPos.x, fromPos.y, toPos.x, toPos.y].join("-");
+    if (this._bezier && this._bezierVersion === bezierVersion) {
+      return;
+    }
+    this._bezierVersion = bezierVersion;
+    this._bezier = this.createBezier(fromPos, toPos);
+  }
+  /**
+   * 可以用于判断线条点位信息是否变化
+   */
+  get bezierDataVersion() {
+    return this._bezierVersion;
+  }
+  /** 是否反转箭头 */
+  get reverse() {
+    return this.linesManager.isReverseLine(this);
+  }
+  /** 是否隐藏箭头 */
+  get hideArrow() {
+    return this.linesManager.isHideArrowLine(this);
+  }
+  /** 是否流动 */
+  get flowing() {
+    return this.linesManager.isFlowingLine(this);
+  }
+  /** 是否禁用 */
+  get disabled() {
+    return this.linesManager.isDisabledLine(this);
+  }
+  /** 是否竖向 */
+  get vertical() {
+    return this.linesManager.isVerticalLine(this);
+  }
+  get color() {
+    return this.linesManager.getLineColor(this);
+  }
+  // get defaultToPos(): IPoint {
+  //   const fromPos = this.from.getData(TransformComponent)!.toBounds.center;
+  //
+  //   return {
+  //     x: fromPos.x + DEFAULT_LINE_LENGTH,
+  //     y: fromPos.y,
+  //   };
+  // }
+  /**
+   * 初始化线条
+   * @param info 线条信息
+   */
+  initInfo(info) {
+    if (!isEqual2(info, this.info)) {
+      this.info = info;
+      this._from = this.document.getNode(info.from);
+      this._to = info.to ? this.document.getNode(info.to) : void 0;
+      this.fireChange();
+    }
+  }
+  // 校验连线是否为错误态
+  validate() {
+    const { fromPort, toPort } = this;
+    this.validateSelf();
+    fromPort?.validate();
+    toPort?.validate();
+  }
+  validateSelf() {
+    const { fromPort, toPort } = this;
+    if (fromPort) {
+      this.hasError = this.linesManager.isErrorLine(fromPort, toPort);
+    }
+  }
+  is(line) {
+    if (line instanceof _WorkflowLineEntity) {
+      return this === line;
+    }
+    return _WorkflowLineEntity.portInfoToLineId(line) === this.id;
+  }
+  /**
+   * 框选 贝塞尔曲线
+   * TODO 这个方法可能有性能问题，后续看看有没有更好的方式
+   * @param rect
+   */
+  intersectsRectangle(rect) {
+    const dots = this.bezier.bezier.getLUT(50);
+    return dots.some((dot) => rect.contains(dot.x, dot.y));
+  }
+  canRemove(newLineInfo) {
+    return this.linesManager.canRemove(this, newLineInfo);
+  }
+  get node() {
+    if (this._node) return this._node;
+    this._node = domUtils.createDivWithClass("gedit-flow-activity-line");
+    this._node.dataset.testid = "sdk.workflow.canvas.line";
+    this._node.dataset.lineId = this.id;
+    this._node.dataset.fromNodeId = this.from.id;
+    this._node.dataset.fromPortId = this.fromPort?.id ?? "";
+    this._node.dataset.toNodeId = this.to?.id ?? "";
+    this._node.dataset.toPortId = this.toPort?.id ?? "";
+    this._node.dataset.hasError = this.hasError ? "true" : "false";
+    return this._node;
+  }
+  toJSON() {
+    const json = {
+      sourceNodeID: this.info.from,
+      targetNodeID: this.info.to,
+      sourcePortID: this.info.fromPort,
+      targetPortID: this.info.toPort
+    };
+    if (!json.sourcePortID) {
+      delete json.sourcePortID;
+    }
+    if (!json.targetPortID) {
+      delete json.targetPortID;
+    }
+    return json;
+  }
+  /** 触发线条渲染 */
+  fireRender() {
+    this.fireChange();
+  }
+};
+_WorkflowLineEntity.type = WORKFLOW_LINE_ENTITY;
+var WorkflowLineEntity = _WorkflowLineEntity;
+
+// src/service/workflow-select-service.ts
+var WorkflowSelectService = class {
+  get onSelectionChanged() {
+    return this.selectionService.onSelectionChanged;
+  }
+  get selection() {
+    return this.selectionService.selection;
+  }
+  set selection(entities) {
+    this.selectionService.selection = entities;
+  }
+  /**
+   * 当前激活的节点只能有一个
+   */
+  get activatedNode() {
+    const { selectedNodes } = this;
+    if (selectedNodes.length !== 1) {
+      return void 0;
+    }
+    return selectedNodes[0];
+  }
+  isSelected(id) {
+    return this.selectionService.selection.some((s) => s.id === id);
+  }
+  isActivated(id) {
+    return this.activatedNode?.id === id;
+  }
+  /**
+   * 选中的节点
+   */
+  get selectedNodes() {
+    return this.selectionService.selection.filter(
+      (n) => n instanceof WorkflowNodeEntity
+    );
+  }
+  /**
+   * 选中
+   * @param node
+   */
+  selectNode(node) {
+    this.selectionService.selection = [node];
+  }
+  toggleSelect(node) {
+    if (this.selectionService.selection.includes(node)) {
+      this.selectionService.selection = this.selectionService.selection.filter((n) => n !== node);
+    } else {
+      this.selectionService.selection = this.selectionService.selection.concat(node);
+    }
+  }
+  select(node) {
+    this.selectionService.selection = [node];
+  }
+  clear() {
+    this.selectionService.selection = [];
+  }
+  /**
+   *  选中并滚动到节点
+   * @param node
+   */
+  async selectNodeAndScrollToView(node, fitView2) {
+    this.selectNodeAndFocus(node);
+    const DELAY_TIME = 30;
+    await delay(DELAY_TIME);
+    const scrollConfig = {
+      entities: [node]
+    };
+    if (fitView2) {
+      const bounds = Rectangle7.enlarge([node.getData(TransformData4).bounds]).pad(
+        30,
+        30
+      );
+      const viewport = this.playground.config.getViewport(false);
+      const zoom = SizeSchema.fixSize(bounds, viewport);
+      scrollConfig.zoom = zoom;
+      scrollConfig.scrollToCenter = true;
+      scrollConfig.easing = true;
+    }
+    return this.playground.config.scrollToView(scrollConfig);
+  }
+  selectNodeAndFocus(node) {
+    this.select(node);
+    this.playground.node.focus();
+  }
+};
+__decorateClass([
+  inject(SelectionService)
+], WorkflowSelectService.prototype, "selectionService", 2);
+__decorateClass([
+  inject(Playground)
+], WorkflowSelectService.prototype, "playground", 2);
+WorkflowSelectService = __decorateClass([
+  injectable()
+], WorkflowSelectService);
+
+// src/service/workflow-hover-service.ts
+import { inject as inject2, injectable as injectable2 } from "inversify";
+import { EntityManager } from "@flowgram.ai/core";
+import { Emitter as Emitter2 } from "@flowgram.ai/utils";
+var WorkflowHoverService = class {
+  constructor() {
+    this.onHoveredChangeEmitter = new Emitter2();
+    this.onHoveredChange = this.onHoveredChangeEmitter.event;
+    // 当前鼠标 hover 位置
+    this.hoveredPos = { x: 0, y: 0 };
+    /**
+     * 当前 hovered 的 节点或者线条或者点
+     * 1: nodeId / lineId  （节点 / 线条）
+     * 2: nodeId:portKey  （节点连接点）
+     */
+    this.hoveredKey = "";
+  }
+  /**
+   * 更新 hover 的内容
+   * @param hoveredKey hovered key
+   */
+  updateHoveredKey(hoveredKey) {
+    if (this.hoveredKey !== hoveredKey) {
+      this.hoveredKey = hoveredKey;
+      this.onHoveredChangeEmitter.fire(hoveredKey);
+    }
+  }
+  /**
+   * 清空 hover 内容
+   */
+  clearHovered() {
+    this.updateHoveredKey("");
+  }
+  /**
+   *  判断是否 hover
+   * @param nodeId hoveredKey
+   * @returns 是否 hover
+   */
+  isHovered(nodeId) {
+    return nodeId === this.hoveredKey;
+  }
+  isSomeHovered() {
+    return !!this.hoveredKey;
+  }
+  /**
+   * 获取被 hover 的节点或线条
+   */
+  get hoveredNode() {
+    return this.entityManager.getEntityById(this.hoveredKey);
+  }
+};
+__decorateClass([
+  inject2(EntityManager)
+], WorkflowHoverService.prototype, "entityManager", 2);
+WorkflowHoverService = __decorateClass([
+  injectable2()
+], WorkflowHoverService);
+
+// src/service/workflow-drag-service.ts
+import { nanoid as nanoid3 } from "nanoid";
+import { inject as inject6, injectable as injectable6, postConstruct as postConstruct2 } from "inversify";
+import {
+  domUtils as domUtils2,
+  PromiseDeferred,
+  Emitter as Emitter5,
+  DisposableCollection as DisposableCollection2,
+  Rectangle as Rectangle9,
+  delay as delay2
+} from "@flowgram.ai/utils";
+import {
+  FlowNodeTransformData as FlowNodeTransformData5,
+  FlowOperationBaseService
+} from "@flowgram.ai/document";
+import { FlowNodeBaseType as FlowNodeBaseType2 } from "@flowgram.ai/document";
+import {
+  CommandService,
+  PlaygroundConfigEntity as PlaygroundConfigEntity5,
+  PlaygroundDrag,
+  TransformData as TransformData9
+} from "@flowgram.ai/core";
+
+// src/workflow-lines-manager.ts
+import { last } from "lodash-es";
+import { inject as inject3, injectable as injectable3 } from "inversify";
+import { Disposable as Disposable2, DisposableCollection, Emitter as Emitter3 } from "@flowgram.ai/utils";
+import { FlowNodeTransformData as FlowNodeTransformData2 } from "@flowgram.ai/document";
+import { EntityManager as EntityManager2, PlaygroundConfigEntity as PlaygroundConfigEntity2, TransformData as TransformData6 } from "@flowgram.ai/core";
+
+// src/workflow-document-option.ts
+import { FlowNodeErrorData } from "@flowgram.ai/form-core";
+import { FlowNodeTransformData } from "@flowgram.ai/document";
+import { TransformData as TransformData5 } from "@flowgram.ai/core";
+
+// src/utils/flow-node-form-data.ts
+import { FlowNodeFormData } from "@flowgram.ai/form-core";
+function getFlowNodeFormData(node) {
+  return node.getData(FlowNodeFormData);
+}
+function toFormJSON(node) {
+  const formData = node.getData(FlowNodeFormData);
+  if (!formData || !node.getNodeRegistry().formMeta) return void 0;
+  return formData.toJSON();
+}
+
+// src/workflow-document-option.ts
+var WorkflowDocumentOptions = Symbol("WorkflowDocumentOptions");
+var WorkflowDocumentOptionsDefault = {
+  cursors: {
+    grab: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMCAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMC40ODczIDIuNjIzNzhDOS45MDczMSAyLjYyMzc4IDkuNDM3MTMgMy4wOTM5NiA5LjQzNzEzIDMuNjczOTZWNS4xNDM3NkM5LjM5NDI4IDQuNDAyNzQgOC43Nzk3OCAzLjgxNTA0IDguMDI4MDIgMy44MTUwNEM3LjI0ODQ4IDMuODE1MDQgNi42MTY1MyA0LjQ0Njk5IDYuNjE2NTMgNS4yMjY1M1YxMS44Mjg5TDUuNjc0MTggMTEuMDA0OUM1LjE1NDg3IDEwLjU1MDkgNC40MDk1IDEwLjQ2MzYgMy43OTkzOCAxMC43ODU1TDMuNjk2OTQgMTAuODM5NkMzLjA2MjE3IDExLjE3NDUgMi45MjI2IDEyLjAyMjggMy40MTY2MiAxMi41NDM0TDcuMzM5NTkgMTYuNjc3NVYxNy4zMjU5QzcuMzM5NTkgMTcuNzg2MiA3LjcxMjY5IDE4LjE1OTMgOC4xNzI5MiAxOC4xNTkzSDEzLjgwODRDMTQuMjY4NyAxOC4xNTkzIDE0LjY0MTcgMTcuNzg2MiAxNC42NDE3IDE3LjMyNTlWMTYuNzkzNUMxNS44MDk0IDE1LjY0ODUgMTYuNDY3MyAxNC4wODE5IDE2LjQ2NzMgMTIuNDQ2NVYxMS40OTY3TDE2LjQ2NzEgNi42MzY4NUMxNi40NjcxIDUuOTU2MyAxNS45MTU0IDUuNDA0NjEgMTUuMjM0OCA1LjQwNDYxQzE0LjU1NDMgNS40MDQ2MSAxNC4wMDI2IDUuOTU2MyAxNC4wMDI2IDYuNjM2ODVMMTQuMDAyMSA1LjA0NzI4QzE0LjAwMjEgNC4zNjY3MyAxMy40NTA0IDMuODE1MDQgMTIuNzY5OCAzLjgxNTA0QzEyLjA4OTMgMy44MTUwNCAxMS41Mzc2IDQuMzY2NzMgMTEuNTM3NiA1LjA0NzI4TDExLjUzNzUgMy42NzM5NUMxMS41Mzc1IDMuMDkzOTYgMTEuMDY3MyAyLjYyMzc4IDEwLjQ4NzMgMi42MjM3OFoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTAuNDg3NCAxLjM3NDAyQzExLjM2MTIgMS4zNzQwMiAxMi4xMjExIDEuODYxMTggMTIuNTEwNSAyLjU3ODY4QzEyLjU5NTggMi41Njk4MyAxMi42ODIzIDIuNTY1MjggMTIuNzcgMi41NjUyOEMxMy44Mjc4IDIuNTY1MjggMTQuNzMxMSAzLjIyNzAxIDE1LjA4ODUgNC4xNTkxMUMxNS4xMzcgNC4xNTYyOSAxNS4xODU4IDQuMTU0ODYgMTUuMjM1IDQuMTU0ODZDMTYuNjA1OSA0LjE1NDg2IDE3LjcxNzIgNS4yNjYxOSAxNy43MTcyIDYuNjM3MDlMMTcuNzE3NCAxMi40NDY3QzE3LjcxNzQgMTQuMjM1NSAxNy4wNjQ0IDE1Ljk1NTkgMTUuODkxOSAxNy4yOTA0VjE3LjMyNjJDMTUuODkxOSAxOC40NzY4IDE0Ljk1OTEgMTkuNDA5NSAxMy44MDg1IDE5LjQwOTVIOC4xNzMwNkM3LjAyMjQ3IDE5LjQwOTUgNi4wODk3MyAxOC40NzY4IDYuMDg5NzMgMTcuMzI2MlYxNy4xNzY0TDIuNTEwMDMgMTMuNDA0MUMxLjQ0NTk5IDEyLjI4MjggMS43NDY2IDEwLjQ1NTUgMy4xMTM3OSA5LjczNDI0TDMuMjE2MjQgOS42ODAxOUMzLjg5MTY4IDkuMzIzODMgNC42NjE4NSA5LjI1NDAxIDUuMzY2NjYgOS40NTE5OFY1LjIyNjc4QzUuMzY2NjYgMy43NTY4NyA2LjU1ODI2IDIuNTY1MjggOC4wMjgxNiAyLjU2NTI4QzguMTcyOTMgMi41NjUyOCA4LjMxNDk5IDIuNTc2ODQgOC40NTM0NyAyLjU5OTA3QzguODM5NDMgMS44NzA0MiA5LjYwNTQ2IDEuMzc0MDIgMTAuNDg3NCAxLjM3NDAyWk0xMi40NDc2IDMuODU3ODdWOS40NzY0NkMxMi40NDc2IDkuNzI4NTIgMTIuMjQzMyA5LjkzMjg1IDExLjk5MTMgOS45MzI4NUMxMS43MzkyIDkuOTMyODUgMTEuNTM0OSA5LjcyODUyIDExLjUzNDkgOS40NzY0NlYzLjc5NjU1QzExLjUzNDkgMy43Nzk1NiAxMS41MzU4IDMuNzYyNzcgMTEuNTM3NiAzLjc0NjI2VjMuNjc0MkMxMS41Mzc2IDMuNDMyODIgMTEuNDU2MiAzLjIxMDQ2IDExLjMxOTMgMy4wMzMwOUMxMS4xMjcyIDIuNzg0MjggMTAuODI2MSAyLjYyNDAyIDEwLjQ4NzQgMi42MjQwMkMxMC4xMjM4IDIuNjI0MDIgOS44MDMzMiAyLjgwODg2IDkuNjE0ODMgMy4wODk3QzkuNTAyNjkgMy4yNTY3OSA5LjQzNzI2IDMuNDU3ODUgOS40MzcyNiAzLjY3NDJWMy43ODU3M0M5LjQzNzM1IDMuNzg5MzMgOS40MzczOSAzLjc5Mjk0IDkuNDM3MzkgMy43OTY1NVY5LjkwMTdDOS40MzczOSAxMC4xNTM3IDkuMjMzMDYgMTAuMzU4MSA4Ljk4MTAxIDEwLjM1ODFDOC43Mjg5NSAxMC4zNTgxIDguNTI0NjIgMTAuMTUzNyA4LjUyNDYyIDkuOTAxN1YzLjkwNTA3QzguNDE3NzMgMy44NjQ5IDguMzA0NjggMy44MzczMiA4LjE4NzI2IDMuODI0MTVDOC4xMzUwNCAzLjgxODI5IDguMDgxOTUgMy44MTUyOCA4LjAyODE2IDMuODE1MjhDNy4yNDg2MSAzLjgxNTI4IDYuNjE2NjYgNC40NDcyMyA2LjYxNjY2IDUuMjI2NzhWMTEuODI5Mkw1LjY3NDMxIDExLjAwNTJDNS41Nzg2OCAxMC45MjE2IDUuNDc1MzcgMTAuODUwNCA1LjM2NjY2IDEwLjc5MTlDNC44ODUwNiAxMC41MzI5IDQuMjk3MjggMTAuNTIzMSAzLjc5OTUyIDEwLjc4NThMMy42OTcwNyAxMC44Mzk4QzMuMDYyMzEgMTEuMTc0NyAyLjkyMjczIDEyLjAyMzEgMy40MTY3NSAxMi41NDM3TDcuMzM5NzMgMTYuNjc3N1YxNy4zMjYyQzcuMzM5NzMgMTcuNzg2NCA3LjcxMjgyIDE4LjE1OTUgOC4xNzMwNiAxOC4xNTk1SDEzLjgwODVDMTQuMjY4OCAxOC4xNTk1IDE0LjY0MTkgMTcuNzg2NCAxNC42NDE5IDE3LjMyNjJWMTYuNzkzOEMxNS43Mzc5IDE1LjcxOSAxNi4zODQ3IDE0LjI3MjggMTYuNDYgMTIuNzQ3QzE2LjQ2NDEgMTIuNjY0MSAxNi40NjY1IDEyLjU4MDkgMTYuNDY3MiAxMi40OTc1TDE2LjQ2NzQgMTIuNDQ2N0wxNi40NjcyIDYuNjM3MDlDMTYuNDY3MiA1Ljk2MjMgMTUuOTI0OCA1LjQxNDE5IDE1LjI1MjIgNS40MDQ5N0wxNS4yMzUgNS40MDQ4NkMxNS4xMjQ2IDUuNDA0ODYgMTUuMDE3NyA1LjQxOTM2IDE0LjkxNTkgNS40NDY1NlY5LjYwMjI2QzE0LjkxNTkgOS44NTQzMSAxNC43MTE2IDEwLjA1ODYgMTQuNDU5NSAxMC4wNTg2QzE0LjIwNzUgMTAuMDU4NiAxNC4wMDMxIDkuODU0MzEgMTQuMDAzMSA5LjYwMjI2VjYuNjA1MTRDMTQuMDAyOSA2LjYxNTc2IDE0LjAwMjcgNi42MjY0MSAxNC4wMDI3IDYuNjM3MDlWOS4yNzcwNUwxNC4wMDIyIDUuMDQ3NTJDMTQuMDAyMiA0Ljg2OTEzIDEzLjk2NDMgNC42OTk2IDEzLjg5NjEgNC41NDY1M0MxMy43MDY0IDQuMTIwNzIgMTMuMjgyMiAzLjgyMjM1IDEyLjc4NzYgMy44MTU0MUwxMi43NyAzLjgxNTI4QzEyLjY1ODQgMy44MTUyOCAxMi41NTA0IDMuODMwMSAxMi40NDc2IDMuODU3ODdaIiBmaWxsPSIjMUQxQzIzIi8+Cjwvc3ZnPg=="), auto',
+    grabbing: 'url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMCAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik02LjYxODE3IDUuNTk4NzVDNi42MTgxNyA0LjgxOTIgNy4yNTAxMiA0LjE4NzI2IDguMDI5NjcgNC4xODcyNkM4Ljc3ODczIDQuMTg3MjYgOS4zOTE1MiA0Ljc3MDc1IDkuNDM4MjkgNS41MDgwMUM5LjQ1OTkyIDQuOTQ3MSA5LjkyMTQ3IDQuNDk5MDIgMTAuNDg3NyA0LjQ5OTAyQzExLjA2NzcgNC40OTkwMiAxMS41Mzc4IDQuOTY5MiAxMS41Mzc4IDUuNTQ5MTlWOC43NjI0NkwxMS41Mzc5IDYuNzExNUMxMS41Mzc5IDYuMDMwOTUgMTIuMDg5NiA1LjQ3OTI2IDEyLjc3MDIgNS40NzkyNkMxMy40NTA3IDUuNDc5MjYgMTQuMDAyNCA2LjAzMDk1IDE0LjAwMjQgNi43MTE1TDE0LjAwMjQgOC43NjI0NkwxNC4wMDI5IDguMDE5ODNDMTQuMDAyOSA3LjMzOTI5IDE0LjU1NDYgNi43ODc1OSAxNS4yMzUyIDYuNzg3NTlDMTUuOTE1NyA2Ljc4NzU5IDE2LjQ2NzQgNy4zMzkyOCAxNi40Njc0IDguMDE5ODNWMTEuNDk3TDE2LjQ2NzUgMTIuNDQ2N0MxNi40Njc1IDE0LjA4MjEgMTUuODA5NiAxNS42NDg3IDE0LjY0MiAxNi43OTM4VjE3LjMyNjJDMTQuNjQyIDE3Ljc4NjQgMTQuMjY4OSAxOC4xNTk1IDEzLjgwODcgMTguMTU5NUg4LjE3MzE3QzcuNzEyOTMgMTguMTU5NSA3LjMzOTg0IDE3Ljc4NjQgNy4zMzk4NCAxNy4zMjYyVjE1Ljk0MjRMNS4zNDU2MiAxNC43NTM0QzQuNTg5MjQgMTQuMzAyNCA0LjEyNTkxIDEzLjQ4NjcgNC4xMjU4OSAxMi42MDYxTDQuMTI1ODMgOS4yODM4M0M0LjEyNTgyIDguOTU0MjcgNC4zMjAwMyA4LjY1NTY2IDQuNjIxMjkgOC41MjIwNUw2LjYxODE3IDcuNjM2MzRWNS41OTg3NVoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTAuNDg3OCAzLjI0OTAyQzExLjI3OTYgMy4yNDkwMiAxMS45Nzc4IDMuNjQ5MDIgMTIuMzkxNyA0LjI1Nzk2QzEyLjUxNTEgNC4yMzkwNiAxMi42NDE2IDQuMjI5MjYgMTIuNzcwMyA0LjIyOTI2QzEzLjcyMjQgNC4yMjkyNiAxNC41NDkzIDQuNzY1MzEgMTQuOTY1NyA1LjU1MjA3QzE1LjA1NDMgNS41NDI1IDE1LjE0NDIgNS41Mzc1OSAxNS4yMzUzIDUuNTM3NTlDMTYuNjA2MiA1LjUzNzU5IDE3LjcxNzYgNi42NDg5MyAxNy43MTc2IDguMDE5ODNMMTcuNzE3NyAxMi40NDY3QzE3LjcxNzcgMTQuMjM1NSAxNy4wNjQ3IDE1Ljk1NTkgMTUuODkyMSAxNy4yOTA0VjE3LjMyNjJDMTUuODkyMSAxOC40NzY4IDE0Ljk1OTQgMTkuNDA5NSAxMy44MDg4IDE5LjQwOTVIOC4xNzMzMkM3LjAyMjczIDE5LjQwOTUgNi4wODk5OCAxOC40NzY4IDYuMDg5OTggMTcuMzI2MlYxNi42NTI0TDQuNzA1NjMgMTUuODI3QzMuNTcxMDYgMTUuMTUwNSAyLjg3NjA3IDEzLjkyNzEgMi44NzYwNCAxMi42MDYxTDIuODc1OTggOS4yODM4NUMyLjg3NTk2IDguNDU5OTYgMy4zNjE0OSA3LjcxMzQ1IDQuMTE0NjIgNy4zNzk0TDUuMzY4MzIgNi44MjMzM1Y1LjU5ODc1QzUuMzY4MzIgNC4xMjg4NSA2LjU1OTkxIDIuOTM3MjYgOC4wMjk4MiAyLjkzNzI2QzguNjA4MzEgMi45MzcyNiA5LjE0MzU1IDMuMTIxNyA5LjU4MDA1IDMuNDM1MDVDOS44NTg1MyAzLjMxNTMyIDEwLjE2NTQgMy4yNDkwMiAxMC40ODc4IDMuMjQ5MDJaTTEyLjQ0NzkgNS41MjE4NlY5LjQ3NTU3QzEyLjQ0NzkgOS43Mjc2MiAxMi4yNDM2IDkuOTMxOTUgMTEuOTkxNiA5LjkzMTk1QzExLjc1NjggOS45MzE5NSAxMS41NjM0IDkuNzU0NjUgMTEuNTM4IDkuNTI2NjNDMTEuNTM2MSA5LjUwOTg3IDExLjUzNTIgOS40OTI4MyAxMS41MzUyIDkuNDc1NTdWNS40NzE1OEMxMS41MTU0IDUuMjAwODMgMTEuMzkzIDQuOTU4NTggMTEuMjA2NiA0Ljc4MzU4QzExLjAxODggNC42MDcxMSAxMC43NjU5IDQuNDk5MDIgMTAuNDg3OCA0LjQ5OTAyQzEwLjQ3NjYgNC40OTkwMiAxMC40NjU0IDQuNDk5MTkgMTAuNDU0MiA0LjQ5OTU0QzkuOTAzNDcgNC41MTY4NCA5LjQ1OTY0IDQuOTU4MjQgOS40Mzg0NCA1LjUwODAxQzkuNDM4MiA1LjUwNDMgOS40Mzc5NSA1LjUwMDU4IDkuNDM3NjkgNS40OTY4OFY5LjkwMjQzQzkuNDM3NjkgMTAuMTU0NSA5LjIzMzM2IDEwLjM1ODggOC45ODEzMSAxMC4zNTg4QzguNzI5MjUgMTAuMzU4OCA4LjUyNDkyIDEwLjE1NDUgOC41MjQ5MiA5LjkwMjQzVjQuMjc2NTNDOC4zNzA4NiA0LjIxODgyIDguMjA0MDIgNC4xODcyNiA4LjAyOTgyIDQuMTg3MjZDNy4yNTAyNyA0LjE4NzI2IDYuNjE4MzIgNC44MTkyIDYuNjE4MzIgNS41OTg3NUw2LjYxODI3IDkuOTc1OTlDNi42MTgyNyAxMC4yMjggNi40MTM5NCAxMC40MzI0IDYuMTYxODkgMTAuNDMyNEM1LjkwOTgzIDEwLjQzMjQgNS43MDU1IDEwLjIyOCA1LjcwNTUgOS45NzU5OVY4LjA0MTIyTDQuNjIxNDQgOC41MjIwNUM0LjMyMDE4IDguNjU1NjYgNC4xMjU5NyA4Ljk1NDI3IDQuMTI1OTggOS4yODM4M0w0LjEyNjA0IDEyLjYwNjFDNC4xMjYwNiAxMy40ODY3IDQuNTg5MzkgMTQuMzAyNCA1LjM0NTc2IDE0Ljc1MzRMNy4zMzk5OCAxNS45NDI0VjE3LjMyNjJDNy4zMzk5OCAxNy43ODY0IDcuNzEzMDggMTguMTU5NSA4LjE3MzMyIDE4LjE1OTVIMTMuODA4OEMxNC4yNjkgMTguMTU5NSAxNC42NDIxIDE3Ljc4NjQgMTQuNjQyMSAxNy4zMjYyVjE2Ljc5MzhDMTUuNzM4MSAxNS43MTkgMTYuMzg1IDE0LjI3MjggMTYuNDYwMyAxMi43NDdDMTYuNDY0NiAxMi42NiAxNi40NjcgMTIuNTcyOCAxNi40Njc2IDEyLjQ4NTRMMTYuNDY3NyAxMi40NDY3TDE2LjQ2NzYgOC4wMTk4M0MxNi40Njc2IDcuMzQ1MDQgMTUuOTI1MiA2Ljc5NjkzIDE1LjI1MjUgNi43ODc3MUwxNS4yMzUzIDYuNzg3NTlDMTUuMTI1IDYuNzg3NTkgMTUuMDE4IDYuODAyMSAxNC45MTYyIDYuODI5MzFWOS42MDEzNkMxNC45MTYyIDkuODUzNDIgMTQuNzExOSAxMC4wNTc3IDE0LjQ1OTggMTAuMDU3N0MxNC4yMDc4IDEwLjA1NzcgMTQuMDAzNCA5Ljg1MzQxIDE0LjAwMzQgOS42MDEzNlY3Ljk4OTg1QzE0LjAwMzIgNy45OTk4MiAxNC4wMDMxIDguMDA5ODEgMTQuMDAzMSA4LjAxOTgzTDE0LjAwMzQgOS42MDEzNkwxNC4wMDI1IDYuNzExNUMxNC4wMDI1IDYuNDQ5NzQgMTMuOTIwOSA2LjIwNzA1IDEzLjc4MTggNi4wMDc0OEMxMy41NjIgNS42OTI0MiAxMy4xOTg5IDUuNDg0ODMgMTIuNzg3IDUuNDc5MzdMMTIuNzcwMyA1LjQ3OTI2QzEyLjY1ODggNS40NzkyNiAxMi41NTA3IDUuNDk0MDggMTIuNDQ3OSA1LjUyMTg2WiIgZmlsbD0iIzFEMUMyMyIvPgo8L3N2Zz4="), auto'
+  },
+  toNodeJSON(node) {
+    const nodeError = node.getData(FlowNodeErrorData)?.getError();
+    if (nodeError) {
+      throw nodeError;
+    }
+    const transform = node.getData(TransformData5);
+    let formJSON = toFormJSON(node);
+    const metaData = {};
+    const nodeMeta = node.getNodeMeta();
+    const subCanvas = nodeMeta.subCanvas?.(node);
+    if (subCanvas?.isCanvas === false) {
+      const canvasNodeTransform = subCanvas.canvasNode.getData(FlowNodeTransformData);
+      const { x, y } = canvasNodeTransform.transform.position;
+      metaData.canvasPosition = { x, y };
+    }
+    const json = {
+      id: node.id,
+      type: node.flowNodeType,
+      meta: {
+        position: { x: transform.position.x, y: transform.position.y },
+        ...metaData
+      },
+      data: formJSON
+    };
+    return json;
+  }
+};
+
+// src/entity-datas/workflow-node-lines-data.ts
+import { Disposable } from "@flowgram.ai/utils";
+import { EntityData as EntityData2 } from "@flowgram.ai/core";
+var _WorkflowNodeLinesData = class _WorkflowNodeLinesData extends EntityData2 {
+  getDefaultData() {
+    return {
+      inputLines: [],
+      outputLines: []
+    };
+  }
+  constructor(entity) {
+    super(entity);
+    this.entity = entity;
+    this.toDispose.push(
+      Disposable.create(() => {
+        this.inputLines.slice().forEach((line) => line.dispose());
+        this.outputLines.slice().forEach((line) => line.dispose());
+      })
+    );
+  }
+  /**
+   * 输入线条
+   */
+  get inputLines() {
+    return this.data.inputLines;
+  }
+  /**
+   * 输出线条
+   */
+  get outputLines() {
+    return this.data.outputLines;
+  }
+  /**
+   * 输入节点
+   */
+  get inputNodes() {
+    return this.inputLines.map((l) => l.from).filter(Boolean);
+  }
+  /**
+   * 所有输入节点
+   */
+  get allInputNodes() {
+    const nodeSet = /* @__PURE__ */ new Set();
+    const handleNode = (node) => {
+      if (nodeSet.has(node)) {
+        return;
+      }
+      nodeSet.add(node);
+      const { inputNodes } = node.getData(_WorkflowNodeLinesData);
+      if (!inputNodes || !inputNodes.length) {
+        return;
+      }
+      inputNodes.forEach((inputNode) => {
+        if (inputNode?.parent === node || node?.parent === inputNode) {
+          return;
+        }
+        handleNode(inputNode);
+      });
+    };
+    handleNode(this.entity);
+    nodeSet.delete(this.entity);
+    return Array.from(nodeSet);
+  }
+  /**
+   * 输出节点
+   */
+  get outputNodes() {
+    return this.outputLines.map((l) => l.to).filter(Boolean);
+  }
+  /**
+   * 输入输出节点
+   */
+  get allOutputNodes() {
+    const nodeSet = /* @__PURE__ */ new Set();
+    const handleNode = (node) => {
+      if (nodeSet.has(node)) {
+        return;
+      }
+      nodeSet.add(node);
+      const { outputNodes } = node.getData(_WorkflowNodeLinesData);
+      if (!outputNodes || !outputNodes.length) {
+        return;
+      }
+      outputNodes.forEach((outputNode) => {
+        if (outputNode?.parent === node || node?.parent === outputNode) {
+          return;
+        }
+        handleNode(outputNode);
+      });
+    };
+    handleNode(this.entity);
+    nodeSet.delete(this.entity);
+    return Array.from(nodeSet);
+  }
+  addLine(line) {
+    if (line.from === this.entity) {
+      this.outputLines.push(line);
+    } else {
+      this.inputLines.push(line);
+    }
+    this.fireChange();
+  }
+  removeLine(line) {
+    const { inputLines, outputLines } = this;
+    const inputIndex = inputLines.indexOf(line);
+    const outputIndex = outputLines.indexOf(line);
+    if (inputIndex !== -1) {
+      inputLines.splice(inputIndex, 1);
+      this.fireChange();
+    }
+    if (outputIndex !== -1) {
+      outputLines.splice(outputIndex, 1);
+      this.fireChange();
+    }
+  }
+};
+_WorkflowNodeLinesData.type = "WorkflowNodeLinesData";
+var WorkflowNodeLinesData = _WorkflowNodeLinesData;
+
+// src/workflow-lines-manager.ts
+var WorkflowLinesManager = class {
+  constructor() {
+    this.toDispose = new DisposableCollection();
+    // 线条类型
+    this._lineType = 0 /* BEZIER */;
+    this.onAvailableLinesChangeEmitter = new Emitter3();
+    this.onForceUpdateEmitter = new Emitter3();
+    /**
+     * 有效的线条被添加或者删除时候触发，未连上的线条不算
+     */
+    this.onAvailableLinesChange = this.onAvailableLinesChangeEmitter.event;
+    /**
+     * 强制渲染 lines
+     */
+    this.onForceUpdate = this.onForceUpdateEmitter.event;
+    /**
+     * 是否在调整线条
+     */
+    this.isDrawing = false;
+  }
+  init(doc) {
+    this.document = doc;
+  }
+  forceUpdate() {
+    this.onForceUpdateEmitter.fire();
+  }
+  get lineType() {
+    return this._lineType;
+  }
+  get lineColor() {
+    const color = {
+      default: "#4d53e8" /* DEFUALT */,
+      error: "red" /* ERROR */,
+      hidden: "transparent" /* HIDDEN */,
+      drawing: "#5DD6E3" /* DRAWING */,
+      hovered: "#37d0ff" /* HOVER */,
+      selected: "#37d0ff" /* HOVER */
+    };
+    if (this.options.lineColor) {
+      Object.assign(color, this.options.lineColor);
+    }
+    return color;
+  }
+  switchLineType(newType) {
+    if (newType === void 0) {
+      if (this._lineType === 0 /* BEZIER */) {
+        newType = 1 /* LINE_CHART */;
+      } else {
+        newType = 0 /* BEZIER */;
+      }
+    }
+    if (newType !== this._lineType) {
+      this._lineType = newType;
+      this.entityManager.fireEntityChanged(WorkflowLineEntity.type);
+    }
+    return this._lineType;
+  }
+  getAllLines() {
+    return this.entityManager.getEntities(WorkflowLineEntity);
+  }
+  hasLine(portInfo) {
+    return !!this.entityManager.getEntityById(
+      WorkflowLineEntity.portInfoToLineId(portInfo)
+    );
+  }
+  getLine(portInfo) {
+    return this.entityManager.getEntityById(
+      WorkflowLineEntity.portInfoToLineId(portInfo)
+    );
+  }
+  replaceLine(oldPortInfo, newPortInfo) {
+    const oldLine = this.getLine(oldPortInfo);
+    if (oldLine) {
+      oldLine.dispose();
+    }
+    return this.createLine(newPortInfo);
+  }
+  createLine(options) {
+    const { from, to, drawingTo, fromPort, toPort } = options;
+    const available = Boolean(from && to);
+    const key = options.key || WorkflowLineEntity.portInfoToLineId(options);
+    let line = this.entityManager.getEntityById(key);
+    if (line) {
+      line.highlightColor = "";
+      line.validate();
+      return line;
+    }
+    const fromNode = this.entityManager.getEntityById(from)?.getData(WorkflowNodeLinesData);
+    const toNode = to ? this.entityManager.getEntityById(to).getData(WorkflowNodeLinesData) : void 0;
+    if (!fromNode) {
+      return;
+    }
+    this.isDrawing = Boolean(drawingTo);
+    line = this.entityManager.createEntity(WorkflowLineEntity, {
+      id: key,
+      document: this.document,
+      linesManager: this,
+      from,
+      fromPort,
+      toPort,
+      to,
+      drawingTo
+    });
+    fromNode.addLine(line);
+    toNode?.addLine(line);
+    line.onDispose(() => {
+      if (drawingTo) {
+        this.isDrawing = false;
+      }
+      fromNode.removeLine(line);
+      toNode?.removeLine(line);
+      line.validate();
+    });
+    line.toDispose.push(
+      Disposable2.create(() => {
+        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 */,
+        toJSON: () => line.toJSON(),
+        entity: line
+      });
+    }
+    line.validate();
+    return line;
+  }
+  /**
+   * 获取线条中距离鼠标位置最近的线条和距离
+   * @param mousePos 鼠标位置
+   * @param minDistance 最小检测距离
+   * @returns 距离鼠标位置最近的线条 以及距离
+   */
+  getCloseInLineFromMousePos(mousePos, minDistance = LINE_HOVER_DISTANCE) {
+    let targetLine, targetLineDist;
+    this.getAllLines().forEach((line) => {
+      const dist = line.getHoverDist(mousePos, this.lineType);
+      if (dist <= minDistance && (!targetLineDist || targetLineDist >= dist)) {
+        targetLineDist = dist;
+        targetLine = line;
+      }
+    });
+    return targetLine;
+  }
+  dispose() {
+    this.toDispose.dispose();
+  }
+  get disposed() {
+    return this.toDispose.disposed;
+  }
+  isErrorLine(fromPort, toPort) {
+    if (this.options.isErrorLine) {
+      return this.options.isErrorLine(fromPort, toPort, this);
+    }
+    return false;
+  }
+  isReverseLine(line) {
+    if (this.options.isReverseLine) {
+      return this.options.isReverseLine(line);
+    }
+    return false;
+  }
+  isHideArrowLine(line) {
+    if (this.options.isHideArrowLine) {
+      return this.options.isHideArrowLine(line);
+    }
+    return false;
+  }
+  isFlowingLine(line) {
+    if (this.options.isFlowingLine) {
+      return this.options.isFlowingLine(line);
+    }
+    return false;
+  }
+  isDisabledLine(line) {
+    if (this.options.isDisabledLine) {
+      return this.options.isDisabledLine(line);
+    }
+    return false;
+  }
+  isVerticalLine(line) {
+    if (this.options.isVerticalLine) {
+      return this.options.isVerticalLine(line);
+    }
+    return false;
+  }
+  getLineColor(line) {
+    if (line.isHidden) {
+      return this.lineColor.hidden;
+    }
+    if (line.hasError) {
+      return this.lineColor.error;
+    }
+    if (line.highlightColor) {
+      return line.highlightColor;
+    }
+    if (line.drawingTo) {
+      return this.lineColor.drawing;
+    }
+    if (this.hoverService.isHovered(line.id)) {
+      return this.lineColor.hovered;
+    }
+    if (this.selectService.isSelected(line.id)) {
+      return this.lineColor.selected;
+    }
+    return this.lineColor.default;
+  }
+  canAddLine(fromPort, toPort, silent) {
+    if (fromPort === toPort || fromPort.node === toPort.node || fromPort.portType !== "output" || toPort.portType !== "input" || toPort.disabled) {
+      return false;
+    }
+    if (this.options.canAddLine) {
+      return this.options.canAddLine(fromPort, toPort, this, silent);
+    }
+    return fromPort.node !== toPort.node;
+  }
+  toJSON() {
+    return this.getAllLines().filter((l) => !l.isDrawing).map((l) => l.toJSON());
+  }
+  getPortById(portId) {
+    return this.entityManager.getEntityById(portId);
+  }
+  canRemove(line, newLineInfo, silent) {
+    if (this.options && this.options.canDeleteLine && !this.options.canDeleteLine(line, newLineInfo, silent)) {
+      return false;
+    }
+    return true;
+  }
+  canReset(fromPort, oldToPort, newToPort) {
+    if (this.options && this.options.canResetLine && !this.options.canResetLine(fromPort, oldToPort, newToPort, this)) {
+      return false;
+    }
+    return true;
+  }
+  /**
+   * 根据鼠标位置找到 port
+   * @param pos
+   */
+  getPortFromMousePos(pos) {
+    const allPorts = this.entityManager.getEntities(WorkflowPortEntity).filter((port) => port.node.flowNodeType !== "root");
+    const targetPort = allPorts.find((port) => port.isHovered(pos.x, pos.y));
+    if (targetPort) {
+      const targetNode = this.document.getAllNodes().slice().reverse().filter((node) => targetPort.node?.parent?.id !== node.id).find((node) => node.getData(TransformData6).contains(pos.x, pos.y));
+      if (targetNode && targetNode !== targetPort.node) {
+        return;
+      }
+    }
+    return targetPort;
+  }
+  /**
+   * 根据鼠标位置找到 node
+   * @param pos - 鼠标位置
+   */
+  getNodeFromMousePos(pos) {
+    const allNodes = this.document.getAllNodes();
+    const containNodes = [];
+    const { selection } = this.selectService;
+    const zoom = this.entityManager.getEntity(PlaygroundConfigEntity2)?.config?.zoom || 1;
+    allNodes.forEach((node) => {
+      const { bounds } = node.getData(FlowNodeTransformData2);
+      if (bounds.clone().pad(4 / zoom).contains(pos.x, pos.y)) {
+        containNodes.push(node);
+      }
+    });
+    if (selection?.length) {
+      const filteredNodes = containNodes.filter(
+        (node) => selection.some((_node) => node.id === _node.id)
+      );
+      if (filteredNodes?.length) {
+        return last(filteredNodes);
+      }
+    }
+    return last(containNodes);
+  }
+};
+__decorateClass([
+  inject3(WorkflowHoverService)
+], WorkflowLinesManager.prototype, "hoverService", 2);
+__decorateClass([
+  inject3(WorkflowSelectService)
+], WorkflowLinesManager.prototype, "selectService", 2);
+__decorateClass([
+  inject3(EntityManager2)
+], WorkflowLinesManager.prototype, "entityManager", 2);
+__decorateClass([
+  inject3(WorkflowDocumentOptions)
+], WorkflowLinesManager.prototype, "options", 2);
+WorkflowLinesManager = __decorateClass([
+  injectable3()
+], WorkflowLinesManager);
+
+// src/workflow-document.ts
+import { customAlphabet } from "nanoid";
+import { inject as inject5, injectable as injectable5, optional, postConstruct } from "inversify";
+import { Disposable as Disposable3, Emitter as Emitter4 } from "@flowgram.ai/utils";
+import { NodeEngineContext } from "@flowgram.ai/form-core";
+import { FlowDocument, FlowNodeBaseType, FlowNodeTransformData as FlowNodeTransformData4 } from "@flowgram.ai/document";
+import {
+  injectPlaygroundContext,
+  PlaygroundConfigEntity as PlaygroundConfigEntity4,
+  PositionData,
+  TransformData as TransformData8
+} from "@flowgram.ai/core";
+
+// src/layout/free-layout.ts
+import { inject as inject4, injectable as injectable4 } from "inversify";
+import {
+  FlowDocumentProvider,
+  FlowNodeTransformData as FlowNodeTransformData3
+} from "@flowgram.ai/document";
+import { PlaygroundConfigEntity as PlaygroundConfigEntity3, TransformData as TransformData7 } from "@flowgram.ai/core";
+import {
+  PaddingSchema,
+  Rectangle as Rectangle8,
+  SizeSchema as SizeSchema2
+} from "@flowgram.ai/utils";
+var FREE_LAYOUT_KEY = "free-layout";
+var FreeLayout = class {
+  constructor() {
+    this.name = FREE_LAYOUT_KEY;
+  }
+  get document() {
+    return this.documentProvider();
+  }
+  /**
+   * 更新布局
+   */
+  update() {
+    if (this.document.root.getData(FlowNodeTransformData3)?.localDirty) {
+      this.document.root.clearMemoGlobal();
+    }
+  }
+  syncTransform(node) {
+    const transform = node.getData(FlowNodeTransformData3);
+    if (!transform.localDirty) {
+      return;
+    }
+    node.clearMemoGlobal();
+    node.clearMemoLocal();
+    transform.transform.update({
+      size: transform.data.size
+    });
+    if (!node.parent) {
+      return;
+    }
+    node.parent.clearMemoGlobal();
+    node.parent.clearMemoLocal();
+    const parentTransform = node.parent.getData(FlowNodeTransformData3);
+    parentTransform.transform.fireChange();
+  }
+  /**
+   * 获取节点的 padding 数据
+   * @param node
+   */
+  getPadding(node) {
+    const { padding } = node.getNodeMeta();
+    const transform = node.getData(FlowNodeTransformData3);
+    if (padding) {
+      return typeof padding === "function" ? padding(transform) : padding;
+    }
+    return PaddingSchema.empty();
+  }
+  /**
+   * 默认滚动到 fitview 区域
+   * @param contentSize
+   */
+  getInitScroll(contentSize) {
+    const bounds = Rectangle8.enlarge(
+      this.document.getAllNodes().map((node) => node.getData(TransformData7).bounds)
+    ).pad(30, 30);
+    const viewport = this.playgroundConfig.getViewport(false);
+    const zoom = SizeSchema2.fixSize(bounds, viewport);
+    return {
+      scrollX: (bounds.x + bounds.width / 2) * zoom - this.playgroundConfig.config.width / 2,
+      scrollY: (bounds.y + bounds.height / 2) * zoom - this.playgroundConfig.config.height / 2
+    };
+  }
+  /**
+   * 获取默认输入点
+   */
+  getDefaultInputPoint(node) {
+    return node.getData(TransformData7).bounds.leftCenter;
+  }
+  /**
+   * 获取默认输出点
+   */
+  getDefaultOutputPoint(node) {
+    return node.getData(TransformData7).bounds.rightCenter;
+  }
+  /**
+   * 水平中心点
+   */
+  getDefaultNodeOrigin() {
+    return { x: 0.5, y: 0 };
+  }
+};
+__decorateClass([
+  inject4(PlaygroundConfigEntity3)
+], FreeLayout.prototype, "playgroundConfig", 2);
+__decorateClass([
+  inject4(FlowDocumentProvider)
+], FreeLayout.prototype, "documentProvider", 2);
+FreeLayout = __decorateClass([
+  injectable4()
+], FreeLayout);
+
+// src/workflow-document.ts
+var nanoid2 = customAlphabet("1234567890", 5);
+var WorkflowDocumentProvider = Symbol("WorkflowDocumentProvider");
+var WorkflowDocument = class extends FlowDocument {
+  constructor() {
+    super(...arguments);
+    this._onContentChangeEmitter = new Emitter4();
+    this.onLoadedEmitter = new Emitter4();
+    this.onContentChange = this._onContentChangeEmitter.event;
+    this._onReloadEmitter = new Emitter4();
+    this.onReload = this._onReloadEmitter.event;
+    this.disposed = false;
+    /**
+     * 数据加载完成
+     */
+    this.onLoaded = this.onLoadedEmitter.event;
+    this._loading = false;
+    this.options = {};
+  }
+  get loading() {
+    return this._loading;
+  }
+  async fitView(easing) {
+    return fitView(this, this.playgroundConfig, easing).then(() => {
+      this.linesManager.forceUpdate();
+    });
+  }
+  init() {
+    super.init();
+    this.currentLayoutKey = this.options.defaultLayout || FREE_LAYOUT_KEY;
+    this.linesManager.init(this);
+    this.playgroundConfig.getCursors = () => this.options.cursors;
+    this.linesManager.onAvailableLinesChange((e) => this.fireContentChange(e));
+    this.playgroundConfig.onReadonlyOrDisabledChange(({ readonly }) => {
+      if (this.nodeEngineContext) {
+        this.nodeEngineContext.readonly = readonly;
+      }
+    });
+  }
+  async load() {
+    this._loading = true;
+    await super.load();
+    this._loading = false;
+    this.onLoadedEmitter.fire();
+  }
+  async reload(json, delayTime = 0) {
+    this._loading = true;
+    this.clear();
+    this.fromJSON(json);
+    await delay(delayTime);
+    this._loading = false;
+    this._onReloadEmitter.fire(this);
+  }
+  /**
+   * 从数据加载
+   * @param json
+   */
+  fromJSON(json, fireRender = true) {
+    const { flattenJSON, nodeBlocks, nodeEdges } = this.flatJSON(json);
+    const nestedJSON = this.nestJSON(flattenJSON, nodeBlocks, nodeEdges);
+    this.entityManager.changeEntityLocked = true;
+    this.renderJSON(nestedJSON);
+    this.entityManager.changeEntityLocked = false;
+    this.transformer.loading = false;
+    if (fireRender) {
+      this.fireRender();
+    }
+  }
+  /**
+   * 清空画布
+   */
+  clear() {
+    this.getAllNodes().map((node) => node.dispose());
+    this.linesManager.getAllLines().map((line) => line.dispose());
+    this.getAllPorts().map((port) => port.dispose());
+    this.selectServices.clear();
+  }
+  /**
+   * 创建流程节点
+   * @param json
+   */
+  createWorkflowNode(json, isClone = false, parentId) {
+    const isExistedNode = this.getNode(json.id);
+    const parent = this.getNode(parentId ?? this.root.id) ?? this.root;
+    const node = this.addNode(
+      {
+        ...json,
+        parent
+      },
+      void 0,
+      true
+    );
+    const registry = node.getNodeRegistry();
+    const { formMeta } = registry;
+    const meta = node.getNodeMeta();
+    const formData = getFlowNodeFormData(node);
+    const transform = node.getData(FlowNodeTransformData4);
+    const freeLayout = this.layout;
+    transform.onDataChange(() => {
+      freeLayout.syncTransform(node);
+    });
+    let { position } = meta;
+    if (!position) {
+      position = this.getNodeDefaultPosition(json.type);
+    }
+    node.getData(TransformData8).update({
+      position
+    });
+    if (formMeta && formData) {
+      formData.createForm(formMeta, json.data);
+      formData.onDataChange(() => {
+        this.fireContentChange({
+          type: "NODE_DATA_CHANGE" /* NODE_DATA_CHANGE */,
+          toJSON: () => formData.toJSON(),
+          entity: node
+        });
+      });
+    }
+    const positionData = node.getData(PositionData);
+    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({
+        type: "ADD_NODE" /* ADD_NODE */,
+        entity: node,
+        toJSON: () => this.toNodeJSON(node)
+      });
+      node.toDispose.push(
+        Disposable3.create(() => {
+          this.fireContentChange({
+            type: "DELETE_NODE" /* DELETE_NODE */,
+            entity: node,
+            toJSON: () => this.toNodeJSON(node)
+          });
+        })
+      );
+      node.toDispose.push(
+        Disposable3.create(() => {
+          if (!node.parent || node.parent.flowNodeType === FlowNodeBaseType.ROOT) {
+            return;
+          }
+          const parentTransform = node.parent.getData(FlowNodeTransformData4);
+          setTimeout(() => {
+            parentTransform.fireChange();
+          }, 0);
+        })
+      );
+    }
+    if (json.blocks) {
+      this.renderJSON(
+        { nodes: json.blocks, edges: json.edges ?? [] },
+        {
+          parent: node,
+          isClone
+        }
+      );
+    }
+    if (subCanvas) {
+      const canvasTransform = subCanvas.canvasNode.getData(TransformData8);
+      canvasTransform.update({
+        position: subCanvas.parentNode.getNodeMeta()?.canvasPosition
+      });
+      subCanvas.parentNode.onDispose(() => {
+        subCanvas.canvasNode.dispose();
+      });
+      subCanvas.canvasNode.onDispose(() => {
+        subCanvas.parentNode.dispose();
+      });
+    }
+    this.onNodeCreateEmitter.fire({
+      node,
+      data: json
+    });
+    return node;
+  }
+  /**
+   * 获取默认的 x y 坐标, 默认为当前画布可视区域中心
+   * @param type
+   * @protected
+   */
+  getNodeDefaultPosition(type) {
+    const { size } = this.getNodeRegistry(type).meta || {};
+    let position = this.playgroundConfig.getViewport(true).center;
+    if (size) {
+      position = {
+        x: position.x,
+        y: position.y - size.height / 2
+      };
+    }
+    return getAntiOverlapPosition(this, position);
+  }
+  /**
+   * 通过类型创建节点, 如果没有提供position 则直接放在画布中间
+   * @param type
+   */
+  createWorkflowNodeByType(type, position, json = {}, parentID) {
+    let id = json.id;
+    if (id === void 0) {
+      do {
+        id = `1${nanoid2()}`;
+      } while (this.entityManager.getEntityById(id));
+    } else {
+      if (this.entityManager.getEntityById(id)) {
+        throw new Error(`[WorkflowDocument.createWorkflowNodeByType] Node Id "${id}" duplicated.`);
+      }
+    }
+    return this.createWorkflowNode(
+      {
+        id,
+        type,
+        meta: { position, ...json?.meta },
+        // TODO title 和 meta 要从注册数据去拿
+        data: json?.data,
+        blocks: json?.blocks,
+        edges: json?.edges
+      },
+      false,
+      parentID
+    );
+  }
+  getAllNodes() {
+    return this.entityManager.getEntities(WorkflowNodeEntity).filter((n) => n.id !== FlowNodeBaseType.ROOT);
+  }
+  getAllPorts() {
+    return this.entityManager.getEntities(WorkflowPortEntity).filter((p) => p.node.id !== FlowNodeBaseType.ROOT);
+  }
+  /**
+   * 获取画布中的非游离节点
+   * 1. 开始节点
+   * 2. 从开始节点出发能走到的节点
+   * 3. 结束节点
+   * 4. 默认所有子画布内节点为游离节点
+   */
+  getAssociatedNodes() {
+    const allNode = this.getAllNodes();
+    const allLines = this.linesManager.getAllLines().filter((line) => line.from && line.to).map((line) => ({
+      from: line.from.id,
+      to: line.to.id
+    }));
+    const startNodeId = allNode.find((node) => node.isStart).id;
+    const endNodeId = allNode.find((node) => node.isNodeEnd).id;
+    const nodeInSubCanvas = allNode.filter((node) => node.parent?.flowNodeType === FlowNodeBaseType.SUB_CANVAS).map((node) => node.id);
+    const associatedCache = /* @__PURE__ */ new Set([endNodeId, ...nodeInSubCanvas]);
+    const bfs = (nodeId) => {
+      if (associatedCache.has(nodeId)) {
+        return;
+      }
+      associatedCache.add(nodeId);
+      const nextNodes = allLines.reduce((ids, { from, to }) => {
+        if (from === nodeId && !associatedCache.has(to)) {
+          ids.push(to);
+        }
+        return ids;
+      }, []);
+      nextNodes.forEach(bfs);
+    };
+    bfs(startNodeId);
+    const associatedNodes = allNode.filter((node) => associatedCache.has(node.id));
+    return associatedNodes;
+  }
+  /**
+   * 触发渲染
+   */
+  fireRender() {
+    this.entityManager.fireEntityChanged(WorkflowNodeEntity.type);
+    this.entityManager.fireEntityChanged(WorkflowLineEntity.type);
+    this.entityManager.fireEntityChanged(WorkflowPortEntity.type);
+  }
+  fireContentChange(event) {
+    if (this._loading || this.disposed || this.entityManager.changeEntityLocked) {
+      return;
+    }
+    this._onContentChangeEmitter.fire(event);
+  }
+  toNodeJSON(node) {
+    const subCanvas = this.getNodeSubCanvas(node);
+    if (subCanvas?.isCanvas === true) {
+      return this.toNodeJSON(subCanvas.parentNode);
+    }
+    const json = this.toNodeJSONFromOptions(node);
+    const children = this.getNodeChildren(node);
+    const blocks = children.map((child) => this.toNodeJSON(child));
+    const linesMap = /* @__PURE__ */ new Map();
+    children.forEach((child) => {
+      const childLinesData = child.getData(WorkflowNodeLinesData);
+      [...childLinesData.inputLines, ...childLinesData.outputLines].filter(Boolean).forEach((line) => {
+        const lineJSON = this.toLineJSON(line);
+        if (!lineJSON || linesMap.has(line.id)) {
+          return;
+        }
+        linesMap.set(line.id, lineJSON);
+      });
+    });
+    const edges = Array.from(linesMap.values());
+    if (blocks.length > 0) json.blocks = blocks;
+    if (edges.length > 0) json.edges = edges;
+    return json;
+  }
+  /**
+   * 节点转换为JSON， 没有format的过程
+   * @param node
+   * @returns
+   */
+  toNodeJSONFromOptions(node) {
+    if (this.options.toNodeJSON) {
+      return this.options.toNodeJSON(node);
+    }
+    return WorkflowDocumentOptionsDefault.toNodeJSON(node);
+  }
+  copyNode(node, newNodeId, format, position) {
+    let json = this.toNodeJSON(node);
+    if (format) {
+      json = format(json);
+    }
+    position = position || {
+      x: json.meta.position.x + 30,
+      y: json.meta.position.y + 30
+    };
+    return this.createWorkflowNode(
+      {
+        id: newNodeId || `1${nanoid2()}`,
+        type: node.flowNodeType,
+        meta: {
+          ...json.meta,
+          position
+        },
+        data: json.data,
+        blocks: json.blocks,
+        edges: json.edges
+      },
+      true,
+      node.parent?.id
+    );
+  }
+  copyNodeFromJSON(flowNodeType, nodeJSON, newNodeId, position, parentId) {
+    position = position || {
+      x: nodeJSON.meta.position.x + 30,
+      y: nodeJSON.meta.position.y + 30
+    };
+    return this.createWorkflowNode(
+      {
+        id: newNodeId || `1${nanoid2()}`,
+        type: flowNodeType,
+        meta: {
+          ...nodeJSON.meta,
+          position
+        },
+        data: nodeJSON.data,
+        blocks: nodeJSON.blocks,
+        edges: nodeJSON.edges
+      },
+      true,
+      parentId
+    );
+  }
+  canRemove(node, silent) {
+    const meta = node.getNodeMeta();
+    if (meta.deleteDisable) {
+      return false;
+    }
+    if (this.options.canDeleteNode && !this.options.canDeleteNode(node, silent)) {
+      return false;
+    }
+    return true;
+  }
+  /**
+   * 判断端口是否为错误态
+   */
+  isErrorPort(port) {
+    if (typeof this.options.isErrorPort === "function") {
+      return this.options.isErrorPort(port);
+    }
+    return false;
+  }
+  /**
+   * 导出数据
+   */
+  toJSON() {
+    const rootJSON = this.toNodeJSON(this.root);
+    return {
+      nodes: rootJSON.blocks ?? [],
+      edges: rootJSON.edges ?? []
+    };
+  }
+  dispose() {
+    if (this.disposed) {
+      return;
+    }
+    super.dispose();
+    this.disposed = true;
+    this._onReloadEmitter.dispose();
+  }
+  getEdgeID(edge) {
+    return WorkflowLineEntity.portInfoToLineId({
+      from: edge.sourceNodeID,
+      to: edge.targetNodeID,
+      fromPort: edge.sourcePortID,
+      toPort: edge.targetPortID
+    });
+  }
+  /**
+   * 拍平树形json结构，将结构信息提取到map
+   */
+  flatJSON(json = { nodes: [], edges: [] }) {
+    const nodeBlocks = /* @__PURE__ */ new Map();
+    const nodeEdges = /* @__PURE__ */ new Map();
+    const rootNodes = json.nodes ?? [];
+    const rootEdges = json.edges ?? [];
+    const flattenNodeJSONs = [...rootNodes];
+    const flattenEdgeJSONs = [...rootEdges];
+    const rootBlockIDs = rootNodes.map((node) => node.id);
+    const rootEdgeIDs = rootEdges.map((edge) => this.getEdgeID(edge));
+    nodeBlocks.set(FlowNodeBaseType.ROOT, rootBlockIDs);
+    nodeEdges.set(FlowNodeBaseType.ROOT, rootEdgeIDs);
+    rootNodes.forEach((nodeJSON) => {
+      const { blocks, edges } = nodeJSON;
+      if (blocks) {
+        flattenNodeJSONs.push(...blocks);
+        const blockIDs = [];
+        blocks.forEach((block) => {
+          blockIDs.push(block.id);
+        });
+        nodeBlocks.set(nodeJSON.id, blockIDs);
+        delete nodeJSON.blocks;
+      }
+      if (edges) {
+        flattenEdgeJSONs.push(...edges);
+        const edgeIDs = [];
+        edges.forEach((edge) => {
+          const edgeID = this.getEdgeID(edge);
+          edgeIDs.push(edgeID);
+        });
+        nodeEdges.set(nodeJSON.id, edgeIDs);
+        delete nodeJSON.edges;
+      }
+    });
+    const flattenJSON = {
+      nodes: flattenNodeJSONs,
+      edges: flattenEdgeJSONs
+    };
+    return {
+      flattenJSON,
+      nodeBlocks,
+      nodeEdges
+    };
+  }
+  /**
+   * 对JSON进行分层
+   */
+  nestJSON(flattenJSON, nodeBlocks, nodeEdges) {
+    const nestJSON = {
+      nodes: [],
+      edges: []
+    };
+    const nodeMap = /* @__PURE__ */ new Map();
+    const edgeMap = /* @__PURE__ */ new Map();
+    const rootBlockSet = new Set(nodeBlocks.get(FlowNodeBaseType.ROOT) ?? []);
+    const rootEdgeSet = new Set(nodeEdges.get(FlowNodeBaseType.ROOT) ?? []);
+    flattenJSON.nodes.forEach((nodeJSON) => {
+      nodeMap.set(nodeJSON.id, nodeJSON);
+    });
+    flattenJSON.edges.forEach((edgeJSON) => {
+      const edgeID = this.getEdgeID(edgeJSON);
+      edgeMap.set(edgeID, edgeJSON);
+    });
+    flattenJSON.nodes.forEach((nodeJSON) => {
+      if (rootBlockSet.has(nodeJSON.id)) {
+        nestJSON.nodes.push(nodeJSON);
+      }
+      if (nodeBlocks.has(nodeJSON.id)) {
+        const blockIDs = nodeBlocks.get(nodeJSON.id);
+        const blockJSONs = blockIDs.map((blockID) => nodeMap.get(blockID)).filter(Boolean);
+        nodeJSON.blocks = blockJSONs;
+      }
+      if (nodeEdges.has(nodeJSON.id)) {
+        const edgeIDs = nodeEdges.get(nodeJSON.id);
+        const edgeJSONs = edgeIDs.map((edgeID) => edgeMap.get(edgeID)).filter(Boolean);
+        nodeJSON.edges = edgeJSONs;
+      }
+    });
+    flattenJSON.edges.forEach((edgeJSON) => {
+      const edgeID = this.getEdgeID(edgeJSON);
+      if (rootEdgeSet.has(edgeID)) {
+        nestJSON.edges.push(edgeJSON);
+      }
+    });
+    return nestJSON;
+  }
+  /**
+   * 逐层创建节点和线条
+   */
+  renderJSON(json, options) {
+    const { parent = this.root, isClone = false } = options ?? {};
+    const containerID = this.getNodeSubCanvas(parent)?.canvasNode.id ?? parent.id;
+    json.nodes.forEach((nodeJSON) => {
+      this.createWorkflowNode(nodeJSON, isClone, containerID);
+    }), // 创建线条
+    json.edges.forEach((edge) => this.createWorkflowLine(edge, containerID));
+  }
+  getNodeSubCanvas(node) {
+    if (!node) return;
+    const nodeMeta = node.getNodeMeta();
+    const subCanvas = nodeMeta.subCanvas?.(node);
+    return subCanvas;
+  }
+  getNodeChildren(node) {
+    if (!node) return [];
+    const subCanvas = this.getNodeSubCanvas(node);
+    const childrenWithCanvas = subCanvas ? subCanvas.canvasNode.collapsedChildren : node.collapsedChildren;
+    const children = childrenWithCanvas.filter((child) => {
+      const childMeta = child.getNodeMeta();
+      return !childMeta.subCanvas?.(node)?.isCanvas;
+    }).filter(Boolean);
+    return children;
+  }
+  toLineJSON(line) {
+    const lineJSON = line.toJSON();
+    if (!line.to || !line.info.to || !line.toPort) {
+      return;
+    }
+    const fromSubCanvas = this.getNodeSubCanvas(line.from);
+    const toSubCanvas = this.getNodeSubCanvas(line.to);
+    if (fromSubCanvas && !fromSubCanvas.isCanvas && toSubCanvas && toSubCanvas.isCanvas) {
+      return;
+    }
+    if (line.from === line.to.parent && fromSubCanvas) {
+      return {
+        ...lineJSON,
+        sourceNodeID: fromSubCanvas.parentNode.id
+      };
+    }
+    if (line.to === line.from.parent && toSubCanvas) {
+      return {
+        ...lineJSON,
+        targetNodeID: toSubCanvas.parentNode.id
+      };
+    }
+    return lineJSON;
+  }
+  createWorkflowLine(json, parentId) {
+    const fromNode = this.getNode(json.sourceNodeID);
+    const toNode = this.getNode(json.targetNodeID);
+    if (!fromNode || !toNode) {
+      return;
+    }
+    const lineInfo = {
+      from: json.sourceNodeID,
+      fromPort: json.sourcePortID,
+      to: json.targetNodeID,
+      toPort: json.targetPortID
+    };
+    if (!parentId) {
+      return this.linesManager.createLine(lineInfo);
+    }
+    const canvasNode = this.getNode(parentId);
+    if (!canvasNode) {
+      return this.linesManager.createLine(lineInfo);
+    }
+    const parentSubCanvas = this.getNodeSubCanvas(canvasNode);
+    if (!parentSubCanvas) {
+      return this.linesManager.createLine(lineInfo);
+    }
+    if (lineInfo.from === parentSubCanvas.parentNode.id) {
+      return this.linesManager.createLine({
+        ...lineInfo,
+        from: parentSubCanvas.canvasNode.id
+      });
+    }
+    if (lineInfo.to === parentSubCanvas.parentNode.id) {
+      return this.linesManager.createLine({
+        ...lineInfo,
+        to: parentSubCanvas.canvasNode.id
+      });
+    }
+    return this.linesManager.createLine(lineInfo);
+  }
+};
+__decorateClass([
+  inject5(WorkflowLinesManager)
+], WorkflowDocument.prototype, "linesManager", 2);
+__decorateClass([
+  inject5(PlaygroundConfigEntity4)
+], WorkflowDocument.prototype, "playgroundConfig", 2);
+__decorateClass([
+  injectPlaygroundContext()
+], WorkflowDocument.prototype, "playgroundContext", 2);
+__decorateClass([
+  inject5(WorkflowDocumentOptions)
+], WorkflowDocument.prototype, "options", 2);
+__decorateClass([
+  inject5(NodeEngineContext),
+  optional()
+], WorkflowDocument.prototype, "nodeEngineContext", 2);
+__decorateClass([
+  inject5(WorkflowSelectService)
+], WorkflowDocument.prototype, "selectServices", 2);
+__decorateClass([
+  postConstruct()
+], WorkflowDocument.prototype, "init", 1);
+WorkflowDocument = __decorateClass([
+  injectable5()
+], WorkflowDocument);
+
+// src/service/workflow-drag-service.ts
+var DRAG_TIMEOUT = 100;
+var DRAG_MIN_DELTA = 5;
+function checkDragSuccess(time, e, originLine) {
+  if (!originLine || time > DRAG_TIMEOUT || Math.abs(e.endPos.x - e.startPos.x) >= DRAG_MIN_DELTA || Math.abs(e.endPos.y - e.startPos.y) >= DRAG_MIN_DELTA) {
+    return true;
+  }
+  return false;
+}
+var WorkflowDragService = class {
+  constructor() {
+    this._onDragLineEventEmitter = new Emitter5();
+    this.onDragLineEventChange = this._onDragLineEventEmitter.event;
+    this.isDragging = false;
+    this._nodesDragEmitter = new Emitter5();
+    this.onNodesDrag = this._nodesDragEmitter.event;
+    this._toDispose = new DisposableCollection2();
+    this._droppableTransforms = [];
+    this.posAdjusters = /* @__PURE__ */ new Set();
+    this._onDragLineEndCallbacks = /* @__PURE__ */ new Map();
+  }
+  init() {
+    this._toDispose.pushAll([this._onDragLineEventEmitter, this._nodesDragEmitter]);
+  }
+  dispose() {
+    this._toDispose.dispose();
+  }
+  /**
+   * 拖拽选中节点
+   * @param event
+   */
+  startDragSelectedNodes(event) {
+    let { selectedNodes } = this.selectService;
+    if (selectedNodes.length === 0 || this.playgroundConfig.readonly || this.playgroundConfig.disabled) {
+      return Promise.resolve(false);
+    }
+    const sameParent = this.childrenOfContainer(selectedNodes);
+    if (sameParent && sameParent.flowNodeType !== FlowNodeBaseType2.ROOT) {
+      selectedNodes = [sameParent];
+    }
+    const { altKey } = event;
+    let startPosition = this.getNodesPosition(selectedNodes);
+    let startPositions = selectedNodes.map((node) => {
+      const transform = node.getData(TransformData9);
+      return { x: transform.position.x, y: transform.position.y };
+    });
+    let dragSuccess = false;
+    const startTime = Date.now();
+    const dragger = new PlaygroundDrag({
+      onDragStart: () => {
+        this.isDragging = true;
+      },
+      onDrag: (e) => {
+        if (!dragSuccess && checkDragSuccess(Date.now() - startTime, e)) {
+          dragSuccess = true;
+          if (altKey) {
+            const tryCopyNodes = selectedNodes;
+            if (tryCopyNodes.length > 0) {
+              this.commandService.executeCommand("PASTE_NODES" /* PASTE_NODES */, tryCopyNodes, true).then((newNodes) => {
+                if (newNodes && Array.isArray(newNodes) && newNodes.length > 0) {
+                  selectedNodes = newNodes;
+                  startPosition = this.getNodesPosition(tryCopyNodes);
+                  startPositions = tryCopyNodes.filter((n) => !n.getNodeMeta().copyDisable).map((node) => {
+                    const transform = node.getData(TransformData9);
+                    return {
+                      x: transform.position.x,
+                      y: transform.position.y
+                    };
+                  });
+                }
+              });
+            }
+          }
+        }
+        const offset = this.getDragPosOffset({
+          event: e,
+          selectedNodes,
+          startPosition
+        });
+        selectedNodes.forEach((node, index) => {
+          const transform = node.getData(TransformData9);
+          const nodeStartPosition = startPositions[index];
+          const newPosition = {
+            x: nodeStartPosition.x + offset.x,
+            y: nodeStartPosition.y + offset.y
+          };
+          if (node.collapsedChildren?.length > 0) {
+            node.collapsedChildren.forEach((childNode) => {
+              const childNodeTransformData = childNode.getData(FlowNodeTransformData5);
+              childNodeTransformData.fireChange();
+            });
+          }
+          transform.update({
+            position: newPosition
+          });
+        });
+      },
+      onDragEnd: () => {
+        this.isDragging = false;
+        this._nodesDragEmitter.fire({
+          type: "onDragEnd",
+          nodes: selectedNodes,
+          startPositions,
+          altKey
+        });
+      }
+    });
+    return dragger.start(event.clientX, event.clientY, this.playgroundConfig).then(() => dragSuccess);
+  }
+  /**
+   * 通过拖入卡片添加
+   * @param type
+   * @param event
+   * @param data 节点数据
+   */
+  async dropCard(type, event, data, parent) {
+    const mousePos = this.playgroundConfig.getPosFromMouseEvent(event);
+    if (!this.playgroundConfig.getViewport().contains(mousePos.x, mousePos.y)) {
+      return;
+    }
+    const position = this.adjustSubNodePosition(type, parent, mousePos);
+    const node = await this.document.createWorkflowNodeByType(
+      type,
+      position,
+      data,
+      parent?.id
+    );
+    return node;
+  }
+  /**
+   * 拖拽卡片到画布
+   * 返回创建结果
+   * @param type
+   * @param event
+   */
+  async startDragCard(type, event, data, cloneNode) {
+    let domNode;
+    let startPos = { x: 0, y: 0 };
+    const deferred = new PromiseDeferred();
+    const dragger = new PlaygroundDrag({
+      onDragStart: (e) => {
+        const targetNode = event.currentTarget;
+        domNode = cloneNode ? cloneNode(e) : targetNode.cloneNode(true);
+        const bounds = targetNode.getBoundingClientRect();
+        startPos = { x: bounds.left, y: bounds.top };
+        domUtils2.setStyle(domNode, {
+          zIndex: 1e3,
+          position: "absolute",
+          left: startPos.x,
+          top: startPos.y,
+          boxShadow: "0 6px 8px 0 rgba(28, 31, 35, .2)"
+        });
+        document.body.appendChild(domNode);
+        this.updateDroppableTransforms();
+      },
+      onDrag: (e) => {
+        const deltaX = e.endPos.x - e.startPos.x;
+        const deltaY = e.endPos.y - e.startPos.y;
+        const left = startPos.x + deltaX;
+        const right = startPos.y + deltaY;
+        domNode.style.left = `${left}px`;
+        domNode.style.top = `${right}px`;
+        const { x, y } = this.playgroundConfig.getPosFromMouseEvent(e);
+        const draggingRect = new Rectangle9(x, y, 170, 90);
+        const collisionTransform = this._droppableTransforms.find((transform) => {
+          const { bounds, entity } = transform;
+          const padding = this.document.layout.getPadding(entity);
+          const transformRect = new Rectangle9(
+            bounds.x + padding.left + padding.right,
+            bounds.y,
+            bounds.width,
+            bounds.height
+          );
+          return Rectangle9.intersects(draggingRect, transformRect);
+        });
+        this.updateDropNode(collisionTransform?.entity);
+      },
+      onDragEnd: async (e) => {
+        const dropNode = this._dropNode;
+        const dragNode = await this.dropCard(type, e, data, dropNode);
+        this.clearDrop();
+        if (dragNode) {
+          domNode.remove();
+          deferred.resolve(dragNode);
+        } else {
+          domNode.style.transition = "all ease .2s";
+          domNode.style.left = `${startPos.x}px`;
+          domNode.style.top = `${startPos.y}px`;
+          const TIMEOUT = 200;
+          await delay2(TIMEOUT);
+          domNode.remove();
+          deferred.resolve();
+        }
+      }
+    });
+    await dragger.start(event.clientX, event.clientY);
+    return deferred.promise;
+  }
+  /**
+   * 如果存在容器节点，且传入鼠标坐标，需要用容器的坐标减去传入的鼠标坐标
+   */
+  adjustSubNodePosition(subNodeType, containerNode, mousePos, resetEmptyPos = true) {
+    if (!mousePos) {
+      return { x: 0, y: 0 };
+    }
+    if (!subNodeType || !containerNode || containerNode.flowNodeType === FlowNodeBaseType2.ROOT) {
+      return mousePos;
+    }
+    const isParentEmpty = !containerNode.children || containerNode.children.length === 0;
+    const parentPadding = this.document.layout.getPadding(containerNode);
+    const parentTransform = containerNode.getData(TransformData9);
+    if (isParentEmpty && resetEmptyPos) {
+      return {
+        x: 0,
+        y: parentPadding.top
+      };
+    } else {
+      return {
+        x: mousePos.x - parentTransform.position.x,
+        y: mousePos.y - parentTransform.position.y
+      };
+    }
+  }
+  /**
+   * 注册位置调整
+   */
+  registerPosAdjuster(adjuster) {
+    this.posAdjusters.add(adjuster);
+    return {
+      dispose: () => this.posAdjusters.delete(adjuster)
+    };
+  }
+  /**
+   * 获取拖拽偏移
+   */
+  getDragPosOffset(params) {
+    const { event, selectedNodes, startPosition } = params;
+    const { finalScale } = this.playgroundConfig;
+    const mouseOffset = {
+      x: (event.endPos.x - event.startPos.x) / finalScale,
+      y: (event.endPos.y - event.startPos.y) / finalScale
+    };
+    const wholePosition = {
+      x: startPosition.x + mouseOffset.x,
+      y: startPosition.y + mouseOffset.y
+    };
+    const adjustedOffsets = Array.from(this.posAdjusters.values()).map(
+      (adjuster) => adjuster({
+        selectedNodes,
+        position: wholePosition
+      })
+    );
+    const offset = adjustedOffsets.reduce(
+      (offset2, adjustOffset) => ({
+        x: offset2.x + adjustOffset.x,
+        y: offset2.y + adjustOffset.y
+      }),
+      mouseOffset
+    );
+    return offset;
+  }
+  updateDroppableTransforms() {
+    this._droppableTransforms = this.document.getRenderDatas(FlowNodeTransformData5, false).filter((transform) => {
+      const { entity } = transform;
+      if (entity.originParent) {
+        return this.nodeSelectable(entity) && this.nodeSelectable(entity.originParent);
+      }
+      return this.nodeSelectable(entity);
+    }).filter((transform) => {
+      const { entity } = transform;
+      return entity.flowNodeType === FlowNodeBaseType2.SUB_CANVAS;
+    });
+  }
+  /**
+   * 获取节点整体位置
+   */
+  getNodesPosition(nodes) {
+    const selectedBounds = Rectangle9.enlarge(
+      nodes.map((n) => n.getData(FlowNodeTransformData5).bounds)
+    );
+    const position = {
+      x: selectedBounds.x,
+      y: selectedBounds.y
+    };
+    return position;
+  }
+  nodeSelectable(node) {
+    const selectable = node.getNodeMeta().selectable;
+    if (typeof selectable === "function") {
+      return selectable(node);
+    } else {
+      return selectable;
+    }
+  }
+  updateDropNode(node) {
+    if (this._dropNode) {
+      if (this._dropNode.id === node?.id) {
+        return;
+      }
+      this.selectService.clear();
+    }
+    if (node) {
+      this.selectService.selectNode(node);
+    }
+    this._dropNode = node;
+  }
+  clearDrop() {
+    if (this._dropNode) {
+      this.selectService.clear();
+    }
+    this._dropNode = void 0;
+    this._droppableTransforms = [];
+  }
+  setLineColor(line, color) {
+    line.highlightColor = color;
+    this.hoverService.clearHovered();
+  }
+  handleDragOnNode(toNode, fromPort, line, toPort, originLine) {
+    if (toPort && (originLine?.toPort === toPort || toPort.portType === "input" && this.linesManager.canAddLine(fromPort, toPort, true))) {
+      this.hoverService.updateHoveredKey(toPort.id);
+      line.setToPort(toPort);
+      this._onDragLineEventEmitter.fire({
+        type: "onDrag",
+        onDragNodeId: toNode.id
+      });
+      return {
+        hasError: false
+      };
+    } else if (toNode.flowNodeType === FlowNodeBaseType2.SUB_CANVAS) {
+      return {
+        hasError: false
+      };
+    } else {
+      this.setLineColor(line, this.linesManager.lineColor.error);
+      return {
+        hasError: true
+      };
+    }
+  }
+  childrenOfContainer(nodes) {
+    if (nodes.length === 0) {
+      return;
+    }
+    const sourceContainer = nodes[0]?.parent;
+    if (!sourceContainer || sourceContainer.collapsedChildren.length !== nodes.length) {
+      return;
+    }
+    const valid = nodes.every((node) => node?.parent === sourceContainer);
+    if (!valid) {
+      return;
+    }
+    return sourceContainer;
+  }
+  /**
+   * 绘制线条
+   * @param opts
+   * @param event
+   */
+  async startDrawingLine(fromPort, event, originLine) {
+    const isFromInActivePort = !originLine && fromPort.isErrorPort() && fromPort.disabled;
+    if (originLine?.disabled || isFromInActivePort || this.playgroundConfig.readonly || this.playgroundConfig.disabled) {
+      return { dragSuccess: false, newLine: void 0 };
+    }
+    const config = this.playgroundConfig;
+    const deferred = new PromiseDeferred();
+    const preCursor = config.cursor;
+    let line, toPort, toNode, lineErrorReset = false;
+    const startTime = Date.now();
+    let dragSuccess = false;
+    const dragger = new PlaygroundDrag({
+      onDrag: (e) => {
+        if (!line && checkDragSuccess(Date.now() - startTime, e, originLine)) {
+          if (originLine) {
+            originLine.highlightColor = this.linesManager.lineColor.hidden;
+          }
+          dragSuccess = true;
+          line = this.linesManager.createLine({
+            from: fromPort.node.id,
+            fromPort: fromPort.portID,
+            drawingTo: config.getPosFromMouseEvent(event)
+          });
+          if (!line) {
+            return;
+          }
+          config.updateCursor("grab");
+          line.highlightColor = this.linesManager.lineColor.drawing;
+          this.hoverService.updateHoveredKey("");
+        }
+        if (!line) {
+          return;
+        }
+        lineErrorReset = false;
+        const dragPos = config.getPosFromMouseEvent(e);
+        toNode = this.linesManager.getNodeFromMousePos(dragPos);
+        toPort = this.linesManager.getPortFromMousePos(dragPos);
+        if (!toPort) {
+          line.setToPort(void 0);
+        } else if (!this.linesManager.canAddLine(fromPort, toPort, true)) {
+          line.highlightColor = this.linesManager.lineColor.error;
+          lineErrorReset = true;
+          line.setToPort(void 0);
+        } else {
+          line.setToPort(toPort);
+        }
+        this._onDragLineEventEmitter.fire({
+          type: "onDrag"
+        });
+        this.setLineColor(line, this.linesManager.lineColor.drawing);
+        if (toNode && toNode.flowNodeType !== FlowNodeBaseType2.SUB_CANVAS) {
+          const portsData = toNode.getData(WorkflowNodePortsData);
+          toPort = portsData.inputPorts[0];
+          const { hasError } = this.handleDragOnNode(toNode, fromPort, line, toPort, originLine);
+          lineErrorReset = hasError;
+        }
+        if (line.toPort) {
+          line.drawingTo = { x: line.toPort.point.x, y: line.toPort.point.y };
+        } else {
+          line.drawingTo = { x: dragPos.x, y: dragPos.y };
+        }
+        originLine?.validate();
+        line.validate();
+      },
+      // eslint-disable-next-line complexity
+      onDragEnd: async (e) => {
+        const dragPos = config.getPosFromMouseEvent(e);
+        const onDragLineEndCallbacks = Array.from(this._onDragLineEndCallbacks.values());
+        config.updateCursor(preCursor);
+        await Promise.all(
+          onDragLineEndCallbacks.map(
+            (callback) => callback({
+              fromPort,
+              toPort,
+              mousePos: dragPos,
+              line,
+              originLine,
+              event: e
+            })
+          )
+        );
+        line?.dispose();
+        this._onDragLineEventEmitter.fire({
+          type: "onDragEnd"
+        });
+        if (originLine) {
+          originLine.highlightColor = "";
+        }
+        const end = () => {
+          originLine?.validate();
+          deferred.resolve({ dragSuccess });
+        };
+        if (dragSuccess) {
+          if (originLine && originLine.toPort === toPort) {
+            return end();
+          }
+          if (toPort && toPort.portType !== "input") {
+            return end();
+          }
+          const newLineInfo = toPort ? {
+            from: fromPort.node.id,
+            fromPort: fromPort.portID,
+            to: toPort.node.id,
+            toPort: toPort.portID
+          } : void 0;
+          const isReset = originLine && toPort;
+          if (isReset && !this.linesManager.canReset(
+            originLine.fromPort,
+            originLine.toPort,
+            toPort
+          )) {
+            return end();
+          }
+          if (originLine && (!this.linesManager.canRemove(originLine, newLineInfo, false) || lineErrorReset)) {
+            return end();
+          } else {
+            originLine?.dispose();
+          }
+          if (!toPort || !this.linesManager.canAddLine(fromPort, toPort, false)) {
+            return end();
+          }
+          const newLine = this.linesManager.createLine(newLineInfo);
+          if (!newLine) {
+            end();
+          }
+          deferred.resolve({
+            dragSuccess,
+            newLine
+          });
+        } else {
+          end();
+        }
+      }
+    });
+    await dragger.start(event.clientX, event.clientY, config);
+    return deferred.promise;
+  }
+  /**
+   * 重新连接线条
+   * @param line
+   * @param e
+   */
+  async resetLine(line, e) {
+    const { fromPort } = line;
+    const { dragSuccess } = await this.startDrawingLine(fromPort, e, line);
+    if (!dragSuccess) {
+      this.selectService.select(line);
+    }
+  }
+  /** 线条拖拽结束 */
+  onDragLineEnd(callback) {
+    const id = nanoid3();
+    this._onDragLineEndCallbacks.set(id, callback);
+    return {
+      dispose: () => {
+        this._onDragLineEndCallbacks.delete(id);
+      }
+    };
+  }
+};
+__decorateClass([
+  inject6(PlaygroundConfigEntity5)
+], WorkflowDragService.prototype, "playgroundConfig", 2);
+__decorateClass([
+  inject6(WorkflowHoverService)
+], WorkflowDragService.prototype, "hoverService", 2);
+__decorateClass([
+  inject6(WorkflowDocument)
+], WorkflowDragService.prototype, "document", 2);
+__decorateClass([
+  inject6(WorkflowLinesManager)
+], WorkflowDragService.prototype, "linesManager", 2);
+__decorateClass([
+  inject6(CommandService)
+], WorkflowDragService.prototype, "commandService", 2);
+__decorateClass([
+  inject6(WorkflowSelectService)
+], WorkflowDragService.prototype, "selectService", 2);
+__decorateClass([
+  inject6(FlowOperationBaseService)
+], WorkflowDragService.prototype, "operationService", 2);
+__decorateClass([
+  postConstruct2()
+], WorkflowDragService.prototype, "init", 1);
+WorkflowDragService = __decorateClass([
+  injectable6()
+], WorkflowDragService);
+
+// src/service/workflow-reset-layout-service.ts
+import { inject as inject7, injectable as injectable7, postConstruct as postConstruct3 } from "inversify";
+import { PlaygroundConfigEntity as PlaygroundConfigEntity6 } from "@flowgram.ai/core";
+import { EntityManager as EntityManager3 } from "@flowgram.ai/core";
+import { DisposableCollection as DisposableCollection3, Emitter as Emitter6 } from "@flowgram.ai/utils";
+
+// src/utils/layout-to-positions.ts
+import { FlowNodeTransformData as FlowNodeTransformData6 } from "@flowgram.ai/document";
+import { TransformData as TransformData10, startTween } from "@flowgram.ai/core";
+var layoutToPositions = async (nodes, nodePositionMap) => {
+  const newNodePositionMap = {};
+  nodes.forEach((node) => {
+    const transform = node.getData(TransformData10);
+    const nodeTransform = node.getData(FlowNodeTransformData6);
+    newNodePositionMap[node.id] = {
+      x: transform.position.x,
+      y: transform.position.y + nodeTransform.bounds.height / 2
+    };
+  });
+  return new Promise((resolve) => {
+    startTween({
+      from: { d: 0 },
+      to: { d: 100 },
+      duration: 300,
+      onUpdate: (v) => {
+        nodes.forEach((node) => {
+          const transform = node.getData(TransformData10);
+          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(FlowNodeTransformData6);
+              childNodeTransformData.fireChange();
+            });
+          }
+          transform.update({
+            position: {
+              x: transform.position.x + deltaX,
+              y: transform.position.y + deltaY
+            }
+          });
+        });
+      },
+      onComplete: () => {
+        resolve(newNodePositionMap);
+      }
+    });
+  });
+};
+
+// src/service/workflow-reset-layout-service.ts
+var WorkflowResetLayoutService = class {
+  constructor() {
+    this._resetLayoutEmitter = new Emitter6();
+    /**
+     * reset layout事件
+     */
+    this.onResetLayout = this._resetLayoutEmitter.event;
+    this._toDispose = new DisposableCollection3();
+  }
+  init() {
+    this._toDispose.push(this._resetLayoutEmitter);
+  }
+  /**
+   * 触发重置布局
+   * @param nodeIds 节点id
+   * @param positionMap 新布局数据
+   * @param oldPositionMap 老布局数据
+   */
+  fireResetLayout(nodeIds, positionMap, oldPositionMap) {
+    this._resetLayoutEmitter.fire({
+      nodeIds,
+      positionMap,
+      oldPositionMap
+    });
+  }
+  /**
+   * 根据数据重新布局
+   * @param positionMap
+   * @returns
+   */
+  async layoutToPositions(nodeIds, positionMap) {
+    const nodes = nodeIds.map((id) => this._entityManager.getEntityById(id)).filter(Boolean);
+    const positions = await layoutToPositions(nodes, positionMap);
+    fitView(this._document, this._config, true);
+    return positions;
+  }
+  /**
+   * 销毁
+   */
+  dispose() {
+    this._toDispose.dispose();
+  }
+};
+__decorateClass([
+  inject7(PlaygroundConfigEntity6)
+], WorkflowResetLayoutService.prototype, "_config", 2);
+__decorateClass([
+  inject7(WorkflowDocument)
+], WorkflowResetLayoutService.prototype, "_document", 2);
+__decorateClass([
+  inject7(EntityManager3)
+], WorkflowResetLayoutService.prototype, "_entityManager", 2);
+__decorateClass([
+  postConstruct3()
+], WorkflowResetLayoutService.prototype, "init", 1);
+WorkflowResetLayoutService = __decorateClass([
+  injectable7()
+], WorkflowResetLayoutService);
+
+// src/hooks/use-playground-readonly-state.ts
+import { useEffect } from "react";
+import { usePlayground, useRefresh } from "@flowgram.ai/core";
+function usePlaygroundReadonlyState(listenChange) {
+  const playground = usePlayground();
+  const refresh = useRefresh();
+  useEffect(() => {
+    let dispose = void 0;
+    if (listenChange) {
+      dispose = playground.config.onReadonlyOrDisabledChange(() => refresh());
+    }
+    return () => dispose?.dispose();
+  }, [listenChange]);
+  return playground.config.readonly;
+}
+
+// src/hooks/use-node-render.tsx
+function checkTargetDraggable(el) {
+  return el && el.tagName !== "INPUT" && el.tagName !== "TEXTAREA" && !el.closest(".flow-canvas-not-draggable");
+}
+function useNodeRender(nodeFromProps) {
+  const node = nodeFromProps || useContext(PlaygroundEntityContext);
+  const renderData = node.getData(FlowNodeRenderData2);
+  const portsData = node.getData(WorkflowNodePortsData);
+  const readonly = usePlaygroundReadonlyState();
+  const dragService = useService(WorkflowDragService);
+  const selectionService = useService(WorkflowSelectService);
+  const isDragging = useRef(false);
+  const nodeRef = useRef(null);
+  const [linkingNodeId, setLinkingNodeId] = useState("");
+  useEffect2(() => {
+    const disposable = dragService.onDragLineEventChange(({ type, onDragNodeId }) => {
+      if (type === "onDrag") {
+        setLinkingNodeId(onDragNodeId || "");
+      } else {
+        setLinkingNodeId("");
+      }
+    });
+    return () => {
+      disposable.dispose();
+    };
+  }, []);
+  const startDrag = useCallback(
+    (e) => {
+      e.preventDefault();
+      if (!selectionService.isSelected(node.id)) {
+        selectNode(e);
+      }
+      if (!checkTargetDraggable(e.target) || !checkTargetDraggable(document.activeElement)) {
+        return;
+      }
+      isDragging.current = true;
+      dragService.startDragSelectedNodes(e).finally(
+        () => setTimeout(() => {
+          isDragging.current = false;
+        })
+      );
+    },
+    [dragService, node]
+  );
+  const selectNode = useCallback(
+    (e) => {
+      if (isDragging.current) {
+        return;
+      }
+      if (e.metaKey || e.shiftKey || e.ctrlKey) {
+        selectionService.toggleSelect(node);
+      } else {
+        selectionService.selectNode(node);
+      }
+      if (e.target) {
+        e.target.focus();
+      }
+    },
+    [node]
+  );
+  const deleteNode = useCallback(() => node.dispose(), [node]);
+  useListenEvents(selectionService.onSelectionChanged, portsData.onDataChange);
+  const isFirefox = navigator?.userAgent?.includes?.("Firefox");
+  const onFocus = useCallback(() => {
+    if (isFirefox) {
+      nodeRef.current?.setAttribute("draggable", "false");
+    }
+  }, []);
+  const onBlur = useCallback(() => {
+    if (isFirefox) {
+      nodeRef.current?.setAttribute("draggable", "true");
+    }
+  }, []);
+  const getExtInfo = useCallback(() => node.getExtInfo(), [node]);
+  const updateExtInfo = useCallback(
+    (data) => {
+      node.updateExtInfo(data);
+    },
+    [node]
+  );
+  const form = useMemo(() => getNodeForm(node), [node]);
+  const formState = useObserve(form?.state || {});
+  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() {
+          return form.values;
+        },
+        get state() {
+          return formState;
+        }
+      };
+    }
+  };
+}
+
+// src/hooks/use-current-dom-node.ts
+import { FlowNodeRenderData as FlowNodeRenderData3 } from "@flowgram.ai/document";
+import { useEntityFromContext } from "@flowgram.ai/core";
+function useCurrentDomNode() {
+  const entity = useEntityFromContext();
+  const renderData = entity.getData(FlowNodeRenderData3);
+  return renderData.node;
+}
+
+// src/hooks/use-current-entity.ts
+import { useEntityFromContext as useEntityFromContext2 } from "@flowgram.ai/core";
+function useCurrentEntity() {
+  return useEntityFromContext2();
+}
+
+// src/hooks/use-workflow-document.ts
+import { useService as useService2 } from "@flowgram.ai/core";
+function useWorkflowDocument() {
+  return useService2(WorkflowDocument);
+}
+
+// src/constants.ts
+var EditorCursorState = /* @__PURE__ */ ((EditorCursorState2) => {
+  EditorCursorState2["GRAB"] = "GRAB";
+  EditorCursorState2["SELECT"] = "SELECT";
+  return EditorCursorState2;
+})(EditorCursorState || {});
+var InteractiveType = /* @__PURE__ */ ((InteractiveType2) => {
+  InteractiveType2["MOUSE"] = "MOUSE";
+  InteractiveType2["PAD"] = "PAD";
+  return InteractiveType2;
+})(InteractiveType || {});
+
+// src/workflow-document-container-module.ts
+import { ContainerModule } from "inversify";
+import { FlowDocument as FlowDocument2, FlowDocumentContribution } from "@flowgram.ai/document";
+import { bindContributions } from "@flowgram.ai/utils";
+
+// src/workflow-document-contribution.ts
+import { injectable as injectable8, inject as inject8 } from "inversify";
+import {
+  FlowNodeRenderData as FlowNodeRenderData4,
+  FlowNodeTransformData as FlowNodeTransformData7
+} from "@flowgram.ai/document";
+var WorkflowDocumentContribution = class {
+  registerDocument(document2) {
+    document2.registerNodeDatas(
+      FlowNodeTransformData7,
+      FlowNodeRenderData4,
+      WorkflowNodePortsData,
+      WorkflowNodeLinesData
+    );
+    document2.registerLayout(this.freeLayout);
+  }
+};
+__decorateClass([
+  inject8(FreeLayout)
+], WorkflowDocumentContribution.prototype, "freeLayout", 2);
+WorkflowDocumentContribution = __decorateClass([
+  injectable8()
+], WorkflowDocumentContribution);
+
+// src/utils/get-url-params.ts
+function getUrlParams() {
+  return location.search.replace(/^\?/, "").split("&").reduce((res, key) => {
+    const [k, v] = key.split("=");
+    res[k] = v;
+    return res;
+  }, {});
+}
+
+// src/workflow-document-container-module.ts
+var WorkflowDocumentContainerModule = new ContainerModule(
+  (bind, unbind, isBound, rebind) => {
+    bind(WorkflowDocument).toSelf().inSingletonScope();
+    bind(WorkflowLinesManager).toSelf().inSingletonScope();
+    bind(FreeLayout).toSelf().inSingletonScope();
+    bind(WorkflowDragService).toSelf().inSingletonScope();
+    bind(WorkflowSelectService).toSelf().inSingletonScope();
+    bind(WorkflowHoverService).toSelf().inSingletonScope();
+    bind(WorkflowResetLayoutService).toSelf().inSingletonScope();
+    bind(URLParams).toDynamicValue(() => getUrlParams()).inSingletonScope();
+    bindContributions(bind, WorkflowDocumentContribution, [FlowDocumentContribution]);
+    bind(WorkflowDocumentOptions).toConstantValue({
+      ...WorkflowDocumentOptionsDefault
+    });
+    rebind(FlowDocument2).toService(WorkflowDocument);
+    bind(WorkflowDocumentProvider).toDynamicValue((ctx) => () => ctx.container.get(WorkflowDocument)).inSingletonScope();
+  }
+);
+export {
+  BezierControlType,
+  EditorCursorState,
+  FoldLine,
+  InteractiveType,
+  LINE_HOVER_DISTANCE,
+  LineColors,
+  LineType,
+  POINT_RADIUS,
+  PORT_SIZE,
+  URLParams,
+  WORKFLOW_LINE_ENTITY,
+  WorkflowCommands,
+  WorkflowContentChangeType,
+  WorkflowDocument,
+  WorkflowDocumentContainerModule,
+  WorkflowDocumentOptions,
+  WorkflowDocumentOptionsDefault,
+  WorkflowDocumentProvider,
+  WorkflowDragService,
+  WorkflowHoverService,
+  WorkflowLineEntity,
+  WorkflowLinesManager,
+  WorkflowNodeEntity,
+  WorkflowNodeLinesData,
+  WorkflowNodePortsData,
+  WorkflowPortEntity,
+  WorkflowResetLayoutService,
+  WorkflowSelectService,
+  bindConfigEntity,
+  compose,
+  composeAsync,
+  delay,
+  domReactToBounds,
+  fitView,
+  getAntiOverlapPosition,
+  getBezierHorizontalControlPoints,
+  getBezierVerticalControlPoints,
+  getPortEntityId,
+  nanoid,
+  useConfigEntity,
+  useCurrentDomNode,
+  useCurrentEntity,
+  useEntities,
+  useEntityDataFromContext,
+  useEntityFromContext3 as useEntityFromContext,
+  useListenEvents2 as useListenEvents,
+  useNodeRender,
+  usePlayground2 as usePlayground,
+  usePlaygroundContainer,
+  usePlaygroundContext,
+  usePlaygroundLatest,
+  usePlaygroundReadonlyState,
+  useRefresh2 as useRefresh,
+  useService3 as useService,
+  useWorkflowDocument
+};
+//# sourceMappingURL=index.js.map