@tmagic/editor 1.3.3 → 1.3.5

package/dist/tmagic-editor.umd.cjs

@@ -413,7 +413,7 @@
 
   const _hoisted_1$w = { style: { "display": "flex", "margin-bottom": "10px" } };
   const _hoisted_2$p = { style: { "flex": "1" } };
-  const _hoisted_3$b = { style: { "flex": "1" } };
+  const _hoisted_3$c = { style: { "flex": "1" } };
   const _hoisted_4$7 = { class: "dialog-footer" };
   const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
     ...{
@@ -671,7 +671,7 @@
                     _: 1
                   })
                 ]),
-                vue.createElementVNode("div", _hoisted_3$b, [
+                vue.createElementVNode("div", _hoisted_3$c, [
                   vue.createVNode(vue.unref(design.TMagicTag), {
                     size: "small",
                     type: "success"
@@ -776,6 +776,7 @@
           name: "data",
           type: "key-value",
           defaultValue: {},
+          advanced: true,
           text: "请求体"
         },
         {
@@ -2537,7 +2538,9 @@
     async update(config) {
       const nodes = Array.isArray(config) ? config : [config];
       const newNodes = await Promise.all(nodes.map((node) => this.doUpdate(node)));
-      this.pushHistoryState();
+      if (newNodes[0]?.type !== schema.NodeType.ROOT) {
+        this.pushHistoryState();
+      }
       this.emit("update", newNodes);
       return Array.isArray(config) ? newNodes : newNodes[0];
     }
@@ -3290,7 +3293,7 @@
         },
         {
           label: "属性描述",
-          prop: "desc"
+          prop: "description"
         },
         {
           label: "默认值",
@@ -3421,6 +3424,7 @@
         data: {}
       });
       const newFromJsonHandler = () => {
+        jsonFromValues.value.data = utils.getDefaultValueFromFields(props.model[props.name]);
         addFromJsonDialog.value?.show();
       };
       const getValueType = (value) => {
@@ -3438,33 +3442,35 @@
           return "string";
         return "any";
       };
-      const getFieldsConfig = (value) => {
+      const getFieldsConfig = (value, fields = []) => {
         if (!value || typeof value !== "object")
           throw new Error("数据格式错误");
-        const fields = [];
+        const newFields = [];
         Object.entries(value).forEach(([key, value2]) => {
           const type = getValueType(value2);
+          const oldField = fields.find((field) => field.name === key);
           let childFields = [];
           if (Array.isArray(value2) && value2.length > 0) {
-            childFields = getFieldsConfig(value2[0]);
+            childFields = getFieldsConfig(value2[0], oldField?.fields);
           } else if (type === "object") {
-            childFields = getFieldsConfig(value2);
+            childFields = getFieldsConfig(value2, oldField?.fields);
           }
-          fields.push({
+          newFields.push({
             name: key,
-            title: key,
+            title: oldField?.title || key,
             type,
+            description: oldField?.description || "",
+            enable: oldField?.enable ?? true,
             defaultValue: value2,
             fields: childFields
           });
         });
-        return fields;
+        return newFields;
       };
       const addFromJsonFromChange = ({ data }) => {
-        console.log(data);
         try {
           const value = JSON.parse(data);
-          props.model[props.name] = getFieldsConfig(value);
+          props.model[props.name] = getFieldsConfig(value, props.model[props.name]);
           addFromJsonDialog.value?.hide();
           emit("change", props.model[props.name]);
         } catch (e) {
@@ -3586,7 +3592,7 @@
 
   const _hoisted_1$s = { style: { "display": "flex", "flex-direction": "column", "line-height": "1.2em" } };
   const _hoisted_2$m = { style: { "font-size": "10px", "color": "rgba(0, 0, 0, 0.6)" } };
-  const _hoisted_3$a = { class: "el-input__inner" };
+  const _hoisted_3$b = { class: "el-input__inner" };
   const _sfc_main$J = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorDataSourceInput"
@@ -3794,7 +3800,7 @@
           vue.createElementVNode("div", {
             class: vue.normalizeClass(`tmagic-data-source-input-text-wrapper el-input__wrapper ${isFocused.value ? " is-focus" : ""}`)
           }, [
-            vue.createElementVNode("div", _hoisted_3$a, [
+            vue.createElementVNode("div", _hoisted_3$b, [
               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(displayState.value, (item, index) => {
                 return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
                   item.type === "text" ? (vue.openBlock(), vue.createElementBlock("span", {
@@ -4682,9 +4688,32 @@
     }
   });
 
-  const _hoisted_1$n = { class: "m-fields-key-value" };
-  const _hoisted_2$h = /* @__PURE__ */ vue.createElementVNode("span", { class: "m-fileds-key-value-delimiter" }, ":", -1);
+  const _hoisted_1$n = {
+    viewBox: "0 0 32 32",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg",
+    "xmlns:xlink": "http://www.w3.org/1999/xlink"
+  };
+  const _hoisted_2$h = /* @__PURE__ */ vue.createStaticVNode('<defs><rect id="path-1" x="0" y="0" width="32" height="32"></rect></defs><g id="组件规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="03图标" transform="translate(-561.000000, -2356.000000)"><g id="icon/line/Universal/code" transform="translate(561.000000, 2356.000000)"><g id="路径"><mask id="mask-2" fill="white"><use xlink:href="#path-1"></use></mask><use id="蒙版" fill="#D8D8D8" opacity="0" xlink:href="#path-1"></use><path d="M21.9284587,7.9482233 L29.8079004,15.827665 C29.9055315,15.9252961 29.9055315,16.0835874 29.8079004,16.1812184 L21.9284587,24.0606602 C21.8308276,24.1582912 21.6725364,24.1582912 21.5749053,24.0606602 L20.3374684,22.8232233 C20.2419143,22.7276698 20.2398813,22.5740096 20.331369,22.4759832 L20.3374687,22.4696702 L26.8027181,16.0044417 L20.3374687,9.53921328 C20.2398372,9.44158265 20.2398369,9.2832914 20.3374679,9.18566017 L21.5749053,7.9482233 C21.6725364,7.85059223 21.8308276,7.85059223 21.9284587,7.9482233 Z M10.3999684,7.9482233 L11.6374053,9.18566017 C11.7329594,9.28121371 11.7349925,9.43487387 11.6435048,9.53290029 L11.637405,9.53921328 L5.17215562,16.0044417 L11.637405,22.4696702 C11.7329593,22.5652236 11.7349926,22.7188837 11.643505,22.8169103 L11.6374053,22.8232233 L10.3999684,24.0606602 C10.3023374,24.1582912 10.1440461,24.1582912 10.046415,24.0606602 L2.1669733,16.1812184 C2.06934223,16.0835874 2.06934223,15.9252961 2.1669733,15.827665 L10.046415,7.9482233 C10.1440461,7.85059223 10.3023374,7.85059223 10.3999684,7.9482233 Z M17.2612532,9.29310422 L18.9262468,9.83189578 C19.0576112,9.87440526 19.1296423,10.0153579 19.0871328,10.1467222 L15.0848232,22.514807 C15.0423138,22.6461714 14.9013612,22.7182025 14.7699968,22.675693 L13.1050032,22.1369014 C12.9736388,22.0943919 12.9016077,21.9534393 12.9441172,21.822075 L16.9464268,9.45399022 C16.9889362,9.32262585 17.1298888,9.25059474 17.2612532,9.29310422 Z" id="形状" fill="#1D1F24" mask="url(#mask-2)"></path></g></g><g id="icon切图" transform="translate(226.000000, 1782.000000)"></g></g></g>', 2);
+  const _hoisted_4$6 = [
+    _hoisted_2$h
+  ];
   const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
+    ...{
+      name: "MEditorCodeIcon"
+    },
+    __name: "CodeIcon",
+    setup(__props) {
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$n, _hoisted_4$6);
+      };
+    }
+  });
+
+  const _hoisted_1$m = { class: "m-fields-key-value" };
+  const _hoisted_2$g = { key: 0 };
+  const _hoisted_3$a = /* @__PURE__ */ vue.createElementVNode("span", { class: "m-fileds-key-value-delimiter" }, ":", -1);
+  const _sfc_main$C = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorKeyValue"
     },
@@ -4705,8 +4734,16 @@
       const props = __props;
       const emit = __emit;
       const records = vue.ref([]);
+      const showCode = vue.ref(false);
       vue.watchEffect(() => {
-        records.value = Object.entries(props.model[props.name] || {});
+        const initValues = Object.entries(props.model[props.name] || {});
+        for (const [, value] of initValues) {
+          if (typeof value !== "string") {
+            showCode.value = true;
+            break;
+          }
+        }
+        records.value = initValues;
       });
       const getValue = () => {
         const record = {};
@@ -4730,66 +4767,90 @@
         records.value.splice(index, 1);
         emit("change", getValue());
       };
+      const save = (v) => {
+        emit("change", v);
+      };
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$n, [
-          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(records.value, (item, index) => {
-            return vue.openBlock(), vue.createElementBlock("div", {
-              class: "m-fields-key-value-item",
-              key: index
-            }, [
-              vue.createVNode(vue.unref(design.TMagicInput), {
-                placeholder: "key",
-                modelValue: records.value[index][0],
-                "onUpdate:modelValue": ($event) => records.value[index][0] = $event,
-                disabled: _ctx.disabled,
-                size: _ctx.size,
-                onChange: keyChangeHandler
-              }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled", "size"]),
-              _hoisted_2$h,
-              vue.createVNode(vue.unref(design.TMagicInput), {
-                placeholder: "value",
-                modelValue: records.value[index][1],
-                "onUpdate:modelValue": ($event) => records.value[index][1] = $event,
-                disabled: _ctx.disabled,
-                size: _ctx.size,
-                onChange: valueChangeHandler
-              }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled", "size"]),
-              vue.createVNode(vue.unref(design.TMagicButton), {
-                class: "m-fileds-key-value-delete",
-                type: "danger",
-                size: _ctx.size,
-                disabled: _ctx.disabled,
-                circle: "",
-                plain: "",
-                icon: vue.unref(iconsVue.Delete),
-                onClick: ($event) => deleteHandler(index)
-              }, null, 8, ["size", "disabled", "icon", "onClick"])
-            ]);
-          }), 128)),
-          vue.createVNode(vue.unref(design.TMagicButton), {
-            type: "primary",
-            size: _ctx.size,
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$m, [
+          !showCode.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$g, [
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(records.value, (item, index) => {
+              return vue.openBlock(), vue.createElementBlock("div", {
+                class: "m-fields-key-value-item",
+                key: index
+              }, [
+                vue.createVNode(vue.unref(design.TMagicInput), {
+                  placeholder: "key",
+                  modelValue: records.value[index][0],
+                  "onUpdate:modelValue": ($event) => records.value[index][0] = $event,
+                  disabled: _ctx.disabled,
+                  size: _ctx.size,
+                  onChange: keyChangeHandler
+                }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled", "size"]),
+                _hoisted_3$a,
+                vue.createVNode(vue.unref(design.TMagicInput), {
+                  placeholder: "value",
+                  modelValue: records.value[index][1],
+                  "onUpdate:modelValue": ($event) => records.value[index][1] = $event,
+                  disabled: _ctx.disabled,
+                  size: _ctx.size,
+                  onChange: valueChangeHandler
+                }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled", "size"]),
+                vue.createVNode(vue.unref(design.TMagicButton), {
+                  class: "m-fileds-key-value-delete",
+                  type: "danger",
+                  size: _ctx.size,
+                  disabled: _ctx.disabled,
+                  circle: "",
+                  plain: "",
+                  icon: vue.unref(iconsVue.Delete),
+                  onClick: ($event) => deleteHandler(index)
+                }, null, 8, ["size", "disabled", "icon", "onClick"])
+              ]);
+            }), 128)),
+            vue.createVNode(vue.unref(design.TMagicButton), {
+              type: "primary",
+              size: _ctx.size,
+              disabled: _ctx.disabled,
+              plain: "",
+              icon: vue.unref(iconsVue.Plus),
+              onClick: addHandler
+            }, {
+              default: vue.withCtx(() => [
+                vue.createTextVNode("添加")
+              ]),
+              _: 1
+            }, 8, ["size", "disabled", "icon"])
+          ])) : vue.createCommentVNode("", true),
+          _ctx.config.advanced && showCode.value ? (vue.openBlock(), vue.createBlock(_sfc_main$T, {
+            key: 1,
+            height: "200px",
+            "init-values": _ctx.model[_ctx.name],
+            language: "json",
+            options: {
+              readOnly: _ctx.disabled
+            },
+            parse: true,
+            onSave: save
+          }, null, 8, ["init-values", "options"])) : vue.createCommentVNode("", true),
+          _ctx.config.advanced ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
+            key: 2,
+            size: "default",
             disabled: _ctx.disabled,
-            plain: "",
-            icon: vue.unref(iconsVue.Plus),
-            onClick: addHandler
-          }, {
-            default: vue.withCtx(() => [
-              vue.createTextVNode("添加")
-            ]),
-            _: 1
-          }, 8, ["size", "disabled", "icon"])
+            text: "",
+            icon: _sfc_main$D,
+            onClick: _cache[0] || (_cache[0] = ($event) => showCode.value = !showCode.value)
+          }, null, 8, ["disabled"])) : vue.createCommentVNode("", true)
         ]);
       };
     }
   });
 
-  const _hoisted_1$m = {
+  const _hoisted_1$l = {
     key: 1,
     class: "m-fields-ui-select",
     style: { "display": "flex" }
   };
-  const _sfc_main$C = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorUISelect"
     },
@@ -4879,7 +4940,7 @@
             ]),
             _: 1
           }, 8, ["icon", "disabled", "size"])
