@ibiz-template/vue3-components 0.7.41-alpha.13 → 0.7.41-alpha.130

package/lib/editor/html/wang-editor/wang-editor.cjs

@@ -4,26 +4,95 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 var editorForVue = require('@wangeditor/editor-for-vue');
-var qxUtil = require('qx-util');
+var editor = require('@wangeditor/editor');
 var ramda = require('ramda');
 var vue3Util = require('@ibiz-template/vue3-util');
 var core = require('@ibiz-template/core');
-var runtime = require('@ibiz-template/runtime');
 var ElementPlus = require('element-plus');
-require('../../../util/index.cjs');
+require('./module/index.cjs');
+require('./config/index.cjs');
 require('./wang-editor.css');
-var aiUtil = require('../../../util/ai-util/ai-util.cjs');
+var toolbar = require('./config/toolbar.cjs');
+var inlineAiModule = require('./module/inline-ai-module.cjs');
 
 "use strict";
 const IBizHtml = /* @__PURE__ */ vue.defineComponent({
   name: "IBizHtml",
   props: vue3Util.getHtmlProps(),
-  emits: vue3Util.getEditorEmits(),
+  emits: vue3Util.getHtmlEmits(),
   setup(props, {
-    emit
+    emit,
+    slots
   }) {
+    var _a;
     const ns = vue3Util.useNamespace("html");
     const c = props.controller;
+    const {
+      semanticClass,
+      semanticStyle
+    } = vue3Util.useSemanticNode(c);
+    const childClass = [{
+      class: semanticClass("editor.customToolbar"),
+      selector: ".".concat(ns.b("custom-toolbar"))
+    }, {
+      class: semanticClass("editor.customToolbar.item"),
+      selector: ".".concat(ns.be("custom-toolbar", "item"))
+    }, {
+      class: semanticClass("editor.hoverToolbar"),
+      selector: ".w-e-hover-bar"
+    }, {
+      class: semanticClass("editor.hoverToolbar.item"),
+      selector: ".w-e-hover-bar .w-e-bar-item"
+    }, {
+      class: semanticClass("editor.toolbar"),
+      selector: ".w-e-toolbar"
+    }, {
+      class: semanticClass("editor.toolbar.item"),
+      selector: ".w-e-toolbar .w-e-bar-item"
+    }, {
+      class: semanticClass("editor.input"),
+      selector: ".".concat(ns.b("editor"))
+    }, {
+      class: semanticClass("editor.footer"),
+      selector: ".".concat(ns.b("footer"))
+    }, {
+      class: semanticClass("editor.footer.cancel"),
+      selector: ".".concat(ns.be("footer", "cancel"))
+    }, {
+      class: semanticClass("editor.footer.save"),
+      selector: ".".concat(ns.be("footer", "save"))
+    }];
+    const childStyle = [{
+      style: semanticStyle("editor.customToolbar"),
+      selector: ".".concat(ns.b("custom-toolbar"))
+    }, {
+      style: semanticStyle("editor.customToolbar.item"),
+      selector: ".".concat(ns.be("custom-toolbar", "item"))
+    }, {
+      style: semanticStyle("editor.hoverToolbar"),
+      selector: ".w-e-hover-bar"
+    }, {
+      style: semanticStyle("editor.hoverToolbar.item"),
+      selector: ".w-e-hover-bar .w-e-bar-item"
+    }, {
+      style: semanticStyle("editor.toolbar"),
+      selector: ".w-e-toolbar"
+    }, {
+      style: semanticStyle("editor.toolbar.item"),
+      selector: ".w-e-toolbar .w-e-bar-item"
+    }, {
+      style: semanticStyle("editor.input"),
+      selector: ".".concat(ns.b("editor"))
+    }, {
+      style: semanticStyle("editor.footer"),
+      selector: ".".concat(ns.b("footer"))
+    }, {
+      style: semanticStyle("editor.footer.cancel"),
+      selector: ".".concat(ns.be("footer", "cancel"))
+    }, {
+      style: semanticStyle("editor.footer.save"),
+      selector: ".".concat(ns.be("footer", "save"))
+    }];
     const htmlContent = vue.ref();
     const cssVars = vue.ref({});
     let resizeObserver = null;
@@ -36,12 +105,12 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
       ...uploadHeaders
     });
     const uploadUrl = vue.ref("");
-    const downloadUrl = vue.ref("");
     const enableEdit = vue.ref(true);
     const hasEnableEdit = vue.ref(false);
     const readonlyState = vue.ref(false);
     const enableFullScreen = vue.ref(false);
     const isFullScreen = vue.ref(false);
+    let enableNoAccess = false;
     const editorModel = c.model;
     if (editorModel.editorParams) {
       if (editorModel.editorParams.enableEdit) {
@@ -60,25 +129,44 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
       if (editorModel.editorParams.enablefullscreen) {
         enableFullScreen.value = c.toBoolean(editorModel.editorParams.enablefullscreen);
       }
+      if (editorModel.editorParams.enablenoaccess) {
+        enableNoAccess = ((_a = c == null ? void 0 : c.editorParams) == null ? void 0 : _a.enablenoaccess) === "true";
+      }
     }
     if (props.readonly) {
       hasEnableEdit.value = false;
       readonlyState.value = true;
     }
+    const getDownloadUrl = (data, file) => {
+      const editorParams = {
+        ...c.editorParams,
+        enableNoAccess
+      };
+      if (editorParams.exportparams) {
+        editorParams.exportParams = JSON.parse(editorParams.exportparams);
+      }
+      if (file && file.folder) {
+        editorParams.osscat = file.folder;
+      }
+      if (editorParams.globaldownloadprifix) {
+        editorParams.globalDownloadPrifix = editorParams.globaldownloadprifix === "true";
+      } else {
+        editorParams.globalDownloadPrifix = ibiz.config.common.globalDownloadPrifix;
+      }
+      const urls = ibiz.util.file.calcFileUpDownUrl(c.context, c.params, data, editorParams);
+      return urls.downloadUrl;
+    };
     vue.watch(() => props.data, (newVal) => {
       if (newVal) {
         const editorParams = {
-          ...c.editorParams
+          ...c.editorParams,
+          enableNoAccess
         };
         if (editorParams.uploadparams) {
           editorParams.uploadParams = JSON.parse(editorParams.uploadparams);
         }
-        if (editorParams.exportparams) {
-          editorParams.exportParams = JSON.parse(editorParams.exportparams);
-        }
         const urls = ibiz.util.file.calcFileUpDownUrl(c.context, c.params, newVal, editorParams);
         uploadUrl.value = urls.uploadUrl;
-        downloadUrl.value = urls.downloadUrl;
       }
     }, {
       immediate: true,
@@ -93,13 +181,21 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
     const customParseLinkUrl = (url) => {
       return url;
     };
+    const toolbarKeys = toolbar.genDefaultToolbarKeys();
+    if (c.chatCompletion)
+      toolbarKeys.unshift(...["aichart", "|"]);
+    if (c.extraActions.length > 0) {
+      const keys = c.extraActions.map((item) => {
+        return item.uiactionId.split("@")[0];
+      });
+      toolbarKeys.push(...keys);
+    }
     const toolbarConfig = {
       excludeKeys: ["group-video", "emotion"],
-      insertKeys: {
-        index: 60,
-        keys: c.chatCompletion ? ["emoji", "|", "aichart"] : ["emoji"]
-      }
+      toolbarKeys
     };
+    const language = ibiz.i18n.getLang();
+    editor.i18nChangeLanguage(language);
     const editorConfig = {
       placeholder: c.placeHolder,
       readOnly: hasEnableEdit.value ? readonlyState.value : props.readonly,
@@ -131,6 +227,9 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
           },
           // 单个文件上传成功之后
           onSuccess(file, res) {
+            if (ibiz.config.common.enableDownloadTicket && !enableNoAccess && res.ticket) {
+              ibiz.util.file.setDownloadTicket(res.id, res.ticket);
+            }
             console.log("".concat(file.name, " \u4E0A\u4F20\u6210\u529F"), res);
           },
           // 单个文件上传失败
@@ -143,9 +242,20 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
           },
           // 自定义插入图片
           async customInsert(res, insertFn) {
-            const url = downloadUrl.value.replace("%fileId%", res.id);
+            const downloadUrl = getDownloadUrl(props.data, res);
+            let url = downloadUrl.replace("%fileId%", res.id);
             const alt = res.filename;
-            insertFn(url, alt, "");
+            if (ibiz.config.common.enableDownloadTicket && !enableNoAccess) {
+              const downloadTicket = await ibiz.util.file.getDownloadTicket(c.context, c.params, props.data, {
+                fileId: res.id
+              }, c.downloadTicketParams);
+              if (downloadTicket && downloadTicket.ticket) {
+                url = downloadUrl.replace("%fileId%", downloadTicket.ticket);
+                insertFn(url, alt, "");
+              }
+            } else {
+              insertFn(url, alt, "");
+            }
           }
         },
         // 插入链接
@@ -162,7 +272,8 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
           parseLinkUrl: customParseLinkUrl
           // 也支持 async 函数
         }
-      }
+      },
+      hoverbarKeys: inlineAiModule.hoverbarKeysEx
     };
     vue.onBeforeUnmount(() => {
       const editor = editorRef.value;
@@ -175,26 +286,32 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
       const appDataEntityId = c.model.appDataEntityId;
       if (!appDataEntityId || !c.deACMode)
         return;
-      const {
-        contentToolbarItems,
-        footerToolbarItems,
-        questionToolbarItems,
-        otherToolbarItems
-      } = aiUtil.calcAiToolbarItemsByAc(c.deACMode);
       const {
         zIndex
       } = vue3Util.useUIStore();
       const containerZIndex = zIndex.increment();
-      const module = await import('@ibiz-template-plugin/ai-chat');
-      chatInstance = module.chat || module.default.chat;
-      let id = "";
-      let abortController;
+      chatInstance = await ibiz.aiChatUtil.getAIChat();
+      const {
+        containerOptions,
+        chatOptions
+      } = await ibiz.aiChatUtil.getEditorExAIChatParams(c.editorParams, c.context, c.params, props.data, c.deACMode, {
+        chatInstance,
+        view: c.view,
+        ctrl: c.ctrl
+      });
+      const resourceOptions = await ibiz.aiChatUtil.getAIResourceOptions(c.context, c.params);
+      let chatCaption = c.deACMode.logicName;
+      if (c.editorParams.srfaichatcaption) {
+        chatCaption = ibiz.appUtil.resolveI18nText(c.editorParams.srfaichatcaption);
+      }
       chatInstance.create({
+        resourceOptions,
         containerOptions: {
-          zIndex: containerZIndex
+          zIndex: containerZIndex,
+          ...containerOptions
         },
         chatOptions: {
-          caption: c.deACMode.logicName,
+          caption: chatCaption,
           context: {
             ...c.context
           },
@@ -203,77 +320,7 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
             srfactag: c.deACMode.codeName
           },
           appDataEntityId,
-          contentToolbarItems,
-          footerToolbarItems,
-          questionToolbarItems,
-          otherToolbarItems,
-          // 编辑器参数srfaiappendcurdata，是否传入对象参数，用于历史查询传参
-          appendCurData: c.editorParams.srfaiappendcurdata === "true" ? props.data : void 0,
-          // 编辑器参数srfaiappendcurcontent，传入编辑内容作为用户消息,获取历史数据后附加
-          appendCurContent: c.editorParams.srfaiappendcurcontent ? core.StringUtil.fill(c.editorParams.srfaiappendcurcontent, c.context, c.params, props.data) : void 0,
-          question: async (aiChat, ctx, param, other, arr) => {
-            id = qxUtil.createUUID();
-            abortController = new AbortController();
-            const deService = await ibiz.hub.getApp(ctx.srfappid).deService.getService(ctx, other.appDataEntityId);
-            try {
-              await deService.aiChatSse((msg) => {
-                if (msg.actionstate === 20 && msg.actionresult) {
-                  aiChat.addMessage({
-                    messageid: id,
-                    state: msg.actionstate,
-                    type: "DEFAULT",
-                    role: "ASSISTANT",
-                    content: msg.actionresult
-                  });
-                } else if (msg.actionstate === 30 && msg.actionresult) {
-                  const result = JSON.parse(msg.actionresult);
-                  const choices = result.choices;
-                  if (choices && choices.length > 0) {
-                    aiChat.replaceMessage({
-                      messageid: id,
-                      state: msg.actionstate,
-                      type: "DEFAULT",
-                      role: "ASSISTANT",
-                      content: choices[0].content || ""
-                    });
-                  }
-                } else if (msg.actionstate === 40) {
-                  aiChat.replaceMessage({
-                    messageid: id,
-                    state: msg.actionstate,
-                    type: "ERROR",
-                    role: "ASSISTANT",
-                    content: msg.actionresult
-                  });
-                }
-              }, abortController, ctx, param, {
-                messages: arr
-              });
-            } catch (error) {
-              aiChat.replaceMessage({
-                messageid: id,
-                state: 40,
-                type: "ERROR",
-                role: "ASSISTANT",
-                content: error.message || ibiz.i18n.t("app.aiError")
-              });
-              abortController == null ? void 0 : abortController.abort();
-            } finally {
-              aiChat.completeMessage(id, true);
-              return true;
-            }
-          },
-          abortQuestion: async (aiChat) => {
-            abortController == null ? void 0 : abortController.abort();
-            await aiChat.stopMessage({
-              messageid: id,
-              state: 30,
-              type: "DEFAULT",
-              role: "ASSISTANT",
-              content: ""
-            });
-            await aiChat.completeMessage(id, true);
-          },
+          ...chatOptions,
           action: (action, message) => {
             if (action === "backfill") {
               if (hasEnableEdit.value) {
@@ -282,94 +329,6 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
                 emit("change", message.realcontent);
               }
             }
-          },
-          history: async (ctx, param, other) => {
-            const deService = await ibiz.hub.getApp(ctx.srfappid).deService.getService(ctx, other.appDataEntityId);
-            const historyData = other.appendCurData ? other.appendCurData : {};
-            const result = await deService.aiChatHistory(ctx, param, historyData);
-            if (result.data && Array.isArray(result.data)) {
-              let preMsg;
-              result.data.forEach((item) => {
-                if (item.role === "TOOL") {
-                  if (preMsg && item.content) {
-                    chatInstance.aiChat.updateRecommendPrompt(preMsg, item.content);
-                  }
-                } else {
-                  const msg = {
-                    messageid: qxUtil.createUUID(),
-                    state: 30,
-                    type: "DEFAULT",
-                    role: item.role,
-                    content: item.content,
-                    completed: true
-                  };
-                  preMsg = msg;
-                  chatInstance.aiChat.addMessage(msg);
-                }
-              });
-            }
-            return true;
-          },
-          recommendPrompt: async (ctx, param, other) => {
-            const deService = await ibiz.hub.getApp(ctx.srfappid).deService.getService(ctx, other.appDataEntityId);
-            const result = await deService.aiChatRecommendPrompt(ctx, param, other.message);
-            if (result.ok && result.data) {
-              const choices = result.data.choices;
-              if (choices && choices.length > 0) {
-                return choices[0];
-              }
-              return null;
-            }
-            return null;
-          },
-          uploader: {
-            onUpload: async (file, reportProgress, options) => {
-              const fileMeata = ibiz.util.file.calcFileUpDownUrl((options == null ? void 0 : options.context) || c.context, (options == null ? void 0 : options.params) || c.params, {});
-              const fielUploadHeaders = ibiz.util.file.getUploadHeaders();
-              const formData = new FormData();
-              formData.append("file", file);
-              const res = await ibiz.net.axios({
-                url: fileMeata.uploadUrl,
-                method: "post",
-                headers: fielUploadHeaders,
-                data: formData,
-                onUploadProgress: (progressEvent) => {
-                  const percent = progressEvent.loaded / progressEvent.total * 100;
-                  reportProgress(percent);
-                }
-              });
-              return res.data;
-            }
-          },
-          extendToolbarClick: async (event, source, context, params, data) => {
-            var _a, _b;
-            const result = await runtime.UIActionUtil.exec(source.id, {
-              view: c.view,
-              ctrl: c.ctrl,
-              context: core.IBizContext.create(context),
-              params,
-              data: [data],
-              event
-            }, source.appId);
-            if (result.closeView) {
-              c.view.closeView({
-                ok: true
-              });
-            } else if (result.refresh) {
-              switch (result.refreshMode) {
-                case 1:
-                  c.view.callUIAction(runtime.SysUIActionTag.REFRESH);
-                  break;
-                case 2:
-                  (_a = c.view.parentView) == null ? void 0 : _a.callUIAction(runtime.SysUIActionTag.REFRESH);
-                  break;
-                case 3:
-                  (_b = c.view.getTopView()) == null ? void 0 : _b.callUIAction(runtime.SysUIActionTag.REFRESH);
-                  break;
-                default:
-              }
-            }
-            return result;
           }
         }
       });
@@ -381,6 +340,50 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
       editor.on("aiClick", () => {
         onClickAI();
       });
+      editor.on("lineAiClick", () => {
+        const container = editor.getEditableContainer();
+        const hoverToolbar = container.querySelector(".w-e-hover-bar");
+        if (!hoverToolbar) {
+          return;
+        }
+        const {
+          offsetLeft,
+          offsetTop,
+          offsetHeight
+        } = hoverToolbar;
+        const items = ibiz.inLineAIUtil.calcContextMenus(c.deACMode, (tag) => {
+          c.doInLineAIUIAction(tag, c.model.appId);
+        });
+        if (items.length === 0)
+          return;
+        const editorBoundingClientRect = editor.getEditableContainer().getBoundingClientRect();
+        const {
+          zIndex
+        } = vue3Util.useUIStore();
+        const popoverZIndex = zIndex.increment();
+        ibiz.inLineAIUtil.showContextMenus(
+          // 编辑器的左侧距离+选区距离编辑器左侧距离
+          editorBoundingClientRect.x + offsetLeft,
+          // 编辑器的上方距离+选区距离编辑器上方距离+悬浮工具栏高度
+          editorBoundingClientRect.y + offsetTop + offsetHeight,
+          items,
+          {
+            zIndex: popoverZIndex,
+            onClose: () => {
+              zIndex.decrement();
+            }
+          }
+        );
+      });
+      editor.on("customAction", async (model) => {
+        const data = await c.doCustomUIAction(model.uiactionId, c.model.appId);
+        if (data.length > 0) {
+          emit("customAction", {
+            tag: model.uiactionId,
+            data
+          });
+        }
+      });
     };
     const handleChange = (editor) => {
       const html = editor.getHtml();
@@ -466,7 +469,8 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
             const height = entries[0].contentRect.height;
             if (height !== lastToolbarHeight) {
               const tempCssVars = {
-                height: "".concat(htmlContentHeight - entries[0].contentRect.height + (height !== 0 ? 300 : 0), "px")
+                height: "".concat(htmlContentHeight - entries[0].contentRect.height + (height !== 0 ? 300 : 0), "px"),
+                "toolbar-height": "".concat(height, "px")
               };
               cssVars.value = ns.cssVarBlock(tempCssVars);
               lastToolbarHeight = height;
@@ -477,11 +481,11 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
       });
     };
     const moveToLastStr = () => {
-      var _a, _b;
+      var _a2, _b;
       if (props.value) {
         const index = props.value.indexOf("</p>");
         if (index >= 0) {
-          const offset = (_a = editorRef.value.selection.anchor) == null ? void 0 : _a.offset;
+          const offset = (_a2 = editorRef.value.selection.anchor) == null ? void 0 : _a2.offset;
           const path = (_b = editorRef.value.selection.anchor) == null ? void 0 : _b.path;
           if (offset === 0 && path.length > 0 && path[0] === 0) {
             editorRef.value.move(index - 3);
@@ -566,14 +570,14 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
       if (enableFullScreen.value) {
         if (isFullScreen.value) {
           return vue.createVNode("i", {
-            "class": "fa fa-compress",
+            "class": ["fa fa-compress", ns.be("custom-toolbar", "item")],
             "aria-hidden": "true",
             "title": ibiz.i18n.t("editor.html.reduce"),
             "onClick": () => changeFullScreenState()
           }, null);
         }
         return vue.createVNode("i", {
-          "class": "fa fa-expand",
+          "class": ["fa fa-expand", ns.be("custom-toolbar", "item")],
           "aria-hidden": "true",
           "title": ibiz.i18n.t("editor.html.expand"),
           "onClick": () => changeFullScreenState()
@@ -586,8 +590,8 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
         return vue.createVNode("div", {
           "class": ns.b("custom-toolbar")
         }, [hasEnableEdit.value && enableEdit.value && readonlyState.value ? vue.createVNode("i", {
-          "class": "fa fa-edit",
           "aria-hidden": "true",
+          "class": ["fa fa-edit", ns.be("custom-toolbar", "item")],
           "title": ibiz.i18n.t("editor.html.enableedit"),
           "onClick": () => changeEditState()
         }, null) : null, isAllowRenderFullScreen()]);
@@ -596,10 +600,15 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
     };
     const renderEditorContent = () => {
       return vue.createVNode("div", {
-        "class": ns.b("content"),
         "ref": "htmlContent",
-        "style": cssVars.value
-      }, [vue.createVNode(editorForVue.Toolbar, {
+        "class": [ns.b("content"), ns.is("editing", !readonlyState.value), semanticClass("editor.content")],
+        "style": {
+          ...cssVars.value,
+          ...semanticStyle("editor.content")
+        }
+      }, [slots.editorSwitchMenu ? vue.createVNode("div", {
+        "class": ns.b("menu")
+      }, [slots.editorSwitchMenu()]) : null, vue.createVNode(editorForVue.Toolbar, {
         "ref": "toolbarRef",
         "editor": editorRef.value,
         "default-config": toolbarConfig,
@@ -634,52 +643,59 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
     });
     return {
       ns,
-      editorRef,
-      mode: "default",
+      cssVars,
       valueHtml,
-      toolbarConfig,
+      editorRef,
+      childClass,
+      childStyle,
+      toolbarRef,
+      htmlContent,
       editorConfig,
-      handleCreated,
-      handleChange,
-      handleDestroyed,
-      handleFocus,
+      isFullScreen,
+      hasEnableEdit,
+      toolbarConfig,
+      readonlyState,
+      semanticClass,
+      semanticStyle,
+      mode: "default",
+      enable,
+      disable,
+      printHtml,
+      insertText,
       handleBlur,
+      handleFocus,
       customAlert,
       customPaste,
-      insertText,
-      printHtml,
-      disable,
-      enable,
+      handleChange,
+      renderFooter,
+      handleCreated,
+      handleDestroyed,
       renderHeaserToolbar,
       renderEditorContent,
-      renderFooter,
-      htmlContent,
-      hasEnableEdit,
-      cssVars,
-      toolbarRef,
-      isFullScreen,
-      readonlyState,
       changeFullScreenState
     };
   },
   render() {
-    return !this.isFullScreen ? vue.createVNode("div", {
-      "class": [this.ns.b(), {
+    const isShowEditorSwitchMenu = !!this.$slots.editorSwitchMenu;
+    return !this.isFullScreen ? vue.withDirectives(vue.createVNode("div", {
+      "class": [this.ns.b(), this.semanticClass("editor.root"), {
         [this.ns.b("editor-readonly")]: this.readonlyState
-      }, this.ns.is("show-ai", true)]
-    }, [this.renderHeaserToolbar(), this.renderEditorContent(), this.hasEnableEdit && !this.readonlyState ? this.renderFooter() : null]) : vue.createVNode(vue.resolveComponent("el-dialog"), {
+      }, this.ns.is("show-ai", true), this.ns.is("enable-edit", !this.readonly && !this.disabled), this.ns.is("show-editor-switch-menu", isShowEditorSwitchMenu)],
+      "style": this.semanticStyle("editor.root")
+    }, [this.renderHeaserToolbar(), this.renderEditorContent(), this.hasEnableEdit && !this.readonlyState ? this.renderFooter() : null]), [[vue.resolveDirective("child-class"), this.childClass], [vue.resolveDirective("child-style"), this.childStyle]]) : vue.createVNode(vue.resolveComponent("el-dialog"), {
       "modelValue": this.isFullScreen,
       "onUpdate:modelValue": ($event) => this.isFullScreen = $event,
       "width": "80%",
       "top": "10vh",
-      "class": this.ns.b("dialog-full-screen"),
+      "class": [this.ns.b("dialog-full-screen"), this.ns.is("editing", !this.readonlyState)],
       "onClose": () => this.changeFullScreenState()
     }, {
-      default: () => [vue.createVNode("div", {
-        "class": [this.ns.b(), {
+      default: () => [vue.withDirectives(vue.createVNode("div", {
+        "class": [this.ns.b(), this.semanticClass("editor.root"), {
           [this.ns.b("editor-readonly")]: this.readonlyState
-        }]
-      }, [this.renderHeaserToolbar(), this.renderEditorContent(), this.hasEnableEdit && !this.readonlyState ? this.renderFooter() : null])]
+        }, this.ns.is("show-editor-switch-menu", isShowEditorSwitchMenu)],
+        "style": this.semanticStyle("editor.root")
+      }, [this.renderHeaserToolbar(), this.renderEditorContent(), this.hasEnableEdit && !this.readonlyState ? this.renderFooter() : null]), [[vue.resolveDirective("child-class"), this.childClass], [vue.resolveDirective("child-style"), this.childStyle]])]
     });
   }
 });