@flowgram.ai/free-auto-layout-plugin 0.2.16 → 0.2.18

package/dist/index.d.mts

@@ -140,12 +140,18 @@ declare namespace dagreLib {
     export { reversePointsForReversedEdges };
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare class LayoutStore {
     readonly config: LayoutConfig;
     private indexMap;
     private init;
     private store;
     private container;
+    options: LayoutOptions;
     constructor(config: LayoutConfig);
     get initialized(): boolean;
     getNode(id?: string): LayoutNode | undefined;
@@ -153,7 +159,7 @@ declare class LayoutStore {
     getEdge(id: string): LayoutEdge | undefined;
     get nodes(): LayoutNode[];
     get edges(): LayoutEdge[];
-    create(params: LayoutParams): void;
+    create(params: LayoutParams, options: LayoutOptions): void;
     /** 创建布局数据 */
     private createStore;
     /** 创建节点布局数据 */
@@ -166,8 +172,17 @@ declare class LayoutStore {
     private createIndexMap;
     /** 节点排序 */
     private sortNodes;
+    /** 记录运行选项 */
+    private setOptions;
+    /** 设置跟随节点配置 */
+    private setFollowNode;
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 interface LayoutNode {
     id: string;
     /** 节点索引 */
@@ -222,6 +237,7 @@ interface LayoutParams {
 }
 interface LayoutOptions {
     getFollowNode?: GetFollowNode;
+    enableAnimation: boolean;
 }
 interface LayoutConfig {
     /** Direction for rank nodes. Can be TB, BT, LR, or RL, where T = top, B = bottom, L = left, and R = right. */
@@ -251,30 +267,49 @@ type GetFollowNode = (node: LayoutNode, context: {
     followTo?: string;
 } | undefined;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 interface AutoLayoutOptions {
     layoutConfig?: Partial<LayoutConfig>;
 }
 
 declare const createFreeAutoLayoutPlugin: _flowgram_ai_core.PluginCreator<AutoLayoutOptions>;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare class Layout {
     private readonly _store;
     private readonly _layout;
     private readonly _position;
     constructor(config: LayoutConfig);
-    init(params: LayoutParams, options?: LayoutOptions): void;
+    init(params: LayoutParams, options: LayoutOptions): void;
     layout(): void;
     position(): Promise<void>;
-    setFollowNode(getFollowNode?: GetFollowNode): void;
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare const DefaultLayoutConfig: LayoutConfig;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare class AutoLayoutService {
     private readonly document;
     private layoutConfig;
     init(options: AutoLayoutOptions): void;
-    layout(options?: LayoutOptions): Promise<void>;
+    layout(options?: Partial<LayoutOptions>): Promise<void>;
     private layoutNode;
     private getNodesAllLines;
 }

package/dist/index.d.ts

@@ -140,12 +140,18 @@ declare namespace dagreLib {
     export { reversePointsForReversedEdges };
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare class LayoutStore {
     readonly config: LayoutConfig;
     private indexMap;
     private init;
     private store;
     private container;
+    options: LayoutOptions;
     constructor(config: LayoutConfig);
     get initialized(): boolean;
     getNode(id?: string): LayoutNode | undefined;
@@ -153,7 +159,7 @@ declare class LayoutStore {
     getEdge(id: string): LayoutEdge | undefined;
     get nodes(): LayoutNode[];
     get edges(): LayoutEdge[];
-    create(params: LayoutParams): void;
+    create(params: LayoutParams, options: LayoutOptions): void;
     /** 创建布局数据 */
     private createStore;
     /** 创建节点布局数据 */
@@ -166,8 +172,17 @@ declare class LayoutStore {
     private createIndexMap;
     /** 节点排序 */
     private sortNodes;
+    /** 记录运行选项 */
+    private setOptions;
+    /** 设置跟随节点配置 */
+    private setFollowNode;
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 interface LayoutNode {
     id: string;
     /** 节点索引 */
@@ -222,6 +237,7 @@ interface LayoutParams {
 }
 interface LayoutOptions {
     getFollowNode?: GetFollowNode;
+    enableAnimation: boolean;
 }
 interface LayoutConfig {
     /** Direction for rank nodes. Can be TB, BT, LR, or RL, where T = top, B = bottom, L = left, and R = right. */
@@ -251,30 +267,49 @@ type GetFollowNode = (node: LayoutNode, context: {
     followTo?: string;
 } | undefined;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 interface AutoLayoutOptions {
     layoutConfig?: Partial<LayoutConfig>;
 }
 
 declare const createFreeAutoLayoutPlugin: _flowgram_ai_core.PluginCreator<AutoLayoutOptions>;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare class Layout {
     private readonly _store;
     private readonly _layout;
     private readonly _position;
     constructor(config: LayoutConfig);
-    init(params: LayoutParams, options?: LayoutOptions): void;
+    init(params: LayoutParams, options: LayoutOptions): void;
     layout(): void;
     position(): Promise<void>;
-    setFollowNode(getFollowNode?: GetFollowNode): void;
 }
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare const DefaultLayoutConfig: LayoutConfig;
 
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
 declare class AutoLayoutService {
     private readonly document;
     private layoutConfig;
     init(options: AutoLayoutOptions): void;
-    layout(options?: LayoutOptions): Promise<void>;
+    layout(options?: Partial<LayoutOptions>): Promise<void>;
     private layoutNode;
     private getNodesAllLines;
 }

package/dist/index.js

@@ -2111,6 +2111,23 @@ var import_core2 = require("@flowgram.ai/core");
 var import_inversify = require("inversify");
 var import_free_layout_core2 = require("@flowgram.ai/free-layout-core");
 
+// src/layout/constant.ts
+var DefaultLayoutConfig = {
+  rankdir: "LR",
+  align: void 0,
+  nodesep: 100,
+  edgesep: 10,
+  ranksep: 100,
+  marginx: 0,
+  marginy: 0,
+  acyclicer: void 0,
+  ranker: "network-simplex"
+};
+var DefaultLayoutOptions = {
+  getFollowNode: void 0,
+  enableAnimation: false
+};
+
 // src/layout/store.ts
 var import_free_layout_core = require("@flowgram.ai/free-layout-core");
 var import_document = require("@flowgram.ai/document");
@@ -2141,9 +2158,10 @@ var LayoutStore = class {
   get edges() {
     return Array.from(this.store.edges.values());
   }
-  create(params) {
+  create(params, options) {
     this.store = this.createStore(params);
     this.indexMap = this.createIndexMap();
+    this.setOptions(options);
     this.init = true;
   }
   /** 创建布局数据 */
@@ -2333,6 +2351,27 @@ var LayoutStore = class {
     }, []);
     return uniqueNodeIds;
   }
+  /** 记录运行选项 */
+  setOptions(options) {
+    this.options = options;
+    this.setFollowNode(options.getFollowNode);
+  }
+  /** 设置跟随节点配置 */
+  setFollowNode(getFollowNode) {
+    if (!getFollowNode) return;
+    const context = { store: this };
+    this.nodes.forEach((node) => {
+      const followTo = getFollowNode(node, context)?.followTo;
+      if (!followTo) return;
+      const followToNode = this.getNode(followTo);
+      if (!followToNode) return;
+      if (!followToNode.followedBy) {
+        followToNode.followedBy = [];
+      }
+      followToNode.followedBy.push(node.id);
+      node.followTo = followTo;
+    });
+  }
 };
 
 // src/layout/position.ts
@@ -2342,6 +2381,17 @@ var LayoutPosition = class {
     this.store = store;
   }
   async position() {
+    if (this.store.options.enableAnimation) {
+      return this.positionWithAnimation();
+    }
+    return this.positionDirectly();
+  }
+  positionDirectly() {
+    this.store.nodes.forEach((layoutNode) => {
+      this.updateNodePosition({ layoutNode, step: 100 });
+    });
+  }
+  async positionWithAnimation() {
     return new Promise((resolve) => {
       (0, import_core.startTween)({
         from: { d: 0 },
@@ -2556,9 +2606,8 @@ var Layout = class {
     this._layout = new DagreLayout(this._store);
     this._position = new LayoutPosition(this._store);
   }
-  init(params, options = {}) {
-    this._store.create(params);
-    this.setFollowNode(options.getFollowNode);
+  init(params, options) {
+    this._store.create(params, options);
   }
   layout() {
     if (!this._store.initialized) {
@@ -2572,34 +2621,6 @@ var Layout = class {
     }
     return await this._position.position();
   }
-  setFollowNode(getFollowNode) {
-    if (!getFollowNode) return;
-    const context = { store: this._store };
-    this._store.nodes.forEach((node) => {
-      const followTo = getFollowNode(node, context)?.followTo;
-      if (!followTo) return;
-      const followToNode = this._store.getNode(followTo);
-      if (!followToNode) return;
-      if (!followToNode.followedBy) {
-        followToNode.followedBy = [];
-      }
-      followToNode.followedBy.push(node.id);
-      node.followTo = followTo;
-    });
-  }
-};
-
-// src/layout/constant.ts
-var DefaultLayoutConfig = {
-  rankdir: "LR",
-  align: void 0,
-  nodesep: 100,
-  edgesep: 10,
-  ranksep: 100,
-  marginx: 0,
-  marginy: 0,
-  acyclicer: void 0,
-  ranker: "network-simplex"
 };
 
 // src/services.ts
@@ -2614,7 +2635,10 @@ var AutoLayoutService = class {
     };
   }
   async layout(options = {}) {
-    await this.layoutNode(this.document.root, options);
+    await this.layoutNode(this.document.root, {
+      ...DefaultLayoutOptions,
+      ...options
+    });
   }
   async layoutNode(node, options) {
     const nodes = node.blocks;