-        ])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$m, [
+        ])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$l, [
           val.value ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
             vue.createVNode(vue.unref(design.TMagicTooltip), {
               content: "清除",
@@ -4976,7 +5037,7 @@
     };
   };
 
-  const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorResizer"
     },
@@ -4998,7 +5059,7 @@
     }
   });
 
-  const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$z = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorLayout"
     },
@@ -5125,7 +5186,7 @@
             }, [
               vue.renderSlot(_ctx.$slots, "left")
             ], 6),
-            vue.createVNode(_sfc_main$B, { onChange: changeLeft })
+            vue.createVNode(_sfc_main$A, { onChange: changeLeft })
           ], 64)) : vue.createCommentVNode("", true),
           vue.createElementVNode("div", {
             class: vue.normalizeClass(["m-editor-layout-center", _ctx.centerClass]),
@@ -5134,7 +5195,7 @@
             vue.renderSlot(_ctx.$slots, "center")
           ], 6),
           hasRight.value && _ctx.$slots.right ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
-            vue.createVNode(_sfc_main$B, { onChange: changeRight }),
+            vue.createVNode(_sfc_main$A, { onChange: changeRight }),
             vue.createElementVNode("div", {
               class: vue.normalizeClass(["m-editor-layout-right", _ctx.rightClass]),
               style: vue.normalizeStyle(`width: ${_ctx.right}px`)
@@ -5147,10 +5208,10 @@
     }
   });
 
