@flowgram.ai/free-layout-core 0.1.0-alpha.14 → 0.1.0-alpha.16

package/dist/esm/index.js

@@ -43,8 +43,7 @@ import {
   useEntities,
   useEntityFromContext as useEntityFromContext3,
   useEntityDataFromContext,
-  useRefresh as useRefresh2,
-  usePlaygroundLatest
+  useRefresh as useRefresh2
 } from "@flowgram.ai/core";
 
 // src/hooks/use-node-render.tsx
@@ -455,6 +454,7 @@ var WorkflowNodePortsData = class extends EntityData {
         ...Array.from(elements).map((element) => ({
           portID: element.getAttribute("data-port-id"),
           type: element.getAttribute("data-port-type"),
+          location: element.getAttribute("data-port-location"),
           targetElement: element
         }))
       );
@@ -776,11 +776,11 @@ var WorkflowLineRenderData = class extends EntityData3 {
    * WARNING: 这个方法，必须在 requestAnimationFrame / useLayoutEffect 中调用，否则会引起浏览器强制重排
    */
   updatePosition() {
-    this.data.position.from = this.entity.from.getData(WorkflowNodePortsData).getOutputPoint(this.entity.info.fromPort);
+    this.data.position.from = this.entity.from.ports.getOutputPoint(this.entity.info.fromPort);
     if (this.entity.info.drawingTo) {
       this.data.position.to = this.entity.info.drawingTo;
     } else {
-      this.data.position.to = this.entity.to?.getData(WorkflowNodePortsData)?.getInputPoint(this.entity.info.toPort) ?? {
+      this.data.position.to = this.entity.to?.ports?.getInputPoint(this.entity.info.toPort) ?? {
         x: this.data.position.from.x,
         y: this.data.position.from.y,
         location: this.data.position.from.location === "right" ? "left" : "top"
@@ -1042,13 +1042,13 @@ var _WorkflowLineEntity = class _WorkflowLineEntity extends Entity2 {
     return this.getData(WorkflowLineRenderData).calcDistance(pos);
   }
   get fromPort() {
-    return this.from.getData(WorkflowNodePortsData).getPortEntityByKey("output", this.info.fromPort);
+    return this.from.ports.getPortEntityByKey("output", this.info.fromPort);
   }
   get toPort() {
     if (!this.to) {
       return void 0;
     }
-    return this.to.getData(WorkflowNodePortsData).getPortEntityByKey("input", this.info.toPort);
+    return this.to.ports.getPortEntityByKey("input", this.info.toPort);
   }
   /**
    * 获取线条真实的输入输出节点坐标
@@ -1078,7 +1078,9 @@ var _WorkflowLineEntity = class _WorkflowLineEntity extends Entity2 {
   get disabled() {
     return this.linesManager.isDisabledLine(this, this.uiState.disabled);
   }
-  /** 是否竖向 */
+  /**
+   * @deprecated
+   */
   get vertical() {
     const fromLocation = this.fromPort.location;
     const toLocation = this.toPort?.location;
@@ -1724,7 +1726,7 @@ var WorkflowLinesManager = class {
    */
   getPortFromMousePos(pos) {
     const allNodes = this.getSortedNodes().reverse();
-    const allPorts = allNodes.map((node) => node.getData(WorkflowNodePortsData).allPorts).flat();
+    const allPorts = allNodes.map((node) => node.ports.allPorts).flat();
     const targetPort = allPorts.find((port) => port.isHovered(pos.x, pos.y));
     if (targetPort) {
       const containNodes = this.getContainNodesFromMousePos(pos);
@@ -2179,8 +2181,11 @@ var WorkflowDocument = class extends FlowDocument {
         originParent,
         meta
       });
+      this.options.preNodeCreate?.(node);
       const datas = dataRegistries ? this.nodeDataRegistries.concat(...dataRegistries) : this.nodeDataRegistries;
       node.addInitializeData(datas);
+      node.ports = node.getData(WorkflowNodePortsData);
+      node.lines = node.getData(WorkflowNodeLinesData);
       node.onDispose(() => this.onNodeDisposeEmitter.fire({ node }));
       this.options.fromNodeJSON?.(node, data, true);
       isNew = true;
@@ -2588,6 +2593,18 @@ function checkDragSuccess(time, e, originLine) {
   }
   return false;
 }
+function reverseLocation(sourceLocation) {
+  switch (sourceLocation) {
+    case "bottom":
+      return "top";
+    case "left":
+      return "right";
+    case "top":
+      return "bottom";
+    case "right":
+      return "left";
+  }
+}
 var WorkflowDragService = class {
   constructor() {
     this._onDragLineEventEmitter = new Emitter6();
@@ -2619,10 +2636,6 @@ var WorkflowDragService = class {
       return Promise.resolve(false);
     }
     this.isDragging = true;
-    const sameParent = this.childrenOfContainer(selectedNodes);
-    if (sameParent && sameParent.flowNodeType !== FlowNodeBaseType3.ROOT) {
-      selectedNodes = [sameParent];
-    }
     let startPosition = this.getNodesPosition(selectedNodes);
     let startPositions = selectedNodes.map((node) => {
       const transform = node.getData(TransformData8);
@@ -2684,6 +2697,7 @@ var WorkflowDragService = class {
           triggerEvent,
           dragger
         });
+        this.resetContainerInternalPosition(selectedNodes);
       }
     });
     const { clientX, clientY } = MouseTouchEvent.getEventCoord(triggerEvent);
@@ -2724,7 +2738,7 @@ var WorkflowDragService = class {
         const targetNode = event.currentTarget;
         domNode = cloneNode ? cloneNode(e) : targetNode.cloneNode(true);
         const bounds = targetNode.getBoundingClientRect();
-        startPos = { x: bounds.left, y: bounds.top };
+        startPos = { x: bounds.left + window.scrollX, y: bounds.top + window.scrollY };
         domUtils2.setStyle(domNode, {
           zIndex: 1e3,
           position: "absolute",
@@ -2954,12 +2968,48 @@ var WorkflowDragService = class {
       };
     }
   }
+  /**
+   * 容器内子节点总体位置重置为0
+   */
+  resetContainerInternalPosition(nodes) {
+    const container = this.childrenOfContainer(nodes);
+    if (!container) {
+      return;
+    }
+    const bounds = Rectangle8.enlarge(
+      container.blocks.map((node) => {
+        const x = node.transform.position.x - node.transform.bounds.width / 2;
+        const y = node.transform.position.y;
+        const width = node.transform.bounds.width;
+        const height = node.transform.bounds.height;
+        return new Rectangle8(x, y, width, height);
+      })
+    );
+    const containerTransform = container.getData(TransformData8);
+    containerTransform.update({
+      position: {
+        x: containerTransform.position.x + bounds.x,
+        y: containerTransform.position.y + bounds.y
+      }
+    });
+    this.document.layout.updateAffectedTransform(container);
+    container.blocks.forEach((node) => {
+      const transform = node.getData(TransformData8);
+      transform.update({
+        position: {
+          x: transform.position.x - bounds.x,
+          y: transform.position.y - bounds.y
+        }
+      });
+      this.document.layout.updateAffectedTransform(node);
+    });
+  }
   childrenOfContainer(nodes) {
     if (nodes.length === 0) {
       return;
     }
     const sourceContainer = nodes[0]?.parent;
-    if (!sourceContainer || sourceContainer.collapsedChildren.length !== nodes.length) {
+    if (!sourceContainer) {
       return;
     }
     const valid = nodes.every((node) => node?.parent === sourceContainer);
@@ -3045,7 +3095,7 @@ var WorkflowDragService = class {
           line.drawingTo = {
             x: dragPos.x,
             y: dragPos.y,
-            location: line.fromPort.location === "right" ? "left" : "top"
+            location: reverseLocation(line.fromPort.location)
           };
         }
         originLine?.validate();
@@ -3160,7 +3210,7 @@ var WorkflowDragService = class {
   }
   /** 获取最近的 port */
   getNearestPort(node, mousePos) {
-    const portsData = node.getData(WorkflowNodePortsData);
+    const portsData = node.ports;
     const distanceSortedPorts = portsData.inputPorts.sort((a, b) => {
       const aDistance = Math.abs(mousePos.y - a.point.y);
       const bDistance = Math.abs(mousePos.y - b.point.y);
@@ -3365,7 +3415,7 @@ var isFirefox = navigator?.userAgent?.includes?.("Firefox");
 function useNodeRender(nodeFromProps) {
   const node = nodeFromProps || useContext(PlaygroundEntityContext);
   const renderData = node.getData(FlowNodeRenderData3);
-  const portsData = node.getData(WorkflowNodePortsData);
+  const portsData = node.ports;
   const readonly = usePlaygroundReadonlyState();
   const dragService = useService(WorkflowDragService);
   const selectionService = useService(WorkflowSelectService);
@@ -3593,11 +3643,35 @@ WorkflowDocumentContribution = __decorateClass([
 
 // src/utils/get-url-params.ts
 function getUrlParams() {
-  return location.search.replace(/^\?/, "").split("&").reduce((res, key) => {
+  const paramsMap = /* @__PURE__ */ new Map();
+  location.search.replace(/^\?/, "").split("&").forEach((key) => {
+    if (!key) return;
     const [k, v] = key.split("=");
-    res[k] = v;
-    return res;
-  }, {});
+    if (k) {
+      const decodedKey = decodeURIComponent(k.trim());
+      const decodedValue = v ? decodeURIComponent(v.trim()) : "";
+      const dangerousProps = [
+        "__proto__",
+        "constructor",
+        "prototype",
+        "__defineGetter__",
+        "__defineSetter__",
+        "__lookupGetter__",
+        "__lookupSetter__",
+        "hasOwnProperty",
+        "isPrototypeOf",
+        "propertyIsEnumerable",
+        "toString",
+        "valueOf",
+        "toLocaleString"
+      ];
+      if (dangerousProps.includes(decodedKey.toLowerCase())) {
+        return;
+      }
+      paramsMap.set(decodedKey, decodedValue);
+    }
+  });
+  return Object.fromEntries(paramsMap);
 }
 
 // src/workflow-document-container-module.ts
@@ -3672,7 +3746,6 @@ export {
   usePlayground2 as usePlayground,
   usePlaygroundContainer,
   usePlaygroundContext,
-  usePlaygroundLatest,
   usePlaygroundReadonlyState,
   useRefresh2 as useRefresh,
   useService3 as useService,