@tmagic/editor 1.2.0-beta.17 → 1.2.0-beta.19

package/dist/tmagic-editor.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('serialize-javascript'), require('lodash-es'), require('@tmagic/schema'), require('@element-plus/icons-vue'), require('@tmagic/design'), require('monaco-editor'), require('@tmagic/stage'), require('gesto'), require('@tmagic/utils'), require('events'), require('@tmagic/core'), require('@tmagic/form'), require('keycon')) :
-  typeof define === 'function' && define.amd ? define(['exports', 'vue', 'serialize-javascript', 'lodash-es', '@tmagic/schema', '@element-plus/icons-vue', '@tmagic/design', 'monaco-editor', '@tmagic/stage', 'gesto', '@tmagic/utils', 'events', '@tmagic/core', '@tmagic/form', 'keycon'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.TMagicEditor = {}, global.Vue, global.serialize, global.lodashEs, global.schema, global.iconsVue, global.design, global.monaco, global.StageCore, global.Gesto, global.utils, global.events, global.core, global.form, global.KeyController));
-})(this, (function (exports, vue, serialize, lodashEs, schema, iconsVue, design, monaco, StageCore, Gesto, utils, events, core, form, KeyController) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('serialize-javascript'), require('lodash-es'), require('@tmagic/form'), require('@tmagic/schema'), require('@element-plus/icons-vue'), require('@tmagic/design'), require('monaco-editor'), require('@tmagic/stage'), require('gesto'), require('@tmagic/utils'), require('events'), require('@tmagic/core'), require('keycon')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'vue', 'serialize-javascript', 'lodash-es', '@tmagic/form', '@tmagic/schema', '@element-plus/icons-vue', '@tmagic/design', 'monaco-editor', '@tmagic/stage', 'gesto', '@tmagic/utils', 'events', '@tmagic/core', 'keycon'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.TMagicEditor = {}, global.Vue, global.serialize, global.lodashEs, global.form, global.schema, global.iconsVue, global.design, global.monaco, global.StageCore, global.Gesto, global.utils, global.events, global.core, global.KeyController));
+})(this, (function (exports, vue, serialize, lodashEs, form, schema, iconsVue, design, monaco, StageCore, Gesto, utils, events, core, KeyController) { 'use strict';
 
   const _interopDefaultLegacy = e => e && typeof e === 'object' && 'default' in e ? e : { default: e };
 
@@ -153,6 +153,7 @@
     setup(__props, { emit }) {
       const props = __props;
       const services = vue.inject("services");
+      const mForm = vue.inject("mForm");
       const codeDsl = vue.computed(() => services?.codeBlockService.getCodeDslSync());
       const tableConfig = vue.computed(() => {
         const defaultConfig = {
@@ -183,7 +184,15 @@
               name: "params",
               label: "\u53C2\u6570",
               defaultValue: {},
-              itemsFunction: (row) => getParamsConfig(row.codeId)
+              itemsFunction: (row) => {
+                const paramsConfig = getParamsConfig(row.codeId);
+                if (!row.params)
+                  row.params = {};
+                if (lodashEs.isEmpty(row.params)) {
+                  form.createValues(mForm, paramsConfig, {}, row.params);
+                }
+                return paramsConfig;
+              }
             }
           ]
         };
@@ -1168,6 +1177,7 @@
         this.state.pageSteps[this.state.pageId] = undoRedo;
       }
       this.setCanUndoRedo();
+      this.emit("page-change", this.state.pageSteps[this.state.pageId]);
     }
     empty() {
       this.state.pageId = void 0;
@@ -1498,7 +1508,7 @@
         this.setPropsValue(utils.toLine(type), values[type]);
       });
     }
-    setPropsValue(type, value) {
+    async setPropsValue(type, value) {
       this.state.propsValueMap[type] = value;
     }
     async getPropsValue(type, { inputEvent, ...defaultValue } = {}) {
@@ -2583,7 +2593,7 @@
     stage.on("highlight", (el) => {
       editorService.highlight(el.id);
     });
-    stage.on("multiSelect", (els) => {
+    stage.on("multi-select", (els) => {
       editorService.multiSelect(els.map((el) => el.id));
     });
     stage.on("update", (ev) => {
@@ -2603,7 +2613,7 @@
       editorService.select(parent);
       editorService.get("stage").select(parent.id);
     });
-    stage.on("changeGuides", (e) => {
+    stage.on("change-guides", (e) => {
       uiService.set("showGuides", true);
       if (!root.value || !page.value)
         return;
@@ -5480,6 +5490,14 @@
           runtime.updateRootConfig?.(lodashEs.cloneDeep(vue.toRaw(root2)));
         }
       });
+      vue.watch(page, (page2) => {
+        if (runtime && page2) {
+          runtime.updatePageId?.(page2.id);
+          vue.nextTick(() => {
+            stage?.select(page2.id);
+          });
+        }
+      });
       const resizeObserver = new ResizeObserver((entries) => {
         for (const { contentRect } of entries) {
           services?.uiService.set("stageContainerRect", {
@@ -5701,10 +5719,10 @@
         }, [
           vue.createVNode(_sfc_main$8),
           vue.renderSlot(_ctx.$slots, "stage", {}, () => [
-            (vue.openBlock(), vue.createBlock(_sfc_main$2, {
-              key: vue.unref(page)?.id,
+            vue.unref(page) ? (vue.openBlock(), vue.createBlock(_sfc_main$2, {
+              key: 0,
               "stage-content-menu": __props.stageContentMenu
-            }, null, 8, ["stage-content-menu"]))
+            }, null, 8, ["stage-content-menu"])) : vue.createCommentVNode("", true)
           ]),
           vue.renderSlot(_ctx.$slots, "workspace-content"),
           vue.createVNode(_sfc_main$6, null, {
@@ -5763,6 +5781,10 @@
       sidebar: {
         type: Object
       },
+      menu: {
+        type: Object,
+        default: () => ({ left: [], right: [] })
+      },
       layerContentMenu: {
         type: Array,
         default: () => []
@@ -5771,10 +5793,6 @@
         type: Array,
         default: () => []
       },
-      menu: {
-        type: Object,
-        default: () => ({ left: [], right: [] })
-      },
       render: {
         type: Function
       },
@@ -5808,7 +5826,7 @@
       },
       containerHighlightClassName: {
         type: String,
-        default: StageCore.CONTAINER_HIGHLIGHT_CLASS
+        default: StageCore.CONTAINER_HIGHLIGHT_CLASS_NAME
       },
       containerHighlightDuration: {
         type: Number,