-  const _hoisted_1$l = { class: "m-editor-empty-panel" };
-  const _hoisted_2$g = { class: "m-editor-empty-content" };
+  const _hoisted_1$k = { class: "m-editor-empty-panel" };
+  const _hoisted_2$f = { class: "m-editor-empty-content" };
   const _hoisted_3$9 = /* @__PURE__ */ vue.createElementVNode("p", null, "新增页面", -1);
-  const _sfc_main$z = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$y = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorAddPageBox"
     },
@@ -5170,8 +5231,8 @@
         });
       };
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$l, [
-          vue.createElementVNode("div", _hoisted_2$g, [
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$k, [
+          vue.createElementVNode("div", _hoisted_2$f, [
             vue.createElementVNode("div", {
               class: "m-editor-empty-button",
               onClick: clickHandler
@@ -5191,7 +5252,7 @@
   const DEFAULT_RIGHT_COLUMN_WIDTH = 480;
   const LEFT_COLUMN_WIDTH_STORAGE_KEY = "$MagicEditorLeftColumnWidthData";
   const RIGHT_COLUMN_WIDTH_STORAGE_KEY = "$MagicEditorRightColumnWidthData";
-  const _sfc_main$y = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$x = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorFramework"
     },
@@ -5272,7 +5333,7 @@
               options: vue.unref(codeOptions),
               onSave: saveCode
             }, null, 8, ["init-values", "options"])
-          ]) : (vue.openBlock(), vue.createBlock(_sfc_main$A, {
+          ]) : (vue.openBlock(), vue.createBlock(_sfc_main$z, {
             key: 1,
             ref_key: "splitView",
             ref: splitView,
@@ -5294,7 +5355,7 @@
             ]),
             center: vue.withCtx(() => [
               pageLength.value > 0 ? vue.renderSlot(_ctx.$slots, "workspace", { key: 0 }) : vue.renderSlot(_ctx.$slots, "empty", { key: 1 }, () => [
-                vue.createVNode(_sfc_main$z)
+                vue.createVNode(_sfc_main$y)
               ])
             ]),
             _: 2
@@ -5319,12 +5380,12 @@
     }
   });
 
-  const _hoisted_1$k = {
+  const _hoisted_1$j = {
     key: 1,
     class: "menu-item-text"
   };
-  const _hoisted_2$f = { class: "el-dropdown-link menubar-menu-button" };
-  const _sfc_main$x = /* @__PURE__ */ vue.defineComponent({
+  const _hoisted_2$e = { class: "el-dropdown-link menubar-menu-button" };
+  const _sfc_main$w = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorToolButton"
     },
@@ -5403,7 +5464,7 @@
           _ctx.data.type === "divider" ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicDivider), {
             key: 0,
             direction: _ctx.data.direction || "vertical"
-          }, null, 8, ["direction"])) : _ctx.data.type === "text" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$k, vue.toDisplayString(_ctx.data.text), 1)) : _ctx.data.type === "button" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
+          }, null, 8, ["direction"])) : _ctx.data.type === "text" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$j, vue.toDisplayString(_ctx.data.text), 1)) : _ctx.data.type === "button" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
             _ctx.data.tooltip ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicTooltip), {
               key: 0,
               effect: "dark",
@@ -5468,7 +5529,7 @@
               })) : vue.createCommentVNode("", true)
             ]),
             default: vue.withCtx(() => [
-              vue.createElementVNode("span", _hoisted_2$f, [
+              vue.createElementVNode("span", _hoisted_2$e, [
                 vue.createTextVNode(vue.toDisplayString(_ctx.data.text), 1),
                 vue.createVNode(vue.unref(design.TMagicIcon), { class: "el-icon--right" }, {
                   default: vue.withCtx(() => [
@@ -5485,7 +5546,7 @@
     }
   });
 
-  const _sfc_main$w = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorNavMenu"
     },
@@ -5647,7 +5708,7 @@
               style: vue.normalizeStyle(`width: ${columnWidth.value?.[key]}px`)
             }, [
               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(buttons.value[key], (item, index) => {
-                return vue.openBlock(), vue.createBlock(_sfc_main$x, {
+                return vue.openBlock(), vue.createBlock(_sfc_main$w, {
                   data: item,
                   key: index
                 }, null, 8, ["data"]);
@@ -5659,8 +5720,8 @@
     }
   });
 
-  const _hoisted_1$j = { class: "m-editor-props-panel" };
-  const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
+  const _hoisted_1$i = { class: "m-editor-props-panel" };
+  const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorPropsPanel"
     },
@@ -5714,7 +5775,7 @@
       };
       __expose({ configForm, submit });
       return (_ctx, _cache) => {
-        return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_1$j, [
+        return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", _hoisted_1$i, [
           vue.renderSlot(_ctx.$slots, "props-panel-header"),
           vue.createVNode(vue.unref(form.MForm), {
             ref_key: "configForm",
@@ -5865,7 +5926,7 @@
     };
   };
 
-  const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "MEditorSearchInput"
     },
@@ -5905,8 +5966,8 @@
     }
   });
 
-  const _hoisted_1$i = { xmlns: "http://www.w3.org/2000/svg" };
-  const _hoisted_2$e = /* @__PURE__ */ vue.createElementVNode("g", {
+  const _hoisted_1$h = { xmlns: "http://www.w3.org/2000/svg" };
+  const _hoisted_2$d = /* @__PURE__ */ vue.createElementVNode("g", {
     fill: "#7C878E",
     "fill-rule": "evenodd"
   }, [
@@ -5917,38 +5978,16 @@
     /* @__PURE__ */ vue.createElementVNode("path", { d: "M8 13.5L2.3 9.2 0.7 10.5 8 16 15.3 10.5 13.7 9.2z" })
   ], -1);
   const _hoisted_3$8 = [
-    _hoisted_2$e
-  ];
-  const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
-    ...{
-      name: "MEditorAppManageIcon"
-    },
-    __name: "AppManageIcon",
-    setup(__props) {
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$i, _hoisted_3$8);
-      };
-    }
-  });
-
-  const _hoisted_1$h = {
-    viewBox: "0 0 32 32",
-    version: "1.1",
-    xmlns: "http://www.w3.org/2000/svg",
-    "xmlns:xlink": "http://www.w3.org/1999/xlink"
-  };
-  const _hoisted_2$d = /* @__PURE__ */ vue.createStaticVNode('<defs><rect id="path-1" x="0" y="0" width="32" height="32"></rect></defs><g id="组件规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="03图标" transform="translate(-561.000000, -2356.000000)"><g id="icon/line/Universal/code" transform="translate(561.000000, 2356.000000)"><g id="路径"><mask id="mask-2" fill="white"><use xlink:href="#path-1"></use></mask><use id="蒙版" fill="#D8D8D8" opacity="0" xlink:href="#path-1"></use><path d="M21.9284587,7.9482233 L29.8079004,15.827665 C29.9055315,15.9252961 29.9055315,16.0835874 29.8079004,16.1812184 L21.9284587,24.0606602 C21.8308276,24.1582912 21.6725364,24.1582912 21.5749053,24.0606602 L20.3374684,22.8232233 C20.2419143,22.7276698 20.2398813,22.5740096 20.331369,22.4759832 L20.3374687,22.4696702 L26.8027181,16.0044417 L20.3374687,9.53921328 C20.2398372,9.44158265 20.2398369,9.2832914 20.3374679,9.18566017 L21.5749053,7.9482233 C21.6725364,7.85059223 21.8308276,7.85059223 21.9284587,7.9482233 Z M10.3999684,7.9482233 L11.6374053,9.18566017 C11.7329594,9.28121371 11.7349925,9.43487387 11.6435048,9.53290029 L11.637405,9.53921328 L5.17215562,16.0044417 L11.637405,22.4696702 C11.7329593,22.5652236 11.7349926,22.7188837 11.643505,22.8169103 L11.6374053,22.8232233 L10.3999684,24.0606602 C10.3023374,24.1582912 10.1440461,24.1582912 10.046415,24.0606602 L2.1669733,16.1812184 C2.06934223,16.0835874 2.06934223,15.9252961 2.1669733,15.827665 L10.046415,7.9482233 C10.1440461,7.85059223 10.3023374,7.85059223 10.3999684,7.9482233 Z M17.2612532,9.29310422 L18.9262468,9.83189578 C19.0576112,9.87440526 19.1296423,10.0153579 19.0871328,10.1467222 L15.0848232,22.514807 C15.0423138,22.6461714 14.9013612,22.7182025 14.7699968,22.675693 L13.1050032,22.1369014 C12.9736388,22.0943919 12.9016077,21.9534393 12.9441172,21.822075 L16.9464268,9.45399022 C16.9889362,9.32262585 17.1298888,9.25059474 17.2612532,9.29310422 Z" id="形状" fill="#1D1F24" mask="url(#mask-2)"></path></g></g><g id="icon切图" transform="translate(226.000000, 1782.000000)"></g></g></g>', 2);
-  const _hoisted_4$6 = [
     _hoisted_2$d
   ];
   const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
     ...{
-      name: "MEditorCodeIcon"
+      name: "MEditorAppManageIcon"
     },
-    __name: "CodeIcon",
+    __name: "AppManageIcon",
     setup(__props) {
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$h, _hoisted_4$6);
+        return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$h, _hoisted_3$8);
       };
     }
   });
