@tmagic/editor 1.0.2 → 1.0.5

package/dist/tmagic-editor.umd.js

@@ -206,7 +206,7 @@
       };
     }
   });
-  const _hoisted_1$c = /* @__PURE__ */ vue.createTextVNode("\u53D6\u6D88");
+  const _hoisted_1$d = /* @__PURE__ */ vue.createTextVNode("\u53D6\u6D88");
   function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
     const _component_el_button = vue.resolveComponent("el-button");
     const _component_el_tooltip = vue.resolveComponent("el-tooltip");
@@ -222,7 +222,7 @@
         style: { "padding": "0" }
       }, {
         default: vue.withCtx(() => [
-          _hoisted_1$c
+          _hoisted_1$d
         ]),
         _: 1
       }, 8, ["icon"])
@@ -387,12 +387,12 @@
       };
     }
   });
-  const _hoisted_1$b = {
+  const _hoisted_1$c = {
     ref: "codeEditor",
     class: "magic-code-editor"
   };
   function _sfc_render$j(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, null, 512);
+    return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$c, null, 512);
   }
   var CodeEditor = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["render", _sfc_render$j]]);
 
@@ -1613,13 +1613,13 @@
       };
     }
   });
-  const _hoisted_1$a = { class: "m-editor-empty-panel" };
+  const _hoisted_1$b = { class: "m-editor-empty-panel" };
   const _hoisted_2$4 = { class: "m-editor-empty-content" };
   const _hoisted_3$2 = /* @__PURE__ */ vue.createElementVNode("p", null, "\u65B0\u589E\u9875\u9762", -1);
   function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
     const _component_plus = vue.resolveComponent("plus");
     const _component_el_icon = vue.resolveComponent("el-icon");
-    return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
+    return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
       vue.createElementVNode("div", _hoisted_2$4, [
         vue.createElementVNode("div", {
           class: "m-editor-empty-button",
@@ -1682,12 +1682,12 @@
       };
     }
   });
-  const _hoisted_1$9 = {
+  const _hoisted_1$a = {
     ref: "target",
     class: "m-editor-resizer"
   };
   function _sfc_render$h(_ctx, _cache, $props, $setup, $data, $options) {
-    return vue.openBlock(), vue.createElementBlock("span", _hoisted_1$9, [
+    return vue.openBlock(), vue.createElementBlock("span", _hoisted_1$a, [
       vue.renderSlot(_ctx.$slots, "default")
     ], 512);
   }
@@ -1722,7 +1722,7 @@
       };
     }
   });
-  const _hoisted_1$8 = { class: "m-editor" };
+  const _hoisted_1$9 = { class: "m-editor" };
   const _hoisted_2$3 = {
     key: 1,
     class: "m-editor-content"
@@ -1732,7 +1732,7 @@
     const _component_resizer = vue.resolveComponent("resizer");
     const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");
     const _component_add_page_box = vue.resolveComponent("add-page-box");
-    return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$8, [
+    return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
       vue.renderSlot(_ctx.$slots, "nav", { class: "m-editor-nav-menu" }),
       _ctx.showSrc ? (vue.openBlock(), vue.createBlock(_component_magic_code_editor, {
         key: 0,
@@ -1762,7 +1762,7 @@
           }, [
             vue.createVNode(_component_el_scrollbar, null, {
               default: vue.withCtx(() => [
-                vue.renderSlot(_ctx.$slots, "propsPanel")
+                vue.renderSlot(_ctx.$slots, "props-panel")
               ]),
               _: 3
             })
@@ -1789,7 +1789,7 @@
       };
     }
   });
-  const _hoisted_1$7 = ["src"];
+  const _hoisted_1$8 = ["src"];
   function _sfc_render$f(_ctx, _cache, $props, $setup, $data, $options) {
     const _component_edit = vue.resolveComponent("edit");
     const _component_el_icon = vue.resolveComponent("el-icon");
@@ -1801,7 +1801,7 @@
     })) : typeof _ctx.icon === "string" && _ctx.icon.startsWith("http") ? (vue.openBlock(), vue.createElementBlock("img", {
       key: 1,
       src: _ctx.icon
-    }, null, 8, _hoisted_1$7)) : typeof _ctx.icon === "string" ? (vue.openBlock(), vue.createElementBlock("i", {
+    }, null, 8, _hoisted_1$8)) : typeof _ctx.icon === "string" ? (vue.openBlock(), vue.createElementBlock("i", {
       key: 2,
       class: vue.normalizeClass(_ctx.icon)
     }, null, 2)) : (vue.openBlock(), vue.createBlock(_component_el_icon, { key: 3 }, {
@@ -1973,7 +1973,7 @@
       };
     }
   });
