@tmagic/editor 1.5.12 → 1.5.14

package/dist/tmagic-editor.js

@@ -7,18 +7,18 @@ export { default as formPlugin } from '@tmagic/form';
 import tablePlugin__default, { MagicTable } from '@tmagic/table';
 export * from '@tmagic/table';
 export { default as tablePlugin } from '@tmagic/table';
-import { defineComponent, openBlock, createBlock, unref, withCtx, createVNode, createElementVNode, createElementBlock, normalizeClass, resolveDynamicComponent, toRaw, ref, useTemplateRef, watch, onMounted, onBeforeUnmount, Teleport, normalizeStyle, computed, reactive, resolveComponent, inject, createCommentVNode, Fragment, renderList, mergeProps, mergeModels, useModel, nextTick, provide, renderSlot, toDisplayString, shallowReactive, createTextVNode, isRef, createStaticVNode, watchEffect, markRaw, withDirectives, vModelText, vShow, shallowRef, withModifiers, toHandlers, createSlots, getCurrentInstance, Transition, resolveDirective, mergeDefaults } from 'vue';
-import { Edit, FullScreen, View, Close, Coin, Delete, Plus, Grid, ArrowDown, ArrowLeftBold, ArrowRightBold, Files, Search, CaretBottom, DocumentCopy, Memo, ScaleToOriginal, ZoomOut, ZoomIn, Right, Back, Document, Sugar, ArrowRight, CopyDocument, Hide, Goods, List, EditPen, CloseBold, Top, Bottom } from '@element-plus/icons-vue';
+import { defineComponent, createBlock, createElementBlock, openBlock, unref, withCtx, createVNode, createElementVNode, normalizeClass, resolveDynamicComponent, toRaw, ref, useTemplateRef, watch, onMounted, onBeforeUnmount, Teleport, normalizeStyle, computed, reactive, resolveComponent, inject, createCommentVNode, Fragment, renderList, mergeProps, mergeModels, useModel, nextTick, provide, renderSlot, toDisplayString, shallowReactive, createTextVNode, isRef, createStaticVNode, watchEffect, markRaw, withDirectives, vModelText, vShow, shallowRef, withModifiers, toHandlers, createSlots, getCurrentInstance, Transition, resolveDirective, mergeDefaults } from 'vue';
+import { Edit, FullScreen, View, Close, Coin, Delete, Plus, Grid, ArrowDown, ArrowLeftBold, ArrowRightBold, Files, Search, DocumentCopy, CaretBottom, Memo, ScaleToOriginal, ZoomOut, ZoomIn, Right, Back, Document, Sugar, ArrowRight, CopyDocument, Hide, EditPen, List, Goods, CloseBold, Top, Bottom } from '@element-plus/icons-vue';
 import { throttle, isEmpty, isObject, cloneDeep, mergeWith, uniq, get, map, has, pick, keys } from 'lodash-es';
 import serialize from 'serialize-javascript';
 import { emmetHTML, emmetCSS } from 'emmet-monaco-es';
 import * as monaco from 'monaco-editor';
 import { HookCodeType, HookType, NODE_CONDS_KEY, Target, Watcher, NodeType, ActionType, DepTargetType, createCodeBlockTarget, createDataSourceTarget, createDataSourceCondTarget, createDataSourceMethodTarget } from '@tmagic/core';
 export { DepTargetType } from '@tmagic/core';
-import { isPage, isPageFragment, isPop, getNodePath, isNumber, getElById, calcValueByFontsize, isValueIncludeDataSource, toLine, guid, getValueByKeyPath, setValueByKeyPath, getNodeInfo, dataSourceTemplateRegExp, getKeysArray, DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX, getKeys, convertToNumber, getIdFromEl, traverseNode, getDefaultValueFromFields, DATA_SOURCE_FIELDS_CHANGE_EVENT_PREFIX, removeClassName, addClassName, removeClassNameByClassName, getNodes } from '@tmagic/utils';
+import { isPage, isPageFragment, isPop, getNodePath, isNumber, getElById, calcValueByFontsize, isValueIncludeDataSource, toLine, guid, getValueByKeyPath, setValueByKeyPath, getNodeInfo, DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX, dataSourceTemplateRegExp, getKeysArray, getKeys, convertToNumber, getIdFromEl, traverseNode, getDefaultValueFromFields, DATA_SOURCE_FIELDS_CHANGE_EVENT_PREFIX, removeClassName, addClassName, removeClassNameByClassName, getNodes } from '@tmagic/utils';
 export * from '@tmagic/utils';
 import VanillaMoveable from 'moveable';
-import StageCore__default, { isFixed, GuidesType, getOffset, RenderType, CONTAINER_HIGHLIGHT_CLASS_NAME, ContainerHighlightType } from '@tmagic/stage';
+import StageCore__default, { isFixed, GuidesType, getOffset, ContainerHighlightType, CONTAINER_HIGHLIGHT_CLASS_NAME, RenderType } from '@tmagic/stage';
 export * from '@tmagic/stage';
 export { default as StageCore } from '@tmagic/stage';
 import { EventEmitter } from 'events';
