@flowgram.ai/free-auto-layout-plugin 1.0.8 → 1.0.10

package/dist/index.d.mts

@@ -224,16 +224,29 @@ interface LayoutParams {
     layoutEdges: LayoutEdge[];
 }
 interface LayoutOptions {
+    /** Custom layout configuration to override default dagre settings. */
     layoutConfig?: Partial<LayoutConfig>;
+    /** The container node entity used as the root for the layout. */
     containerNode?: WorkflowNodeEntity;
+    /** Custom function to determine follow-node relationships between layout nodes. */
     getFollowNode?: GetFollowNode;
+    /** Whether to animate node movements during layout positioning. */
     enableAnimation?: boolean;
+    /** Duration of the position animation in milliseconds. Only effective when `enableAnimation` is true. */
     animationDuration?: number;
+    /** When true, skips the fit-view step after layout is applied. */
     disableFitView?: boolean;
+    /**
+     * When true, aligns nodes by their top edge instead of their center point.
+     * Defaults to false (center-aligned). Set to true to place all nodes' top edges on the same horizontal line.
+     */
+    alignTopEdge?: boolean;
+    /** Filter function to exclude specific nodes from the layout. Return false to skip a node. */
     filterNode?: (params: {
         node: WorkflowNodeEntity;
         parent?: WorkflowNodeEntity;
     }) => boolean;
+    /** Filter function to exclude specific edges from the layout. Return false to skip an edge. */
     filterLine?: (params: {
         line: WorkflowLineEntity;
     }) => boolean;

package/dist/index.d.ts

@@ -224,16 +224,29 @@ interface LayoutParams {
     layoutEdges: LayoutEdge[];
 }
 interface LayoutOptions {
+    /** Custom layout configuration to override default dagre settings. */
     layoutConfig?: Partial<LayoutConfig>;
+    /** The container node entity used as the root for the layout. */
     containerNode?: WorkflowNodeEntity;
+    /** Custom function to determine follow-node relationships between layout nodes. */
     getFollowNode?: GetFollowNode;
+    /** Whether to animate node movements during layout positioning. */
     enableAnimation?: boolean;
+    /** Duration of the position animation in milliseconds. Only effective when `enableAnimation` is true. */
     animationDuration?: number;
+    /** When true, skips the fit-view step after layout is applied. */
     disableFitView?: boolean;
+    /**
+     * When true, aligns nodes by their top edge instead of their center point.
+     * Defaults to false (center-aligned). Set to true to place all nodes' top edges on the same horizontal line.
+     */
+    alignTopEdge?: boolean;
+    /** Filter function to exclude specific nodes from the layout. Return false to skip a node. */
     filterNode?: (params: {
         node: WorkflowNodeEntity;
         parent?: WorkflowNodeEntity;
     }) => boolean;
+    /** Filter function to exclude specific edges from the layout. Return false to skip an edge. */
     filterLine?: (params: {
         line: WorkflowLineEntity;
     }) => boolean;

package/dist/index.js

@@ -2192,7 +2192,7 @@ var LayoutStore = class {
       const blockIdSet = new Set(blocks.map((b) => b.id));
       const groupFromEdges = edges.filter((edge) => blockIdSet.has(edge.to?.id ?? "")).map((edge) => {
         const { from, to } = edge.info;
-        if (!from || !to || edge.vertical) {
+        if (!from || !to) {
           return;
         }
         const id = `virtual_${groupId}_from_${from}_to_${to}`;
@@ -2211,7 +2211,7 @@ var LayoutStore = class {
       }).filter(Boolean);
       const groupToEdges = edges.filter((edge) => blockIdSet.has(edge.from?.id ?? "")).map((edge) => {
         const { from, to } = edge.info;
-        if (!from || !to || edge.vertical) {
+        if (!from || !to) {
           return;
         }
         const id = `virtual_${groupId}_from_${from}_to_${to}`;
@@ -2371,10 +2371,10 @@ var LayoutPosition = class {
   updateNodePosition(params) {
     const { layoutNode, step } = params;
     const { transform } = layoutNode.entity.transform;
+    const centerToTopEdgeOffset = (layoutNode.size.height - layoutNode.padding.top - layoutNode.padding.bottom) / 2;
     const layoutPosition = {
       x: layoutNode.position.x + layoutNode.offset.x,
-      // layoutNode.position.y 是中心点，但画布节点原点在上边沿的中间，所以 y 坐标需要转化后一下
-      y: layoutNode.position.y + layoutNode.offset.y - (layoutNode.size.height - layoutNode.padding.top - layoutNode.padding.bottom) / 2
+      y: layoutNode.position.y + layoutNode.offset.y - centerToTopEdgeOffset
     };
     const deltaX = (layoutPosition.x - transform.position.x) * step / 100;
     const deltaY = (layoutPosition.y - transform.position.y) * step / 100;
@@ -2400,6 +2400,7 @@ var DagreLayout = class {
   layout() {
     this.graphSetData();
     this.dagreLayout();
+    this.alignTopEdgeIfNeeded();
     this.layoutSetPosition();
   }
   dagreLayout() {
@@ -2484,6 +2485,28 @@ var DagreLayout = class {
       };
     });
   }
+  alignTopEdgeIfNeeded() {
+    const { alignTopEdge } = this.store.options;
+    const { rankdir, marginy = 0 } = this.store.config;
+    if (!alignTopEdge || rankdir !== "LR" && rankdir !== "RL") {
+      return;
+    }
+    const rankGroups = this.rankGroup(this.graph);
+    rankGroups.forEach((indexSet) => {
+      const graphNodes = Array.from(indexSet).map((id) => this.graph.node(id)).filter(Boolean);
+      if (graphNodes.length === 0) {
+        return;
+      }
+      const minTop = Math.min(...graphNodes.map((node) => node.y - node.height / 2));
+      const deltaY = marginy - minTop;
+      if (deltaY === 0) {
+        return;
+      }
+      graphNodes.forEach((node) => {
+        node.y += deltaY;
+      });
+    });
+  }
   normalizeNumber(number) {
     return Number.isNaN(number) ? 0 : number;
   }
@@ -2548,6 +2571,9 @@ var DagreLayout = class {
     const rankGroup = /* @__PURE__ */ new Map();
     g.nodes().forEach((i) => {
       const graphNode = g.node(i);
+      if (!graphNode || typeof graphNode.rank !== "number") {
+        return;
+      }
       const rank2 = graphNode.rank;
       if (!rankGroup.has(rank2)) {
         rankGroup.set(rank2, /* @__PURE__ */ new Set());