-  const _hoisted_1$6 = {
+  const _hoisted_1$7 = {
     key: 1,
     class: "menu-item-text"
   };
@@ -2003,7 +2003,7 @@
       _ctx.item.type === "divider" ? (vue.openBlock(), vue.createBlock(_component_el_divider, {
         key: 0,
         direction: _ctx.item.direction || "vertical"
-      }, null, 8, ["direction"])) : _ctx.item.type === "text" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, vue.toDisplayString(_ctx.item.text), 1)) : _ctx.item.type === "zoom" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
+      }, null, 8, ["direction"])) : _ctx.item.type === "text" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, vue.toDisplayString(_ctx.item.text), 1)) : _ctx.item.type === "zoom" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
         vue.createVNode(_component_tool_button, {
           data: { type: "button", icon: _ctx.ZoomOut, handler: _ctx.zoomOutHandler, tooltip: "\u7F29\u5C0F" },
           "event-type": _ctx.eventType
@@ -2184,17 +2184,21 @@
       };
     }
   });
+  const _hoisted_1$6 = { class: "`m-editor-props-panel" };
   function _sfc_render$c(_ctx, _cache, $props, $setup, $data, $options) {
     const _component_m_form = vue.resolveComponent("m-form");
-    return vue.openBlock(), vue.createBlock(_component_m_form, {
-      class: vue.normalizeClass(`m-editor-props-panel ${_ctx.propsPanelSize}`),
-      "popper-class": `m-editor-props-panel-popper ${_ctx.propsPanelSize}`,
-      ref: "configForm",
-      size: _ctx.propsPanelSize,
-      "init-values": _ctx.values,
-      config: _ctx.curFormConfig,
-      onChange: _ctx.submit
-    }, null, 8, ["class", "popper-class", "size", "init-values", "config", "onChange"]);
+    return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
+      vue.renderSlot(_ctx.$slots, "props-panel-header"),
+      vue.createVNode(_component_m_form, {
+        class: vue.normalizeClass(`m-editor-props-panel ${_ctx.propsPanelSize}`),
+        "popper-class": `m-editor-props-panel-popper ${_ctx.propsPanelSize}`,
+        ref: "configForm",
+        size: _ctx.propsPanelSize,
+        "init-values": _ctx.values,
+        config: _ctx.curFormConfig,
+        onChange: _ctx.submit
+      }, null, 8, ["class", "popper-class", "size", "init-values", "config", "onChange"])
+    ]);
   }
   var PropsPanel = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["render", _sfc_render$c]]);
 
@@ -2244,6 +2248,7 @@
     const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");
     return vue.openBlock(), vue.createBlock(_component_el_scrollbar, null, {
       default: vue.withCtx(() => [
+        vue.renderSlot(_ctx.$slots, "component-list-panel-header"),
         vue.createVNode(_component_el_collapse, {
           class: "ui-component-panel",
           "model-value": _ctx.collapseValue
@@ -2301,7 +2306,7 @@
           _: 1
         }, 8, ["model-value"])
       ]),
-      _: 1
+      _: 3
     });
   }
   var ComponentListPanel = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["render", _sfc_render$b]]);