@@ -471,13 +471,11 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent({
                 { value: HookCodeType.DATA_SOURCE_METHOD, text: "数据源方法" }
               ],
               defaultValue: "code",
-              onChange: (mForm, v, { model, prop, changeRecords }) => {
+              onChange: (_mForm, v, { setModel }) => {
                 if (v === HookCodeType.DATA_SOURCE_METHOD) {
-                  model.codeId = [];
-                  changeRecords.push({ propPath: prop.replace("codeType", "codeId"), value: [] });
+                  setModel("codeId", []);
                 } else {
-                  model.codeId = "";
-                  changeRecords.push({ propPath: prop.replace("codeType", "codeId"), value: "" });
+                  setModel("codeId", "");
                 }
                 return v;
               }
@@ -487,7 +485,7 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent({
               name: "codeId",
               span: 18,
               labelWidth: 0,
-              display: (mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
+              display: (_mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
               notEditable: () => !codeBlockService.getEditStatus()
             },
             {
@@ -495,7 +493,7 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent({
               name: "codeId",
               span: 18,
               labelWidth: 0,
-              display: (mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
+              display: (_mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
               notEditable: () => !dataSourceService.get("editable")
             }
           ]
@@ -693,13 +691,12 @@ const fillConfig$1 = (config = [], labelWidth = "80px") => [
             append: {
               type: "button",
               text: "复制",
-              handler: async (vm, { model }) => {
-                try {
-                  await navigator.clipboard.writeText(`${model.id}`);
+              handler: (vm, { model }) => {
+                navigator.clipboard.writeText(`${model.id}`).then(() => {
                   tMagicMessage.success("已复制");
-                } catch (err) {
+                }).catch(() => {
                   tMagicMessage.error("复制失败");
-                }
+                });
               }
             }
           },
@@ -1454,7 +1451,7 @@ class UndoRedo {
 class History extends BaseService {
   state = reactive({
     pageSteps: {},
-    pageId: undefined,
+    pageId: void 0,
     canRedo: false,
     canUndo: false
   });
@@ -1467,7 +1464,7 @@ class History extends BaseService {
     this.resetPage();
   }
   resetPage() {
-    this.state.pageId = undefined;
+    this.state.pageId = void 0;
     this.state.canRedo = false;
     this.state.canUndo = false;
   }
@@ -1487,7 +1484,7 @@ class History extends BaseService {
     this.emit("page-change", this.state.pageSteps[this.state.pageId]);
   }
   resetState() {
-    this.state.pageId = undefined;
+    this.state.pageId = void 0;
     this.state.pageSteps = {};
     this.state.canRedo = false;
     this.state.canUndo = false;
@@ -1539,7 +1536,6 @@ var Protocol = /* @__PURE__ */ ((Protocol2) => {
   return Protocol2;
 })(Protocol || {});
 const canUsePluginMethods$5 = {
-  async: [],
   sync: ["getStorage", "getNamespace", "clear", "getItem", "removeItem", "setItem"]
 };
 class WebStorage extends BaseService {
@@ -1676,9 +1672,7 @@ const canUsePluginMethods$4 = {
     "undo",
     "redo",
     "move"
-  ],
-  sync: []
-};
+  ]};
 class Editor extends BaseService {
   state = reactive({
     root: null,
@@ -2440,10 +2434,11 @@ class Editor extends BaseService {
     this.isHistoryStateChange = true;
     await this.update(value.data);
     this.set("modifiedNodeIds", value.modifiedNodeIds);
-    setTimeout(async () => {
+    setTimeout(() => {
       if (!value.nodeId) return;
-      await this.select(value.nodeId);
-      this.get("stage")?.select(value.nodeId);
+      this.select(value.nodeId).then(() => {
+        this.get("stage")?.select(value.nodeId);
+      });
     }, 0);
     this.emit("history-change", value.data);
   }
@@ -3075,7 +3070,7 @@ const updateStatus = (nodeStatusMap, id, status) => {
   const nodeStatus = nodeStatusMap.get(id);
   if (!nodeStatus) return;
   getKeys(status).forEach((key) => {
-    if (nodeStatus[key] !== undefined && status[key] !== undefined) {
+    if (nodeStatus[key] !== void 0 && status[key] !== void 0) {
       nodeStatus[key] = Boolean(status[key]);
     }
   });
@@ -3215,20 +3210,23 @@ const _sfc_main$1l = /* @__PURE__ */ defineComponent({
         }
         return [];
       },
-      onChange: (formState, codeId, { model }) => {
+      onChange: (formState, codeId, { setModel, model }) => {
         paramsConfig.value = getParamItemsConfig(codeId);
         if (paramsConfig.value.length) {
-          model.params = createValues(formState, paramsConfig.value, {}, model.params);
+          setModel("params", createValues(formState, paramsConfig.value, {}, model.params));
         } else {
-          model.params = {};
+          setModel("params", {});
         }
         return codeId;
       }
     };
-    const onCodeIdChangeHandler = (value) => {
+    const onCodeIdChangeHandler = (value, eventData) => {
       props.model.params = value.params;
       emit("change", props.model, {
-        changeRecords: [
+        changeRecords: eventData.changeRecords?.map((item) => ({
+          prop: `${props.prop.replace(props.name, "")}${item.propPath}`,
+          value: item.value
+        })) || [
           {
             propPath: props.prop,
             value: value[props.name]
@@ -3593,9 +3591,7 @@ const useCodeBlockEdit = (codeBlockService) => {
   const createCodeBlock = async () => {
     codeConfig.value = {
       name: "",
-      content: `({app, params, flowState}) => {
-  // place your code here
-}`,
+      content: "({app, params, flowState}) => {\n  // place your code here\n}",
       params: []
     };
     codeId.value = await codeBlockService.getUniqueId();
@@ -3678,9 +3674,7 @@ const state = shallowReactive({
   }
 });
 const canUsePluginMethods$3 = {
-  async: ["zoom", "calcZoom"],
-  sync: []
-};
+  async: ["zoom", "calcZoom"]};
 class Ui extends BaseService {
   constructor() {
     super(canUsePluginMethods$3.async.map((methodName) => ({ name: methodName, isAsync: true })));
@@ -4169,6 +4163,7 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
           try {
             return JSON.stringify(row.defaultValue);
           } catch (e) {
+            error(e);
             return row.defaultValue;
           }
         }
@@ -4217,9 +4212,9 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
           { text: "null", value: "null" },
           { text: "any", value: "any" }
         ],
-        onChange: (formState, v, { model }) => {
+        onChange: (_formState, v, { setModel }) => {
           if (!["any", "array", "object"].includes(v)) {
-            model.fields = [];
+            setModel("fields", []);
           }
           return v;
         }
@@ -5088,7 +5083,7 @@ const _sfc_main$1e = /* @__PURE__ */ defineComponent({
     "visible": { type: Boolean, ...{ default: false } },
     "visibleModifiers": {}
   }),
-  emits: /* @__PURE__ */ mergeModels(["submit"], ["update:width", "update:visible"]),
+  emits: /* @__PURE__ */ mergeModels(["submit", "close", "open"], ["update:width", "update:visible"]),
   setup(__props, { expose: __expose, emit: __emit }) {
     const width = useModel(__props, "width");
     const boxVisible = useModel(__props, "visible");
@@ -5201,7 +5196,7 @@ const _sfc_main$1e = /* @__PURE__ */ defineComponent({
       }
     ]);
     const submitForm = (values, data) => {
-      changedValue.value = undefined;
+      changedValue.value = void 0;
       emit("submit", values, data);
     };
     const errorHandler = (error) => {
@@ -5230,10 +5225,19 @@ const _sfc_main$1e = /* @__PURE__ */ defineComponent({
       });
     };
     const closedHandler = () => {
-      changedValue.value = undefined;
+      changedValue.value = void 0;
     };
     const parentFloating = inject("parentFloating", ref(null));
     const { boxPosition, calcBoxPosition } = useNextFloatBoxPosition(uiService, parentFloating);
+    watch(boxVisible, (visible) => {
+      nextTick(() => {
+        if (!visible) {
+          emit("close");
+        } else {
+          emit("open");
+        }
+      });
+    });
     __expose({
       async show() {
         calcBoxPosition();
@@ -5429,9 +5433,7 @@ const _sfc_main$1d = /* @__PURE__ */ defineComponent({
           {
             text: "编辑",
             handler: (method, index) => {
-              let codeContent = method.content || `({ params, dataSource, app }) => {
-  // place your code here
-}`;
+              let codeContent = method.content || "({ params, dataSource, app }) => {\n  // place your code here\n}";
               if (typeof codeContent !== "string") {
                 codeContent = codeContent.toString();
               }
@@ -5460,9 +5462,7 @@ const _sfc_main$1d = /* @__PURE__ */ defineComponent({
     const createCodeHandler = () => {
       codeConfig.value = {
         name: "",
-        content: `({ params, dataSource, app, flowState }) => {
-  // place your code here
-}`,
+        content: "({ params, dataSource, app, flowState }) => {\n  // place your code here\n}",
         params: []
       };
       editIndex = -1;
@@ -5498,7 +5498,7 @@ const _sfc_main$1d = /* @__PURE__ */ defineComponent({
         });
       }
       editIndex = -1;
-      codeConfig.value = undefined;
+      codeConfig.value = void 0;
       codeBlockEditorRef.value?.hide();
     };
     return (_ctx, _cache) => {
@@ -5581,12 +5581,12 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
       }));
     };
     const paramsConfig = ref(getParamItemsConfig(props.model[props.name || "dataSourceMethod"]));
-    const setParamsConfig = (dataSourceMethod, formState = {}) => {
+    const setParamsConfig = (dataSourceMethod, formState = {}, setModel) => {
       paramsConfig.value = dataSourceMethod ? getParamItemsConfig(dataSourceMethod) : [];
       if (paramsConfig.value.length) {
-        props.model.params = createValues(formState, paramsConfig.value, {}, props.model.params);
+        setModel("params", createValues(formState, paramsConfig.value, {}, props.model.params));
       } else {
-        props.model.params = {};
+        setModel("params", {});
       }
     };
     const methodsOptions = computed(
@@ -5607,8 +5607,8 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
       name: props.name,
       options: methodsOptions.value,
       disable: props.disabled,
-      onChange: (formState, dataSourceMethod) => {
-        setParamsConfig(dataSourceMethod, formState);
+      onChange: (formState, dataSourceMethod, { setModel }) => {
+        setParamsConfig(dataSourceMethod, formState, setModel);
         return dataSourceMethod;
       }
     }));
@@ -6276,8 +6276,8 @@ const _sfc_main$18 = /* @__PURE__ */ defineComponent({
         text: "联动组件",
         type: "ui-select",
         display: (mForm, { model }) => model.actionType === ActionType.COMP,
-        onChange: (MForm, v, { model }) => {
-          model.method = "";
+        onChange: (MForm, v, { setModel }) => {
+          setModel("method", "");
           return v;
         }
       };
@@ -6850,7 +6850,7 @@ const _export_sfc = (sfc, props) => {
   return target;
 };
 
-const _sfc_main$13 = {};
+const _sfc_main$13 = {  };
 
 const _hoisted_1$J = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -6864,7 +6864,7 @@ function _sfc_render$k(_ctx, _cache) {
 }
 const BackgroundRepeat = /*#__PURE__*/_export_sfc(_sfc_main$13, [['render',_sfc_render$k]]);
 
-const _sfc_main$12 = {};
+const _sfc_main$12 = {  };
 
 const _hoisted_1$I = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -6881,7 +6881,7 @@ function _sfc_render$j(_ctx, _cache) {
 }
 const BackgroundRepeatX = /*#__PURE__*/_export_sfc(_sfc_main$12, [['render',_sfc_render$j]]);
 
-const _sfc_main$11 = {};
+const _sfc_main$11 = {  };
 
 const _hoisted_1$H = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -6898,7 +6898,7 @@ function _sfc_render$i(_ctx, _cache) {
 }
 const BackgroundRepeatY = /*#__PURE__*/_export_sfc(_sfc_main$11, [['render',_sfc_render$i]]);
 
-const _sfc_main$10 = {};
+const _sfc_main$10 = {  };
 
 const _hoisted_1$G = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -6990,7 +6990,7 @@ const _sfc_main$$ = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _sfc_main$_ = {};
+const _sfc_main$_ = {  };
 
 const _hoisted_1$F = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7004,7 +7004,7 @@ function _sfc_render$g(_ctx, _cache) {
 }
 const AlignLeft = /*#__PURE__*/_export_sfc(_sfc_main$_, [['render',_sfc_render$g]]);
 
-const _sfc_main$Z = {};
+const _sfc_main$Z = {  };
 
 const _hoisted_1$E = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7018,7 +7018,7 @@ function _sfc_render$f(_ctx, _cache) {
 }
 const AlignCenter = /*#__PURE__*/_export_sfc(_sfc_main$Z, [['render',_sfc_render$f]]);
 
-const _sfc_main$Y = {};
+const _sfc_main$Y = {  };
 
 const _hoisted_1$D = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7215,7 +7215,7 @@ const _sfc_main$W = /* @__PURE__ */ defineComponent({
   }
 });
 
-const _sfc_main$V = {};
+const _sfc_main$V = {  };
 
 const _hoisted_1$B = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7229,7 +7229,7 @@ function _sfc_render$d(_ctx, _cache) {
 }
 const DisplayBlock = /*#__PURE__*/_export_sfc(_sfc_main$V, [['render',_sfc_render$d]]);
 
-const _sfc_main$U = {};
+const _sfc_main$U = {  };
 
 const _hoisted_1$A = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7243,7 +7243,7 @@ function _sfc_render$c(_ctx, _cache) {
 }
 const DisplayFlex = /*#__PURE__*/_export_sfc(_sfc_main$U, [['render',_sfc_render$c]]);
 
-const _sfc_main$T = {};
+const _sfc_main$T = {  };
 
 const _hoisted_1$z = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7257,7 +7257,7 @@ function _sfc_render$b(_ctx, _cache) {
 }
 const DisplayInline = /*#__PURE__*/_export_sfc(_sfc_main$T, [['render',_sfc_render$b]]);
 
-const _sfc_main$S = {};
+const _sfc_main$S = {  };
 
 const _hoisted_1$y = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7271,7 +7271,7 @@ function _sfc_render$a(_ctx, _cache) {
 }
 const DisplayInlineBlock = /*#__PURE__*/_export_sfc(_sfc_main$S, [['render',_sfc_render$a]]);
 
-const _sfc_main$R = {};
+const _sfc_main$R = {  };
 
 const _hoisted_1$x = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7285,7 +7285,7 @@ function _sfc_render$9(_ctx, _cache) {
 }
 const DisplayNone = /*#__PURE__*/_export_sfc(_sfc_main$R, [['render',_sfc_render$9]]);
 
-const _sfc_main$Q = {};
+const _sfc_main$Q = {  };
 
 const _hoisted_1$w = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7299,7 +7299,7 @@ function _sfc_render$8(_ctx, _cache) {
 }
 const FlexDirectionColumn = /*#__PURE__*/_export_sfc(_sfc_main$Q, [['render',_sfc_render$8]]);
 
-const _sfc_main$P = {};
+const _sfc_main$P = {  };
 
 const _hoisted_1$v = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7313,7 +7313,7 @@ function _sfc_render$7(_ctx, _cache) {
 }
 const FlexDirectionColumnReverse = /*#__PURE__*/_export_sfc(_sfc_main$P, [['render',_sfc_render$7]]);
 
-const _sfc_main$O = {};
+const _sfc_main$O = {  };
 
 const _hoisted_1$u = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7327,7 +7327,7 @@ function _sfc_render$6(_ctx, _cache) {
 }
 const FlexDirectionRow = /*#__PURE__*/_export_sfc(_sfc_main$O, [['render',_sfc_render$6]]);
 
-const _sfc_main$N = {};
+const _sfc_main$N = {  };
 
 const _hoisted_1$t = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7341,7 +7341,7 @@ function _sfc_render$5(_ctx, _cache) {
 }
 const FlexDirectionRowReverse = /*#__PURE__*/_export_sfc(_sfc_main$N, [['render',_sfc_render$5]]);
 
-const _sfc_main$M = {};
+const _sfc_main$M = {  };
 
 const _hoisted_1$s = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7355,7 +7355,7 @@ function _sfc_render$4(_ctx, _cache) {
 }
 const JustifyContentCenter = /*#__PURE__*/_export_sfc(_sfc_main$M, [['render',_sfc_render$4]]);
 
-const _sfc_main$L = {};
+const _sfc_main$L = {  };
 
 const _hoisted_1$r = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7369,7 +7369,7 @@ function _sfc_render$3(_ctx, _cache) {
 }
 const JustifyContentFlexEnd = /*#__PURE__*/_export_sfc(_sfc_main$L, [['render',_sfc_render$3]]);
 
-const _sfc_main$K = {};
+const _sfc_main$K = {  };
 
 const _hoisted_1$q = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7383,7 +7383,7 @@ function _sfc_render$2(_ctx, _cache) {
 }
 const JustifyContentFlexStart = /*#__PURE__*/_export_sfc(_sfc_main$K, [['render',_sfc_render$2]]);
 
-const _sfc_main$J = {};
+const _sfc_main$J = {  };
 
 const _hoisted_1$p = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7397,7 +7397,7 @@ function _sfc_render$1(_ctx, _cache) {
 }
 const JustifyContentSpaceAround = /*#__PURE__*/_export_sfc(_sfc_main$J, [['render',_sfc_render$1]]);
 
-const _sfc_main$I = {};
+const _sfc_main$I = {  };
 
 const _hoisted_1$o = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -7995,7 +7995,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
         emit("change", id);
         mForm?.$emit("field-change", props.prop, id);
       }
-      {
+      if (cancelHandler) {
         cancelHandler();
       }
     };
@@ -9311,7 +9311,7 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
                 renderSlot(_ctx.$slots, "props-panel")
               ]),
               key: "0"
-            } : undefined
+            } : void 0
           ]), 1032, ["left", "right", "min-left", "min-right", "min-center", "width"])),
           renderSlot(_ctx.$slots, "content-after"),
           renderSlot(_ctx.$slots, "footer")
@@ -9368,7 +9368,7 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
             type: "button",
             className: "delete",
             icon: markRaw(Delete),
-            tooltip: `刪除(Delete)`,
+            tooltip: "刪除(Delete)",
             disabled: () => editorService.get("node")?.type === NodeType.PAGE,
             handler: () => {
               const node = editorService.get("node");
@@ -10433,6 +10433,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
       emit("node-contextmenu", event, data);
     };
     __expose({
+      nodeStatusMap,
       filter: filterTextChangeHandler,
       deleteCode
     });
@@ -10594,7 +10595,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     const eventBus = inject("eventBus");
     const { codeBlockService } = useServices();
     const editable = computed(() => codeBlockService.getEditStatus());
-    const { codeBlockEditor, codeConfig, editCode, deleteCode, createCodeBlock, submitCodeBlockHandler } = useCodeBlockEdit(codeBlockService);
+    const { codeId, codeBlockEditor, codeConfig, editCode, deleteCode, createCodeBlock, submitCodeBlockHandler } = useCodeBlockEdit(codeBlockService);
     const codeBlockListRef = useTemplateRef("codeBlockList");
     const filterTextChangeHandler = (val) => {
       codeBlockListRef.value?.filter(val);
@@ -10602,6 +10603,20 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     eventBus?.on("edit-code", (id) => {
       editCode(id);
     });
+    watch(codeId, () => {
+      if (codeBlockListRef.value) {
+        for (const [statusId, status] of codeBlockListRef.value.nodeStatusMap.entries()) {
+          status.selected = statusId === codeId.value;
+        }
+      }
+    });
+    const editDialogCloseHandler = () => {
+      if (codeBlockListRef.value) {
+        for (const [, status] of codeBlockListRef.value.nodeStatusMap.entries()) {
+          status.selected = false;
+        }
+      }
+    };
     const {
       nodeContentMenuHandler,
       menuData: contentMenuData,
@@ -10665,7 +10680,8 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
             ref: codeBlockEditor,
             disabled: !editable.value,
             content: unref(codeConfig),
-            onSubmit: unref(submitCodeBlockHandler)
+            onSubmit: unref(submitCodeBlockHandler),
+            onClose: editDialogCloseHandler
           }, null, 8, ["disabled", "content", "onSubmit"])) : createCommentVNode("v-if", true),
           (openBlock(), createBlock(Teleport, { to: "body" }, [
             menuData.value.length ? (openBlock(), createBlock(_sfc_main$o, {
@@ -10730,7 +10746,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     "width": { default: 670 },
     "widthModifiers": {}
   }),
-  emits: /* @__PURE__ */ mergeModels(["submit"], ["update:visible", "update:width"]),
+  emits: /* @__PURE__ */ mergeModels(["submit", "close", "open"], ["update:visible", "update:width"]),
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const boxVisible = useModel(__props, "visible");
@@ -10752,6 +10768,15 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     const errorHandler = (error) => {
       tMagicMessage.error(error.message);
     };
+    watch(boxVisible, (visible) => {
+      nextTick(() => {
+        if (!visible) {
+          emit("close");
+        } else if (initValues.value?.id) {
+          emit("open", initValues.value.id);
+        }
+      });
+    });
     __expose({
       show() {
         calcBoxPosition();
@@ -10887,6 +10912,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
       emit("node-contextmenu", event, data);
     };
     __expose({
+      nodeStatusMap,
       filter: filterTextChangeHandler
     });
     return (_ctx, _cache) => {
@@ -11042,6 +11068,20 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
     const eventBus = inject("eventBus");
     const { dataSourceService } = useServices();
     const { editDialog, dataSourceValues, dialogTitle, editable, editHandler, submitDataSourceHandler } = useDataSourceEdit(dataSourceService);
+    const editDialogCloseHandler = () => {
+      if (dataSourceListRef.value) {
+        for (const [, status] of dataSourceListRef.value.nodeStatusMap.entries()) {
+          status.selected = false;
+        }
+      }
+    };
+    watch(dataSourceValues, (dataSourceValues2) => {
+      if (dataSourceListRef.value && dataSourceValues2.id) {
+        for (const [statusId, status] of dataSourceListRef.value.nodeStatusMap.entries()) {
+          status.selected = statusId === dataSourceValues2.id;
+        }
+      }
+    });
     const datasourceTypeList = computed(
       () => [
         { text: "基础", type: "base" },
@@ -11071,9 +11111,9 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
       });
       dataSourceService.remove(id);
     };
-    const dataSourceList = ref();
+    const dataSourceListRef = useTemplateRef("dataSourceList");
     const filterTextChangeHandler = (val) => {
-      dataSourceList.value?.filter(val);
+      dataSourceListRef.value?.filter(val);
     };
     eventBus?.on("edit-data-source", (id) => {
       editHandler(id);
@@ -11140,8 +11180,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
               ]),
               createCommentVNode(" 数据源列表 "),
               createVNode(_sfc_main$h, {
-                ref_key: "dataSourceList",
-                ref: dataSourceList,
+                ref: "dataSourceList",
                 indent: _ctx.indent,
                 "next-level-indent-increment": _ctx.nextLevelIndentIncrement,
                 onEdit: unref(editHandler),
@@ -11158,7 +11197,8 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
             disabled: !unref(editable),
             values: unref(dataSourceValues),
             title: unref(dialogTitle),
-            onSubmit: unref(submitDataSourceHandler)
+            onSubmit: unref(submitDataSourceHandler),
+            onClose: editDialogCloseHandler
           }, null, 8, ["disabled", "values", "title", "onSubmit"]),
           (openBlock(), createBlock(Teleport, { to: "body" }, [
             menuData.value.length ? (openBlock(), createBlock(_sfc_main$o, {
@@ -12045,7 +12085,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     const dragendHandler = () => {
       if (timeout) {
         globalThis.clearTimeout(timeout);
-        timeout = undefined;
+        timeout = void 0;
       }
       const doc = stage.value?.renderer?.getDocument();
       if (doc && stageOptions?.containerHighlightClassName) {
@@ -12060,7 +12100,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         clientY = e.clientY;
         if (timeout) {
           globalThis.clearTimeout(timeout);
-          timeout = undefined;
+          timeout = void 0;
         }
         return;
       }
@@ -12384,14 +12424,14 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
                             }) : config.slots?.componentList ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.componentList), { key: 1 })) : createCommentVNode("v-if", true)
                           ]),
                           key: "0"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "component-list" || config.slots?.componentListPanelHeader ? {
                           name: "component-list-panel-header",
                           fn: withCtx(() => [
                             config.$key === "component-list" ? renderSlot(_ctx.$slots, "component-list-panel-header", { key: 0 }) : config.slots?.componentListPanelHeader ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.componentListPanelHeader), { key: 1 })) : createCommentVNode("v-if", true)
                           ]),
                           key: "1"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "component-list" || config.slots?.componentListItem ? {
                           name: "component-list-item",
                           fn: withCtx(({ component }) => [
@@ -12404,21 +12444,21 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
                             }, null, 8, ["component"])) : createCommentVNode("v-if", true)
                           ]),
                           key: "2"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "layer" || config.slots?.layerPanelHeader ? {
                           name: "layer-panel-header",
                           fn: withCtx(() => [
                             config.$key === "layer" ? renderSlot(_ctx.$slots, "layer-panel-header", { key: 0 }) : config.slots?.layerPanelHeader ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.layerPanelHeader), { key: 1 })) : createCommentVNode("v-if", true)
                           ]),
                           key: "3"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "code-block" || config.slots?.codeBlockPanelHeader ? {
                           name: "code-block-panel-header",
                           fn: withCtx(() => [
                             config.$key === "code-block" ? renderSlot(_ctx.$slots, "code-block-panel-header", { key: 0 }) : config.slots?.codeBlockPanelHeader ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.codeBlockPanelHeader), { key: 1 })) : createCommentVNode("v-if", true)
                           ]),
                           key: "4"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "code-block" || config.slots?.codeBlockPanelTool ? {
                           name: "code-block-panel-tool",
                           fn: withCtx(({ id, data }) => [
@@ -12429,14 +12469,14 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
                             }) : config.slots?.codeBlockPanelTool ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.codeBlockPanelTool), { key: 1 })) : createCommentVNode("v-if", true)
                           ]),
                           key: "5"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "code-block" || config.slots?.codeBlockPanelSearch ? {
                           name: "code-block-panel-search",
                           fn: withCtx(() => [
                             config.$key === "code-block" ? renderSlot(_ctx.$slots, "code-block-panel-search", { key: 0 }) : config.slots?.codeBlockPanelSearch ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.codeBlockPanelSearch), { key: 1 })) : createCommentVNode("v-if", true)
                           ]),
                           key: "6"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "layer" || config.slots?.layerNodeContent ? {
                           name: "layer-node-content",
                           fn: withCtx(({ data: nodeData }) => [
@@ -12449,7 +12489,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
                             }, null, 8, ["data"])) : createCommentVNode("v-if", true)
                           ]),
                           key: "7"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "layer" || config.slots?.layerNodeLabel ? {
                           name: "layer-node-label",
                           fn: withCtx(({ data: nodeData }) => [
@@ -12462,7 +12502,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
                             }, null, 8, ["data"])) : createCommentVNode("v-if", true)
                           ]),
                           key: "8"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "layer" || config.slots?.layerNodeTool ? {
                           name: "layer-node-tool",
                           fn: withCtx(({ data: nodeData }) => [
@@ -12475,7 +12515,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
                             }, null, 8, ["data"])) : createCommentVNode("v-if", true)
                           ]),
                           key: "9"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "data-source" || config.slots?.dataSourcePanelTool ? {
                           name: "data-source-panel-tool",
                           fn: withCtx(({ data }) => [
@@ -12485,14 +12525,14 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
                             }) : config.slots?.DataSourcePanelTool ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.DataSourcePanelTool), { key: 1 })) : createCommentVNode("v-if", true)
                           ]),
                           key: "10"
-                        } : undefined,
+                        } : void 0,
                         config.$key === "data-source" || config.slots?.dataSourcePanelSearch ? {
                           name: "data-source-panel-search",
                           fn: withCtx(() => [
                             config.$key === "data-source" ? renderSlot(_ctx.$slots, "data-source-panel-search", { key: 0 }) : config.slots?.dataSourcePanelSearch ? (openBlock(), createBlock(resolveDynamicComponent(config.slots.dataSourcePanelSearch), { key: 1 })) : createCommentVNode("v-if", true)
                           ]),
                           key: "11"
-                        } : undefined
+                        } : void 0
                       ]),
                       1040
                       /* FULL_PROPS, DYNAMIC_SLOTS */
