fix(auto-layout): offset x should depend on layout node size (#842)

packages/plugins/free-auto-layout-plugin/src/layout/dagre.ts

@@ -3,7 +3,6 @@
  * SPDX-License-Identifier: MIT
  */
 
-import { FlowNodeTransformData } from '@flowgram.ai/document';
 import { Graph as DagreGraph } from '@dagrejs/graphlib';
 
 import { dagreLib } from '../dagre-lib/index';
@@ -123,9 +122,8 @@ export class DagreLayout {
       return 0;
     }
     // 存在子节点才需计算padding带来的偏移
-    const nodeTransform = layoutNode.entity.getData(FlowNodeTransformData);
-    const { bounds, padding } = nodeTransform;
-    const leftOffset = -bounds.width / 2 + padding.left;
+    const { padding } = layoutNode;
+    const leftOffset = -layoutNode.size.width / 2 + padding.left;
     return leftOffset;
   }
 

packages/plugins/free-auto-layout-plugin/src/layout/type.ts

@@ -53,6 +53,13 @@ export interface LayoutNode {
     x: number;
     y: number;
   };
+  /** 边距 */
+  padding: {
+    top: number;
+    bottom: number;
+    left: number;
+    right: number;
+  };
   /** 宽高 */
   size: LayoutSize;
   /** 子节点 */

packages/plugins/free-auto-layout-plugin/src/services.ts

@@ -88,7 +88,7 @@ export class AutoLayoutService {
     const layoutNodes = this.createLayoutNodes(blocks, options);
     const layoutEdges = this.createLayoutEdges(edges);
 
-    const { bounds } = node.transform;
+    const { bounds, padding } = node.transform;
     const { width, height, center } = bounds;
     const { x, y } = center;
     const layoutNode: LayoutNode = {
@@ -99,6 +99,7 @@ export class AutoLayoutService {
       order: -1, // 初始化时，节点还未布局，顺序为-1
       position: { x, y },
       offset: { x: 0, y: 0 },
+      padding,
       size: { width, height },
       layoutNodes,
       layoutEdges,
@@ -147,7 +148,7 @@ export class AutoLayoutService {
   private getLayoutNodeRect(layoutNode: LayoutNode): Rectangle {
     const rects = layoutNode.layoutNodes.map((node) => this.layoutNodeRect(node));
     const rect = Rectangle.enlarge(rects);
-    const { padding } = layoutNode.entity.transform;
+    const { padding } = layoutNode;
     const width = rect.width + padding.left + padding.right;
     const height = rect.height + padding.top + padding.bottom;
     const x = rect.x - padding.left;