@@ -2666,6 +2671,7 @@
     const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");
     return vue.openBlock(), vue.createBlock(_component_el_scrollbar, { class: "magic-editor-layer-panel" }, {
       default: vue.withCtx(() => [
+        vue.renderSlot(_ctx.$slots, "layer-panel-header"),
         vue.createVNode(_component_el_input, {
           class: "filterInput",
           size: "small",
@@ -2783,6 +2789,18 @@
       ]),
       default: vue.withCtx(() => [
         (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.config.component), vue.mergeProps(_ctx.config.props || {}, vue.toHandlers(_ctx.config?.listeners || {})), vue.createSlots({ _: 2 }, [
+          _ctx.data === "component-list" || _ctx.config.slots?.componentListPanelHeader ? {
+            name: "component-list-panel-header",
+            fn: vue.withCtx(() => [
+              _ctx.data === "component-list" ? vue.renderSlot(_ctx.$slots, "component-list-panel-header", { key: 0 }) : _ctx.config.slots?.componentListPanelHeader ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.config.slots.componentListPanelHeader), { key: 1 })) : vue.createCommentVNode("", true)
+            ])
+          } : void 0,
+          _ctx.data === "layer" || _ctx.config.slots?.layerPanelHeader ? {
+            name: "layer-panel-header",
+            fn: vue.withCtx(() => [
+              _ctx.data === "layer" ? vue.renderSlot(_ctx.$slots, "layer-panel-header", { key: 0 }) : _ctx.config.slots?.layerPanelHeader ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.config.slots.layerPanelHeader), { key: 1 })) : vue.createCommentVNode("", true)
+            ])
+          } : void 0,
           _ctx.config.slots?.layerNodeContent ? {
             name: "layer-node-content",
             fn: vue.withCtx(({ data, node }) => [
@@ -2794,7 +2812,7 @@
           } : void 0
         ]), 1040))
       ]),
-      _: 1
+      _: 3
     }, 8, ["name"])) : vue.createCommentVNode("", true);
   }
   var TabPane = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["render", _sfc_render$7]]);
@@ -2834,10 +2852,23 @@
           return vue.openBlock(), vue.createBlock(_component_tab_pane, {
             key: index,
             data: item
-          }, null, 8, ["data"]);
+          }, vue.createSlots({ _: 2 }, [
+            item === "layer" ? {
+              name: "layer-panel-header",
+              fn: vue.withCtx(() => [
+                vue.renderSlot(_ctx.$slots, "layer-panel-header")
+              ])
+            } : void 0,
+            item === "component-list" ? {
+              name: "component-list-panel-header",
+              fn: vue.withCtx(() => [
+                vue.renderSlot(_ctx.$slots, "component-list-panel-header")
+              ])
+            } : void 0
+          ]), 1032, ["data"]);
         }), 128))
       ]),
-      _: 1
+      _: 3
     }, 8, ["modelValue"])) : vue.createCommentVNode("", true);
   }
   var Sidebar = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$6]]);
@@ -4012,7 +4043,15 @@
       ]),
       sidebar: vue.withCtx(() => [
         vue.renderSlot(_ctx.$slots, "sidebar", { editorService: _ctx.editorService }, () => [
-          vue.createVNode(_component_sidebar, { data: _ctx.sidebar }, null, 8, ["data"])
+          vue.createVNode(_component_sidebar, { data: _ctx.sidebar }, {
+            "layer-panel-header": vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, "layer-panel-header")
+            ]),
+            "component-list-panel-header": vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, "component-list-panel-header")
+            ]),
+            _: 3
+          }, 8, ["data"])
         ])
       ]),
       workspace: vue.withCtx(() => [
@@ -4031,12 +4070,17 @@
           })
         ])
       ]),
-      propsPanel: vue.withCtx(() => [
-        vue.renderSlot(_ctx.$slots, "propsPanel", {}, () => [
+      "props-panel": vue.withCtx(() => [
+        vue.renderSlot(_ctx.$slots, "props-panel", {}, () => [
           vue.createVNode(_component_props_panel, {
             ref: "propsPanel",
             onMounted: _cache[0] || (_cache[0] = (instance) => _ctx.$emit("props-panel-mounted", instance))
-          }, null, 512)
+          }, {
+            "props-panel-header": vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, "props-panel-header")
+            ]),
+            _: 3
+          }, 512)
         ])
       ]),
       empty: vue.withCtx(() => [