Merge commit '7d87f8284f5845b23c9c025cc765f8baef1bf14c' into def_releases_202108031430088_ali-lowcode_ali-lowcode-engine/1.0.62

packages/designer/src/designer/setting/setting-top-entry.ts

@@ -54,6 +54,10 @@ export class SettingTopEntry implements SettingEntry {
     return this.nodes.length === 1;
   }
 
+  get isLocked(): boolean {
+    return this.first.isLocked;
+  }
+
   /**
    * 多个
    */

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

@@ -44,7 +44,7 @@ import { NodeRemoveOptions } from '../../types';
  *  conditionGroup use for condition, for exclusive
  *  title          display on outline
  *  ignored        ignore this node will not publish to render, but will store
- *  isLocked       can not select/hover/ item on canvas but can control on outline
+ *  isLocked       can not select/hover/ item on canvas and outline
  *  hidden         not visible on canvas
  *  slotArgs       like loopArgs, for slot node
  *
@@ -374,6 +374,20 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
     }
   }
 
+  /**
+   * 锁住当前节点
+   */
+  lock(flag = true) {
+    this.setExtraProp('isLocked', flag);
+  }
+
+  /**
+   * 获取当前节点的锁定状态
+   */
+  get isLocked(): boolean {
+    return !!this.getExtraProp('isLocked', false)?.getValue();
+  }
+
   /**
    * 选择当前节点
    */

packages/editor-preset-general/README.md

@@ -1,82 +0,0 @@
-子视图
-prototype.view
-view.Preview
-view.Mobile
-
-实时切
-
-设备
-device
-创建多个 simulator
-
-不同simulator 加载不同视图
-
-这样有利于 环境隔离，比如 rax 和 react
-
-适配规则
-
-规则 1
-mobile view.mobile.xxx
-rax    view.rax.xxx
-miniapp view.miniapp.xxx
-view.<device>.xxx
-通配 view.xxx
-
-universal
-
-规则 2
-urls: "view.js,view2 <device selector>, view3 <device selector>",
-urls: [
-  "view.js",
-  "view.js *",
-  "view1.js mobile|pc",
-  "view2.js <device selector>"
-]
-
-环境通用资源
-
-"react": {
-  "urls": [
-    "//g.alicdn.com/platform/c/react/16.5.2/react.min.js"
-  ],
-  "library": "React",
-  "package": "react",
-  "version": "16.5.2",
-  "devices-for": "*" | ["mobile", "web"] | "rax|mobile"
-}
-
-
-load legao assets
-  load all x-prototype-urls
-  
-
-load assets
-
-  build componentMeta
-  if has x-prototype-urls ,
-  load x-prototype-urls
-    call Bundle.createPrototype() or something register
-   got prototypeView
-
-load schema
-
-
-open schema
-
-load simulator resources
-
-
-
-simulator 中加载资源，根据 componentsMap 构建组件查询字典，
-
-
-获取 view 相关的样式、脚本
-获取 proto 相关的样式
-在 simulator 中也加载一次
-
-1. meta 信息构造
-2. components 字典构造, proto.getView 或者 通过 npm 信息查询
-3. 
-
-
-componentMeta 段描述的信息，如果包含 x-prototype-urls ，那么这个 meta 信息都可以丢掉

packages/editor-preset-general/build.json

@@ -1,25 +0,0 @@
-{
-  "plugins": [
-    [
-      "build-plugin-component",
-      {
-        "filename": "editor-preset-general",
-        "library": "AliLowCodeEngine",
-        "libraryTarget": "umd",
-        "externals": {
-          "react": "var window.React",
-          "react-dom": "var window.ReactDOM",
-          "prop-types": "var window.PropTypes",
-          "@alifd/next": "var window.Next",
-          "@ali/visualengine": "var window.VisualEngine",
-          "@ali/visualengine-utils": "var window.VisualEngineUtils"
-        }
-      }
-    ],
-    "build-plugin-fusion",
-    ["build-plugin-moment-locales", {
-      "locales": ["zh-cn"]
-    }],
-    "./build.plugin.js"
-  ]
-}

packages/editor-preset-general/build.plugin.js

@@ -1,23 +0,0 @@
-const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-
-module.exports = ({ onGetWebpackConfig }) => {
-  onGetWebpackConfig((config) => {
-    config.resolve
-      .plugin('tsconfigpaths')
-      .use(TsconfigPathsPlugin, [{
-        configFile: './tsconfig.json',
-      }]);
-
-    /*
-    config
-      // 定义插件名称
-      .plugin('MonacoWebpackPlugin')
-      // 第一项为具体插件，第二项为插件参数
-      .use(new MonacoWebpackPlugin({
-        languages:["javascript","css","json"]
-      }), []);
-      */
-    config.plugins.delete('hot');
-    config.devServer.hot(false);
-  });
-};