@@ -13487,7 +13527,7 @@ class CodeBlock extends BaseService {
     editable: true,
     combineIds: [],
     undeletableList: [],
-    paramsColConfig: undefined
+    paramsColConfig: void 0
   });
   constructor() {
     super([
@@ -13751,7 +13791,6 @@ class ComponentList extends BaseService {
 const componentListService = new ComponentList();
 
 const canUsePluginMethods$1 = {
-  async: [],
   sync: [
     "getFormConfig",
     "setFormConfig",
@@ -14273,7 +14312,6 @@ class Keybinding extends BaseService {
 const keybindingService = new Keybinding();
 
 const canUsePluginMethods = {
-  async: [],
   sync: ["openOverlay", "closeOverlay", "updateOverlay", "createStage"]
 };
 class StageOverlay extends BaseService {
@@ -14613,14 +14651,14 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
   const getTMagicApp = () => {
     const renderer = editorService.get("stage")?.renderer;
     if (!renderer) {
-      return undefined;
+      return void 0;
     }
     if (renderer.runtime) {
       return renderer.runtime.getApp?.();
     }
     return new Promise((resolve) => {
       const timeout = globalThis.setTimeout(() => {
-        resolve(undefined);
+        resolve(void 0);
       }, 1e4);
       renderer.on("runtime-ready", () => {
         if (timeout) {
@@ -14654,12 +14692,13 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
       app.dsl.dataSources = root.dataSources;
     }
   };
-  const dsDepCollectedHandler = async () => {
+  const dsDepCollectedHandler = () => {
     const root = editorService.get("root");
-    const app = await getTMagicApp();
-    if (root && app?.dsl) {
-      app.dsl.dataSourceDeps = root.dataSourceDeps;
-    }
+    getTMagicApp()?.then((app) => {
+      if (root && app?.dsl) {
+        app.dsl.dataSourceDeps = root.dataSourceDeps;
+      }
+    });
   };
   const collectIdle = (nodes, deep, type) => Promise.all(
     nodes.map((node) => {
@@ -14692,7 +14731,7 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
     depService.addTarget(createDataSourceMethodTarget(ds, reactive({})));
     depService.addTarget(createDataSourceCondTarget(ds, reactive({})));
   };
-  const rootChangeHandler = async (value, preValue) => {
+  const rootChangeHandler = (value, preValue) => {
     if (!value) return;
     value.codeBlocks = value.codeBlocks || {};
     value.dataSources = value.dataSources || [];
@@ -14715,29 +14754,33 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
       delete value.dataSourceDeps;
       delete value.dataSourceCondDeps;
     }
-    const nodeId = editorService.get("node")?.id || props.defaultSelected;
-    let node;
-    if (nodeId) {
-      node = editorService.getNodeById(nodeId);
-    }
-    if (node && node !== value) {
-      await editorService.select(node.id);
-    } else if (value.items?.length) {
-      await editorService.select(value.items[0]);
-    } else if (value.id) {
-      editorService.set("nodes", [value]);
-      editorService.set("parent", null);
-      editorService.set("page", null);
-    }
-    if (toRaw(value) !== toRaw(preValue)) {
-      emit("update:modelValue", value);
-    }
+    const handler = async () => {
+      const nodeId = editorService.get("node")?.id || props.defaultSelected;
+      let node;
+      if (nodeId) {
+        node = editorService.getNodeById(nodeId);
+      }
+      if (node && node !== value) {
+        await editorService.select(node.id);
+      } else if (value.items?.length) {
+        await editorService.select(value.items[0]);
+      } else if (value.id) {
+        editorService.set("nodes", [value]);
+        editorService.set("parent", null);
+        editorService.set("page", null);
+      }
+      if (toRaw(value) !== toRaw(preValue)) {
+        emit("update:modelValue", value);
+      }
+    };
+    handler();
   };
-  const nodeAddHandler = async (nodes) => {
-    await collectIdle(nodes, true);
-    updateStageNodes(nodes);
+  const nodeAddHandler = (nodes) => {
+    collectIdle(nodes, true).then(() => {
+      updateStageNodes(nodes);
+    });
   };
-  const nodeUpdateHandler = async (data) => {
+  const nodeUpdateHandler = (data) => {
     const needRecollectNodes = [];
     const normalNodes = [];
     for (const { newNode, oldNode, changeRecords } of data) {
@@ -14769,9 +14812,12 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
       }
     }
     if (needRecollectNodes.length) {
-      await collectIdle(needRecollectNodes, true, DepTargetType.DATA_SOURCE);
-      await collectIdle(needRecollectNodes, true, DepTargetType.DATA_SOURCE_COND);
-      updateStageNodes(needRecollectNodes);
+      const handler = async () => {
+        await collectIdle(needRecollectNodes, true, DepTargetType.DATA_SOURCE);
+        await collectIdle(needRecollectNodes, true, DepTargetType.DATA_SOURCE_COND);
+        updateStageNodes(needRecollectNodes);
+      };
+      handler();
     } else {
       updateStageNodes(normalNodes);
       Promise.all([
@@ -14783,28 +14829,32 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
   const nodeRemoveHandler = (nodes) => {
     depService.clear(nodes);
   };
-  const historyChangeHandler = async (page) => {
-    await collectIdle([page], true);
-    updateStageNode(page);
+  const historyChangeHandler = (page) => {
+    collectIdle([page], true).then(() => {
+      updateStageNode(page);
+    });
   };
   editorService.on("history-change", historyChangeHandler);
   editorService.on("root-change", rootChangeHandler);
   editorService.on("add", nodeAddHandler);
   editorService.on("remove", nodeRemoveHandler);
   editorService.on("update", nodeUpdateHandler);
-  const dataSourceAddHandler = async (config) => {
-    initDataSourceDepTarget(config);
-    const app = await getTMagicApp();
-    if (!app?.dataSourceManager) {
-      return;
-    }
-    app.dataSourceManager.addDataSource(config);
-    const newDs = app.dataSourceManager.get(config.id);
-    if (newDs) {
-      app.dataSourceManager.init(newDs);
-    }
+  const dataSourceAddHandler = (config) => {
+    const handler = async () => {
+      initDataSourceDepTarget(config);
+      const app = await getTMagicApp();
+      if (!app?.dataSourceManager) {
+        return;
+      }
+      app.dataSourceManager.addDataSource(config);
+      const newDs = app.dataSourceManager.get(config.id);
+      if (newDs) {
+        app.dataSourceManager.init(newDs);
+      }
+    };
+    handler();
   };
-  const dataSourceUpdateHandler = async (config, { changeRecords }) => {
+  const dataSourceUpdateHandler = (config, { changeRecords }) => {
     const updateDsData = async () => {
       const app = await getTMagicApp();
       if (!app?.dataSourceManager) {
@@ -14865,23 +14915,26 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
     depService.removeTarget(id, DepTargetType.DATA_SOURCE_COND);
     depService.removeTarget(id, DepTargetType.DATA_SOURCE_METHOD);
   };
-  const dataSourceRemoveHandler = async (id) => {
+  const dataSourceRemoveHandler = (id) => {
     const root = editorService.get("root");
     if (!root) {
       return;
     }
-    const nodeIds = Object.keys(root.dataSourceDeps?.[id] || {});
-    const nodes = getNodes(nodeIds, root.items);
-    await Promise.all([
-      collectIdle(nodes, false, DepTargetType.DATA_SOURCE),
-      collectIdle(nodes, false, DepTargetType.DATA_SOURCE_COND),
-      collectIdle(nodes, false, DepTargetType.DATA_SOURCE_METHOD)
-    ]);
-    updateDataSourceSchema();
-    const app = await getTMagicApp();
-    app?.dataSourceManager?.removeDataSource(id);
-    updateStageNodes(nodes);
-    removeDataSourceTarget(id);
+    const handler = async () => {
+      const nodeIds = Object.keys(root.dataSourceDeps?.[id] || {});
+      const nodes = getNodes(nodeIds, root.items);
+      await Promise.all([
+        collectIdle(nodes, false, DepTargetType.DATA_SOURCE),
+        collectIdle(nodes, false, DepTargetType.DATA_SOURCE_COND),
+        collectIdle(nodes, false, DepTargetType.DATA_SOURCE_METHOD)
+      ]);
+      updateDataSourceSchema();
+      const app = await getTMagicApp();
+      app?.dataSourceManager?.removeDataSource(id);
+      updateStageNodes(nodes);
+      removeDataSourceTarget(id);
+    };
+    handler();
   };
   dataSourceService.on("add", dataSourceAddHandler);
   dataSourceService.on("update", dataSourceUpdateHandler);