Merge branch 'develop' into filter-highlight

Author: AndyJinSS

docs/README.md

@@ -36,7 +36,7 @@ $ yarn build
 
 
 ## 功能
-- [x] 支持本地离线搜搜
+- [x] 支持本地离线搜索
 - [x] 版本化文档管理
 - [x] 离线静态部署
 - [x] 主题（fork 宜搭开发者中心）

docs/docs/api/command.md

@@ -25,8 +25,7 @@ sidebar_position: 10
 
 注册一个新命令及其处理函数。
 
-```
-typescriptCopy code
+```typescript
 /**
  * 注册一个新的命令及其处理程序。
  * @param command {IPublicTypeCommand} - 要注册的命令。
@@ -38,8 +37,7 @@ registerCommand(command: IPublicTypeCommand): void;
 
 注销一个已存在的命令。
 
-```
-typescriptCopy code
+```typescript
 /**
  * 注销一个已存在的命令。
  * @param name {string} - 要注销的命令的名称。
@@ -51,8 +49,7 @@ unregisterCommand(name: string): void;
 
 根据名称和提供的参数执行命令，确保参数符合命令的定义。
 
-```
-typescriptCopy code
+```typescript
 /**
  * 根据名称和提供的参数执行命令。
  * @param name {string} - 要执行的命令的名称。
@@ -65,8 +62,7 @@ executeCommand(name: string, args?: IPublicTypeCommandHandlerArgs): void;
 
 批量执行命令，在所有命令执行后进行重绘，历史记录中只记录一次。
 
-```
-typescriptCopy code
+```typescript
 /**
  * 批量执行命令，随后进行重绘，历史记录中只记录一次。
  * @param commands {Array} - 命令对象的数组，包含名称和可选参数。
@@ -78,8 +74,7 @@ batchExecuteCommand(commands: { name: string; args?: IPublicTypeCommandHandlerAr
 
 列出所有已注册的命令。
 
-```
-typescriptCopy code
+```typescript
 /**
  * 列出所有已注册的命令。
  * @returns {IPublicTypeListCommand[]} - 已注册命令的数组。
@@ -91,8 +86,7 @@ listCommands(): IPublicTypeListCommand[];
 
 为命令执行过程中的错误注册错误处理回调函数。
 
-```
-typescriptCopy code
+```typescript
 /**
  * 为命令执行过程中的错误注册一个回调函数。
  * @param callback {(name: string, error: Error) => void} - 错误处理的回调函数。

docs/docs/api/commonUI.md

@@ -3,6 +3,8 @@ title: commonUI - UI 组件库
 sidebar_position: 10
 ---
 
+> **@since** v1.3.0
+
 ## 简介
 CommonUI API 是一个专为低代码引擎设计的组件 UI 库，使用它开发的插件，可以保证在不同项目和主题切换中能够保持一致性和兼容性。
 

docs/docs/api/hotkey.md

@@ -32,6 +32,19 @@ bind(
 - [IPublicTypeHotkeyCallback](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/hotkey-callback.ts)
 - [IPublicTypeDisposable](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/disposable.ts)
 
+### mount
+
+给指定窗口绑定快捷键
+
+```typescript
+/**
+ * 给指定窗口绑定快捷键
+ * @param window 窗口的 window 对象
+ */
+mount(window: Window): IPublicTypeDisposable;
+
+```
+
 
 ## 使用示例
 ### 基础示例

docs/docs/api/skeleton.md

@@ -11,8 +11,9 @@ sidebar_position: 10
 
 ![image.png](https://img.alicdn.com/imgextra/i4/O1CN01eVA0U41xYRP3e5zo0_!!6000000006455-2-tps-1780-996.png)
 
-页面上可以扩展的区域共 5 个，具体如下：
-![image.png](https://img.alicdn.com/imgextra/i3/O1CN014d2AcS1D5c9TshEiQ_!!6000000000165-2-tps-1892-974.png)
+页面上可以扩展的区域共 6 个，具体如下：
+![image](https://github.com/alibaba/lowcode-engine/assets/11935995/ba4641dd-d346-4ef7-8b71-8ca211e6eaf4)
+
 ### 基本概念
 #### 扩展区域位置 (area)
 ##### topArea
@@ -41,6 +42,11 @@ sidebar_position: 10
 ##### rightArea
 
 右侧区域，常用于组件的配置。常见的扩展有：统一处理组件的配置项，例如统一删除某一个配置项，统一添加某一个配置项的。
+
+##### bottomArea
+
+底部扩展区域。
+
 ##### toolbar
 
 跟 topArea 类似，按需放置面板插件~

docs/docs/guide/appendix/npms.md

@@ -43,5 +43,5 @@ sidebar_position: 3
 | @alilc/lowcode-materials | [https://github.com/alibaba/lowcode-materials](https://github.com/alibaba/lowcode-materials) | packages/fusion-lowcode-materials |
 | @alilc/antd-lowcode-materials | [https://github.com/alibaba/lowcode-materials](https://github.com/alibaba/lowcode-materials) | packages/antd-lowcode-materials |
 | @alifd/layout（原 @alifd/pro-layout 升级后的版本） | [https://github.com/alibaba-fusion/layout](https://github.com/alibaba-fusion/layout) |  |
-|  |  |  |
+| @alilc/lowcode-engine-docs | [https://github.com/alibaba/lowcode-engine](https://github.com/alibaba/lowcode-engine) | docs |
 |  |  |  |

docs/docs/guide/create/useRenderer.md

@@ -20,7 +20,7 @@ sidebar_position: 1
 [在 Demo 中](https://lowcode-engine.cn/demo/demo-general/index.html)，右上角有渲染模块的示例使用方式：
 ![Mar-13-2022 16-52-49.gif](https://img.alicdn.com/imgextra/i2/O1CN01PRsEl61o7Zct5fJML_!!6000000005178-1-tps-1534-514.gif)
 
-基于官方提供的渲染模块 [@alifd/lowcode-react-renderer](https://github.com/alibaba/lowcode-engine/tree/main/packages/react-renderer)，你可以在 React 上下文渲染低代码编辑器产出的页面。
+基于官方提供的渲染模块 [@alilc/lowcode-react-renderer](https://github.com/alibaba/lowcode-engine/tree/main/packages/react-renderer)，你可以在 React 上下文渲染低代码编辑器产出的页面。
 
 ### 构造渲染模块所需数据
 

docs/docs/participate/index.md

@@ -70,7 +70,7 @@ npm start
 在 lowcode-engine 目录下执行下面命令
 ```
 cd docs