packages/editor-preset-general/package.json

@@ -1,42 +0,0 @@
-{
-  "name": "@ali/lowcode-editor-preset-general",
-  "version": "1.0.61",
-  "description": "Ali General Editor Preset",
-  "main": "lib/index.js",
-  "private": true,
-  "files": [
-    "dist",
-    "es",
-    "lib"
-  ],
-  "scripts": {
-    "build": "build-scripts build --skip-demo"
-  },
-  "license": "MIT",
-  "dependencies": {
-    "@ali/lowcode-editor-core": "1.0.61",
-    "@ali/lowcode-editor-skeleton": "1.0.61",
-    "@ali/lowcode-plugin-designer": "1.0.61",
-    "@ali/lowcode-plugin-outline-pane": "1.0.61",
-    "@ali/lowcode-types": "1.0.61",
-    "@ali/lowcode-utils": "1.0.61",
-    "@alifd/next": "^1.19.12",
-    "@alife/theme-lowcode-dark": "^0.1.0",
-    "@alife/theme-lowcode-light": "^0.1.0",
-    "react": "^16.8.1",
-    "react-dom": "^16.8.1"
-  },
-  "devDependencies": {
-    "@ali/lowcode-editor-setters": "^1.0.22",
-    "@alib/build-scripts": "^0.1.18",
-    "@types/react": "^16.8.3",
-    "@types/react-dom": "^16.8.2",
-    "build-plugin-fusion": "^0.1.0",
-    "build-plugin-moment-locales": "^0.1.0",
-    "build-plugin-react-app": "^1.1.2",
-    "tsconfig-paths-webpack-plugin": "^3.2.0"
-  },
-  "publishConfig": {
-    "registry": "https://registry.npm.alibaba-inc.com"
-  }
-}

packages/editor-preset-general/src/index.ts

@@ -1,98 +0,0 @@
-import { render } from 'react-dom';
-import { createElement } from 'react';
-import builtinSetters from '@ali/lowcode-editor-setters';
-import DesignerPlugin from '@ali/lowcode-plugin-designer';
-import { Designer, LiveEditing } from '@ali/lowcode-designer';
-import { globalContext, Editor, registerSetter } from '@ali/lowcode-editor-core';
-import { OutlinePane, OutlineBackupPane, getTreeMaster } from '@ali/lowcode-plugin-outline-pane';
-import { Workbench, Skeleton, SettingsPrimaryPane, registerDefaults } from '@ali/lowcode-editor-skeleton';
-
-import { version } from '../package.json';
-import { liveEditingRule, liveEditingSaveHander } from './live-editing';
-
-export * from '@ali/lowcode-types';
-export * from '@ali/lowcode-utils';
-export * from '@ali/lowcode-editor-core';
-export * from '@ali/lowcode-editor-skeleton';
-export * from '@ali/lowcode-designer';
-
-registerSetter(builtinSetters);
-
-export const editor = new Editor();
-globalContext.register(editor, Editor);
-
-export const skeleton = new Skeleton(editor);
-editor.set(Skeleton, skeleton);
-editor.set('skeleton', skeleton);
-registerDefaults();
-
-export const designer = new Designer({ editor });
-editor.set(Designer, designer);
-editor.set('designer', designer);
-
-skeleton.add({
-  area: 'leftArea',
-  name: 'outline',
-  type: 'PanelDock',
-  props: {
-    align: 'top',
-    icon: 'shuxingkongjian',
-    description: '大纲树',
-  },
-  panelProps: {
-    area: 'leftFixedArea',
-  },
-  contentProps: {},
-  content: OutlinePane,
-});
-skeleton.add({
-  area: 'mainArea',
-  name: 'designer',
-  type: 'Widget',
-  content: DesignerPlugin,
-});
-skeleton.add({
-  area: 'rightArea',
-  name: 'settingsPane',
-  type: 'Panel',
-  content: SettingsPrimaryPane,
-});
-skeleton.add({
-  area: 'rightArea',
-  name: 'backupOutline',
-  type: 'Panel',
-  props: {
-    condition: () => {
-      return designer.dragon.dragging && !getTreeMaster(designer).hasVisibleTreeBoard();
-    },
-  },
-  content: OutlineBackupPane,
-});
-
-export function GeneralWorkbench(props: any) {
-  return createElement(Workbench, {
-    skeleton,
-    ...props,
-  });
-}
-
-export default GeneralWorkbench;
-
-window.__ctx = {
-  editor,
-  appHelper: editor,
-};
-export function init(container?: Element) {
-  if (!container) {
-    container = document.createElement('div');
-    document.body.appendChild(container);
-  }
-  container.id = 'lowcodeEditorPresetGeneral';
-
-  render(createElement(GeneralWorkbench), container);
-}
-
-console.log(`%cLowcodeEngine %cv${version}`, 'color:#000;font-weight:bold;', 'color:green;font-weight:bold;');
-
-LiveEditing.addLiveEditingSpecificRule(liveEditingRule);
-LiveEditing.addLiveEditingSaveHandler(liveEditingSaveHander);

