@flowgram.ai/free-layout-core 0.1.0-alpha.34 → 0.1.0-alpha.36

package/dist/index.d.mts

@@ -2,8 +2,8 @@ import { PlaygroundConfigEntity, CommandService, PlaygroundDragEvent, EntityData
 export { bindConfigEntity, useConfigEntity, useEntities, useEntityDataFromContext, useEntityFromContext, useListenEvents, usePlayground, usePlaygroundContainer, usePlaygroundContext, useRefresh, useService } from '@flowgram.ai/core';
 import { NodeFormProps } from '@flowgram.ai/node';
 import { FlowNodeType, FlowOperationBaseServiceImpl, FlowNodeEntityOrId, FlowNodeEntity } from '@flowgram.ai/document';
-import { W as WorkflowJSON, L as LineCenterPoint, a as WorkflowDocument, b as WorkflowNodeEntity, c as WorkflowHoverService, d as WorkflowLinesManager, e as WorkflowSelectService, f as WorkflowDocumentOptions, g as LineEventProps, N as NodesDragEvent, h as WorkflowNodeJSON, i as WorkflowPortEntity, j as WorkflowLineEntity, O as OnDragLineEnd, k as LineRenderType, l as WorkflowLineRenderContribution, m as LinePosition } from './workflow-node-entity-C6bFzfXc.mjs';
-export { Y as HoverPosition, G as LINE_HOVER_DISTANCE, y as LineColor, z as LineColors, x as LinePoint, w as LinePointLocation, v as LineType, D as NodesDragEndEvent, C as NodesDragStartEvent, E as NodesDraggingEvent, P as POINT_RADIUS, M as PORT_SIZE, q as WORKFLOW_LINE_ENTITY, Z as WorkfloEntityHoverable, t as WorkflowContentChangeEvent, s as WorkflowContentChangeType, $ as WorkflowDocumentOptionsDefault, _ as WorkflowDocumentProvider, X as WorkflowEntityHoverable, I as WorkflowLineEntityOpts, J as WorkflowLineInfo, H as WorkflowLinePortInfo, A as WorkflowLineRenderContributionFactory, K as WorkflowLineUIState, U as WorkflowNodeLines, V as WorkflowNodeLinesData, u as WorkflowNodeMeta, T as WorkflowNodePortsData, Q as WorkflowPort, S as WorkflowPortEntityOpts, n as WorkflowPortType, R as WorkflowPorts, B as WorkflowSubCanvas, r as domReactToBounds, p as getPortEntityId, o as getPortEntityIdByNodeId, F as onDragLineEndParams } from './workflow-node-entity-C6bFzfXc.mjs';
+import { W as WorkflowJSON, L as LineCenterPoint, a as WorkflowDocument, b as WorkflowNodeEntity, c as WorkflowHoverService, d as WorkflowLinesManager, e as WorkflowSelectService, f as WorkflowDocumentOptions, g as LineEventProps, N as NodesDragEvent, h as WorkflowNodeJSON, i as WorkflowPortEntity, j as WorkflowLineEntity, O as OnDragLineEnd, k as LineRenderType, l as WorkflowLineRenderContribution, m as LinePosition } from './workflow-node-entity-DcXjib68.mjs';
+export { Y as HoverPosition, G as LINE_HOVER_DISTANCE, y as LineColor, z as LineColors, x as LinePoint, w as LinePointLocation, v as LineType, D as NodesDragEndEvent, C as NodesDragStartEvent, E as NodesDraggingEvent, P as POINT_RADIUS, M as PORT_SIZE, q as WORKFLOW_LINE_ENTITY, Z as WorkfloEntityHoverable, t as WorkflowContentChangeEvent, s as WorkflowContentChangeType, $ as WorkflowDocumentOptionsDefault, _ as WorkflowDocumentProvider, X as WorkflowEntityHoverable, I as WorkflowLineEntityOpts, J as WorkflowLineInfo, H as WorkflowLinePortInfo, A as WorkflowLineRenderContributionFactory, K as WorkflowLineUIState, U as WorkflowNodeLines, V as WorkflowNodeLinesData, u as WorkflowNodeMeta, T as WorkflowNodePortsData, Q as WorkflowPort, S as WorkflowPortEntityOpts, n as WorkflowPortType, R as WorkflowPorts, B as WorkflowSubCanvas, r as domReactToBounds, p as getPortEntityId, o as getPortEntityIdByNodeId, F as onDragLineEndParams } from './workflow-node-entity-DcXjib68.mjs';
 import * as _flowgram_ai_utils from '@flowgram.ai/utils';
 import { IPoint, Rectangle, DisposableCollection, Disposable } from '@flowgram.ai/utils';
 export { compose, composeAsync, delay } from '@flowgram.ai/utils';

package/dist/index.d.ts

@@ -2,8 +2,8 @@ import { PlaygroundConfigEntity, CommandService, PlaygroundDragEvent, EntityData
 export { bindConfigEntity, useConfigEntity, useEntities, useEntityDataFromContext, useEntityFromContext, useListenEvents, usePlayground, usePlaygroundContainer, usePlaygroundContext, useRefresh, useService } from '@flowgram.ai/core';
 import { NodeFormProps } from '@flowgram.ai/node';
 import { FlowNodeType, FlowOperationBaseServiceImpl, FlowNodeEntityOrId, FlowNodeEntity } from '@flowgram.ai/document';
-import { W as WorkflowJSON, L as LineCenterPoint, a as WorkflowDocument, b as WorkflowNodeEntity, c as WorkflowHoverService, d as WorkflowLinesManager, e as WorkflowSelectService, f as WorkflowDocumentOptions, g as LineEventProps, N as NodesDragEvent, h as WorkflowNodeJSON, i as WorkflowPortEntity, j as WorkflowLineEntity, O as OnDragLineEnd, k as LineRenderType, l as WorkflowLineRenderContribution, m as LinePosition } from './workflow-node-entity-03Q7Fvv6.js';
-export { Y as HoverPosition, G as LINE_HOVER_DISTANCE, y as LineColor, z as LineColors, x as LinePoint, w as LinePointLocation, v as LineType, D as NodesDragEndEvent, C as NodesDragStartEvent, E as NodesDraggingEvent, P as POINT_RADIUS, M as PORT_SIZE, q as WORKFLOW_LINE_ENTITY, Z as WorkfloEntityHoverable, t as WorkflowContentChangeEvent, s as WorkflowContentChangeType, $ as WorkflowDocumentOptionsDefault, _ as WorkflowDocumentProvider, X as WorkflowEntityHoverable, I as WorkflowLineEntityOpts, J as WorkflowLineInfo, H as WorkflowLinePortInfo, A as WorkflowLineRenderContributionFactory, K as WorkflowLineUIState, U as WorkflowNodeLines, V as WorkflowNodeLinesData, u as WorkflowNodeMeta, T as WorkflowNodePortsData, Q as WorkflowPort, S as WorkflowPortEntityOpts, n as WorkflowPortType, R as WorkflowPorts, B as WorkflowSubCanvas, r as domReactToBounds, p as getPortEntityId, o as getPortEntityIdByNodeId, F as onDragLineEndParams } from './workflow-node-entity-03Q7Fvv6.js';
+import { W as WorkflowJSON, L as LineCenterPoint, a as WorkflowDocument, b as WorkflowNodeEntity, c as WorkflowHoverService, d as WorkflowLinesManager, e as WorkflowSelectService, f as WorkflowDocumentOptions, g as LineEventProps, N as NodesDragEvent, h as WorkflowNodeJSON, i as WorkflowPortEntity, j as WorkflowLineEntity, O as OnDragLineEnd, k as LineRenderType, l as WorkflowLineRenderContribution, m as LinePosition } from './workflow-node-entity-_7O7-wJE.js';
+export { Y as HoverPosition, G as LINE_HOVER_DISTANCE, y as LineColor, z as LineColors, x as LinePoint, w as LinePointLocation, v as LineType, D as NodesDragEndEvent, C as NodesDragStartEvent, E as NodesDraggingEvent, P as POINT_RADIUS, M as PORT_SIZE, q as WORKFLOW_LINE_ENTITY, Z as WorkfloEntityHoverable, t as WorkflowContentChangeEvent, s as WorkflowContentChangeType, $ as WorkflowDocumentOptionsDefault, _ as WorkflowDocumentProvider, X as WorkflowEntityHoverable, I as WorkflowLineEntityOpts, J as WorkflowLineInfo, H as WorkflowLinePortInfo, A as WorkflowLineRenderContributionFactory, K as WorkflowLineUIState, U as WorkflowNodeLines, V as WorkflowNodeLinesData, u as WorkflowNodeMeta, T as WorkflowNodePortsData, Q as WorkflowPort, S as WorkflowPortEntityOpts, n as WorkflowPortType, R as WorkflowPorts, B as WorkflowSubCanvas, r as domReactToBounds, p as getPortEntityId, o as getPortEntityIdByNodeId, F as onDragLineEndParams } from './workflow-node-entity-_7O7-wJE.js';
 import * as _flowgram_ai_utils from '@flowgram.ai/utils';
 import { IPoint, Rectangle, DisposableCollection, Disposable } from '@flowgram.ai/utils';
 export { compose, composeAsync, delay } from '@flowgram.ai/utils';

package/dist/index.js

@@ -365,7 +365,14 @@ var WorkflowPortEntity = class extends import_core4.Entity {
     );
   }
   isHovered(x, y) {
-    return this.bounds.contains(x, y);
+    const { point } = this;
+    const size = this._size || { width: PORT_SIZE, height: PORT_SIZE };
+    const halfWidth = size.width / 2;
+    const halfHeight = size.height / 2;
+    if (size.width <= 0 || size.height <= 0) {
+      return false;
+    }
+    return x >= point.x - halfWidth && x <= point.x + halfWidth && y >= point.y - halfHeight && y <= point.y + halfHeight;
   }
   /**
    * 相对节点左上角的位置
@@ -466,6 +473,7 @@ var WorkflowNodePortsData = class extends import_core5.EntityData {
     this._staticPorts = [];
     /** 存储 port 实体的 id，用于判断 port 是否存在 */
     this._portIDSet = /* @__PURE__ */ new Set();
+    this._portDisposeIDSet = /* @__PURE__ */ new Set();
     this.entity = entity;
     const meta = entity.getNodeMeta();
     const defaultPorts = meta.useDynamicPort ? [] : [{ type: "input" }, { type: "output" }];
@@ -552,6 +560,7 @@ var WorkflowNodePortsData = class extends import_core5.EntityData {
       });
       ports.forEach((port) => this.updatePortEntity(port));
       this._prePorts = ports;