-
+npm install
 npm start
 ```
 

docs/docs/specs/lowcode-spec.md

@@ -20,7 +20,7 @@ sidebar_position: 0
 ### 1.2 协议草案起草人
 
 - 撰写：月飞、康为、林熠
-- 审阅：大果、潕量、九神、元彦、戊子、屹凡、金禅、前道、天晟、戊子、游鹿、光弘、力皓
+- 审阅：大果、潕量、九神、元彦、戊子、屹凡、金禅、前道、天晟、游鹿、光弘、力皓
 
 
 ### 1.3 版本号
@@ -94,7 +94,7 @@ sidebar_position: 0
 
 ### 1.9 使用范围
 
-本协议描述的是低代码搭建平台产物（应用、页面、区块、组件）的 schema 结构，以及实现其数据状态更新（内置 api)、能力扩展、国际化等方面完整，只在低代码搭建场景下可用；
+本协议描述的是低代码搭建平台产物（应用、页面、区块、组件）的 schema 结构，以及实现其数据状态更新（内置 api）、能力扩展、国际化等方面完整，只在低代码搭建场景下可用；
 
 ### 1.10 协议目标
 
@@ -430,7 +430,7 @@ import { Input as CustomInput } from '@ali/custom/lib/input';
 | 参数        | 说明                   | 类型                                   | 支持变量 | 默认值 | 备注                                                                                                        |
 | ----------- | ---------------------- | -------------------------------------- | -------- | ------ | ----------------------------------------------------------------------------------------------------------- |
 | list[]     | 数据源列表             | **ComponentDataSourceItem**[] | -        | -      | 成为为单个请求配置, 内容定义详见 [ComponentDataSourceItem 对象描述](#2314-componentdatasourceitem-对象描述) |
-| dataHandler | 所有请求数据的处理函数 | Function                               | -        | -      | 详见 [dataHandler Function 描述](#2317-datahandler-function 描述)                                           |
+| dataHandler | 所有请求数据的处理函数 | Function                               | -        | -      | 详见 [dataHandler Function 描述](#2317-datahandler-function-描述)                                           |
 
 ##### 2.3.1.4 ComponentDataSourceItem 对象描述
 
@@ -447,7 +447,7 @@ import { Input as CustomInput } from '@ali/custom/lib/input';
 | errorHandler   | request 失败后的回调函数     | Function                                             | -        | -                           | 参数：请求出错 promise 的 error 内容                                                                                                                                 |
 | options {}     | 请求参数                     | **ComponentDataSourceItemOptions**| -        | -                           | 每种请求类型对应不同参数，详见 | 每种请求类型对应不同参数，详见 [ComponentDataSourceItemOptions 对象描述](#2315-componentdatasourceitemoptions-对象描述)                                              |
 
-**关于 dataHandler 于 errorHandler 的细节说明：**
+**关于 dataHandler 与 errorHandler 的细节说明：**
 
 request 返回的是一个 promise，dataHandler 和 errorHandler 遵循 Promise 对象的 then 方法，实际使用方式如下：
 
@@ -560,7 +560,7 @@ try {
 | 参数          | 说明                   | 类型             | 支持变量 | 默认值            | 备注                                                                                                       |
 | ------------- | ---------------------- | ---------------- | -------- | ----------------- | ---------------------------------------------------------------------------------------------------------- |
 | id            | 组件唯一标识           | String           | -        |                   | 可选，组件 id 由引擎随机生成（UUID），并保证唯一性，消费方为上层应用平台，在组件发生移动等场景需保持 id 不变 |
-| componentName | 组件名称               | String           | -        | Div               | 必填，首字母大写，同 [componentsMap](#22-组件映射关系 a) 中的要求                                           |
+| componentName | 组件名称               | String           | -        | Div               | 必填，首字母大写，同 [componentsMap](#22-组件映射关系a) 中的要求                                           |
 | props {}      | 组件属性对象           | **Props**| -        | {}                | 必填，详见 | 必填，详见 [Props 结构描述](#2311-props-结构描述)                                                          |
 | condition     | 渲染条件               | Boolean          | ✅        | true              | 选填，根据表达式结果判断是否渲染物料；支持变量表达式                                                       |
 | loop          | 循环数据               | Array            | ✅        | -                 | 选填，默认不进行循环渲染；支持变量表达式                                                                   |
@@ -797,7 +797,7 @@ try {
 | 参数   | 说明       | 值类型                | 默认值   | 备注                                                           |
 | ------ | ---------- | --------------------- | -------- | -------------------------------------------------------------- |
 | type   | 值类型描述 | String                | 'JSSlot' | 固定值                                                         |
-| value  | 具体的值   | NodeSchema \| NodeSchema[] | null     | 内容为 NodeSchema 类型，详见[组件结构描述](#232-组件结构描述 a) |
+| value  | 具体的值   | NodeSchema \| NodeSchema[] | null     | 内容为 NodeSchema 类型，详见[组件结构描述](#232-组件结构描述（A）) |
 | params | 函数的参数 | String[]     | null     | 函数的入参，其子节点可以通过 `this[参数名]` 来获取对应的参数。 |
 
 
@@ -1124,7 +1124,7 @@ this.setState((prevState) => ({ count: prevState.count + 1 }));
 | utils[]           | 工具类扩展映射关系 | **UtilItem**[]                                                                                          | -        |        |
 | *UtilItem*.name    | 工具类扩展项名称   | String                                                                                                           | -        |        |
 | *UtilItem*.type    | 工具类扩展项类型   | 枚举， `'npm'` （代表公网 npm 类型） / `'tnpm'` （代表阿里巴巴内部 npm 类型） / `'function'` （代表 Javascript 函数类型） | -        |        |
-| *UtilItem*.content | 工具类扩展项内容   | [ComponentMap 类型](#22-组件映射关系 a) 或 [JSFunction](#2432事件函数类型 a)                                        | -        |        |
+| *UtilItem*.content | 工具类扩展项内容   | [ComponentMap 类型](#22-组件映射关系a) 或 [JSFunction](#2342事件函数类型a)                                        | -        |        |
 
 描述示例：
 

docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alilc/lowcode-engine-docs",
-  "version": "1.2.31",
+  "version": "1.2.36",
   "description": "低代码引擎版本化文档",
   "license": "MIT",
   "files": [

packages/designer/jest.config.js

@@ -22,6 +22,7 @@ const jestConfig = {
   // testMatch: ['**/selection.test.ts'],
   // testMatch: ['**/plugin/sequencify.test.ts'],
   // testMatch: ['**/builtin-simulator/utils/parse-metadata.test.ts'],
+  // testMatch: ['**/setting/setting-top-entry.test.ts'],
   transformIgnorePatterns: [
     `/node_modules/(?!${esModules})/`,
   ],

packages/designer/src/context-menu-actions.ts

@@ -5,18 +5,6 @@ import { Menu } from '@alifd/next';
 import { engineConfig } from '@alilc/lowcode-editor-core';
 import './context-menu-actions.scss';
 
-export interface IContextMenuActions {
-  actions: IPublicTypeContextMenuAction[];
-
-  adjustMenuLayoutFn: (actions: IPublicTypeContextMenuItem[]) => IPublicTypeContextMenuItem[];
-
-  addMenuAction: IPublicApiMaterial['addContextMenuOption'];
-
-  removeMenuAction: IPublicApiMaterial['removeContextMenuOption'];
-
-  adjustMenuLayout: IPublicApiMaterial['adjustContextMenuLayout'];
-}
-
 let adjustMenuLayoutFn: Function = (actions: IPublicTypeContextMenuAction[]) => actions;
 
 export class GlobalContextMenuActions {
@@ -116,7 +104,7 @@ export class GlobalContextMenuActions {
 
 const globalContextMenuActions = new GlobalContextMenuActions();
 
-export class ContextMenuActions implements IContextMenuActions {
+export class ContextMenuActions {
   actions: IPublicTypeContextMenuAction[] = [];
 
   designer: IDesigner;
@@ -204,30 +192,32 @@ export class ContextMenuActions implements IContextMenuActions {
         originalEvent.stopPropagation();
         originalEvent.preventDefault();
         // 如果右键的节点不在 当前选中的节点中，选中该节点
-        if (!designer.currentSelection.has(node.id)) {
-          designer.currentSelection.select(node.id);
+        if (!designer.currentSelection?.has(node.id)) {
+          designer.currentSelection?.select(node.id);
         }
-        const nodes = designer.currentSelection.getNodes();
+        const nodes = designer.currentSelection?.getNodes();
         this.handleContextMenu(nodes, originalEvent);
       }),
     );
   }
 
-  addMenuAction(action: IPublicTypeContextMenuAction) {
+  addMenuAction: IPublicApiMaterial['addContextMenuOption'] = (action: IPublicTypeContextMenuAction) => {
     this.actions.push({
       type: IPublicEnumContextMenuType.MENU_ITEM,
       ...action,
     });
-  }
+  };
 
-  removeMenuAction(name: string) {
+  removeMenuAction: IPublicApiMaterial['removeContextMenuOption'] = (name: string) => {
     const i = this.actions.findIndex((action) => action.name === name);
     if (i > -1) {
       this.actions.splice(i, 1);
     }
-  }
+  };
 
-  adjustMenuLayout(fn: (actions: IPublicTypeContextMenuItem[]) => IPublicTypeContextMenuItem[]) {
+  adjustMenuLayout: IPublicApiMaterial['adjustContextMenuLayout'] = (fn: (actions: IPublicTypeContextMenuItem[]) => IPublicTypeContextMenuItem[]) => {
     adjustMenuLayoutFn = fn;
-  }
-}
+  };
+}
+
+export interface IContextMenuActions extends ContextMenuActions {}

packages/designer/src/designer/designer-view.tsx

@@ -1,16 +1,16 @@
 import { Component } from 'react';
 import classNames from 'classnames';
 import BuiltinDragGhostComponent from './drag-ghost';
-import { Designer, DesignerProps } from './designer';
+import { Designer, DesignerProps, IDesigner } from './designer';
 import { ProjectView } from '../project';
 import './designer.less';
 
 type IProps = DesignerProps & {
-  designer?: Designer;
+  designer?: IDesigner;
 };
 
 export class DesignerView extends Component<IProps> {
-  readonly designer: Designer;
+  readonly designer: IDesigner;
   readonly viewName: string | undefined;
 
   constructor(props: IProps) {