Merge branch 'develop' into release/1.1.0-beta

babel.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: [
+    ['@babel/plugin-proposal-decorators', { legacy: true }],
+    [require.resolve('@babel/plugin-proposal-class-properties'), { loose: true }],
+  ],
+};

docs/docs/api/model/document-model.md

@@ -11,39 +11,86 @@ sidebar_position: 0
 
 ## 变量
 
+### id
+
+唯一 ID
+
+`@type {string}`
+
 ### selection
 
-画布节点选中区模型实例，具体方法参见 [画布节点选中区模型](./selection)
+画布节点选中区模型实例
+
+`@type {IPublicModelSelection}`
+
+相关章节：[节点选中区模型](./selection)
+
+相关类型：[IPublicModelSelection](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/selection.ts)
 
 ### detecting
 
-画布节点 hover 区模型实例，具体方法参见 [画布节点悬停模型](./detecting)
+画布节点 hover 区模型实例
+
+`@type {IPublicModelDetecting}`
+
+相关章节：[画布节点悬停模型](./detecting)
+
+相关类型：[IPublicModelDetecting](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/detecting.ts)
 
 ### history
 
-操作历史模型实例，具体方法参见 [操作历史模型](./history)
+操作历史模型实例
-### canvas
 
-获取当前画布中的一些信息，比如拖拽时的 dropLocation
+`@type {IPublicModelHistory}`
+
+相关章节：[操作历史模型](./history)
+
+相关类型：[IPublicModelHistory](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/history.ts)
 
 ### project
 
 获取当前文档模型所属的 project
 
+`@type {IPublicApiProject}`
+
+相关类型：[IPublicApiProject](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/api/project.ts)
+
 ### root
 
 获取文档的根节点
 