+      this.clearPortsCache();
       this.fireChange();
     }
     this.allPorts.forEach((port) => {
@@ -564,19 +573,28 @@ var WorkflowNodePortsData = class extends import_core5.EntityData {
    * 获取所有 port entities
    */
   get allPorts() {
-    return Array.from(this._portIDSet).map((portId) => this.getPortEntity(portId)).filter(Boolean);
+    if (!this._allPortsCache) {
+      this._allPortsCache = Array.from(this._portIDSet).map((portId) => this.getPortEntity(portId)).filter(Boolean);
+    }
+    return this._allPortsCache;
   }
   /**
    * 获取输入点位
    */
   get inputPorts() {
-    return this.allPorts.filter((port) => port.portType === "input");
+    if (!this._inputPortsCache) {
+      this._inputPortsCache = this.allPorts.filter((port) => port.portType === "input");
+    }
+    return this._inputPortsCache;
   }
   /**
    * 获取输出点位
    */
   get outputPorts() {
-    return this.allPorts.filter((port) => port.portType === "output");
+    if (!this._outputPortsCache) {
+      this._outputPortsCache = this.allPorts.filter((port) => port.portType === "output");
+    }
+    return this._outputPortsCache;
   }
   /**
    * 获取输入点位置
@@ -617,6 +635,11 @@ var WorkflowNodePortsData = class extends import_core5.EntityData {
   getPortId(portType, portKey = "") {
     return getPortEntityId(this.entity, portType, portKey);
   }
+  clearPortsCache() {
+    this._allPortsCache = void 0;
+    this._inputPortsCache = void 0;
+    this._outputPortsCache = void 0;
+  }
   /**
    * 创建 port 实体
    */
@@ -630,10 +653,18 @@ var WorkflowNodePortsData = class extends import_core5.EntityData {
         ...portInfo
       });
     }
-    portEntity.onDispose(() => {
-      this._portIDSet.delete(id);
-    });
-    this._portIDSet.add(id);
+    if (!this._portDisposeIDSet.has(id)) {
+      this._portDisposeIDSet.add(id);
+      portEntity.onDispose(() => {
+        this._portIDSet.delete(id);
+        this._portDisposeIDSet.delete(id);
+        this.clearPortsCache();
+      });
+    }
+    if (!this._portIDSet.has(id)) {
+      this._portIDSet.add(id);
+      this.clearPortsCache();
+    }
     return portEntity;
   }
   /**
@@ -1491,7 +1522,6 @@ var import_document10 = require("@flowgram.ai/document");
 var import_core15 = require("@flowgram.ai/core");
 
 // src/workflow-lines-manager.ts
-var import_lodash_es3 = require("lodash-es");
 var import_inversify3 = require("inversify");
 var import_utils12 = require("@flowgram.ai/utils");
 var import_document6 = require("@flowgram.ai/document");
@@ -1640,6 +1670,10 @@ var WorkflowLinesManager = class {
   forceUpdate() {
     this.onForceUpdateEmitter.fire();
   }
+  invalidateSortedNodesCache() {
+    this.sortedNodesCache = void 0;
+    this.sortedNodesCacheVersion = void 0;
+  }
   get lineType() {
     return this._lineType;
   }
@@ -1826,13 +1860,18 @@ var WorkflowLinesManager = class {
    */
   getCloseInLineFromMousePos(mousePos, minDistance = LINE_HOVER_DISTANCE) {
     let targetLine, targetLineDist;
-    this.getAllLines().forEach((line) => {
+    const lines = this.getAllLines();
+    for (let i = 0; i < lines.length; i++) {
+      const line = lines[i];
+      if (!this.isPointInBounds(mousePos, line.bounds, minDistance)) {
+        continue;
+      }
       const dist = line.getHoverDist(mousePos);
-      if (dist <= minDistance && (!targetLineDist || targetLineDist >= dist)) {
+      if (dist <= minDistance && (targetLineDist === void 0 || targetLineDist >= dist)) {
         targetLineDist = dist;
         targetLine = line;
       }
-    });
+    }
     return targetLine;
   }
   dispose() {
@@ -1951,39 +1990,44 @@ var WorkflowLinesManager = class {
    * @param pos
    */
   getPortFromMousePos(pos, portType) {
-    const allNodes = this.getSortedNodes().reverse();
-    const allPorts = allNodes.map((node) => {
-      if (!portType) {
-        return node.ports.allPorts;
-      }
-      return portType === "input" ? node.ports.inputPorts : node.ports.outputPorts;
-    }).flat();
-    const targetPort = allPorts.find((port) => port.isHovered(pos.x, pos.y));
-    if (targetPort) {
-      const containNodes = this.getContainNodesFromMousePos(pos);
-      const targetNode = (0, import_lodash_es3.last)(containNodes);
-      if (targetNode && targetNode !== targetPort.node) {
-        return;
+    return this.getHoveredPortFromSortedNodes(pos, this.getSortedNodes(), portType);
+  }
+  getPortsFromMousePos(pos) {
+    return this.getHoveredPortsFromSortedNodes(pos, this.getSortedNodes(), void 0, {
+      collectBoth: true
+    });
+  }
+  getNodeAndPortFromMousePos(pos, portType) {
+    const sortedNodes = this.getSortedNodes();
+    const nodeHitInfo = this.getNodeHitInfoFromSortedNodes(
+      pos,
+      sortedNodes,
+      this.selectService.selection
+    );
+    const ports = this.getHoveredPortsFromSortedNodes(pos, sortedNodes, portType, {
+      topCoverNode: nodeHitInfo.topCoverNode
+    });
+    return {
+      node: nodeHitInfo.topNode,
+      port: ports.port
+    };
+  }
+  getHoverNodeFromMousePos(pos) {
+    const nodes = this.getHoverNodes();
+    for (let i = 0; i < nodes.length; i++) {
+      const node = nodes[i];
+      const { bounds } = node.getData(import_document6.FlowNodeTransformData);
+      if (this.isPointInBounds(pos, bounds)) {
+        return node;
       }
     }
-    return targetPort;
   }
   /**
    * 根据鼠标位置找到 node
    * @param pos - 鼠标位置
    */
   getNodeFromMousePos(pos) {
-    const { selection } = this.selectService;
-    const containNodes = this.getContainNodesFromMousePos(pos);
-    if (selection?.length) {
-      const filteredNodes = containNodes.filter(
-        (node) => selection.some((_node) => node.id === _node.id)
-      );
-      if (filteredNodes?.length) {
-        return (0, import_lodash_es3.last)(filteredNodes);
-      }
-    }
-    return (0, import_lodash_es3.last)(containNodes);
+    return this.getTopNodeFromSortedNodes(pos, this.getSortedNodes(), this.selectService.selection);
   }
   registerContribution(factory) {
     this.contributionFactories.push(factory);
@@ -1993,19 +2037,125 @@ var WorkflowLinesManager = class {
     line.addData(WorkflowLineRenderData);
   }
   getSortedNodes() {
-    return this.document.getAllNodes().sort((a, b) => this.getNodeIndex(a) - this.getNodeIndex(b));
+    const nodeVersion = this.entityManager.getEntityVersion(WorkflowNodeEntity);
+    if (this.sortedNodesCache && this.sortedNodesCacheVersion === nodeVersion) {
+      return this.sortedNodesCache;
+    }
+    this.sortedNodesCache = [...this.document.getAllNodes()].sort(
+      (a, b) => this.getNodeIndex(a) - this.getNodeIndex(b)
+    );
+    this.sortedNodesCacheVersion = nodeVersion;
+    return this.sortedNodesCache;
+  }
+  getHoveredPortFromSortedNodes(pos, sortedNodes, portType) {
+    return this.getHoveredPortsFromSortedNodes(pos, sortedNodes, portType).port;
+  }
+  getHoveredPortsFromSortedNodes(pos, sortedNodes, portType, options = {}) {
+    let inputPort;
+    let outputPort;
+    let anyPort;
+    const { collectBoth = false } = options;
+    for (let i = sortedNodes.length - 1; i >= 0; i--) {
+      const node = sortedNodes[i];
+      if (!portType && !anyPort) {
+        anyPort = this.findHoveredPort(node.ports.allPorts, pos);
+      }
+      if ((!portType || portType === "output") && !outputPort) {
+        outputPort = this.findHoveredPort(node.ports.outputPorts, pos);
+      }
+      if ((!portType || portType === "input") && !inputPort) {
+        inputPort = this.findHoveredPort(node.ports.inputPorts, pos);
+      }
+      if (portType === "input" && inputPort || portType === "output" && outputPort || !portType && (collectBoth ? inputPort && outputPort : anyPort)) {
+        break;
+      }
+    }
+    const needCoverCheck = inputPort || outputPort || anyPort;
+    const topCoverNode = needCoverCheck ? options.topCoverNode || this.getNodeHitInfoFromSortedNodes(pos, sortedNodes).topCoverNode : void 0;
+    inputPort = this.filterCoveredPort(inputPort, topCoverNode);
+    outputPort = this.filterCoveredPort(outputPort, topCoverNode);
+    anyPort = this.filterCoveredPort(anyPort, topCoverNode);
+    return {
+      input: inputPort,
+      output: outputPort,
+      port: portType === "input" ? inputPort : portType === "output" ? outputPort : anyPort
+    };
   }
-  /** 获取鼠标坐标位置的所有节点（stackIndex 从小到大排序） */
-  getContainNodesFromMousePos(pos) {
-    const allNodes = this.getSortedNodes();
+  findHoveredPort(ports, pos) {
+    for (let i = 0; i < ports.length; i++) {
+      const port = ports[i];
+      if (port.isHovered(pos.x, pos.y)) {
+        return port;
+      }
+    }
+  }
+  filterCoveredPort(port, topCoverNode) {
+    if (port && topCoverNode && topCoverNode !== port.node) {
+      return void 0;
+    }
+    return port;
+  }
+  getTopNodeFromSortedNodes(pos, sortedNodes, selection) {
+    return this.getNodeHitInfoFromSortedNodes(pos, sortedNodes, selection).topNode;
+  }
+  getNodeHitInfoFromSortedNodes(pos, sortedNodes, selection) {
     const zoom = this.entityManager.getEntity(import_core12.PlaygroundConfigEntity)?.config?.zoom || 1;
-    const containNodes = allNodes.map((node) => {
+    const padding = 4 / zoom;
+    const selectedIDs = selection?.length ? new Set(selection.map((node) => node.id)) : void 0;
+    let topCoverNode;
+    for (let i = sortedNodes.length - 1; i >= 0; i--) {
+      const node = sortedNodes[i];
       const { bounds } = node.getData(import_document6.FlowNodeTransformData);
-      if (bounds.clone().pad(4 / zoom).contains(pos.x, pos.y)) {
-        return node;
+      if (!this.isPointInBounds(pos, bounds, padding)) {
+        continue;
       }
-    }).filter(Boolean);
-    return containNodes;
+      if (!topCoverNode) {
+        topCoverNode = node;
+      }
+      if (!selectedIDs) {
+        return {
+          topCoverNode,
+          topNode: node
+        };
+      }
+      if (selectedIDs.has(node.id)) {
+        return {
+          topCoverNode,
+          topNode: node
+        };
+      }
+    }
+    return {
+      topCoverNode,
+      topNode: topCoverNode
+    };
+  }
+  getHoverNodes() {
+    const nodeVersion = this.entityManager.getEntityVersion(WorkflowNodeEntity);
+    const activatedID = this.selectService.activatedNode?.id;
+    if (this.hoverNodesCache && this.hoverNodesCacheVersion === nodeVersion && this.hoverNodesCacheActivatedID === activatedID) {
+      return this.hoverNodesCache;
+    }
+    const nodes = this.document.getAllNodes().filter(
+      (node) => node.id !== "root" && node.flowNodeType !== import_document6.FlowNodeBaseType.ROOT && node.flowNodeType !== import_document6.FlowNodeBaseType.GROUP
+    ).reverse();
+    if (activatedID) {
+      const activatedIndex = nodes.findIndex((node) => node.id === activatedID);
+      if (activatedIndex > 0) {
+        const [activatedNode] = nodes.splice(activatedIndex, 1);
+        nodes.unshift(activatedNode);
+      }
+    }
+    this.hoverNodesCache = nodes;
+    this.hoverNodesCacheVersion = nodeVersion;
+    this.hoverNodesCacheActivatedID = activatedID;
+    return this.hoverNodesCache;
+  }
+  isPointInBounds(pos, bounds, padding = 0) {
+    if (bounds.width + padding * 2 <= 0 || bounds.height + padding * 2 <= 0) {
+      return false;
+    }
+    return pos.x >= bounds.x - padding && pos.x <= bounds.right + padding && pos.y >= bounds.y - padding && pos.y <= bounds.bottom + padding;
   }
   getNodeIndex(node) {
     const nodeRenderData = node.getData(import_document6.FlowNodeRenderData);
@@ -3407,15 +3557,15 @@ var WorkflowDragService = class {
   }
   updateDrawingLine(isDrawingTo, line, dragPos, originLine) {
     let hasError = false;
-    const mouseNode = this.linesManager.getNodeFromMousePos(dragPos);
     let toNode;
     let toPort;
     let fromPort;
     let fromNode;
     if (isDrawingTo) {
+      const mouseHitInfo = this.linesManager.getNodeAndPortFromMousePos(dragPos, "input");
       fromPort = line.fromPort;
-      toNode = mouseNode;
-      toPort = this.linesManager.getPortFromMousePos(dragPos, "input");
+      toNode = mouseHitInfo.node;
+      toPort = mouseHitInfo.port;
       if (toNode && this.canBuildContainerLine(toNode, dragPos)) {
         toPort = this.getNearestPort(toNode, dragPos, "input");
         hasError = this.checkDraggingPort(isDrawingTo, line, toNode, toPort, originLine).hasError;
@@ -3442,9 +3592,10 @@ var WorkflowDragService = class {
         };
       }
     } else {
+      const mouseHitInfo = this.linesManager.getNodeAndPortFromMousePos(dragPos, "output");
       toPort = line.toPort;
-      fromNode = mouseNode;
-      fromPort = this.linesManager.getPortFromMousePos(dragPos, "output");
+      fromNode = mouseHitInfo.node;
+      fromPort = mouseHitInfo.port;
       if (fromNode && this.canBuildContainerLine(fromNode, dragPos)) {
         fromPort = this.getNearestPort(fromNode, dragPos, "output");
         hasError = this.checkDraggingPort(