packages/editor-preset-general/src/live-editing.ts

@@ -1,80 +0,0 @@
-import { EditingTarget, Node as DocNode, SaveHandler } from '@ali/lowcode-designer';
-import { isJSExpression } from '@ali/lowcode-types';
-
-function getText(node: DocNode, prop: string) {
-  const p = node.getProp(prop, false);
-  if (!p || p.isUnset()) {
-    return null;
-  }
-  let v = p.getValue();
-  if (isJSExpression(v)) {
-    v = v.mock;
-  }
-  if (v == null) {
-    return null;
-  }
-  if (p.type === 'literal') {
-    return v;
-  }
-  return Symbol.for('not-literal');
-}
-
-export function liveEditingRule(target: EditingTarget) {
-  // for vision components specific
-  const { node, event } = target;
-
-  const targetElement = event.target as HTMLElement;
-
-  if (!Array.from(targetElement.childNodes).every(item => item.nodeType === Node.TEXT_NODE)) {
-    return null;
-  }
-
-  const { innerText } = targetElement;
-  const propTarget = ['title', 'label', 'text', 'content', 'children'].find(prop => {
-    return equalText(getText(node, prop), innerText);
-  });
-
-  if (propTarget) {
-    return {
-      propElement: targetElement,
-      propTarget,
-    };
-  }
-  return null;
-}
-
-function equalText(v: any, innerText: string) {
-  // TODO: enhance compare text logic
-  if (typeof v !== 'string') {
-    return false;
-  }
-  return v.trim() === innerText;
-}
-
-export const liveEditingSaveHander: SaveHandler = {
-  condition: (prop) => {
-    // const v = prop.getValue();
-    return prop.type === 'expression'; // || isI18nData(v);
-  },
-  onSaveContent: (content, prop) => {
-    const v = prop.getValue();
-    let data = v;
-    if (isJSExpression(v)) {
-      data = v.mock;
-    }
-    data = content;
-    if (isJSExpression(v)) {
-      prop.setValue({
-        type: 'JSExpression',
-        value: v.value,
-        mock: data,
-      });
-    } else {
-      prop.setValue(data);
-    }
-  },
-};
-// TODO:
-// 非文本编辑
-//  国际化数据，改变当前
-//  JSExpression, 改变 mock 或 弹出绑定变量

packages/editor-preset-general/tsconfig.json

@@ -1,9 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "lib"
-  },
-  "include": [
-    "./src/"
-  ]
-}

packages/editor-skeleton/src/components/settings/settings-primary-pane.tsx

@@ -123,7 +123,7 @@ export class SettingsPrimaryPane extends Component<{ editor: Editor; config: any
 
   render() {
     const { settings } = this.main;
-    const editor = globalContext.get(Editor);
+    const editor = globalContext.get('editor');
     if (!settings) {
       // 未选中节点，提示选中 或者 显示根节点设置
       return (
@@ -135,6 +135,16 @@ export class SettingsPrimaryPane extends Component<{ editor: Editor; config: any
       );
     }
 
+    if (settings.isLocked) {
+      return (
+        <div className="lc-settings-main">
+          <div className="lc-settings-notice">
+            <p>该节点已被锁定，无法配置</p>
+          </div>
+        </div>
+      );
+    }
+
     if (Array.isArray(settings.items) && settings.items.length === 0) {
       return (
         <div className="lc-settings-main">

packages/engine/src/engine-core.ts

@@ -175,7 +175,7 @@ plugins.register((ctx: ILowCodePluginContext) => {
     },
   };
 });
-export async function init(container?: Element, options?: EngineOptions) {
+export async function init(container?: HTMLElement, options?: EngineOptions) {
   let engineOptions = null;
   let engineContainer = null;
   if (isPlainObject(container)) {