@@ -6062,11 +6101,11 @@
               class: "list-container"
             }, [
               vue.createElementVNode("div", _hoisted_2$c, [
-                data.type === "code" ? (vue.openBlock(), vue.createBlock(_sfc_main$s, {
+                data.type === "code" ? (vue.openBlock(), vue.createBlock(_sfc_main$D, {
                   key: 0,
                   class: "codeIcon"
                 })) : vue.createCommentVNode("", true),
-                data.type === "node" ? (vue.openBlock(), vue.createBlock(_sfc_main$t, {
+                data.type === "node" ? (vue.openBlock(), vue.createBlock(_sfc_main$s, {
                   key: 1,
                   class: "compIcon"
                 })) : vue.createCommentVNode("", true),
@@ -6141,7 +6180,7 @@
             default: vue.withCtx(() => [
               vue.renderSlot(_ctx.$slots, "code-block-panel-header", {}, () => [
                 vue.createElementVNode("div", _hoisted_1$f, [
-                  vue.createVNode(_sfc_main$u, { onSearch: filterTextChangeHandler }),
+                  vue.createVNode(_sfc_main$t, { onSearch: filterTextChangeHandler }),
                   editable.value ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
                     key: 0,
                     class: "create-code-button",
@@ -6468,7 +6507,7 @@
           vue.createVNode(vue.unref(design.TMagicScrollbar), { class: "data-source-list-panel m-editor-dep-list-panel" }, {
             default: vue.withCtx(() => [
               vue.createElementVNode("div", _hoisted_1$d, [
-                vue.createVNode(_sfc_main$u, { onSearch: filterTextChangeHandler }),
+                vue.createVNode(_sfc_main$t, { onSearch: filterTextChangeHandler }),
                 editable.value ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicPopover), {
                   key: 0,
                   placement: "right"
@@ -6487,7 +6526,7 @@
                   default: vue.withCtx(() => [
                     vue.createElementVNode("div", _hoisted_2$a, [
                       (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(datasourceTypeList.value, (item, index) => {
-                        return vue.openBlock(), vue.createBlock(_sfc_main$x, {
+                        return vue.openBlock(), vue.createBlock(_sfc_main$w, {
                           data: {
                             type: "button",
                             text: item.text,
@@ -6830,7 +6869,7 @@
               vue.renderSlot(_ctx.$slots, "title"),
               vue.createElementVNode("div", null, [
                 (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.menuData, (item, index) => {
-                  return vue.openBlock(), vue.createBlock(_sfc_main$x, {
+                  return vue.openBlock(), vue.createBlock(_sfc_main$w, {
                     "event-type": "mouseup",
                     ref_for: true,
                     ref_key: "buttons",
@@ -7628,7 +7667,7 @@
         return vue.openBlock(), vue.createBlock(vue.unref(design.TMagicScrollbar), { class: "m-editor-layer-panel" }, {
           default: vue.withCtx(() => [
             vue.renderSlot(_ctx.$slots, "layer-panel-header"),
-            vue.createVNode(_sfc_main$u, { onSearch: vue.unref(filterTextChangeHandler) }, null, 8, ["onSearch"]),
+            vue.createVNode(_sfc_main$t, { onSearch: vue.unref(filterTextChangeHandler) }, null, 8, ["onSearch"]),
             page.value && vue.unref(nodeStatusMap) ? (vue.openBlock(), vue.createBlock(_sfc_main$l, {
               key: 0,
               tabindex: "-1",
@@ -7751,7 +7790,7 @@
               "model-value": collapseValue.value
             }, {
               default: vue.withCtx(() => [
-                vue.createVNode(_sfc_main$u, { onSearch: filterTextChangeHandler }),
+                vue.createVNode(_sfc_main$t, { onSearch: filterTextChangeHandler }),
                 (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(list.value, (group, index) => {
                   return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
                     group.items && group.items.length ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicCollapseItem), {
@@ -8310,8 +8349,8 @@
       const el = vue.ref();
       const style = vue.computed(
         () => `
-        width: ${props.width}px;
-        height: ${props.height}px;
+        width: ${utils.isNumber(`${props.width}`) ? `${props.width}px` : props.width};
+        height: ${utils.isNumber(`${props.height}`) ? `${props.height}px` : props.height};
         position: absolute;
         margin-top: 30px;
       `
@@ -8449,8 +8488,10 @@
       const { height, width } = stageContainerRect;
       if (!width || !height)
         return 1;
-      const stageWidth = stageRect.width + 30;
-      const stageHeight = stageRect.height + 30;
+      let stageWidth = utils.convertToNumber(stageRect.width, width);
+      let stageHeight = utils.convertToNumber(stageRect.height, height);
+      stageWidth = stageWidth + 30;
+      stageHeight = stageHeight + 30;
       if (width > stageWidth && height > stageHeight) {
         return 1;
       }
@@ -9170,7 +9211,11 @@
           let top = 0;
           let left = 0;
           let position = "relative";
-          if (layout === Layout.ABSOLUTE) {
+          if (style.position === "fixed") {
+            position = "fixed";
+            top = e.clientY - containerRect.top;
+            left = e.clientX - containerRect.left;
+          } else if (layout === Layout.ABSOLUTE) {
             position = "absolute";
             top = e.clientY - containerRect.top + scrollTop;
             left = e.clientX - containerRect.left + scrollLeft;
@@ -9468,7 +9513,7 @@
                   default: vue.withCtx(() => [
                     vue.createElementVNode("div", null, [
                       vue.renderSlot(_ctx.$slots, "page-bar-popover", { page: item }, () => [
-                        vue.createVNode(_sfc_main$x, {
+                        vue.createVNode(_sfc_main$w, {
                           data: {
                             type: "button",
                             text: "复制",
@@ -9476,7 +9521,7 @@
                             handler: () => copy(item)
                           }
                         }, null, 8, ["data"]),
-                        vue.createVNode(_sfc_main$x, {
+                        vue.createVNode(_sfc_main$w, {
                           data: {
                             type: "button",
                             text: "删除",
@@ -10391,13 +10436,13 @@
       );
       __expose(services);
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createBlock(_sfc_main$y, null, {
+        return vue.openBlock(), vue.createBlock(_sfc_main$x, null, {
           header: vue.withCtx(() => [
             vue.renderSlot(_ctx.$slots, "header")
           ]),
           nav: vue.withCtx(() => [
             vue.renderSlot(_ctx.$slots, "nav", { editorService: vue.unref(editorService) }, () => [
-              vue.createVNode(_sfc_main$w, { data: _ctx.menu }, null, 8, ["data"])
+              vue.createVNode(_sfc_main$v, { data: _ctx.menu }, null, 8, ["data"])
             ])
           ]),
           "content-before": vue.withCtx(() => [
@@ -10464,7 +10509,7 @@
           ]),
           "props-panel": vue.withCtx(() => [
             vue.renderSlot(_ctx.$slots, "props-panel", {}, () => [
-              vue.createVNode(_sfc_main$v, {
+              vue.createVNode(_sfc_main$u, {
                 "extend-state": _ctx.extendFormState,
                 onMounted: _cache[0] || (_cache[0] = (instance) => _ctx.$emit("props-panel-mounted", instance))
               }, {
@@ -10502,7 +10547,7 @@
       app.config.globalProperties.$TMAGIC_EDITOR = option;
       setConfig(option);
       app.component(_sfc_main.name, _sfc_main);
-      app.component("m-fields-ui-select", _sfc_main$C);
+      app.component("m-fields-ui-select", _sfc_main$B);
       app.component("m-fields-code-link", _sfc_main$R);
       app.component("m-fields-vs-code", _sfc_main$S);
       app.component("magic-code-editor", _sfc_main$T);
@@ -10511,7 +10556,7 @@
       app.component("m-fields-event-select", _sfc_main$E);
       app.component("m-fields-data-source-fields", _sfc_main$L);
       app.component("m-fields-data-source-mocks", _sfc_main$G);
-      app.component("m-fields-key-value", _sfc_main$D);
+      app.component("m-fields-key-value", _sfc_main$C);
       app.component("m-fields-data-source-input", _sfc_main$J);
       app.component("m-fields-data-source-select", _sfc_main$F);
       app.component("m-fields-data-source-methods", _sfc_main$I);
@@ -10548,18 +10593,18 @@
   exports.H_GUIDE_LINE_STORAGE_KEY = H_GUIDE_LINE_STORAGE_KEY;
   exports.Icon = _sfc_main$N;
   exports.KeyBindingCommand = KeyBindingCommand;
-  exports.KeyValue = _sfc_main$D;
+  exports.KeyValue = _sfc_main$C;
   exports.Keys = Keys;
   exports.LayerOffset = LayerOffset;
   exports.LayerPanel = _sfc_main$g;
   exports.Layout = Layout;
-  exports.LayoutContainer = _sfc_main$A;
-  exports.PropsPanel = _sfc_main$v;
-  exports.Resizer = _sfc_main$B;
-  exports.SplitView = _sfc_main$A;
+  exports.LayoutContainer = _sfc_main$z;
+  exports.PropsPanel = _sfc_main$u;
+  exports.Resizer = _sfc_main$A;
+  exports.SplitView = _sfc_main$z;
   exports.TMagicCodeEditor = _sfc_main$T;
   exports.TMagicEditor = _sfc_main;
-  exports.ToolButton = _sfc_main$x;
+  exports.ToolButton = _sfc_main$w;
   exports.UI_SELECT_MODE_EVENT_NAME = UI_SELECT_MODE_EVENT_NAME;
   exports.V_GUIDE_LINE_STORAGE_KEY = V_GUIDE_LINE_STORAGE_KEY;
   exports.advancedTabConfig = advancedTabConfig;