chore(release): publish 1.0.16-beta.9

lerna.json

@@ -1,6 +1,6 @@
 {
   "lerna": "4.0.0",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "npmClient": "yarn",
   "useWorkspaces": true,
   "packages": [

packages/designer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-designer",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "Designer for Ali LowCode Engine",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -15,10 +15,10 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@alilc/lowcode-editor-core": "1.0.15",
+    "@alilc/lowcode-editor-core": "1.0.16-beta.9",
-    "@alilc/lowcode-shell": "1.0.15",
+    "@alilc/lowcode-shell": "1.0.16-beta.9",
-    "@alilc/lowcode-types": "1.0.15",
+    "@alilc/lowcode-types": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "classnames": "^2.2.6",
     "enzyme": "^3.11.0",
     "enzyme-adapter-react-16": "^1.15.5",
@@ -59,5 +59,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/designer"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/designer/src/builtin-simulator/host.ts

@@ -36,6 +36,7 @@ import {
   hasOwnProperty,
   UtilsMetadata,
   getClosestNode,
+  transactionManager,
 } from '@alilc/lowcode-utils';
 import {
   DragObjectType,
@@ -59,9 +60,8 @@ import { getClosestClickableNode } from './utils/clickable';
 import {
   ComponentMetadata,
   ComponentSchema,
-  TransformStage,
-  ActivityData,
   Package,
+  TransitionType,
 } from '@alilc/lowcode-types';
 import { BuiltinSimulatorRenderer } from './renderer';
 import clipboard from '../designer/clipboard';
@@ -181,6 +181,14 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
    */
   autoRender = true;
 
+  stopAutoRepaintNode() {
+    this.renderer?.stopAutoRepaintNode();
+  }
+
+  enableAutoRepaintNode() {
+    this.renderer?.enableAutoRepaintNode();
+  }
+
   constructor(project: Project) {
     makeObservable(this);
     this.project = project;
@@ -194,6 +202,13 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
         i18n: this.project.i18n,
       };
     });
+    transactionManager.onStartTransaction(() => {
+      this.stopAutoRepaintNode();
+    }, TransitionType.REPAINT);
+    transactionManager.onEndTransaction(() => {
+      this.rerender();
+      this.enableAutoRepaintNode();
+    }, TransitionType.REPAINT);
   }
 
   get currentDocument() {

packages/designer/src/builtin-simulator/renderer.ts

@@ -13,6 +13,8 @@ export interface BuiltinSimulatorRenderer {
   setCopyState(state: boolean): void;
   loadAsyncLibrary(asyncMap: { [index: string]: any }): void;
   clearState(): void;
+  stopAutoRepaintNode(): void;
+  enableAutoRepaintNode(): void;
   run(): void;
 }
 

packages/designer/src/document/history.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from 'events';
-import { autorun, reaction, mobx, untracked, globalContext, Editor } from '@alilc/lowcode-editor-core';
+import { reaction, untracked, globalContext, Editor } from '@alilc/lowcode-editor-core';
 import { NodeSchema } from '@alilc/lowcode-types';
 import { History as ShellHistory } from '@alilc/lowcode-shell';
 
@@ -32,14 +32,14 @@ export class History<T = NodeSchema> {
     this.currentSerialization = serialization;
   }
 
-  constructor(dataFn: () => T, private redoer: (data: T) => void, private timeGap: number = 1000) {
+  constructor(dataFn: () => T | null, private redoer: (data: T) => void, private timeGap: number = 1000) {
     this.session = new Session(0, null, this.timeGap);
     this.records = [this.session];
 
-    reaction(() => {
+    reaction((): any => {
       return dataFn();
     }, (data: T) => {
-      if (this.asleep) return;
+      if (this.asleep) return null;
       untracked(() => {
         const log = this.currentSerialization.serialize(data);
         if (this.session.isActive()) {
@@ -56,7 +56,6 @@ export class History<T = NodeSchema> {
             this.emitter.emit('statechange', currentState);
           }
         }
-        // }
       });
     }, { fireImmediately: true });
   }
@@ -69,11 +68,11 @@ export class History<T = NodeSchema> {
     return this.point !== this.session.cursor;
   }
 
-  private sleep() {
+  sleep() {
     this.asleep = true;
   }
 
-  private wakeup() {
+  wakeup() {
     this.asleep = false;
   }
 

packages/editor-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-editor-core",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "Core Api for Ali lowCode engine",
   "license": "MIT",
   "main": "lib/index.js",
@@ -14,8 +14,8 @@
   },
   "dependencies": {
     "@alifd/next": "^1.19.16",
-    "@alilc/lowcode-types": "1.0.15",
+    "@alilc/lowcode-types": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "classnames": "^2.2.6",
     "debug": "^4.1.1",
     "intl-messageformat": "^9.3.1",
@@ -49,5 +49,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/editor-core"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/editor-skeleton/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-editor-skeleton",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "alibaba lowcode editor skeleton",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -18,10 +18,10 @@
   ],
   "dependencies": {
     "@alifd/next": "^1.20.12",
-    "@alilc/lowcode-designer": "1.0.15",
+    "@alilc/lowcode-designer": "1.0.16-beta.9",
-    "@alilc/lowcode-editor-core": "1.0.15",
+    "@alilc/lowcode-editor-core": "1.0.16-beta.9",
-    "@alilc/lowcode-types": "1.0.15",
+    "@alilc/lowcode-types": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "classnames": "^2.2.6",
     "react": "^16.8.1",
     "react-dom": "^16.8.1"
@@ -42,5 +42,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/editor-skeleton"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/engine/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-engine",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "An enterprise-class low-code technology stack with scale-out design / 一套面向扩展设计的企业级低代码技术体系",
   "main": "lib/engine-core.js",
   "module": "es/engine-core.js",
@@ -19,14 +19,14 @@
   "license": "MIT",
   "dependencies": {
     "@alifd/next": "^1.19.12",
-    "@alilc/lowcode-designer": "1.0.15",
+    "@alilc/lowcode-designer": "1.0.16-beta.9",
-    "@alilc/lowcode-editor-core": "1.0.15",
+    "@alilc/lowcode-editor-core": "1.0.16-beta.9",
-    "@alilc/lowcode-editor-skeleton": "1.0.15",
+    "@alilc/lowcode-editor-skeleton": "1.0.16-beta.9",
     "@alilc/lowcode-engine-ext": "^1.0.0",
-    "@alilc/lowcode-plugin-designer": "1.0.15",
+    "@alilc/lowcode-plugin-designer": "1.0.16-beta.9",
-    "@alilc/lowcode-plugin-outline-pane": "1.0.15",
+    "@alilc/lowcode-plugin-outline-pane": "1.0.16-beta.9",
-    "@alilc/lowcode-shell": "1.0.15",
+    "@alilc/lowcode-shell": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "react": "^16.8.1",
     "react-dom": "^16.8.1"
   },
@@ -53,5 +53,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/engine"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/engine/src/modules/utils.ts

@@ -1,6 +1,6 @@
-import { isFormEvent, compatibleLegaoSchema, getNodeSchemaById } from '@alilc/lowcode-utils';
+import { isFormEvent, compatibleLegaoSchema, getNodeSchemaById, transactionManager } from '@alilc/lowcode-utils';
 import { isNodeSchema } from '@alilc/lowcode-types';
-import { getConvertedExtraKey, getOriginalExtraKey, isNode, isSettingField } from '@alilc/lowcode-designer';
+import { getConvertedExtraKey, getOriginalExtraKey } from '@alilc/lowcode-designer';
 
 const utils = {
   isNodeSchema,
@@ -9,6 +9,7 @@ const utils = {
   getNodeSchemaById,
   getConvertedExtraKey,
   getOriginalExtraKey,
+  executeTransaction: transactionManager.executeTransaction.bind(transactionManager),
 };
 
 export default utils;

packages/ignitor/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-ignitor",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "点火器，bootstrap lce project",
   "main": "lib/index.js",
   "private": true,

packages/plugin-designer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-plugin-designer",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "alibaba lowcode editor designer plugin",
   "files": [
     "es",
@@ -18,9 +18,9 @@
   ],
   "author": "xiayang.xy",
   "dependencies": {
-    "@alilc/lowcode-designer": "1.0.15",
+    "@alilc/lowcode-designer": "1.0.16-beta.9",
-    "@alilc/lowcode-editor-core": "1.0.15",
+    "@alilc/lowcode-editor-core": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "react": "^16.8.1",
     "react-dom": "^16.8.1"
   },
@@ -38,5 +38,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/plugin-designer"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/plugin-outline-pane/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-plugin-outline-pane",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "Outline pane for Ali lowCode engine",
   "files": [
     "es",
@@ -13,10 +13,10 @@
   },
   "dependencies": {
     "@alifd/next": "^1.19.16",
-    "@alilc/lowcode-designer": "1.0.15",
+    "@alilc/lowcode-designer": "1.0.16-beta.9",
-    "@alilc/lowcode-editor-core": "1.0.15",
+    "@alilc/lowcode-editor-core": "1.0.16-beta.9",
-    "@alilc/lowcode-types": "1.0.15",
+    "@alilc/lowcode-types": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "classnames": "^2.2.6",
     "react": "^16",
     "react-dom": "^16.7.0",
@@ -41,5 +41,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/plugin-outline-pane"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/rax-renderer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-rax-renderer",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "Rax renderer for Ali lowCode engine",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -30,8 +30,8 @@
     "build": "build-scripts build"
   },
   "dependencies": {
-    "@alilc/lowcode-renderer-core": "1.0.15",
+    "@alilc/lowcode-renderer-core": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "rax-find-dom-node": "^1.0.1"
   },
   "devDependencies": {
@@ -49,5 +49,5 @@
   },
   "license": "MIT",
   "homepage": "https://unpkg.alibaba-inc.com/@alilc/lowcode-rax-renderer@0.1.2/build/index.html",
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/rax-simulator-renderer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-rax-simulator-renderer",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "rax simulator renderer for alibaba lowcode designer",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -13,10 +13,10 @@
     "build:umd": "build-scripts build --config build.umd.json"
   },
   "dependencies": {
-    "@alilc/lowcode-designer": "1.0.15",
+    "@alilc/lowcode-designer": "1.0.16-beta.9",
-    "@alilc/lowcode-rax-renderer": "1.0.15",
+    "@alilc/lowcode-rax-renderer": "1.0.16-beta.9",
-    "@alilc/lowcode-types": "1.0.15",
+    "@alilc/lowcode-types": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "classnames": "^2.2.6",
     "driver-universal": "^3.1.3",
     "history": "^5.0.0",
@@ -51,5 +51,5 @@
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/rax-simulator-renderer"
   },
   "homepage": "https://unpkg.alibaba-inc.com/@alilc/lowcode-rax-simulator-renderer@1.0.73/build/index.html",
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/react-renderer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-react-renderer",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "react renderer for ali lowcode engine",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -22,7 +22,7 @@
   ],
   "dependencies": {
     "@alifd/next": "^1.21.16",
-    "@alilc/lowcode-renderer-core": "1.0.15"
+    "@alilc/lowcode-renderer-core": "1.0.16-beta.9"
   },
   "devDependencies": {
     "@alib/build-scripts": "^0.1.18",
@@ -43,5 +43,5 @@
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/react-renderer"
   },
   "homepage": "https://unpkg.alibaba-inc.com/@alilc/lowcode-react-renderer@1.0.21/build/index.html",
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/react-simulator-renderer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-react-simulator-renderer",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "react simulator renderer for alibaba lowcode designer",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -17,10 +17,10 @@
     "test:cov": "build-scripts test --config build.test.json --jest-coverage"
   },
   "dependencies": {
-    "@alilc/lowcode-designer": "1.0.15",
+    "@alilc/lowcode-designer": "1.0.16-beta.9",
-    "@alilc/lowcode-react-renderer": "1.0.15",
+    "@alilc/lowcode-react-renderer": "1.0.16-beta.9",
-    "@alilc/lowcode-types": "1.0.15",
+    "@alilc/lowcode-types": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "classnames": "^2.2.6",
     "mobx": "^6.3.0",
     "mobx-react": "^7.2.0",
@@ -44,5 +44,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/react-simulator-renderer"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/react-simulator-renderer/src/renderer.ts

@@ -349,6 +349,11 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
    * 是否为画布自动渲染
    */
   autoRender = true;
+
+  /**
+   * 画布是否自动监听事件来重绘节点
+   */
+  autoRepaintNode = true;
   /**
    * 加载资源
    */
@@ -491,6 +496,14 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
     this._appContext = { ...this._appContext };
   }
 
+  stopAutoRepaintNode() {
+    this.autoRepaintNode = false;
+  }
+
+  enableAutoRepaintNode() {
+    this.autoRepaintNode = true;
+  }
+
   dispose() {
     this.disposeFunctions.forEach(fn => fn());
     this.documentInstances.forEach(docInst => docInst.dispose());

packages/renderer-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-renderer-core",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "renderer core",
   "license": "MIT",
   "main": "lib/index.js",
@@ -16,8 +16,8 @@
   },
   "dependencies": {
     "@alilc/lowcode-datasource-engine": "^1.0.0",
-    "@alilc/lowcode-types": "1.0.15",
+    "@alilc/lowcode-types": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "classnames": "^2.2.6",
     "debug": "^4.1.1",
     "fetch-jsonp": "^1.1.3",
@@ -33,7 +33,7 @@
   "devDependencies": {
     "@alib/build-scripts": "^0.1.18",
     "@alifd/next": "^1.26.0",
-    "@alilc/lowcode-designer": "1.0.15",
+    "@alilc/lowcode-designer": "1.0.16-beta.9",
     "@alilc/lowcode-test-mate": "^1.0.1",
     "@babel/plugin-transform-typescript": "^7.16.8",
     "@testing-library/react": "^11.2.2",
@@ -59,5 +59,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/renderer-core"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/renderer-core/src/hoc/leaf.tsx

@@ -102,14 +102,23 @@ function initRerenderEvent({
     leaf,
     dispose: [
       leaf?.onPropChange?.(() => {
+        if (!container.autoRepaintNode) {
+          return;
+        }
         __debug(`${schema.componentName}[${schema.id}] leaf not render in SimulatorRendererView, leaf onPropsChange make rerender`);
         container.rerender();
       }),
       leaf?.onChildrenChange?.(() => {
+        if (!container.autoRepaintNode) {
+          return;
+        }
         __debug(`${schema.componentName}[${schema.id}] leaf not render in SimulatorRendererView, leaf onChildrenChange make rerender`);
         container.rerender();
       }) as Function,
       leaf?.onVisibleChange?.(() => {
+        if (!container.autoRepaintNode) {
+          return;
+        }
         __debug(`${schema.componentName}[${schema.id}] leaf not render in SimulatorRendererView, leaf onVisibleChange make rerender`);
         container.rerender();
       }),
@@ -213,14 +222,18 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
     }
 
     componentDidMount() {
+      const _leaf = this.leaf;
+      this.initOnPropsChangeEvent(_leaf);
+      this.initOnChildrenChangeEvent(_leaf);
+      this.initOnVisibleChangeEvent(_leaf);
       this.recordTime();
     }
 
-    get defaultState() {
+    getDefaultState(nextProps: any) {
       const {
         hidden = false,
         condition = true,
-      } = this.leaf?.export?.(TransformStage.Render) || {};
+      } = nextProps.__inner__ || this.leaf?.export?.(TransformStage.Render) || {};
       return {
         nodeChildren: null,
         childrenInState: false,
@@ -236,11 +249,7 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
       // 监听以下事件，当变化时更新自己
       __debug(`${schema.componentName}[${this.props.componentId}] leaf render in SimulatorRendererView`);
       clearRerenderEvent(componentCacheId);
-      const _leaf = this.leaf;
+      this.curEventLeaf = this.leaf;
-      this.initOnPropsChangeEvent(_leaf);
-      this.initOnChildrenChangeEvent(_leaf);
-      this.initOnVisibleChangeEvent(_leaf);
-      this.curEventLeaf = _leaf;
 
       cache.ref.set(componentCacheId, {
         makeUnitRender: this.makeUnitRender,
@@ -248,7 +257,7 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
 
       let cacheState = cache.state.get(componentCacheId);
       if (!cacheState || cacheState.__tag !== props.__tag) {
-        cacheState = this.defaultState;
+        cacheState = this.getDefaultState(props);
       }
 
       this.state = cacheState;
@@ -279,6 +288,10 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
       singleRender?: boolean;
     };
 
+    get autoRepaintNode() {
+      return container.autoRepaintNode;
+    }
+
     judgeMiniUnitRender() {
       if (!this.renderUnitInfo) {
         this.getRenderUnitInfo();
@@ -380,13 +393,16 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
       const {
         visible,
         ...resetState
-      } = this.defaultState;
+      } = this.getDefaultState(nextProps);
       this.setState(resetState);
     }
 
     /** 监听参数变化 */
     initOnPropsChangeEvent(leaf = this.leaf): void {
       const dispose = leaf?.onPropChange?.(debounce((propChangeInfo: PropChangeOptions) => {
+        if (!this.autoRepaintNode) {
+          return;
+        }
         const {
           key,
           newValue = null,
@@ -433,7 +449,7 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
         });
 
         this.judgeMiniUnitRender();
-      }, 30));
+      }, 20));
 
       dispose && this.disposeFunctions.push(dispose);
     }
@@ -443,6 +459,9 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
      */
     initOnVisibleChangeEvent(leaf = this.leaf) {
       const dispose = leaf?.onVisibleChange?.((flag: boolean) => {
+        if (!this.autoRepaintNode) {
+          return;
+        }
         if (this.state.visible === flag) {
           return;
         }
@@ -463,6 +482,9 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
      */
     initOnChildrenChangeEvent(leaf = this.leaf) {
       const dispose = leaf?.onChildrenChange?.((param): void => {
+        if (!this.autoRepaintNode) {
+          return;
+        }
         const {
           type,
           node,
@@ -540,6 +562,8 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
         ref: forwardedRef,
       };
 
+      delete compProps.__inner__;
+
       return engine.createElement(Comp, compProps, this.hasChildren ? this.children : null);
     }
   }

packages/renderer-core/src/renderer/base.tsx

@@ -670,7 +670,14 @@ export default function baseRendererFactory(): IBaseRenderComponent {
             }
           }
         }
-        return renderComp({ ...props, ...otherProps });
+        return renderComp({
+          ...props,
+          ...otherProps,
+          __inner__: {
+            hidden: schema.hidden,
+            condition,
+          },
+        });
       } catch (e) {
         return engine.createElement(engine.getFaultComponent(), {
           error: e,

packages/renderer-core/tests/hoc/leaf.test.tsx

@@ -35,7 +35,8 @@ const baseRenderer: any = {
     __container: {
       rerender: () => {
         rerenderCount = 1 + rerenderCount;
-      }
+      },
+      autoRepaintNode: true,
     },
     documentId: '01'
   },

packages/renderer-core/tests/renderer/__snapshots__/renderer.test.tsx.snap

@@ -11,6 +11,12 @@ exports[`Base Render renderComp 1`] = `
 >
   <div
     __id="node_dockcy8n9xed"
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": undefined,
+      }
+    }
     className="next-box"
     style={
       Object {
@@ -25,6 +31,12 @@ exports[`Base Render renderComp 1`] = `
   >
     <div
       __id="node_dockcy8n9xee"
+      __inner__={
+        Object {
+          "condition": true,
+          "hidden": undefined,
+        }
+      }
       className="next-box"
       style={
         Object {
@@ -39,6 +51,12 @@ exports[`Base Render renderComp 1`] = `
     >
       <nav
         __id="node_dockcy8n9xef"
+        __inner__={
+          Object {
+            "condition": true,
+            "hidden": undefined,
+          }
+        }
         aria-label="Breadcrumb"
         style={
           Object {
@@ -55,6 +73,12 @@ exports[`Base Render renderComp 1`] = `
           >
             <span
               __id="node_dockcy8n9xeg"
+              __inner__={
+                Object {
+                  "condition": true,
+                  "hidden": undefined,
+                }
+              }
               className="next-breadcrumb-text"
             >
               首页
@@ -74,6 +98,12 @@ exports[`Base Render renderComp 1`] = `
           >
             <span
               __id="node_dockcy8n9xei"
+              __inner__={
+                Object {
+                  "condition": true,
+                  "hidden": undefined,
+                }
+              }
               className="next-breadcrumb-text"
             >
               品质中台
@@ -93,6 +123,12 @@ exports[`Base Render renderComp 1`] = `
           >
             <span
               __id="node_dockcy8n9xek"
+              __inner__={
+                Object {
+                  "condition": true,
+                  "hidden": undefined,
+                }
+              }
               className="next-breadcrumb-text"
             >
               商家品质页面管理
@@ -112,6 +148,12 @@ exports[`Base Render renderComp 1`] = `
           >
             <span
               __id="node_dockcy8n9xem"
+              __inner__={
+                Object {
+                  "condition": true,
+                  "hidden": undefined,
+                }
+              }
               aria-current="page"
               className="next-breadcrumb-text activated"
             >
@@ -123,6 +165,12 @@ exports[`Base Render renderComp 1`] = `
     </div>
     <div
       __id="node_dockcy8n9xeo"
+      __inner__={
+        Object {
+          "condition": true,
+          "hidden": undefined,
+        }
+      }
       className="next-box"
       style={
         Object {
@@ -138,6 +186,12 @@ exports[`Base Render renderComp 1`] = `
       <form
         __events={Array []}
         __id="node_dockcy8n9xep"
+        __inner__={
+          Object {
+            "condition": true,
+            "hidden": undefined,
+          }
+        }
         className="next-form next-inline next-medium"
         onSubmit={[Function]}
         role="grid"
@@ -151,6 +205,12 @@ exports[`Base Render renderComp 1`] = `
       >
         <div
           __id="node_dockcy8n9xeq"
+          __inner__={
+            Object {
+              "condition": true,
+              "hidden": undefined,
+            }
+          }
           className="next-form-item next-left next-medium"
           style={
             Object {
@@ -193,6 +253,12 @@ exports[`Base Render renderComp 1`] = `
                   >
                     <input
                       __id="node_dockcy8n9xer"
+                      __inner__={
+                        Object {
+                          "condition": true,
+                          "hidden": undefined,
+                        }
+                      }
                       autoComplete="off"
                       disabled={false}
                       height="100%"
@@ -258,6 +324,12 @@ exports[`Base Render renderComp 1`] = `
         </div>
         <div
           __id="node_dockcy8n9xes"
+          __inner__={
+            Object {
+              "condition": true,
+              "hidden": undefined,
+            }
+          }
           className="next-form-item next-left next-medium"
           style={
             Object {
@@ -300,6 +372,12 @@ exports[`Base Render renderComp 1`] = `
                   >
                     <input
                       __id="node_dockcy8n9xet"
+                      __inner__={
+                        Object {
+                          "condition": true,
+                          "hidden": undefined,
+                        }
+                      }
                       autoComplete="off"
                       disabled={false}
                       height="100%"
@@ -365,6 +443,12 @@ exports[`Base Render renderComp 1`] = `
         </div>
         <div
           __id="node_dockcy8n9xeu"
+          __inner__={
+            Object {
+              "condition": true,
+              "hidden": undefined,
+            }
+          }
           className="next-form-item next-left next-medium"
           style={
             Object {
@@ -392,6 +476,12 @@ exports[`Base Render renderComp 1`] = `
             >
               <input
                 __id="node_dockcy8n9xev"
+                __inner__={
+                  Object {
+                    "condition": true,
+                    "hidden": undefined,
+                  }
+                }
                 autoComplete="off"
                 disabled={false}
                 height="100%"
@@ -412,10 +502,22 @@ exports[`Base Render renderComp 1`] = `
         </div>
         <div
           __id="node_dockcy8n9xew"
+          __inner__={
+            Object {
+              "condition": true,
+              "hidden": undefined,
+            }
+          }
           className="next-btn-group"
         >
           <button
             __id="node_dockcy8n9xex"
+            __inner__={
+              Object {
+                "condition": true,
+                "hidden": undefined,
+              }
+            }
             className="next-btn next-medium next-btn-primary"
             disabled={false}
             onClick={[Function]}
@@ -435,6 +537,12 @@ exports[`Base Render renderComp 1`] = `
           </button>
           <button
             __id="node_dockcy8n9xe10"
+            __inner__={
+              Object {
+                "condition": true,
+                "hidden": undefined,
+              }
+            }
             className="next-btn next-medium next-btn-normal"
             disabled={false}
             onClick={[Function]}
@@ -457,6 +565,12 @@ exports[`Base Render renderComp 1`] = `
     </div>
     <div
       __id="node_dockcy8n9xe1f"
+      __inner__={
+        Object {
+          "condition": true,
+          "hidden": undefined,
+        }
+      }
       className="next-box"
       style={
         Object {
@@ -482,6 +596,12 @@ exports[`Base Render renderComp 1`] = `
           ]
         }
         __id="node_dockd5nrh9p4"
+        __inner__={
+          Object {
+            "condition": true,
+            "hidden": undefined,
+          }
+        }
         className="next-btn next-medium next-btn-primary"
         disabled={false}
         onClick={[Function]}
@@ -498,6 +618,12 @@ exports[`Base Render renderComp 1`] = `
     </div>
     <div
       __id="node_dockd5nrh9p5"
+      __inner__={
+        Object {
+          "condition": true,
+          "hidden": undefined,
+        }
+      }
       className="next-box"
       style={
         Object {
@@ -510,6 +636,12 @@ exports[`Base Render renderComp 1`] = `
     >
       <div
         __id="node_dockjielosj1"
+        __inner__={
+          Object {
+            "condition": true,
+            "hidden": undefined,
+          }
+        }
         actionBar={
           Array [
             Object {
@@ -688,6 +820,12 @@ exports[`Base Render renderComp 1`] = `
       </div>
       <div
         __id="node_dockd5nrh9pg"
+        __inner__={
+          Object {
+            "condition": true,
+            "hidden": undefined,
+          }
+        }
         className="next-box"
         style={
           Object {
@@ -702,6 +840,12 @@ exports[`Base Render renderComp 1`] = `
       >
         <div
           __id="node_dockd5nrh9pf"
+          __inner__={
+            Object {
+              "condition": true,
+              "hidden": undefined,
+            }
+          }
           className="next-pagination next-medium next-normal"
           style={Object {}}
         >
@@ -898,6 +1042,12 @@ exports[`Base Render renderComp 1`] = `
         >
           <input
             __id="node_dockd5nrh9pr"
+            __inner__={
+              Object {
+                "condition": true,
+                "hidden": undefined,
+              }
+            }
             autoComplete="off"
             disabled={false}
             height="100%"
@@ -967,6 +1117,12 @@ exports[`JSExpression JSExpression props 1`] = `
   style={Object {}}
 >
   <div
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": undefined,
+      }
+    }
     className="div-ut"
     forwardRef={[Function]}
     visible={true}
@@ -980,12 +1136,24 @@ exports[`JSExpression JSExpression props with loop 1`] = `
   style={Object {}}
 >
   <div
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": undefined,
+      }
+    }
     className="div-ut"
     forwardRef={[Function]}
     name1="1"
     name2="1"
   />
   <div
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": undefined,
+      }
+    }
     className="div-ut"
     forwardRef={[Function]}
     name1="2"
@@ -1000,11 +1168,23 @@ exports[`JSExpression JSExpression props with loop, and thisRequiredInJSE is tru
   style={Object {}}
 >
   <div
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": undefined,
+      }
+    }
     className="div-ut"
     forwardRef={[Function]}
     name1="1"
   />
   <div
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": undefined,
+      }
+    }
     className="div-ut"
     forwardRef={[Function]}
     name1="2"
@@ -1018,6 +1198,12 @@ exports[`JSExpression JSFunction props 1`] = `
   style={Object {}}
 >
   <div
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": undefined,
+      }
+    }
     className="div-ut"
     forwardRef={[Function]}
     onClick={[Function]}
@@ -1032,6 +1218,12 @@ exports[`JSExpression JSSlot has loop 1`] = `
 >
   <div
     __id="node_ocl1ao1o7w3"
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": false,
+      }
+    }
     __style__=":root {
  padding: 12px;
  background: #f2f2f2;
@@ -1046,6 +1238,12 @@ exports[`JSExpression JSSlot has loop 1`] = `
   >
     <div
       __id="node_ocl1ao1o7w4"
+      __inner__={
+        Object {
+          "condition": true,
+          "hidden": false,
+        }
+      }
       __style__=":root {
  font-size: 14px;
  color: #666;
@@ -1063,6 +1261,12 @@ exports[`JSExpression JSSlot has loop 1`] = `
   </div>
   <div
     __id="node_ocl1ao1o7w3"
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": false,
+      }
+    }
     __style__=":root {
  padding: 12px;
  background: #f2f2f2;
@@ -1077,6 +1281,12 @@ exports[`JSExpression JSSlot has loop 1`] = `
   >
     <div
       __id="node_ocl1ao1o7w4"
+      __inner__={
+        Object {
+          "condition": true,
+          "hidden": false,
+        }
+      }
       __style__=":root {
  font-size: 14px;
  color: #666;
@@ -1094,6 +1304,12 @@ exports[`JSExpression JSSlot has loop 1`] = `
   </div>
   <div
     __id="node_ocl1ao1o7w3"
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": false,
+      }
+    }
     __style__=":root {
  padding: 12px;
  background: #f2f2f2;
@@ -1108,6 +1324,12 @@ exports[`JSExpression JSSlot has loop 1`] = `
   >
     <div
       __id="node_ocl1ao1o7w4"
+      __inner__={
+        Object {
+          "condition": true,
+          "hidden": false,
+        }
+      }
       __style__=":root {
  font-size: 14px;
  color: #666;
@@ -1132,6 +1354,12 @@ exports[`JSExpression base props 1`] = `
   style={Object {}}
 >
   <div
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": undefined,
+      }
+    }
     className="div-ut"
     forwardRef={[Function]}
     text="123"
@@ -1146,10 +1374,22 @@ exports[`designMode designMode:default 1`] = `
   style={Object {}}
 >
   <div
+    __inner__={
+      Object {
+        "condition": true,
+        "hidden": undefined,
+      }
+    }
     className="div-ut"
     forwardRef={[Function]}
   >
     <div
+      __inner__={
+        Object {
+          "condition": true,
+          "hidden": undefined,
+        }
+      }
       className="div-ut-children"
       forwardRef={[Function]}
     />

packages/shell/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-shell",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "Shell Layer for AliLowCodeEngine",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -15,11 +15,11 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@alilc/lowcode-designer": "1.0.15",
+    "@alilc/lowcode-designer": "1.0.16-beta.9",
-    "@alilc/lowcode-editor-core": "1.0.15",
+    "@alilc/lowcode-editor-core": "1.0.16-beta.9",
-    "@alilc/lowcode-editor-skeleton": "1.0.15",
+    "@alilc/lowcode-editor-skeleton": "1.0.16-beta.9",
-    "@alilc/lowcode-types": "1.0.15",
+    "@alilc/lowcode-types": "1.0.16-beta.9",
-    "@alilc/lowcode-utils": "1.0.15",
+    "@alilc/lowcode-utils": "1.0.16-beta.9",
     "classnames": "^2.2.6",
     "enzyme": "^3.11.0",
     "enzyme-adapter-react-16": "^1.15.5",
@@ -57,5 +57,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/shell"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/types/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-types",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "Types for Ali lowCode engine",
   "files": [
     "es",
@@ -30,5 +30,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/types"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/types/src/index.ts

@@ -21,3 +21,4 @@ export * from './code-result';
 export * from './assets';
 export * as GlobalEvent from './event';
 export * from './disposable';
+export * from './start-transaction';

packages/types/src/start-transaction.ts

@@ -0,0 +1,4 @@
+export enum TransitionType {
+  /** 节点更新后重绘处理 */
+  REPAINT
+}

packages/utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-utils",
-  "version": "1.0.15",
+  "version": "1.0.16-beta.9",
   "description": "Utils for Ali lowCode engine",
   "files": [
     "lib",
@@ -14,8 +14,9 @@
   },
   "dependencies": {
     "@alifd/next": "^1.19.16",
-    "@alilc/lowcode-types": "1.0.15",
+    "@alilc/lowcode-types": "1.0.16-beta.9",
     "lodash": "^4.17.21",
+    "mobx": "^6.3.0",
     "react": "^16",
     "zen-logger": "^1.1.0"
   },
@@ -33,5 +34,5 @@
     "type": "http",
     "url": "https://github.com/alibaba/lowcode-engine/tree/main/packages/utils"
   },
-  "gitHead": "2669f179e6f899d395ce1942d0fe04f9c5ed48a6"
+  "gitHead": "fb640805319761568ab5a721eca25ba859e0feda"
 }

packages/utils/src/index.ts

@@ -26,3 +26,4 @@ export * from './node-helper';
 export * from './clone-enumerable-property';
 export * from './logger';
 export * as css from './css-helper';
+export { transactionManager } from './start-transaction';

packages/utils/src/start-transaction.ts

@@ -0,0 +1,29 @@
+import { TransitionType } from '@alilc/lowcode-types';
+import { runInAction } from 'mobx';
+import EventEmitter from 'events';
+
+class TransactionManager {
+  emitter = new EventEmitter();
+
+  executeTransaction = (fn: () => void, type: TransitionType = TransitionType.REPAINT): void => {
+    this.emitter.emit(`[${type}]startTransaction`);
+    runInAction(fn);
+    this.emitter.emit(`[${type}]endTransaction`);
+  };
+
+  onStartTransaction = (fn: () => void, type: TransitionType = TransitionType.REPAINT): () => void => {
+    this.emitter.on(`[${type}]startTransaction`, fn);
+    return () => {
+      this.emitter.off(`[${type}]startTransaction`, fn);
+    };
+  };
+
+  onEndTransaction = (fn: () => void, type: TransitionType = TransitionType.REPAINT): () => void => {
+    this.emitter.on(`[${type}]endTransaction`, fn);
+    return () => {
+      this.emitter.off(`[${type}]endTransaction`, fn);
+    };
+  };
+}
+
+export const transactionManager = new TransactionManager();