feat: node registry meta add autoResizeDisable and remove expandedSize (#388)

packages/canvas-engine/document/src/datas/flow-node-transform-data.ts

@@ -35,11 +35,10 @@ export class FlowNodeTransformData extends EntityData<FlowNodeTransformSchema> {
   }
 
   getDefaultData(): FlowNodeTransformSchema {
-    const { size, defaultExpanded, expandedSize, hidden } = this.entity.getNodeMeta();
-    const defaultSize = defaultExpanded ? expandedSize : size;
+    const { size, hidden } = this.entity.getNodeMeta();
     // 更新默认 size 大小
     return {
-      size: !hidden ? { ...defaultSize } : { width: 0, height: 0 },
+      size: !hidden ? { ...size } : { width: 0, height: 0 },
     };
   }
 

packages/canvas-engine/document/src/typings/flow-node-register.ts

@@ -30,13 +30,13 @@ export interface FlowNodeMeta {
   hidden?: boolean; // 是否隐藏
   // maxSize?: SizeSchema // 默认展开后的大小
   size?: SizeSchema; // 默认大小
+  autoResizeDisable?: boolean; // 禁用监听节点变化自动调整大小
   /**
    * @deprecated 使用 NodeRegister.getOrigin 代替
    */
   origin?: OriginSchema; // 原点配置，默认 垂直 { x: 0.5, y: 0 } 水平 { x: 0, y: 0.5 }
   defaultExpanded?: boolean; // 默认是否展开
   defaultCollapsed?: boolean; // 复合节点默认是否收起
-  expandedSize?: SizeSchema; // 默认缩小版大小
   spacing?: number | ((transform: FlowNodeTransformData) => number); // 兄弟节点间，等价于 marginBottom
   padding?: PaddingSchema | ((transform: FlowNodeTransformData) => PaddingSchema); // 节点设置了 padding，则不需要 inlineSpacingPre 和 inlineSpacingAfter
   inlineSpacingPre?: number | ((transform: FlowNodeTransformData) => number); // 父子节点间，等价于 paddingTop 或者 paddingLeft
@@ -136,7 +136,6 @@ export const DEFAULT_FLOW_NODE_META: (
     isStart: nodeType === 'start',
     hidden,
     defaultExpanded: document.options.allNodesDefaultExpanded,
-    expandedSize: { width: 520, height: 300 }, // 展开后的大小
     size: DEFAULT_SIZE,
     origin: document.layout.getDefaultNodeOrigin(),
     isInlineBlocks: nodeType === FlowNodeBaseType.INLINE_BLOCKS,

packages/canvas-engine/renderer/src/layers/flow-nodes-content-layer.tsx

@@ -81,9 +81,9 @@ export class FlowNodesContentLayer extends Layer {
       const PortalRenderer = this.getPortalRenderer(data!);
 
       function Portal(): JSX.Element {
-        React.useEffect(() => {
+        React.useLayoutEffect(() => {
           // 第一次加载需要把宽高通知
-          if (node.clientWidth && node.clientHeight) {
+          if (!entity.getNodeMeta().autoResizeDisable && node.clientWidth && node.clientHeight) {
             const transform = entity.getData<FlowNodeTransformData>(FlowNodeTransformData);
             if (transform)
               transform.size = {
@@ -91,7 +91,7 @@ export class FlowNodesContentLayer extends Layer {
                 height: node.clientHeight,
               };
           }
-        }, []);
+        }, [entity, node]);
         // 这里使用 portal，改 dom 样式不会引起 react 重新渲染
         return ReactDOM.createPortal(
           <PlaygroundEntityContext.Provider value={entity}>

packages/canvas-engine/renderer/src/layers/flow-nodes-transform-layer.tsx

@@ -73,7 +73,9 @@ export class FlowNodesTransformLayer extends Layer<FlowNodesTransformLayerOption
         if (resizeDispose) return;
         // 监听 dom 节点的大小变化
         this.renderElement.appendChild(node);
-        resizeDispose = this.resizeObserver.observe(node, transform!);
+        if (!entity.getNodeMeta().autoResizeDisable) {
+          resizeDispose = this.resizeObserver.observe(node, transform!);
+        }
       };
       const dispose = () => {
         if (!resizeDispose) return;