+`@type {IPublicModelNode | null}`
+
+相关类型：[IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+
 ### nodesMap
 
-获取文档下所有节点
+获取文档下所有节点 Map, key 为 nodeId
+
+`@type {Map<string, IPublicModelNode>} `
+
+
+相关章节：[节点模型](./node)
+
+相关类型：[IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
 
 ### modalNodesManager
 
-参见 [模态节点管理](./modal-nodes-manager)
+模态节点管理器
+
+`@type {IPublicModelModalNodesManager | null}`
+
+相关章节：[模态节点管理](./modal-nodes-manager)
+
+相关类型：[IPublicModelModalNodesManager](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/modal-nodes-manager.ts)
 
 ### dropLocation
+
 文档的 dropLocation
+
+`@type {IPublicModelDropLocation | null}`
+
+
 相关类型：[IPublicModelDropLocation](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/drop-location.ts)
 
 **@since v1.1.0**
@@ -51,51 +98,127 @@ sidebar_position: 0
 ## 方法签名
 ### getNodeById
 
-getNodeById(nodeId: string)
-
 根据 nodeId 返回 [Node](./node) 实例
 
+```typescript
+/**
+ * 根据 nodeId 返回 Node 实例
+ * get node by nodeId
+ * @param nodeId
+ * @returns
+ */
+getNodeById(nodeId: string): IPublicModelNode | null;
+```
+
+相关类型：[IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+
+
 ### importSchema
 
-importSchema(schema: RootSchema)
-
 导入 schema
+
+```typescript
+/**
+ * 导入 schema
+ * import schema data
+ * @param schema
+ */
+importSchema(schema: IPublicTypeRootSchema): void;
+```
+
+相关类型：[IPublicTypeRootSchema](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/root-schema.ts)
+
+
 ### exportSchema
-
-exportSchema(stage: TransformStage = TransformStage.Render)
-
 导出 schema
 
+```typescript
+/**
+ * 导出 schema
+ * export schema
+ * @param stage
+ * @returns
+ */
+exportSchema(stage: IPublicEnumTransformStage): any;
+```
+
+相关类型：[IPublicEnumTransformStage](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/enum/transform-stage.ts)
+
 ### insertNode
 
-insertNode(
-    parent: Node,
-    thing: Node,
-    at?: number | null | undefined,
-    copy?: boolean | undefined,
-  )
-
 插入节点
+
+```typescript
+/**
+ * 插入节点
+ * insert a node
+ */
+insertNode(
+  parent: IPublicModelNode,
+  thing: IPublicModelNode,
+  at?: number | null | undefined,
+  copy?: boolean | undefined
+): IPublicModelNode | null;
+```
+
+相关类型：[IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+
 ### createNode
 
-createNode(data: any)
-
 创建一个节点
+
+```typescript
+/**
+ * 创建一个节点
+ * create a node
+ * @param data
+ * @returns
+ */
+createNode(data: any): IPublicModelNode | null;
+```
+
+相关类型：[IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+
 ### removeNode
 
-removeNode(idOrNode: string | Node)
-
 移除指定节点/节点id
 
+```typescript
+/**
+ * 移除指定节点/节点id
+ * remove a node by node instance or nodeId
+ * @param idOrNode
+ */
+removeNode(idOrNode: string | IPublicModelNode): void;
+```
+
+相关类型：[IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+
 ### checkNesting
 检查拖拽放置的目标节点是否可以放置该拖拽对象
 
-**@since v1.0.16**
-
 ```typescript
-function checkNesting(dropTarget: Node, dragObject: DragNodeObject | DragNodeDataObject): boolean {}
+/**
+ * 检查拖拽放置的目标节点是否可以放置该拖拽对象
+ * check if dragOjbect can be put in this dragTarget
+ * @param dropTarget 拖拽放置的目标节点
+ * @param dragObject 拖拽的对象
+ * @returns boolean 是否可以放置
+ * @since v1.0.16
+ */
+checkNesting(
+  dropTarget: IPublicModelNode,
+  dragObject: IPublicTypeDragNodeObject | IPublicTypeDragNodeDataObject
+): boolean;
 ```
 
+相关类型：
+- [IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+- [IPublicTypeDragNodeObject](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/drag-node-object.ts)
+- [IPublicTypeDragNodeDataObject](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/drag-node-object-data.ts)
+
+**@since v1.0.16**
+
 ### isDetectingNode
 检查拖拽放置的目标节点是否可以放置该拖拽对象
 
@@ -117,48 +240,107 @@ isDetectingNode(node: IPublicModelNode): boolean;
 ## 事件
 ### onAddNode
 
-onAddNode(fn: (node: Node) => void)
-
 当前 document 新增节点事件
 
 ```typescript
-import { project } from '@alilc/lowcode-engine';
+/**
-
+ * 当前 document 新增节点事件
-project.currentDocument.onAddNode((node) => {
+ * set callback for event on node is created for a document
-  console.log('node', node);
+ */
-})
+onAddNode(fn: (node: IPublicModelNode) => void): IPublicTypeDisposable;
 ```
 
+相关类型：
+- [IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+- [IPublicTypeDisposable](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/disposable.ts)
+
+### onMountNode
+
+当前 document 新增节点事件，此时节点已经挂载到 document 上
+
+```typescript
+/**
+ * 当前 document 新增节点事件，此时节点已经挂载到 document 上
+ * set callback for event on node is mounted to canvas
+ */
+onMountNode(fn: (payload: { node: IPublicModelNode }) => void): IPublicTypeDisposable;
+```
+
+相关类型：
+- [IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+- [IPublicTypeDisposable](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/disposable.ts)
+
 ### onRemoveNode
-
-onRemoveNode(fn: (node: Node) => void)
-
 当前 document 删除节点事件
 
+```typescript
+/**
+ * 当前 document 删除节点事件
+ * set callback for event on node is removed
+ */
+onRemoveNode(fn: (node: IPublicModelNode) => void): IPublicTypeDisposable;
+```
+
+相关类型：
+- [IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+- [IPublicTypeDisposable](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/disposable.ts)
+
+
 ### onChangeDetecting
 
-onChangeDetecting(fn: (node: Node) => void)
-
 当前 document 的 hover 变更事件
 
+```typescript
+/**
+ * 当前 document 的 hover 变更事件
+ *
+ * set callback for event on detecting changed
+ */
+onChangeDetecting(fn: (node: IPublicModelNode) => void): IPublicTypeDisposable;
+```
+
+相关类型：
+- [IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+- [IPublicTypeDisposable](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/disposable.ts)
+
 ### onChangeSelection
 
-onChangeSelection(fn: (ids: string[]) => void)
-
 当前 document 的选中变更事件
 
+```typescript
+/**
+ * 当前 document 的选中变更事件
+ * set callback for event on selection changed
+ */
+onChangeSelection(fn: (ids: string[]) => void): IPublicTypeDisposable;
+```
+
+相关类型：[IPublicTypeDisposable](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/disposable.ts)
+
 ### onChangeNodeVisible
 
-onChangeNodeVisible(fn: (node: Node, visible: boolean) => void)
-
 当前 document 的节点显隐状态变更事件
 
+```typescript
+/**
+ * 当前 document 的节点显隐状态变更事件
+ * set callback for event on visibility changed for certain node
+ * @param fn
+ */
+onChangeNodeVisible(fn: (node: IPublicModelNode, visible: boolean) => void): void;
+```
+
+相关类型：[IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+
 ### onChangeNodeChildren
 
 onChangeNodeChildren(fn: (info?: IPublicOnChangeOptions) => void)
 
 当前 document 的节点 children 变更事件
 
+```typescript
+```
+
 ### onChangeNodeProp
 当前 document 节点属性修改事件
 

docs/docs/api/model/drop-location.md

@@ -0,0 +1,54 @@
+---
+title: DropLocation
+sidebar_position: 13
+---
+
+> **@types** [IPublicModelDropLocation](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/drop-location.ts)<br/>
+> **@since** v1.1.0
+
+
+## 基本介绍
+
+拖拽放置位置模型
+
+## 变量
+
+### target
+
+拖拽放置位置目标
+
+`@type {IPublicModelNode}`
+
+相关类型：[IPublicModelNode](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node.ts)
+
+### detail
+
+拖拽放置位置详情
+
+`@type {IPublicTypeLocationDetail}`
+
+相关类型：[IPublicTypeLocationDetail](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/location-detail.ts)
+
+### event
+
+拖拽放置位置对应的事件
+
+`@type {IPublicTypeLocationDetail}`
+
+相关类型：[IPublicModelLocateEvent](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/location-event.ts)
+
+## 方法签名
+
+### clone
+
+获取一份当前对象的克隆
+
+```typescript
+/**
+ * 获取一份当前对象的克隆
+ * get a clone object of current dropLocation
+ */
+clone(event: IPublicModelLocateEvent): IPublicModelDropLocation;
+```
+
+相关类型：[IPublicModelLocateEvent](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/location-event.ts)

docs/docs/api/model/node.md

@@ -14,237 +14,634 @@ sidebar_position: 1
 
 节点 id
 
+`@type {string}`
+
 ### title
 
 节点标题
 
-### isContainer
+`@type {string | IPublicTypeI18nData | ReactElement}`
+
+相关类型：[IPublicTypeI18nData](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/i18n-data.ts)
+
+### isContainerNode
 
 是否为「容器型」节点
 
-### isRoot
+`@type {boolean}`
+
+**@since v1.1.0**
+> v1.1.0 之前请使用 `isContainer`
+
+### isRootNode
 
 是否为根节点
 
-### isEmpty
+`@type {boolean}`
+
+**@since v1.1.0**
+
+> v1.1.0 之前请使用 `isRoot`
+
+### isEmptyNode
 
 是否为空节点（无 children 或者 children 为空）
 
-### isPage
+`@type {boolean}`
+
+**@since v1.1.0**
+
+> v1.1.0 之前请使用 `isEmpty`
+
+### isPageNode
 
 是否为 Page 节点
 
-### isComponent
+`@type {boolean}`
+
+**@since v1.1.0**
+
+> v1.1.0 之前请使用 `isPage`
+
+### isComponentNode
 
 是否为 Component 节点
 
-### isModal
+`@type {boolean}`
+
+**@since v1.1.0**
+
+> v1.1.0 之前请使用 `isComponent`
+
+### isModalNode
 
 是否为「模态框」节点
 
-### isSlot
+`@type {boolean}`
+
+**@since v1.1.0**
+
+> v1.1.0 之前请使用 `isModal`
+
+### isSlotNode
 
 是否为插槽节点
 
-### isParental
+`@type {boolean}`
+
+**@since v1.1.0**
+
+> v1.1.0 之前请使用 `isSlot`
+
+### isParentalNode
 
 是否为父类/分支节点
 
-### isLeaf
+`@type {boolean}`
+
+**@since v1.1.0**
+
+> v1.1.0 之前请使用 `isParental`
+
+### isLeafNode
+
 是否为叶子节点
 
+`@type {boolean}`
+
+**@since v1.1.0**
+
+> v1.1.0 之前请使用 `isLeaf`
+
 ### isLocked
+
 获取当前节点的锁定状态
 
 **@since v1.0.16**
 
-### isRGLContainer
+### isRGLContainerNode
 设置为磁贴布局节点，使用方式可参考：[磁贴布局在钉钉宜搭报表设计引擎中的实现](https://mp.weixin.qq.com/s/PSTut5ahAB8nlJ9kBpBaxw)
 
-**@since v1.0.16**
+`@type {boolean}`
+
+**@since v1.1.0**
+
+> v1.0.16 - v1.1.0 请使用 `isRGLContainer`
 
 ### index
 
 下标
 
+`@type {number}`
+
 ### icon
 
 图标
 
+`@type {IPublicTypeIconType}`
+
+相关类型：[IPublicTypeIconType](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/icon-type.ts)
+
 ### zLevel
 
 节点所在树的层级深度，根节点深度为 0
 
+`@type {number}`
+
 ### componentName
 
 节点 componentName
 
+`@type {string}`
+
 ### componentMeta
 
-节点的物料元数据，参见 物料元数据
+节点的物料元数据
+
+`@type {IPublicModelComponentMeta | null}`
+
+相关类型：[IPublicTypeIconType](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/component-meta.ts)
+
 
 ### document
 
 获取节点所属的[文档模型](./document-model)对象
 
+`@type {IPublicModelDocumentModel | null}`
+
+相关类型：[IPublicModelDocumentModel](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/document-model.ts)
+
 ### prevSibling
 
 获取当前节点的前一个兄弟节点
 
+`@type {IPublicModelNode | null}`
+
 ### nextSibling
 
 获取当前节点的后一个兄弟节点
 
+`@type {IPublicModelNode | null}`
+
 ### parent
 
 获取当前节点的父亲节点
 
+`@type {IPublicModelNode | null}`
+
 ### children
 
 获取当前节点的孩子节点模型
 
+`@type {IPublicModelNodeChildren | null}`
+
+相关类型：[IPublicModelNodeChildren](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/node-children.ts)
+
 ### slots
 
 节点上挂载的插槽节点们
 
+`@type {IPublicModelNode[]}`
+
 ### slotFor
 
 当前节点为插槽节点时，返回节点对应的属性实例
 
+`@type {IPublicModelProp | null}`
+
+相关类型：[IPublicModelProp](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/prop.ts)
+
 ### props
 
 返回节点的属性集
 
+`@type {IPublicModelProps | null}`
+
+相关类型：[IPublicModelProps](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/props.ts)
+
+
 ### propsData
 
 返回节点的属性集值
 
+`@type {IPublicTypePropsMap | IPublicTypePropsList | null}`
+
+相关类型：
+- [IPublicTypePropsMap](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/props-map.ts)
+- [IPublicTypePropsList](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/props-list.ts)
+
+### conditionGroup
+
+获取条件组
+
+`@type {IPublicModelExclusiveGroup | null}`
+
+相关类型：[IPublicModelExclusiveGroup](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/exclusive-group.ts)
+
+**@since v1.1.0**
+
+### schema
+
+获取符合搭建协议 - 节点 schema 结构
+
+`@type {IPublicTypeNodeSchema | null}`
+
+相关类型：[IPublicTypeNodeSchema](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/node-schema.ts)
+
+### settingEntry
+
+获取对应的 setting entry
+
+`@type {IPublicModelSettingTopEntry}`
+
+相关类型：[IPublicModelSettingTopEntry](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/setting-top-entry.ts)
+
+### visible
+当前节点是否可见
+
+`@type {boolean}`
+
+**@since v1.1.0**
+
 ## 方法签名
-### getDOMNode
-
-getDOMNode()
-
-获取节点实例对应的 dom 节点
 
 ### getRect
 
-getRect()
-
 返回节点的尺寸、位置信息
 
+```typescript
+/**
+ * 返回节点的尺寸、位置信息
+ * get rect information for this node
+ */
+getRect(): DOMRect | null;
+```
+
 ### hasSlots
 
-hasSlots()
-
 是否有挂载插槽节点
 
+```typescript
+/**
+ * 是否有挂载插槽节点
+ * check if current node has slots
+ */
+hasSlots(): boolean;
+```
+
 ### hasCondition
 
-hasCondition()
-
 是否设定了渲染条件
 
+```typescript
+/**
+ * 是否设定了渲染条件
+ * check if current node has condition value set
+ */
+hasCondition(): boolean;
+```
+
 ### hasLoop
 
-hasLoop()
-
 是否设定了循环数据
 
+```typescript
+/**
+ * 是否设定了循环数据
+ * check if loop is set for this node
+ */
+hasLoop(): boolean;
+```
+
 ### getProp
 
-getProp(path: string): Prop | null
-
 获取指定 path 的属性模型实例
 
+```typescript
+/**
+ * 获取指定 path 的属性模型实例
+ * get prop by path
+ * @param path 属性路径，支持 a / a.b / a.0 等格式
+ */
+getProp(path: string, createIfNone: boolean): IPublicModelProp | null;
+```
+
+相关类型：[IPublicModelProp](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/prop.ts)
+
 ### getPropValue
 
-getPropValue(path: string)
-
 获取指定 path 的属性模型实例值
 
+```typescript
+/**
+ * 获取指定 path 的属性模型实例值
+ * get prop value by path
+ * @param path 属性路径，支持 a / a.b / a.0 等格式
+ */
+getPropValue(path: string): any;
+```
+
 ### getExtraProp
 
-getExtraProp(path: string): Prop | null
-
 获取指定 path 的属性模型实例，注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级
 
+```typescript
+/**
+ * 获取指定 path 的属性模型实例，
+ *  注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级
+ *
+ * get extra prop by path, an extra prop means a prop not exists in the `props`
+ * but as siblint of the `props`
+ * @param path 属性路径，支持 a / a.b / a.0 等格式
+ * @param createIfNone 当没有属性的时候，是否创建一个属性
+ */
+getExtraProp(path: string, createIfNone?: boolean): IPublicModelProp | null;
+```
+
+相关类型：[IPublicModelProp](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/prop.ts)
+
 ### getExtraPropValue
 
-getExtraPropValue(path: string)
-
 获取指定 path 的属性模型实例，注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级
 
+```typescript
+/**
+ * 获取指定 path 的属性模型实例，
+ *  注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级
+ *
+ * get extra prop value by path, an extra prop means a prop not exists in the `props`
+ * but as siblint of the `props`
+ * @param path 属性路径，支持 a / a.b / a.0 等格式
+ * @returns
+ */
+getExtraPropValue(path: string): any;
+```
+
 ### setPropValue
 
 setPropValue(path: string, value: CompositeValue)
 
 设置指定 path 的属性模型实例值
 
-### setExtraPropValue
+```typescript
+/**
+ * 设置指定 path 的属性模型实例值
+ * set value for prop with path
+ * @param path 属性路径，支持 a / a.b / a.0 等格式
+ * @param value 值
+ */
+setPropValue(path: string, value: IPublicTypeCompositeValue): void;
+```
 
-setExtraPropValue(path: string, value: CompositeValue)
+相关类型：[IPublicTypeCompositeValue](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/composite-value.ts)
+
+
+### setExtraPropValue
 
 设置指定 path 的属性模型实例值
 
-### importSchema
+```typescript
+/**
+ * 设置指定 path 的属性模型实例值
+ * set value for extra prop with path
+ * @param path 属性路径，支持 a / a.b / a.0 等格式
+ * @param value 值
+ */
+setExtraPropValue(path: string, value: IPublicTypeCompositeValue): void;
+```
 
-importSchema(data: NodeSchema)
+相关类型：[IPublicTypeCompositeValue](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/composite-value.ts)
+
+### importSchema
 
 导入节点数据
 
-### exportSchema
+```typescript
+/**
+ * 导入节点数据
+ * import node schema
+ * @param data
+ */
+importSchema(data: IPublicTypeNodeSchema): void;
+```
 
-exportSchema(stage: IPublicEnumTransformStage = IPublicEnumTransformStage.Render, options?: any)
+相关类型：[IPublicTypeNodeSchema](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/node-schema.ts)
+
+### exportSchema
 
 导出节点数据
 
-### insertBefore
+```typescript
+/**
+ * 导出节点数据
+ * export schema from this node
+ * @param stage
+ * @param options
+ */
+exportSchema(stage: IPublicEnumTransformStage, options?: any): IPublicTypeNodeSchema;
+```
 
-insertBefore(node: Node, ref?: Node | undefined, useMutator?: boolean)
+相关类型：
+- [IPublicEnumTransformStage](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/enum/transform-stage.ts)
+- [IPublicTypeNodeSchema](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/node-schema.ts)
+
+### insertBefore
 
 在指定位置之前插入一个节点
 
-### insertAfter
+```typescript
+/**
+ * 在指定位置之前插入一个节点
+ * insert a node befor current node
+ * @param node
+ * @param ref
+ * @param useMutator
+ */
+insertBefore(
+    node: IPublicModelNode,
+    ref?: IPublicModelNode | undefined,
+    useMutator?: boolean,
+  ): void;
+```
 
-insertAfter(node: Node, ref?: Node | undefined, useMutator?: boolean)
+### insertAfter
 
 在指定位置之后插入一个节点
 
+```typescript
+/**
+ * 在指定位置之后插入一个节点
+ * insert a node after this node
+ * @param node
+ * @param ref
+ * @param useMutator
+ */
+insertAfter(
+    node: IPublicModelNode,
+    ref?: IPublicModelNode | undefined,
+    useMutator?: boolean,
+  ): void;
+```
+
 ### replaceChild
 
-replaceChild(node: Node, data: any)
+替换指定子节点
 
-替换指定节点
+```typescript
+/**
+ * 替换指定子节点
+ * replace a child node with data provided
+ * @param node 待替换的子节点
+ * @param data 用作替换的节点对象或者节点描述
+ * @returns
+ */
+replaceChild(node: IPublicModelNode, data: any): IPublicModelNode | null;
+```
 
 ### replaceWith
 
-replaceWith(schema: NodeSchema)
-
 将当前节点替换成指定节点描述
 
+```typescript
+/**
+ * 将当前节点替换成指定节点描述
+ * replace current node with a new node schema
+ * @param schema
+ */
+replaceWith(schema: IPublicTypeNodeSchema): any;
+```
+
+相关类型：[IPublicTypeNodeSchema](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/node-schema.ts)
+
 ### select
 
-select()
-
 选中当前节点实例
 
+```typescript
+/**
+ * 选中当前节点实例
+ * select current node
+ */
+select(): void;
+```
+
 ### hover
 
-hover(flag = true)
-
 设置悬停态
 
+```typescript
+/**
+ * 设置悬停态
+ * set hover value for current node
+ * @param flag
+ */
+hover(flag: boolean): void;
+```
+
 ### lock
 设置节点锁定状态
 
 ```typescript
-function lock(flag?: boolean){}
+/**
+ * 设置节点锁定状态
+ * set lock value for current node
+ * @param flag
+ * @since v1.0.16
+ */
+lock(flag?: boolean): void;
 ```
 
 **@since v1.0.16**
 
 ### remove
 
-remove()
+删除当前节点实例
 
-删除当前节点实例
+```typescript
+/**
+ * 删除当前节点实例
+ * remove current node
+ */
+remove(): void;
+```
+
+### mergeChildren
+
+执行新增、删除、排序等操作
+
+```typescript
+/**
+ * 执行新增、删除、排序等操作
+ * excute remove/add/sort operations on node`s children
+ *
+ * @since v1.1.0
+ */
+mergeChildren(
+  remover: (node: IPublicModelNode, idx: number) => boolean,
+  adder: (children: IPublicModelNode[]) => any,
+  sorter: (firstNode: IPublicModelNode, secondNode: IPublicModelNode) => number
+): any;
+```
+
+**@since v1.1.0**
+
+### contains
+
+当前节点是否包含某子节点
+
+```typescript
+/**
+ * 当前节点是否包含某子节点
+ * check if current node contains another node as a child
+ * @param node
+ * @since v1.1.0
+ */
+contains(node: IPublicModelNode): boolean;
+```
+
+**@since v1.1.0**
+
+### canPerformAction
+
+是否可执行某 action
+
+```typescript
+/**
+ * 是否可执行某 action
+ * check if current node can perform certain aciton with actionName
+ * @param actionName action 名字
+ * @since v1.1.0
+ */
+canPerformAction(actionName: string): boolean;
+```
+
+**@since v1.1.0**
+
+### isConditionalVisible
+
+获取该节点的 ConditionalVisible 值
+
+```typescript
+/**
+ * 获取该节点的 ConditionalVisible 值
+ * check if current node ConditionalVisible
+ * @since v1.1.0
+ */
+isConditionalVisible(): boolean | undefined;
+```
+
+**@since v1.1.0**
+
+### setConditionalVisible
+设置该节点的 ConditionalVisible 为 true
+
+```typescript
+/**
+ * 设置该节点的 ConditionalVisible 为 true
+ * make this node as conditionalVisible === true
+ * @since v1.1.0
+ */
+setConditionalVisible(): void;
+```
+
+**@since v1.1.0**

docs/docs/guide/quickStart/start.md

@@ -2,68 +2,93 @@
 sidebar_position: 2
 title: 快速开始
 ---
+
 ## 前置知识
+
 我们假定你已经对 HTML 和 JavaScript 都比较熟悉了。即便你之前使用其他编程语言，你也可以跟上这篇教程的。除此之外，我们假定你也已经熟悉了一些编程的概念，例如，函数、对象、数组，以及 class 的一些内容。
 
 如果你想回顾一下 JavaScript，你可以阅读[这篇教程](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/A_re-introduction_to_JavaScript)。注意，我们也用到了一些 ES6（较新的 JavaScript 版本）的特性。在这篇教程里，我们主要使用了[箭头函数（arrow functions）](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions)、[class](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Classes)、[let](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/let) 语句和 [const](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/const) 语句。你可以使用 [Babel REPL](https://babeljs.io/repl/#?presets=react&code_lz=MYewdgzgLgBApgGzgWzmWBeGAeAFgRgD4AJRBEAGhgHcQAnBAEwEJsB6AwgbgChRJY_KAEMAlmDh0YWRiGABXVOgB0AczhQAokiVQAQgE8AkowAUAcjogQUcwEpeAJTjDgUACIB5ALLK6aRklTRBQ0KCohMQk6Bx4gA) 在线预览 ES6 的编译结果。
 
 ## 环境准备
+
 ### WSL（Window 电脑）
+
 Window 环境需要使用 WSL 在 windows 下进行低代码引擎相关的开发。安装教程 ➡️ [WSL 安装教程](https://docs.microsoft.com/zh-cn/windows/wsl/install)。<br />**对于 Window 环境来说，之后所有需要执行命令的操作都是在 WSL 终端执行的。**
+
 ### Node
+
 node 版本推荐 16.18.0。
 
 #### 查看 Node 版本
+
 ![image.png](https://img.alicdn.com/imgextra/i4/O1CN01oCZKNz290LIu8YUTk_!!6000000008005-2-tps-238-70.png)
 
 #### 通过 n 来管理 node 版本
+
 可以安装 [n](https://www.npmjs.com/package/n) 来管理和变更 node 版本。
 
 ##### 安装 n
+
 ```bash
 npm install -g n
 ```
 
 ##### 变更 node 版本
+
 ```bash
 n 14.17.0
 ```
 
 ### React
+
 低代码引擎的扩展能力都是基于 React 来研发的，在继续阅读之前最好有一定的 React 基础，React 学习教程 ➡️ [React 快速开始教程](https://zh-hans.reactjs.org/docs/getting-started.html)。
 
 ### 下载 Demo
-可以前往 github（https://github.com/alibaba/lowcode-demo）将 DEMO 下载到本地。
+
+可以前往 github（<https://github.com/alibaba/lowcode-demo>）将 DEMO 下载到本地。
 
 #### git clone
+
 ##### HTTPS
+
 需要使用到 git 工具
+
 ```bash
 git clone https://github.com/alibaba/lowcode-demo.git
 ```
+
 ##### SSH
+
 需要配置 SSH key，如果没有配置可以
+
 ```bash
 git clone git@github.com:alibaba/lowcode-demo.git
 ```
 
 #### 下载 Zip 包
+
 ![image.png](https://img.alicdn.com/imgextra/i2/O1CN01iYC7E11phaNwLFUrN_!!6000000005392-2-tps-3584-1794.png)
 
 ### 选择一个 demo 项目
-在  以 `demo-general` 为例：
+
+在 以 `demo-general` 为例：
+
 ```bash
 cd demo-general
 ```
 
 ### 安装依赖
+
 在 `lowcode-demo/demo-general` 目录下执行：
+
 ```bash
 npm install
 ```
 
 ### 启动 demo
+
 在 `lowcode-demo/demo-general` 目录下执行：
+
 ```bash
 npm run start
 ```
@@ -71,6 +96,7 @@ npm run start
 之后就可以通过 [http://localhost:5556/](http://localhost:5556/) 来访问我们的 DEMO 了。
 
 ## 认识 Demo
+
 我们的 Demo 是一个**低代码平台的设计器**。它是一个低代码平台中最重要的一环，用户可以在这里通过拖拽、配置、写代码等等来完成一个页面的开发。由于用户的人群不同、场景不同、诉求不同等等，这个页面的功能就会有所差异。
 
 这里记住**设计器**这个词，它描述的就是下面的这个页面，后面我们会经常看到它。
@@ -95,6 +121,7 @@ Demo 根据**不同的设计器所需要的物料不同**，分为了下面的 8
 ![](https://img.alicdn.com/imgextra/i1/O1CN01EU2jRN1wUwlal17WK_!!6000000006312-2-tps-3110-1974.png)
 
 ### 目录介绍
+
 仓库下每个 demo-xxx-xxx 目录都是一个可独立运行的 demo 工程，分别对应到刚刚介绍的场景。
 
 ![image.png](https://img.alicdn.com/imgextra/i1/O1CN01ztxv5Y1mJozBsLdni_!!6000000004934-2-tps-696-958.png)
@@ -104,11 +131,12 @@ Demo 根据**不同的设计器所需要的物料不同**，分为了下面的 8
 ![image.png](https://img.alicdn.com/imgextra/i1/O1CN01A50oW522S5zg2eDUH_!!6000000007118-2-tps-732-1384.png)
 
 介绍下其中主要的内容
+
 - 设计器入口文件 `source/index.ts` 这个文件做了下述几个事情：
   - 通过 plugins.register 注册各种插件，包括官方插件 (已发布 npm 包形式的插件) 和 `plugins` 目录下内置的示例插件
   - 通过 init 初始化低代码设计器
 - plugins 目录，存放的都是示例插件，方便用户从中看到一个插件是如何实现的
-- services 目录，模拟数据请求、提供默认 schema、默认资产包等，此目录下内容在真是项目中应替换成真是的与服务端交互的服务。
+- services 目录，模拟数据请求、提供默认 schema、默认资产包等，此目录下内容在真实项目中应替换成真实的与服务端交互的服务。
 - 预览页面入口文件 `preview.tsx`
 
 剩下的各位看官可以通过源码来进一步了解。
@@ -118,11 +146,15 @@ Demo 根据**不同的设计器所需要的物料不同**，分为了下面的 8
 ![image.png](https://img.alicdn.com/imgextra/i4/O1CN01YJVcOd1PiL1am6bz2_!!6000000001874-2-tps-3248-1970.png)
 
 接下来我们就根据我们自己的诉求通过对设计器进行扩展，改动成我们需要的设计器功能。
+
 ## 开发一个插件
+
 ### 方式 1：在 DEMO 中直接新增插件
+
 ![image.png](https://img.alicdn.com/imgextra/i4/O1CN01pXpSRs1QvRyut2EE3_!!6000000002038-2-tps-718-1144.png)
 
 可以在 demo/sample-plugins 直接新增插件，这里我新增的插件目录是 plugin-demo。并且新增了 index.tsx 文件，将下面的代码粘贴到 index.tsx 中。
+
 ```javascript
 import * as React from 'react';
 import { IPublicModelPluginContext } from '@alilc/lowcode-types';
@@ -136,7 +168,7 @@ const LowcodePluginPluginDemo = (ctx: IPublicModelPluginContext) => {
         func: () => {
           console.log('方法也是一样');
         },
-      }
+      };
     },
     // 插件的初始化函数，在引擎初始化之后会立刻调用
     init() {
@@ -170,7 +202,7 @@ LowcodePluginPluginDemo.meta = {
   engines: {
     lowcodeEngine: '^1.0.0', // 插件需要配合 ^1.0.0 的引擎才可运行
   },
-}
+};
 
 export default LowcodePluginPluginDemo;
 ```
@@ -182,8 +214,11 @@ export default LowcodePluginPluginDemo;
 这样在我们的设计器中就新增了一个 Demo 面板。
 
 ![image.png](https://img.alicdn.com/imgextra/i2/O1CN01wtPIOV1TQiFLz5Vkf_!!6000000002377-2-tps-3584-1806.png)
+
 ### 方式 2：在新的仓库下开发插件
+
 初始化
+
 ```bash
 npm init @alilc/element your-plugin-name
 ```
@@ -201,11 +236,13 @@ npm init @alilc/element your-plugin-name
 ![image.png](https://img.alicdn.com/imgextra/i4/O1CN01iVIAXD1XVWsOdKttI_!!6000000002929-2-tps-3584-2020.png)
 
 在插件项目下安装依赖
+
 ```bash
 npm install
 ```
 
 启动项目
+
 ```bash
 npm run start
 ```
@@ -220,9 +257,10 @@ npm run start
 
 ![image.png](https://img.alicdn.com/imgextra/i4/O1CN01uqSmrX1oqupxeGH1m_!!6000000005277-2-tps-3584-2020.png)
 
-
 ## 开发一个自定义物料
+
 ### 初始化物料
+
 ```bash
 npm init @alilc/element your-material-demo
 ```
@@ -240,11 +278,15 @@ npm init @alilc/element your-material-demo
 ![image.png](https://img.alicdn.com/imgextra/i1/O1CN01SU2xn91TZPlzcARVI_!!6000000002396-2-tps-3584-2020.png)
 
 ### 启动并调试物料
+
 #### 安装依赖
+
 ```bash
 npm i
 ```
+
 #### 启动
+
 ```bash
 npm run lowcode:dev
 ```
@@ -252,7 +294,9 @@ npm run lowcode:dev
 我们就可以通过 [http://localhost:3333/](http://localhost:3333/) 看到我们的研发的物料了。
 
 ![image.png](https://img.alicdn.com/imgextra/i4/O1CN01JqoHqc1z7zlSWFYJD_!!6000000006668-2-tps-3584-1790.png)
+
 #### 在 Demo 中调试
+
 ```bash
 npm i @alilc/build-plugin-alt
 ```
@@ -262,6 +306,7 @@ npm i @alilc/build-plugin-alt
 ![image.png](https://img.alicdn.com/imgextra/i2/O1CN01K7u7ci1KCfYlBj2yf_!!6000000001128-2-tps-1388-1046.png)
 
 如图，新增如下代码
+
 ```javascript
 [
   '@alilc/build-plugin-alt',
@@ -281,12 +326,15 @@ npm i @alilc/build-plugin-alt
 ![image.png](https://img.alicdn.com/imgextra/i1/O1CN0166WywE26Lv7NuJMus_!!6000000007646-2-tps-3584-1812.png)
 
 ### 发布
+
 首先进行构建
+
 ```bash
 npm run lowcode:build
 ```
 
 发布组件
+
 ```bash
 npm publish
 ```
@@ -344,6 +392,7 @@ npm publish
 ```
 
 ### 使用
+
 我们将刚刚发布的组件的 assets-prod.json 的内容放到 demo 的 src/universal/assets.json 中。
 
 > 最好放到最后，防止因为资源加载顺序问题导致出现报错。
@@ -356,5 +405,7 @@ npm publish
 ![image.png](https://img.alicdn.com/imgextra/i2/O1CN01UNp89s1vQXKyfsFaL_!!6000000006167-2-tps-3584-2020.png)
 
 这时候再启动 DEMO 项目，就会有新的低代码物料了。接下来就按照你们的需求，继续扩展物料吧。
+
 ## 总结
+
 这里只是简单的介绍了一些低代码引擎的基础能力，带大家简单的对低代码 DEMO 进行扩展，定制一些新的功能。低代码引擎的能力还有很多很多，可以继续去探索更多的功能。

docs/docs/specs/assets-spec.md

@@ -2,8 +2,6 @@
 title: 《低代码引擎资产包协议规范》
 sidebar_position: 2
 ---
-# 《低代码引擎资产包协议规范》
-
 ## 1 介绍
 
 ### 1.1 本协议规范涉及的问题域

docs/docs/specs/lowcode-spec.md

@@ -2,8 +2,6 @@
 title: 《低代码引擎搭建协议规范》
 sidebar_position: 0
 ---
-# 《低代码引擎搭建协议规范》
-
 
 ## 1 介绍
 

docs/docs/specs/material-spec.md

@@ -2,7 +2,6 @@
 title: 《低代码引擎物料协议规范》
 sidebar_position: 1
 ---
-# 《低代码引擎物料协议规范》
 
 ## 1 介绍
 

modules/code-generator/babel.config.js

@@ -0,0 +1 @@
+module.exports = require('../../babel.config');

modules/code-generator/babelTransform.js

@@ -1,22 +0,0 @@
-const babelJest = require('babel-jest');
-const getBabelConfig = require('build-scripts-config/lib/config/babel/index.js');
-const formatWinPath = require('build-scripts-config/lib/config/jest/formatWinPath');
-const babelConfig = getBabelConfig();
-
-babelConfig.plugins.push(['@babel/plugin-proposal-class-properties', { loose: true }]);
-
-const jestBabelConfig = {
-  ...babelConfig,
-  presets: babelConfig.presets.map((preset) => {
-    if (Array.isArray(preset) && formatWinPath(preset[0]).indexOf('@babel/preset-env') > -1) {
-      return [preset[0], {
-        targets: {
-          node: 'current',
-        },
-      }];
-    }
-    return preset;
-  }),
-};
-
-module.exports = babelJest.createTransformer(jestBabelConfig);

modules/code-generator/jest.config.js

@@ -1,8 +1,4 @@
 module.exports = {
-  transform: {
-    '^.+\\.(js|jsx|ts|tsx)$': './babelTransform.js',
-    '^(?!.*\\.(js|jsx|ts|tsx|css|json)$)': 'build-scripts-config/lib/config/jest/fileTransform.js',
-  },
   preset: 'ts-jest',
   testEnvironment: 'node',
   transformIgnorePatterns: ['/node_modules/(?!core-js)/'],

packages/designer/babel.config.js

@@ -0,0 +1 @@
+module.exports = require('../../babel.config');

packages/designer/babelTransform.js

@@ -1,22 +0,0 @@
-const babelJest = require('babel-jest');
-const getBabelConfig = require('build-scripts-config/lib/config/babel/index.js');
-const formatWinPath = require('build-scripts-config/lib/config/jest/formatWinPath');
-const babelConfig = getBabelConfig();
-
-babelConfig.plugins.push(['@babel/plugin-proposal-class-properties', { loose: true }]);
-
-const jestBabelConfig = {
-  ...babelConfig,
-  presets: babelConfig.presets.map((preset) => {
-    if (Array.isArray(preset) && formatWinPath(preset[0]).indexOf('@babel/preset-env') > -1) {
-      return [preset[0], {
-        targets: {
-          node: 'current',
-        },
-      }];
-    }
-    return preset;
-  }),
-};
-
-module.exports = babelJest.createTransformer(jestBabelConfig);

packages/designer/jest.config.js

@@ -4,10 +4,6 @@ const esModules = [].join('|');
 const pkgNames = fs.readdirSync(join('..')).filter(pkgName => !pkgName.startsWith('.'));
 
 const jestConfig = {
-  transform: {
-    '^.+\\.(js|jsx|ts|tsx)$': './babelTransform.js',
-    '^(?!.*\\.(js|jsx|ts|tsx|css|json)$)': 'build-scripts-config/lib/config/jest/fileTransform.js',
-  },
   // transform: {
   //   '^.+\\.[jt]sx?$': 'babel-jest',
   //   // '^.+\\.(ts|tsx)$': 'ts-jest',

packages/designer/src/designer/location.ts

@@ -101,10 +101,6 @@ export function getWindow(elem: Element | Document): Window {
 }
 export interface IDropLocation extends IPublicModelDropLocation {
 
-  readonly target: INode;
-
-  readonly event: ILocateEvent;
-
   readonly source: string;
 
   get document(): IPublicModelDocumentModel;

packages/designer/src/document/document-model.ts

@@ -15,6 +15,8 @@ import {
   IPublicApiProject,
   IPublicModelDropLocation,
   IPublicEnumTransformStage,
+  IPublicOnChangeOptions,
+  EDITOR_EVENT,
 } from '@alilc/lowcode-types';
 import { Project } from '../project';
 import { ISimulatorHost } from '../simulator';
@@ -158,6 +160,22 @@ export class DocumentModel implements IDocumentModel {
     this.inited = true;
   }
 
+  onChangeNodeVisible(fn: (node: IPublicModelNode, visible: boolean) => void): () => void {
+    this.designer.editor?.eventBus.on(EDITOR_EVENT.NODE_CHILDREN_CHANGE, fn);
+
+    return () => {
+      this.designer.editor?.eventBus.off(EDITOR_EVENT.NODE_CHILDREN_CHANGE, fn);
+    };
+  }
+
+  onChangeNodeChildren(fn: (info: IPublicOnChangeOptions) => void): () => void {
+    this.designer.editor?.eventBus.on(EDITOR_EVENT.NODE_VISIBLE_CHANGE, fn);
+
+    return () => {
+      this.designer.editor?.eventBus.off(EDITOR_EVENT.NODE_VISIBLE_CHANGE, fn);
+    };
+  }
+
   @obx.shallow private willPurgeSpace: Node[] = [];
 
   get modalNode() {

packages/designer/src/document/node/node.ts

@@ -16,6 +16,7 @@ import {
   IPublicModelNode,
   IPublicModelExclusiveGroup,
   IPublicEnumTransformStage,
+  EDITOR_EVENT,
 } from '@alilc/lowcode-types';
 import { compatStage, isDOMText, isJSExpression } from '@alilc/lowcode-utils';
 import { SettingTopEntry } from '@alilc/lowcode-designer';
@@ -32,6 +33,9 @@ import { NodeRemoveOptions } from '../../types';
 
 export interface INode extends IPublicModelNode {
 
+  setVisible(flag: boolean): void;
+
+  getVisible(): boolean;
 }
 
 /**
@@ -190,6 +194,13 @@ export class Node<Schema extends IPublicTypeNodeSchema = IPublicTypeNodeSchema>
 
     this.isInited = true;
     this.emitter = createModuleEventBus('Node');
+    const editor = this.document.designer.editor;
+    this.onVisibleChange((visible: boolean) => {
+      editor?.eventBus.emit(EDITOR_EVENT.NODE_VISIBLE_CHANGE, this, visible);
+    });
+    this.onChildrenChange((info?: { type: string; node: Node }) => {
+      editor?.eventBus.emit(EDITOR_EVENT.NODE_VISIBLE_CHANGE, info);
+    });
   }
 
   _settingEntry: SettingTopEntry;
@@ -261,27 +272,59 @@ export class Node<Schema extends IPublicTypeNodeSchema = IPublicTypeNodeSchema>
     return !!this._isRGLContainer;
   }
 
+  set isRGLContainerNode(status: boolean) {
+    this._isRGLContainer = status;
+  }
+
+  get isRGLContainerNode(): boolean {
+    return !!this._isRGLContainer;
+  }
+
   isContainer(): boolean {
-    return this.isParental() && this.componentMeta.isContainer;
+    return this.isContainerNode;
+  }
+
+  get isContainerNode(): boolean {
+    return this.isParentalNode && this.componentMeta.isContainer;
   }
 
   isModal(): boolean {
+    return this.isModalNode;
+  }
+
+  get isModalNode(): boolean {
     return this.componentMeta.isModal;
   }
 
   isRoot(): boolean {
+    return this.isRootNode;
+  }
+
+  get isRootNode(): boolean {
     return this.document.rootNode === (this as any);
   }
 
   isPage(): boolean {
-    return this.isRoot() && this.componentName === 'Page';
+    return this.isPageNode;
+  }
+
+  get isPageNode(): boolean {
+    return this.isRootNode && this.componentName === 'Page';
   }
 
   isComponent(): boolean {
-    return this.isRoot() && this.componentName === 'Component';
+    return this.isComponentNode;
+  }
+
+  get isComponentNode(): boolean {
+    return this.isRootNode && this.componentName === 'Component';
   }
 
   isSlot(): boolean {
+    return this.isSlotNode;
+  }
+
+  get isSlotNode(): boolean {
     return this._slotFor != null && this.componentName === 'Slot';
   }
 
@@ -289,13 +332,20 @@ export class Node<Schema extends IPublicTypeNodeSchema = IPublicTypeNodeSchema>
    * 是否一个父亲类节点
    */
   isParental(): boolean {
-    return !this.isLeaf();
+    return this.isParentalNode;
+  }
+
+  get isParentalNode(): boolean {
+    return !this.isLeafNode;
   }
 
   /**
    * 终端节点，内容一般为 文字 或者 表达式
    */
-  isLeaf(): this is LeafNode {
+  isLeaf(): boolean {
+    return this.isLeafNode;
+  }
+  get isLeafNode(): boolean {
     return this.componentName === 'Leaf';
   }
 

packages/designer/tests/document/node/node.add.test.ts

@@ -6,7 +6,6 @@ import { Node } from '../../../src/document/node/node';
 import { Designer } from '../../../src/designer/designer';
 import formSchema from '../../fixtures/schema/form';
 import { getIdsFromSchema, getNodeFromSchemaById } from '../../utils';
-import { EBADF } from 'constants';
 
 const mockCreateSettingEntry = jest.fn();
 jest.mock('../../../src/designer/designer', () => {

packages/designer/tests/document/node/node.dragdrop.test.ts

@@ -1,8 +1,5 @@
-import set from 'lodash/set';
-import cloneDeep from 'lodash/cloneDeep';
 import '../../fixtures/window';
 import { Project } from '../../../src/project/project';
-import { Node } from '../../../src/document/node/node';
 import { Designer } from '../../../src/designer/designer';
 import formSchema from '../../fixtures/schema/form';
 import { getIdsFromSchema, getNodeFromSchemaById } from '../../utils';

packages/designer/tests/document/node/node.modify.test.ts

@@ -1,8 +1,5 @@
-import set from 'lodash/set';
-import cloneDeep from 'lodash/cloneDeep';
 import '../../fixtures/window';
 import { Project } from '../../../src/project/project';
-import { Node } from '../../../src/document/node/node';
 import { Designer } from '../../../src/designer/designer';
 import formSchema from '../../fixtures/schema/form';
 import { getIdsFromSchema, getNodeFromSchemaById } from '../../utils';

packages/designer/tests/document/node/node.remove.test.ts

@@ -2,10 +2,9 @@ import set from 'lodash/set';
 import cloneDeep from 'lodash/cloneDeep';
 import '../../fixtures/window';
 import { Project } from '../../../src/project/project';
-import { Node } from '../../../src/document/node/node';
 import { Designer } from '../../../src/designer/designer';
 import formSchema from '../../fixtures/schema/form';
-import { getIdsFromSchema, getNodeFromSchemaById } from '../../utils';
+import { getIdsFromSchema } from '../../utils';
 
 const mockCreateSettingEntry = jest.fn();
 jest.mock('../../../src/designer/designer', () => {

packages/editor-skeleton/src/area.ts

@@ -1,9 +1,12 @@
 /* eslint-disable max-len */
 import { obx, computed, makeObservable } from '@alilc/lowcode-editor-core';
+import { Logger } from '@alilc/lowcode-utils';
+import { IPublicTypeWidgetBaseConfig, IArea } from '@alilc/lowcode-types';
 import { WidgetContainer } from './widget/widget-container';
 import { Skeleton } from './skeleton';
 import { IWidget } from './widget/widget';
-import { IPublicTypeWidgetBaseConfig, IArea } from '@alilc/lowcode-types';
+
+const logger = new Logger({ level: 'warn', bizName: 'skeleton:area' });
 
 export class Area<C extends IPublicTypeWidgetBaseConfig = any, T extends IWidget = IWidget> implements IArea<C, T> {
   @obx private _visible = true;
@@ -36,6 +39,7 @@ export class Area<C extends IPublicTypeWidgetBaseConfig = any, T extends IWidget
   add(config: T | C): T {
     const item = this.container.get(config.name);
     if (item) {
+      logger.warn(`The ${config.name} has already been added to skeleton.`);
       return item;
     }
     return this.container.add(config);

packages/engine/babel.config.js

@@ -0,0 +1 @@
+module.exports = require('../../babel.config');

packages/engine/build.plugin.js

@@ -25,24 +25,6 @@ const releaseVersion = getVersion();
 
 module.exports = ({ context, onGetWebpackConfig }) => {
   onGetWebpackConfig((config) => {
-    ['jsx', 'tsx'].forEach((rule) => {
-      config.module
-      .rule(rule)
-      .exclude.clear()
-      .add(/node_modules(?!(.+_component_demo|.+build-plugin-component))/)
-      .end()
-      .use('babel-loader')
-      .tap((options) => {
-        const { plugins = [] } = options;
-        return {
-          ...options,
-          plugins: [
-            ...plugins,
-            ['@babel/plugin-proposal-class-properties', { loose: true }],
-          ],
-        };
-      });
-    });
     config.resolve
       .plugin('tsconfigpaths')
       .use(TsconfigPathsPlugin, [{

packages/ignitor/babel.config.js

@@ -0,0 +1 @@
+module.exports = require('../../babel.config');

packages/ignitor/build.plugin.js

@@ -6,26 +6,6 @@ const { version } = lernaConfig;
 
 module.exports = ({ context, onGetWebpackConfig }) => {
   onGetWebpackConfig((config) => {
-    ['jsx', 'tsx'].forEach((rule) => {
-      config.module
-      .rule(rule)
-      .exclude.clear()
-      .add(/node_modules(?!(.+_component_demo|.+build-plugin-component))/)
-      .end()
-      .use('babel-loader')
-      .tap((options) => {
-        const { plugins = [] } = options;
-        console.log('plugins', plugins);
-        return {
-          ...options,
-          plugins: [
-            ...plugins,
-            ['@babel/plugin-proposal-class-properties', { loose: true }],
-          ],
-        };
-      });
-    });
-
     config.resolve.plugin('tsconfigpaths').use(TsconfigPathsPlugin, [
       {
         configFile: './tsconfig.json',

packages/ignitor/jest.config.js

@@ -0,0 +1,47 @@
+const fs = require('fs');
+const { join } = require('path');
+const esModules = [].join('|');
+const pkgNames = fs.readdirSync(join('..')).filter(pkgName => !pkgName.startsWith('.'));
+
+const jestConfig = {
+  // transform: {
+  //   '^.+\\.[jt]sx?$': 'babel-jest',
+  //   // '^.+\\.(ts|tsx)$': 'ts-jest',
+  //   // '^.+\\.(js|jsx)$': 'babel-jest',
+  // },
+  // testMatch: ['**/node-children.test.ts'],
+  // testMatch: ['**/plugin-manager.test.ts'],
+  // testMatch: ['**/history/history.test.ts'],
+  // testMatch: ['**/document-model.test.ts'],
+  // testMatch: ['**/prop.test.ts'],
+  // testMatch: ['(/tests?/.*(test))\\.[jt]s$'],
+  transformIgnorePatterns: [
+    `/node_modules/(?!${esModules})/`,
+  ],
+  setupFiles: ['./tests/fixtures/unhandled-rejection.ts'],
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
+  collectCoverage: false,
+  collectCoverageFrom: [
+    'src/**/*.ts',
+    '!src/**/*.d.ts',
+    '!src/icons/**',
+    '!src/locale/**',
+    '!src/builtin-simulator/utils/**',
+    '!src/plugin/sequencify.ts',
+    '!src/document/node/exclusive-group.ts',
+    '!src/document/node/props/value-to-source.ts',
+    '!src/builtin-simulator/live-editing/live-editing.ts',
+    '!src/designer/offset-observer.ts',
+    '!src/designer/clipboard.ts',
+    '!src/designer/scroller.ts',
+    '!src/builtin-simulator/host.ts',
+    '!**/node_modules/**',
+    '!**/vendor/**',
+  ],
+};
+
+// 只对本仓库内的 pkg 做 mapping
+jestConfig.moduleNameMapper = {};
+jestConfig.moduleNameMapper[`^@alilc/lowcode\\-(${pkgNames.join('|')})$`] = '<rootDir>/../$1/src';
+
+module.exports = jestConfig;

packages/plugin-outline-pane/src/controllers/tree-node.ts

@@ -110,7 +110,7 @@ export default class TreeNode {
   get hidden(): boolean {
     const cv = this.node.isConditionalVisible();
     if (cv == null) {
-      return !this.node.getVisible();
+      return !this.node.visible;
     }
     return !cv;
   }
@@ -119,7 +119,7 @@ export default class TreeNode {
     if (this.node.conditionGroup) {
       return;
     }
-    this.node.setVisible(!flag);
+    this.node.visible = !flag;
     this.onHiddenChanged && this.onHiddenChanged(flag);
   }
 

packages/plugin-outline-pane/src/views/tree-title.tsx

@@ -122,7 +122,7 @@ export default class TreeTitle extends Component<{
         data-id={treeNode.id}
         onClick={() => {
           if (isModal) {
-            if (node.getVisible()) {
+            if (node.visible) {
               node.document?.modalNodesManager?.setInvisible(node);
             } else {
               node.document?.modalNodesManager?.setVisible(node);
@@ -134,7 +134,7 @@ export default class TreeTitle extends Component<{
           }
         }}
       >
-        {isModal && node.getVisible() && (
+        {isModal && node.visible && (
           <div onClick={() => {
             node.document?.modalNodesManager?.setInvisible(node);
           }}
@@ -142,7 +142,7 @@ export default class TreeTitle extends Component<{
             <IconRadioActive className="tree-node-modal-radio-active" />
           </div>
         )}
-        {isModal && !node.getVisible() && (
+        {isModal && !node.visible && (
           <div onClick={() => {
             node.document?.modalNodesManager?.setVisible(node);
           }}

packages/rax-simulator-renderer/babel.config.js

@@ -0,0 +1 @@
+module.exports = require('../../babel.config');

packages/rax-simulator-renderer/build.plugin.js

@@ -1,24 +1,5 @@
 module.exports = ({ onGetWebpackConfig }) => {
   onGetWebpackConfig((config) => {
-    ['jsx', 'tsx'].forEach((rule) => {
-      config.module
-      .rule(rule)
-      .exclude.clear()
-      .add(/node_modules(?!(.+_component_demo|.+build-plugin-component))/)
-      .end()
-      .use('babel-loader')
-      .tap((options) => {
-        const { plugins = [] } = options;
-        console.log('plugins', plugins);
-        return {
-          ...options,
-          plugins: [
-            ...plugins,
-            ['@babel/plugin-proposal-class-properties', { loose: true }],
-          ],
-        };
-      });
-    });
     config.performance.hints(false);
   });
 };

packages/react-simulator-renderer/babel.config.js

@@ -0,0 +1 @@
+module.exports = require('../../babel.config');

packages/react-simulator-renderer/build.plugin.js

@@ -1,24 +1,5 @@
 module.exports = ({ onGetWebpackConfig }) => {
   onGetWebpackConfig((config) => {
-    ['jsx', 'tsx'].forEach((rule) => {
-      config.module
-      .rule(rule)
-      .exclude.clear()
-      .add(/node_modules(?!(.+_component_demo|.+build-plugin-component))/)
-      .end()
-      .use('babel-loader')
-      .tap((options) => {
-        const { plugins = [] } = options;
-        console.log('plugins', plugins);
-        return {
-          ...options,
-          plugins: [
-            ...plugins,
-            ['@babel/plugin-proposal-class-properties', { loose: true }],
-          ],
-        };
-      });
-    });
     config.performance.hints(false);
   });
 };

packages/shell/src/api/project.ts

@@ -139,7 +139,6 @@ export class Project implements IPublicApiProject {
    */
   importSchema(schema?: IPublicTypeProjectSchema): void {
     this[projectSymbol].load(schema, true);
-    // this[editorSymbol].emit(Events.IMPORT_SCHEMA, schema);
   }
 
   /**

packages/shell/src/api/skeleton.ts

@@ -11,7 +11,7 @@ export class Skeleton implements IPublicApiSkeleton {
   private readonly [innerSkeletonSymbol]: InnerSkeleton;
   private readonly pluginName: string;
 
-  get [skeletonSymbol]() {
+  get [skeletonSymbol](): InnerSkeleton {
     if (this.workspaceMode) {
       return this[innerSkeletonSymbol];
     }

packages/shell/src/model/document-model.ts

@@ -29,6 +29,7 @@ import { Node } from './node';
 import { Selection } from './selection';
 import { Detecting } from './detecting';
 import { History } from './history';
+import { DropLocation } from './drop-location';
 import { Project } from '../api/project';
 import { Prop } from './prop';
 import { ModalNodesManager } from './modal-nodes-manager';
@@ -45,7 +46,7 @@ export class DocumentModel implements IPublicModelDocumentModel {
   detecting: IPublicModelDetecting;
   history: IPublicModelHistory;
   /**
-   * @deprecated
+   * @deprecated use canvas API instead
    */
   canvas: IPublicApiCanvas;
 
@@ -89,12 +90,13 @@ export class DocumentModel implements IPublicModelDocumentModel {
    * 获取当前文档所属的 project
    * @returns
    */
-  get project(): IPublicApiProject | null {
+  get project(): IPublicApiProject {
     return Project.create(this[documentSymbol].project);
   }
 
   /**
    * 获取文档的根节点
+   * root node of this documentModel
    * @returns
    */
   get root(): IPublicModelNode | null {
@@ -114,10 +116,10 @@ export class DocumentModel implements IPublicModelDocumentModel {
   }
 
   /**
-   * 获取文档下所有节点
+   * 获取文档下所有节点 Map, key 为 nodeId
-   * @returns
+   * get map of all nodes , using node.id as key
    */
-  get nodesMap(): any {
+  get nodesMap(): Map<string, IPublicModelNode> {
     const map = new Map<string, IPublicModelNode>();
     for (let id of this[documentSymbol].nodesMap.keys()) {
       map.set(id, this.getNodeById(id)!);
@@ -132,11 +134,8 @@ export class DocumentModel implements IPublicModelDocumentModel {
     return ModalNodesManager.create(this[documentSymbol].modalNodesManager);
   }
 
-  /**
+  get dropLocation(): IPublicModelDropLocation | null {
-   * @TODO: 能不能直接暴露
+    return DropLocation.create(this[documentSymbol].dropLocation);
-   */
-  get dropLocation(): IPublicModelDropLocation {
-    return this[documentSymbol].dropLocation;
   }
 
   set dropLocation(loc: IPublicModelDropLocation | null) {
@@ -144,8 +143,8 @@ export class DocumentModel implements IPublicModelDocumentModel {
   }
   /**
    * 根据 nodeId 返回 Node 实例
-   * @param nodeId
+   * get node instance by nodeId
-   * @returns
+   * @param {string} nodeId
    */
   getNodeById(nodeId: string): IPublicModelNode | null {
     return Node.create(this[documentSymbol].getNode(nodeId));
@@ -289,11 +288,8 @@ export class DocumentModel implements IPublicModelDocumentModel {
    * @param fn
    */
   onChangeNodeVisible(fn: (node: IPublicModelNode, visible: boolean) => void): void {
-    // TODO: history 变化时需要重新绑定
+    this[documentSymbol].onChangeNodeVisible((node: IPublicModelNode, visible: boolean) => {
-    this[documentSymbol].nodesMap?.forEach((node) => {
+      fn(Node.create(node)!, visible);
-      node.onVisibleChange((flag: boolean) => {
-        fn(Node.create(node)!, flag);
-      });
     });
   }
 
@@ -301,16 +297,14 @@ export class DocumentModel implements IPublicModelDocumentModel {
    * 当前 document 的节点 children 变更事件
    * @param fn
    */
-  onChangeNodeChildren(fn: (info?: IPublicOnChangeOptions) => void): void {
+  onChangeNodeChildren(fn: (info: IPublicOnChangeOptions) => void): void {
-    // TODO: history 变化时需要重新绑定
+    this[documentSymbol].onChangeNodeChildren((info?: IPublicOnChangeOptions) => {
-    this[documentSymbol].nodesMap?.forEach((node) => {
+      if (!info) {
-      node.onChildrenChange((info?: InnerOnChangeOptions) => {
+        return;
-        return info
+      }
-          ? fn({
+      fn({
-              type: info.type,
+        type: info.type,
-              node: Node.create(node)!,
+        node: Node.create(info.node)!,
-            })
-          : fn();
       });
     });
   }

packages/shell/src/model/drop-location.ts

@@ -3,7 +3,7 @@ import {
 } from '@alilc/lowcode-designer';
 import { dropLocationSymbol } from '../symbols';
 import { Node } from './node';
-import { IPublicModelDropLocation } from '@alilc/lowcode-types';
+import { IPublicModelDropLocation, IPublicTypeLocationDetail, IPublicModelLocateEvent } from '@alilc/lowcode-types';
 
 export class DropLocation implements IPublicModelDropLocation {
   private readonly [dropLocationSymbol]: InnerDropLocation;
@@ -12,7 +12,7 @@ export class DropLocation implements IPublicModelDropLocation {
     this[dropLocationSymbol] = dropLocation;
   }
 
-  static create(dropLocation: InnerDropLocation | null): DropLocation | null {
+  static create(dropLocation: InnerDropLocation | null): IPublicModelDropLocation | null {
     if (!dropLocation) {
       return null;
     }
@@ -22,4 +22,16 @@ export class DropLocation implements IPublicModelDropLocation {
   get target() {
     return Node.create(this[dropLocationSymbol].target);
   }
+
+  get detail(): IPublicTypeLocationDetail {
+    return this[dropLocationSymbol].detail;
+  }
+
+  get event(): IPublicModelLocateEvent {
+    return this[dropLocationSymbol].event;
+  }
+
+  clone(event: IPublicModelLocateEvent): IPublicModelDropLocation {
+    return new DropLocation(this[dropLocationSymbol].clone(event));
+  }
 }

packages/shell/src/model/node.ts

@@ -1,5 +1,6 @@
 import {
-  DocumentModel as InnerDocumentModel,
+  IDocumentModel as InnerDocumentModel,
+  INode as InnerNode,
 } from '@alilc/lowcode-designer';
 import {
   IPublicTypeCompositeValue,
@@ -16,6 +17,7 @@ import {
   IPublicTypePropsMap,
   IPublicTypePropsList,
   IPublicModelSettingTopEntry,
+  IPublicModelExclusiveGroup,
 } from '@alilc/lowcode-types';
 import { Prop } from './prop';
 import { Props } from './props';
@@ -29,8 +31,8 @@ import { ReactElement } from 'react';
 const shellNodeSymbol = Symbol('shellNodeSymbol');
 
 export class Node implements IPublicModelNode {
-  private readonly [documentSymbol]: InnerDocumentModel;
+  private readonly [documentSymbol]: InnerDocumentModel | null;
-  private readonly [nodeSymbol]: IPublicModelNode;
+  private readonly [nodeSymbol]: InnerNode;
 
   private _id: string;
 
@@ -81,14 +83,14 @@ export class Node implements IPublicModelNode {
    * 是否为「容器型」节点
    */
   get isContainer(): boolean {
-    return this[nodeSymbol].isContainer();
+    return this[nodeSymbol].isContainerNode;
   }
 
   /**
    * 是否为「容器型」节点
    */
   get isContainerNode(): boolean {
-    return this[nodeSymbol].isContainer();
+    return this[nodeSymbol].isContainerNode;
   }
 
   /**
@@ -96,14 +98,14 @@ export class Node implements IPublicModelNode {
    * 是否为根节点
    */
   get isRoot(): boolean {
-    return this[nodeSymbol].isRoot();
+    return this[nodeSymbol].isRootNode;
   }
 
   /**
    * 是否为根节点
    */
   get isRootNode(): boolean {
-    return this[nodeSymbol].isRoot();
+    return this[nodeSymbol].isRootNode;
   }
 
   /**
@@ -111,14 +113,14 @@ export class Node implements IPublicModelNode {
    * 是否为空节点（无 children 或者 children 为空）
    */
   get isEmpty(): boolean {
-    return this[nodeSymbol].isEmpty();
+    return this[nodeSymbol].isEmptyNode;
   }
 
   /**
    * 是否为空节点（无 children 或者 children 为空）
    */
   get isEmptyNode(): boolean {
-    return this[nodeSymbol].isEmpty();
+    return this[nodeSymbol].isEmptyNode;
   }
 
   /**
@@ -126,14 +128,14 @@ export class Node implements IPublicModelNode {
    * 是否为 Page 节点
    */
   get isPage(): boolean {
-    return this[nodeSymbol].isPage();
+    return this[nodeSymbol].isPageNode;
   }
 
   /**
    * 是否为 Page 节点
    */
   get isPageNode(): boolean {
-    return this[nodeSymbol].isPage();
+    return this[nodeSymbol].isPageNode;
   }
 
   /**
@@ -141,14 +143,14 @@ export class Node implements IPublicModelNode {
    * 是否为 Component 节点
    */
   get isComponent(): boolean {
-    return this[nodeSymbol].isComponent();
+    return this[nodeSymbol].isComponentNode;
   }
 
   /**
    * 是否为 Component 节点
    */
   get isComponentNode(): boolean {
-    return this[nodeSymbol].isComponent();
+    return this[nodeSymbol].isComponentNode;
   }
 
   /**
@@ -156,14 +158,14 @@ export class Node implements IPublicModelNode {
    * 是否为「模态框」节点
    */
   get isModal(): boolean {
-    return this[nodeSymbol].isModal();
+    return this[nodeSymbol].isModalNode;
   }
 
   /**
    * 是否为「模态框」节点
    */
   get isModalNode(): boolean {
-    return this[nodeSymbol].isModal();
+    return this[nodeSymbol].isModalNode;
   }
 
   /**
@@ -171,14 +173,14 @@ export class Node implements IPublicModelNode {
    * 是否为插槽节点
    */
   get isSlot(): boolean {
-    return this[nodeSymbol].isSlot();
+    return this[nodeSymbol].isSlotNode;
   }
 
   /**
    * 是否为插槽节点
    */
   get isSlotNode(): boolean {
-    return this[nodeSymbol].isSlot();
+    return this[nodeSymbol].isSlotNode;
   }
 
   /**
@@ -186,14 +188,14 @@ export class Node implements IPublicModelNode {
    * 是否为父类/分支节点
    */
   get isParental(): boolean {
-    return this[nodeSymbol].isParental();
+    return this[nodeSymbol].isParentalNode;
   }
 
   /**
    * 是否为父类/分支节点
    */
   get isParentalNode(): boolean {
-    return this[nodeSymbol].isParental();
+    return this[nodeSymbol].isParentalNode;
   }
 
   /**
@@ -201,14 +203,14 @@ export class Node implements IPublicModelNode {
    * 是否为叶子节点
    */
   get isLeaf(): boolean {
-    return this[nodeSymbol].isLeaf();
+    return this[nodeSymbol].isLeafNode;
   }
 
   /**
    * 是否为叶子节点
    */
   get isLeafNode(): boolean {
-    return this[nodeSymbol].isLeaf();
+    return this[nodeSymbol].isLeafNode;
   }
 
   /**
@@ -398,6 +400,14 @@ export class Node implements IPublicModelNode {
     return this[nodeSymbol].hasLoop();
   }
 
+  get visible(): boolean {
+    return this[nodeSymbol].getVisible();
+  }
+
+  set visible(value: boolean) {
+    this[nodeSymbol].setVisible(value);
+  }
+
   getVisible(): boolean {
     return this[nodeSymbol].getVisible();
   }
@@ -620,4 +630,20 @@ export class Node implements IPublicModelNode {
   canPerformAction(actionName: string): boolean {
     return this[nodeSymbol].canPerformAction(actionName);
   }
+
+  /**
+   * get conditionGroup
+   * @since v1.1.0
+   */
+  get conditionGroup(): IPublicModelExclusiveGroup | null {
+    return this[nodeSymbol].conditionGroup;
+  }
+
+  /**
+   * set value for conditionalVisible
+   * @since v1.1.0
+   */
+  setConditionalVisible(): void {
+    this[nodeSymbol].setConditionalVisible();
+  }
 }

packages/types/src/editor.ts

@@ -173,3 +173,9 @@ export interface PluginStatus {
 export interface PluginStatusSet {
   [key: string]: PluginStatus;
 }
+
+export enum EDITOR_EVENT {
+  NODE_CHILDREN_CHANGE = 'node.children.change',
+
+  NODE_VISIBLE_CHANGE = 'node.visible.change',
+}

packages/types/src/shell/model/document-model.ts

@@ -2,6 +2,7 @@ import { IPublicTypeRootSchema, IPublicTypeDragNodeDataObject, IPublicTypeDragNo
 import { IPublicEnumTransformStage } from '../enum';
 import { IPublicApiProject } from '../api';
 import { IPublicModelDropLocation, IPublicModelDetecting, IPublicModelNode, IPublicModelSelection, IPublicModelHistory, IPublicModelModalNodesManager } from './';
+import { IPublicOnChangeOptions } from '@alilc/lowcode-types';
 
 export interface IPublicModelDocumentModel {
 
@@ -12,20 +13,34 @@ export interface IPublicModelDocumentModel {
 
   set id(id);
 
+  /**
+   * 节点选中区模型实例
+   * instance of selection
+   */
   selection: IPublicModelSelection;
 
+  /**
+   * 画布节点 hover 区模型实例
+   * instance of detecting
+   */
   detecting: IPublicModelDetecting;
 
+  /**
+   * 操作历史模型实例
+   * instance of history
+   */
   history: IPublicModelHistory;
 
   /**
    * 获取当前文档所属的 project
+   * get project which this documentModel belongs to
    * @returns
    */
-  get project(): IPublicApiProject | null;
+  get project(): IPublicApiProject;
 
   /**
    * 获取文档的根节点
+   * root node of this documentModel
    * @returns
    */
   get root(): IPublicModelNode | null;
@@ -38,15 +53,17 @@ export interface IPublicModelDocumentModel {
    * 获取文档下所有节点
    * @returns
    */
-  get nodesMap(): any;
+  get nodesMap(): Map<string, IPublicModelNode>;
 
   /**
    * 模态节点管理
+   * get instance of modalNodesManager
    */
   get modalNodesManager(): IPublicModelModalNodesManager | null;
 
   /**
    * 根据 nodeId 返回 Node 实例
+   * get node by nodeId
    * @param nodeId
    * @returns
    */
@@ -54,12 +71,14 @@ export interface IPublicModelDocumentModel {
 
   /**
    * 导入 schema
+   * import schema data
    * @param schema
    */
   importSchema(schema: IPublicTypeRootSchema): void;
 
   /**
    * 导出 schema
+   * export schema
    * @param stage
    * @returns
    */
@@ -67,11 +86,7 @@ export interface IPublicModelDocumentModel {
 
   /**
    * 插入节点
-   * @param parent
+   * insert a node
-   * @param thing
-   * @param at
-   * @param copy
-   * @returns
    */
   insertNode(
     parent: IPublicModelNode,
@@ -82,6 +97,7 @@ export interface IPublicModelDocumentModel {
 
   /**
    * 创建一个节点
+   * create a node
    * @param data
    * @returns
    */
@@ -89,6 +105,7 @@ export interface IPublicModelDocumentModel {
 
   /**
    * 移除指定节点/节点id
+   * remove a node by node instance or nodeId
    * @param idOrNode
    */
   removeNode(idOrNode: string | IPublicModelNode): void;
@@ -102,9 +119,11 @@ export interface IPublicModelDocumentModel {
 
   /**
    * 检查拖拽放置的目标节点是否可以放置该拖拽对象
+   * check if dragOjbect can be put in this dragTarget
    * @param dropTarget 拖拽放置的目标节点
    * @param dragObject 拖拽的对象
    * @returns boolean 是否可以放置
+   * @since v1.0.16
    */
   checkNesting(
     dropTarget: IPublicModelNode,
@@ -113,36 +132,49 @@ export interface IPublicModelDocumentModel {
 
   /**
    * 当前 document 新增节点事件
+   * set callback for event on node is created for a document
    */
   onAddNode(fn: (node: IPublicModelNode) => void): IPublicTypeDisposable;
 
   /**
    * 当前 document 新增节点事件，此时节点已经挂载到 document 上
+   * set callback for event on node is mounted to canvas
    */
   onMountNode(fn: (payload: { node: IPublicModelNode }) => void): IPublicTypeDisposable;
 
   /**
    * 当前 document 删除节点事件
+   * set callback for event on node is removed
    */
   onRemoveNode(fn: (node: IPublicModelNode) => void): IPublicTypeDisposable;
 
   /**
    * 当前 document 的 hover 变更事件
+   *
+   * set callback for event on detecting changed
    */
   onChangeDetecting(fn: (node: IPublicModelNode) => void): IPublicTypeDisposable;
 
   /**
    * 当前 document 的选中变更事件
+   * set callback for event on selection changed
    */
   onChangeSelection(fn: (ids: string[]) => void): IPublicTypeDisposable;
 
   /**
    * 当前 document 的节点显隐状态变更事件
+   * set callback for event on visibility changed for certain node
    * @param fn
    */
   onChangeNodeVisible(fn: (node: IPublicModelNode, visible: boolean) => void): void;
 
 
+  /**
+   * 当前 document 的节点 children 变更事件
+   * @param fn
+   */
+  onChangeNodeChildren(fn: (info: IPublicOnChangeOptions) => void): void;
+
   /**
    * 当前 document 节点属性修改事件
    * @param fn
@@ -169,7 +201,7 @@ export interface IPublicModelDocumentModel {
    * get current drop location
    * @since v1.1.0
    */
-  get dropLocation(): IPublicModelDropLocation;
+  get dropLocation(): IPublicModelDropLocation | null;
 
   /**
    * 设置当前的 DropLocation 信息

packages/types/src/shell/model/drop-location.ts

@@ -1,10 +1,29 @@
 import { IPublicTypeLocationDetail } from '../type';
-import { IPublicModelLocateEvent } from './';
+import { IPublicModelLocateEvent, IPublicModelNode } from './';
 
 export interface IPublicModelDropLocation {
-  get target(): any;
 
-  readonly detail: IPublicTypeLocationDetail;
+  /**
+   * 拖拽位置目标
+   * get target of dropLocation
+   */
+  get target(): IPublicModelNode;
 
+  /**
+   * 拖拽放置位置详情
+   * get detail of dropLocation
+   */
+  get detail(): IPublicTypeLocationDetail;
+
+  /**
+   * 拖拽放置位置对应的事件
+   * get event of dropLocation
+   */
+  get event(): IPublicModelLocateEvent;
+
+  /**
+   * 获取一份当前对象的克隆
+   * get a clone object of current dropLocation
+   */
   clone(event: IPublicModelLocateEvent): IPublicModelDropLocation;
 }

packages/types/src/shell/model/node.ts

@@ -6,43 +6,49 @@ import { IPublicModelNodeChildren, IPublicModelComponentMeta, IPublicModelProp,
 export interface IPublicModelNode {
   /**
    * 节点 id
+   * node id
    */
   id: string;
+
   /**
    * 节点标题
+   * title of node
    */
   get title(): string | IPublicTypeI18nData | ReactElement;
 
   /**
    * @deprecated please use isContainerNode
-   * 是否为「容器型」节点
    */
   get isContainer(): boolean;
 
   /**
    * 是否为「容器型」节点
+   * check if node is a container type node
+   * @since v1.1.0
    */
   get isContainerNode(): boolean;
 
   /**
    * @deprecated please use isRootNode
-   * 是否为根节点
    */
   get isRoot(): boolean;
 
   /**
    * 是否为根节点
+   * check if node is root in the tree
+   * @since v1.1.0
    */
   get isRootNode(): boolean;
 
   /**
    * @deprecated please use isEmptyNode
-   * 是否为空节点（无 children 或者 children 为空）
    */
   get isEmpty(): boolean;
 
   /**
    * 是否为空节点（无 children 或者 children 为空）
+   * check if current node is empty, which means no children or children is empty
+   * @since v1.1.0
    */
   get isEmptyNode(): boolean;
 
@@ -54,220 +60,260 @@ export interface IPublicModelNode {
 
   /**
    * 是否为 Page 节点
+   * check if node is Page
+   * @since v1.1.0
    */
   get isPageNode(): boolean;
 
   /**
    * @deprecated please use isComponentNode
-   * 是否为 Component 节点
    */
   get isComponent(): boolean;
 
   /**
    * 是否为 Component 节点
+   * check if node is Component
+   * @since v1.1.0
    */
   get isComponentNode(): boolean;
 
   /**
    * @deprecated please use isModalNode
-   * 是否为「模态框」节点
    */
   get isModal(): boolean;
 
   /**
    * 是否为「模态框」节点
+   * check if node is Modal
+   * @since v1.1.0
    */
   get isModalNode(): boolean;
 
   /**
    * @deprecated please use isSlotNode
-   * 是否为插槽节点
    */
   get isSlot(): boolean;
 
   /**
    * 是否为插槽节点
+   * check if node is a Slot
+   * @since v1.1.0
    */
   get isSlotNode(): boolean;
 
   /**
    * @deprecated please use isParentalNode
-   * 是否为父类/分支节点
    */
   get isParental(): boolean;
 
   /**
    * 是否为父类/分支节点
+   * check if node a parental node
+   * @since v1.1.0
    */
   get isParentalNode(): boolean;
 
   /**
    * @deprecated please use isLeafNode
-   * 是否为叶子节点
    */
   get isLeaf(): boolean;
 
   /**
    * 是否为叶子节点
+   * check if node is a leaf node in tree
+   * @since v1.1.0
    */
   get isLeafNode(): boolean;
 
   /**
    * 获取当前节点的锁定状态
+   * check if current node is locked
+   * @since v1.0.16
    */
   get isLocked(): boolean;
 
+  /**
+   * @deprecated please use isRGLContainerNode
+   */
+  set isRGLContainer(flag: boolean);
+
+  /**
+   * @deprecated please use isRGLContainerNode
+   * @returns Boolean
+   */
+  get isRGLContainer();
+
+  /**
+   * 设置为磁贴布局节点
+   * @since v1.1.0
+   */
+  set isRGLContainerNode(flag: boolean);
+
+  /**
+   * 获取磁贴布局节点设置状态
+   * @returns Boolean
+   * @since v1.1.0
+   */
+  get isRGLContainerNode();
+
   /**
    * 下标
+   * index
    */
   get index(): number;
 
   /**
    * 图标
+   * get icon of this node
    */
   get icon(): IPublicTypeIconType;
 
   /**
    * 节点所在树的层级深度，根节点深度为 0
+   * depth level of this node, value of root node is 0
    */
   get zLevel(): number;
 
   /**
    * 节点 componentName
+   * componentName
    */
   get componentName(): string;
 
   /**
    * 节点的物料元数据
+   * get component meta of this node
    */
   get componentMeta(): IPublicModelComponentMeta | null;
 
   /**
    * 获取节点所属的文档模型对象
-   * @returns
+   * get documentModel of this node
    */
   get document(): IPublicModelDocumentModel | null;
 
   /**
    * 获取当前节点的前一个兄弟节点
-   * @returns
+   * get previous sibling of this node
    */
   get prevSibling(): IPublicModelNode | null;
 
   /**
    * 获取当前节点的后一个兄弟节点
-   * @returns
+   * get next sibling of this node
    */
   get nextSibling(): IPublicModelNode | null;
 
   /**
    * 获取当前节点的父亲节点
-   * @returns
+   * get parent of this node
    */
   get parent(): IPublicModelNode | null;
 
   /**
    * 获取当前节点的孩子节点模型
-   * @returns
+   * get children of this node
    */
   get children(): IPublicModelNodeChildren | null;
 
   /**
    * 节点上挂载的插槽节点们
+   * get slots of this node
    */
   get slots(): IPublicModelNode[];
 
   /**
    * 当前节点为插槽节点时，返回节点对应的属性实例
+   * return coresponding prop when this node is a slot node
    */
   get slotFor(): IPublicModelProp | null;
 
   /**
    * 返回节点的属性集
+   * get props
    */
   get props(): IPublicModelProps | null;
 
   /**
    * 返回节点的属性集
+   * get props data
    */
   get propsData(): IPublicTypePropsMap | IPublicTypePropsList | null;
 
+  /**
+   * get conditionGroup
+   */
+  get conditionGroup(): IPublicModelExclusiveGroup | null;
+
   /**
    * 获取符合搭建协议 - 节点 schema 结构
+   * get schema of this node
+   * @since v1.1.0
    */
   get schema(): IPublicTypeNodeSchema;
 
+  /**
+   * 获取对应的 setting entry
+   * get setting entry of this node
+   * @since v1.1.0
+   */
   get settingEntry(): IPublicModelSettingTopEntry;
 
-  /**
-   * 执行新增、删除、排序等操作
-   * @param remover
-   * @param adder
-   * @param sorter
-   */
-  mergeChildren(
-    remover: (node: IPublicModelNode, idx: number) => boolean,
-    adder: (children: IPublicModelNode[]) => any,
-    sorter: (firstNode: IPublicModelNode, secondNode: IPublicModelNode) => number
-  ): any;
-
   /**
    * 返回节点的尺寸、位置信息
-   * @returns
+   * get rect information for this node
    */
   getRect(): DOMRect | null;
 
   /**
    * 是否有挂载插槽节点
-   * @returns
+   * check if current node has slots
    */
   hasSlots(): boolean;
 
   /**
    * 是否设定了渲染条件
-   * @returns
+   * check if current node has condition value set
    */
   hasCondition(): boolean;
 
   /**
    * 是否设定了循环数据
-   * @returns
+   * check if loop is set for this node
    */
   hasLoop(): boolean;
 
-  getVisible(): boolean;
-
-  setVisible(flag: boolean): void;
-
-  isConditionalVisible(): boolean | undefined;
-
-  /**
-   * 设置节点锁定状态
-   * @param flag
-   */
-  lock(flag?: boolean): void;
-
-  contains(node: IPublicModelNode): boolean;
-
   /**
    * 获取指定 path 的属性模型实例
+   * get prop by path
    * @param path 属性路径，支持 a / a.b / a.0 等格式
-   * @returns
    */
   getProp(path: string, createIfNone: boolean): IPublicModelProp | null;
 
+  /**
+   * 获取指定 path 的属性模型实例值
+   * get prop value by path
+   * @param path 属性路径，支持 a / a.b / a.0 等格式
+   */
+  getPropValue(path: string): any;
+
   /**
    * 获取指定 path 的属性模型实例，
    *  注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级
+   *
+   * get extra prop by path, an extra prop means a prop not exists in the `props`
+   * but as siblint of the `props`
    * @param path 属性路径，支持 a / a.b / a.0 等格式
    * @param createIfNone 当没有属性的时候，是否创建一个属性
-   * @returns
    */
   getExtraProp(path: string, createIfNone?: boolean): IPublicModelProp | null;
 
   /**
    * 获取指定 path 的属性模型实例，
    *  注：导出时，不同于普通属性，该属性并不挂载在 props 之下，而是与 props 同级
+   *
+   * get extra prop value by path, an extra prop means a prop not exists in the `props`
+   * but as siblint of the `props`
    * @param path 属性路径，支持 a / a.b / a.0 等格式
    * @returns
    */
@@ -275,52 +321,64 @@ export interface IPublicModelNode {
 
   /**
    * 设置指定 path 的属性模型实例值
+   * set value for prop with path
    * @param path 属性路径，支持 a / a.b / a.0 等格式
    * @param value 值
-   * @returns
    */
   setPropValue(path: string, value: IPublicTypeCompositeValue): void;
 
   /**
    * 设置指定 path 的属性模型实例值
+   * set value for extra prop with path
    * @param path 属性路径，支持 a / a.b / a.0 等格式
    * @param value 值
-   * @returns
    */
   setExtraPropValue(path: string, value: IPublicTypeCompositeValue): void;
 
   /**
    * 导入节点数据
+   * import node schema
    * @param data
    */
   importSchema(data: IPublicTypeNodeSchema): void;
 
   /**
    * 导出节点数据
+   * export schema from this node
    * @param stage
    * @param options
-   * @returns
    */
   exportSchema(stage: IPublicEnumTransformStage, options?: any): IPublicTypeNodeSchema;
 
   /**
    * 在指定位置之前插入一个节点
+   * insert a node befor current node
    * @param node
    * @param ref
    * @param useMutator
    */
-  insertBefore(node: IPublicModelNode, ref?: IPublicModelNode | undefined, useMutator?: boolean): void;
+  insertBefore(
+      node: IPublicModelNode,
+      ref?: IPublicModelNode | undefined,
+      useMutator?: boolean,
+    ): void;
 
   /**
    * 在指定位置之后插入一个节点
+   * insert a node after this node
    * @param node
    * @param ref
    * @param useMutator
    */
-  insertAfter(node: IPublicModelNode, ref?: IPublicModelNode | undefined, useMutator?: boolean): void;
+  insertAfter(
+      node: IPublicModelNode,
+      ref?: IPublicModelNode | undefined,
+      useMutator?: boolean,
+    ): void;
 
   /**
    * 替换指定节点
+   * replace a child node with data provided
    * @param node 待替换的子节点
    * @param data 用作替换的节点对象或者节点描述
    * @returns
@@ -329,58 +387,91 @@ export interface IPublicModelNode {
 
   /**
    * 将当前节点替换成指定节点描述
+   * replace current node with a new node schema
    * @param schema
    */
   replaceWith(schema: IPublicTypeNodeSchema): any;
 
   /**
    * 选中当前节点实例
+   * select current node
    */
   select(): void;
 
   /**
    * 设置悬停态
+   * set hover value for current node
    * @param flag
    */
   hover(flag: boolean): void;
 
+  /**
+   * 设置节点锁定状态
+   * set lock value for current node
+   * @param flag
+   * @since v1.0.16
+   */
+  lock(flag?: boolean): void;
+
   /**
    * 删除当前节点实例
+   * remove current node
    */
   remove(): void;
 
   /**
-   * @deprecated please use isRGLContainerNode
+   * 执行新增、删除、排序等操作
-   * 设置为磁贴布局节点
+   * excute remove/add/sort operations on node`s children
+   *
+   * @since v1.1.0
    */
-  set isRGLContainer(flag: boolean);
+  mergeChildren(
+    remover: (node: IPublicModelNode, idx: number) => boolean,
+    adder: (children: IPublicModelNode[]) => any,
+    sorter: (firstNode: IPublicModelNode, secondNode: IPublicModelNode) => number
+  ): any;
 
   /**
-   * @deprecated please use isRGLContainerNode
+   * 当前节点是否包含某子节点
-   * 获取磁贴布局节点设置状态
+   * check if current node contains another node as a child
-   * @returns Boolean
+   * @param node
+   * @since v1.1.0
    */
-  get isRGLContainer();
+  contains(node: IPublicModelNode): boolean;
-
-  /**
-   * 设置为磁贴布局节点
-   */
-  set isRGLContainerNode(flag: boolean);
-
-  /**
-   * 获取磁贴布局节点设置状态
-   * @returns Boolean
-   */
-  get isRGLContainerNode();
 
   /**
    * 是否可执行某 action
+   * check if current node can perform certain aciton with actionName
    * @param actionName action 名字
-   * @returns boolean
+   * @since v1.1.0
    */
   canPerformAction(actionName: string): boolean;
 
-  get conditionGroup(): IPublicModelExclusiveGroup | null;
+  /**
+   * 当前节点是否可见
+   * check if current node is visible
+   * @since v1.1.0
+   */
+  get visible(): boolean;
 
+  /**
+   * 设置当前节点是否可见
+   * set visible value for current node
+   * @since v1.1.0
+   */
+  set visible(value: boolean);
+
+  /**
+   * 获取该节点的 ConditionalVisible 值
+   * check if current node ConditionalVisible
+   * @since v1.1.0
+   */
+  isConditionalVisible(): boolean | undefined;
+
+  /**
+   * 设置该节点的 ConditionalVisible 为 true
+   * make this node as conditionalVisible === true
+   * @since v1.1.0
+   */
   setConditionalVisible(): void;
 }