npm - @maketribe/ms-app - Versions diffs - 3.2.23 → 3.2.25 - Mend

@maketribe/ms-app 3.2.23 → 3.2.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1003) hide show

package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue.js CHANGED Viewed

@@ -1,9 +1,13 @@
 import { defineComponent, ref, watch, onMounted, onUnmounted, resolveComponent, openBlock, createElementBlock, Fragment, createVNode, withCtx, renderList, unref, createBlock, normalizeClass, createElementVNode, normalizeStyle, toDisplayString, createTextVNode } from "vue";
 import { $getSelection, FORMAT_TEXT_COMMAND, FORMAT_ELEMENT_COMMAND, $isRangeSelection, $isRootOrShadowRoot } from "lexical";
 import { $patchStyleText, $getSelectionStyleValueForProperty } from "@lexical/selection";
+import { TOGGLE_LINK_COMMAND, $isLinkNode } from "@lexical/link";
+import { sanitizeUrl } from "../../utils/url.js";
+import { getSelectedNode } from "../../utils/getSelectedNode.js";
 import { mergeRegister, $findMatchingParent } from "@lexical/utils";
 import { useLexicalComposer } from "lexical-vue";
 import { FONT_FAMILY_OPTIONS, FONT_SIZE_OPTIONS, ROOT_FONT_SIZE } from "./FontStyleDefines.js";
+import { ShowLinkEditPanel } from "../AutoLinkPlugin/LinkEditDialog.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "FontStyleTool",
   setup(__props) {
@@ -19,13 +23,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const alignList = ref(["left", "center", "right", "justify"]);
     const alignValue = ref(alignList.value[0]);
     const disabled = ref(false);
+    const isLink = ref(false);
+    const linkValue = ref("");
+    async function insertLink() {
+      const result = await ShowLinkEditPanel(linkValue.value);
+      if (result.trim()) {
+        editor.dispatchCommand(TOGGLE_LINK_COMMAND, sanitizeUrl(result));
+      } else {
+        editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);
+      }
+    }
     function updateToolbar() {
       const selection = $getSelection();
       if ($isRangeSelection(selection)) {
         const anchorNode = selection.anchor.getNode();
         let element = anchorNode.getKey() === "root" ? anchorNode : $findMatchingParent(anchorNode, (e) => {
-          const parent = e.getParent();
-          return parent !== null && $isRootOrShadowRoot(parent);
+          const parent2 = e.getParent();
+          return parent2 !== null && $isRootOrShadowRoot(parent2);
         });
         if (element === null) {
           element = anchorNode.getTopLevelElementOrThrow();
@@ -50,6 +64,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         bgColor.value = $getSelectionStyleValueForProperty(selection, "background-color", "#fff");
         fontFamily.value = FONT_FAMILY_OPTIONS.find((item) => item.value == ff) || FONT_FAMILY_OPTIONS[0];
         disabled.value = false;
+        const node = getSelectedNode(selection);
+        const parent = node.getParent();
+        isLink.value = $isLinkNode(parent) || $isLinkNode(node);
+        if (isLink.value) {
+          linkValue.value = $isLinkNode(parent) ? parent.getURL() : node.getURL();
+        } else {
+          linkValue.value = "";
+        }
       } else {
         disabled.value = true;
       }
@@ -316,7 +338,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             }, 8, ["style", "disabled"])
           ]),
           _: 1
-        }, 8, ["disabled"])
+        }, 8, ["disabled"]),
+        createVNode(_component_el_divider, { direction: "vertical" }),
+        createVNode(_component_el_button_group, null, {
+          default: withCtx(() => [
+            createVNode(_component_el_button, {
+              text: "",
+              disabled: disabled.value,
+              class: normalizeClass(`${isLink.value ? "active" : ""}`),
+              onClick: insertLink
+            }, {
+              default: withCtx(() => [
+                createVNode(_component_MKSvgIcon, { iconClass: "doc-link" })
+              ]),
+              _: 1
+            }, 8, ["disabled", "class"])
+          ]),
+          _: 1
+        })
       ], 64);
     };
   }

package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FontStyleTool.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport {\r\n $getSelection,\r\n $isRangeSelection,\r\n $isRootOrShadowRoot,\r\n FORMAT_TEXT_COMMAND,\r\n FORMAT_ELEMENT_COMMAND,\r\n SELECTION_CHANGE_COMMAND,\r\n type CommandListenerPriority,\r\n type ElementFormatType\r\n} from 'lexical'\r\nimport {\r\n $getSelectionStyleValueForProperty,\r\n $patchStyleText,\r\n} from '@lexical/selection'\r\nimport { $findMatchingParent,mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { onMounted, onUnmounted, ref,watch } from 'vue'\r\nimport { FONT_SIZE_OPTIONS,ROOT_FONT_SIZE,FONT_FAMILY_OPTIONS } from \"./FontStyleDefines\"\r\n\r\nconst editor = useLexicalComposer()\r\nconst fontSize = ref('14px')\r\nconst fontColor = ref<string>('#000')\r\nconst bgColor = ref<string>('#fff')\r\nconst fontFamily = ref<any>(FONT_FAMILY_OPTIONS[0])\r\nconst isBold = ref(false)\r\nconst isItalic = ref(false)\r\nconst isUnderline = ref(false)\r\nconst isStrikethrough = ref(false)\r\n\r\n\r\nconst lowPriority: CommandListenerPriority = 1\r\n\r\n// 对齐方式\r\nconst alignList = ref<ElementFormatType[]>([\"left\",\"center\",\"right\",\"justify\"])\r\nconst alignValue = ref(alignList.value[0])\r\nconst disabled = ref(false)\r\n\r\n\r\n// 更新状态栏\r\nfunction updateToolbar() {\r\n\r\n const selection = $getSelection()\r\n\r\n if ($isRangeSelection(selection)) {\r\n\r\n const anchorNode = selection.anchor.getNode()\r\n\r\n let element = anchorNode.getKey() === 'root'\r\n ? anchorNode\r\n : $findMatchingParent(anchorNode, (e) => {\r\n const parent = e.getParent()\r\n return parent !== null && $isRootOrShadowRoot(parent)\r\n });\r\n\r\n\r\n if (element === null){\r\n element = anchorNode.getTopLevelElementOrThrow()\r\n }\r\n\r\n let elementDOM = editor.getElementByKey(element.getKey());\r\n\r\n // 文本对齐\r\n alignValue.value = (elementDOM?.style.textAlign as ElementFormatType) \|\| \"left\";\r\n\r\n if(alignValue.value == \"start\"){ alignValue.value = \"left\"; }\r\n else if(alignValue.value == \"end\"){ alignValue.value = \"right\"; }\r\n\r\n // Update text format\r\n isBold.value = selection.hasFormat('bold')\r\n isItalic.value = selection.hasFormat('italic')\r\n isUnderline.value = selection.hasFormat('underline')\r\n isStrikethrough.value = selection.hasFormat('strikethrough')\r\n\r\n // Handle buttons\r\n var ff = $getSelectionStyleValueForProperty(selection, 'font-family', 'Arial');\r\n let fs = $getSelectionStyleValueForProperty(selection, 'font-size', '1rem');\r\n \r\n if(fs){\r\n fontSize.value = Math.round(parseFloat(fs) * ROOT_FONT_SIZE)+\"px\"\r\n }\r\n \r\n fontColor.value = $getSelectionStyleValueForProperty(selection, 'color', '#000')\r\n bgColor.value = $getSelectionStyleValueForProperty(selection, 'background-color', '#fff')\r\n fontFamily.value = FONT_FAMILY_OPTIONS.find(item=>item.value==ff) \|\| FONT_FAMILY_OPTIONS[0];\r\n\r\n disabled.value = false;\r\n }\r\n else{\r\n\r\n disabled.value = true;\r\n }\r\n}\r\n\r\n// 文字样式\r\nconst fontStyleHandle = (data : any,styleName?:any)=>{\r\n fontSize.value = data.label;\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null) {\r\n $patchStyleText(selection, {\r\n [styleName \|\| \"font-size\"]:data.value\r\n })\r\n }\r\n })\r\n}\r\n\r\n// 字体颜色\r\nwatch(fontColor,(color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { color })\r\n }\r\n },{})\r\n})\r\n\r\n// bg颜色\r\nwatch(bgColor,(color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { 'background-color':color })\r\n }\r\n },{})\r\n})\r\n\r\n// 挂载的时候\r\nonMounted(() => {\r\n\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => updateToolbar())\r\n }),\r\n // editor.registerCommand(SELECTION_CHANGE_COMMAND, (_payload, _newEditor) => updateToolbar()!,lowPriority)\r\n )\r\n\r\n onUnmounted(() => unregisterMergeListener());\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n <!-- 字体 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n {{fontFamily.label}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontFamily.label == item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_FAMILY_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item,'font-family')\">\r\n <span :style=\"{fontFamily:item.value}\">\r\n {{item.label}}\r\n </span>\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体大小 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :disabled=\"disabled\">\r\n {{fontSize}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontSize==item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_SIZE_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item)\">{{item.label}}</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__fontcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"fontColor\" :disabled=\"disabled\" />\r\n </el-button>\r\n <!-- 背景颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__bgcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"bgColor\" :disabled=\"disabled\" />\r\n <MKSvgIcon class=\"view\" iconClass=\"doc-background-color\" /> \r\n </el-button>\r\n\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isBold ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'bold')\">\r\n <MKSvgIcon iconClass=\"doc-bold\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isItalic ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'italic')\">\r\n <MKSvgIcon iconClass=\"doc-italic\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isUnderline ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'underline')\">\r\n <MKSvgIcon iconClass=\"doc-underline\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isStrikethrough ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'strikethrough')\">\r\n <MKSvgIcon iconClass=\"doc-strikethrough\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${alignValue}`\" style=\"font-size: 18px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :disabled=\"disabled\" :class=\"{active:alignValue == item}\" v-for=\"item in alignList\" :value=\"item\" @click=\"editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, item)\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${item}`\" style=\"font-size: 18px;\" /> \r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n</template>\r\n"],"names":[],"mappings":";;;;;;;;;AAoBA,UAAM,SAAS;AACT,UAAA,WAAW,IAAI,MAAM;AACrB,UAAA,YAAY,IAAY,MAAM;AAC9B,UAAA,UAAU,IAAY,MAAM;AAClC,UAAM,aAAa,IAAS,oBAAoB,CAAC,CAAC;AAC5C,UAAA,SAAS,IAAI,KAAK;AAClB,UAAA,WAAW,IAAI,KAAK;AACpB,UAAA,cAAc,IAAI,KAAK;AACvB,UAAA,kBAAkB,IAAI,KAAK;AAMjC,UAAM,YAAY,IAAyB,CAAC,QAAO,UAAS,SAAQ,SAAS,CAAC;AAC9E,UAAM,aAAa,IAAI,UAAU,MAAM,CAAC,CAAC;AACnC,UAAA,WAAW,IAAI,KAAK;AAI1B,aAAS,gBAAgB;AAEvB,YAAM,YAAY;AAEd,UAAA,kBAAkB,SAAS,GAAG;AAE1B,cAAA,aAAa,UAAU,OAAO,QAAQ;AAExC,YAAA,UAAU,WAAW,aAAa,SAC9B,aACA,oBAAoB,YAAY,CAAC,MAAM;AACjC,gBAAA,SAAS,EAAE;AACV,iBAAA,WAAW,QAAQ,oBAAoB,MAAM;AAAA,QAAA,CACrD;AAGP,YAAI,YAAY,MAAK;AACnB,oBAAU,WAAW;QACvB;AAEA,YAAI,aAAa,OAAO,gBAAgB,QAAQ,OAAQ,CAAA;AAG7C,mBAAA,SAAS,yCAAY,MAAM,cAAmC;AAEtE,YAAA,WAAW,SAAU,SAAQ;AAAE,qBAAW,QAAS;AAAA,QAAA,WAC9C,WAAW,SAAU,OAAM;AAAE,qBAAW,QAAS;AAAA,QAAS;AAG3D,eAAA,QAAQ,UAAU,UAAU,MAAM;AAChC,iBAAA,QAAQ,UAAU,UAAU,QAAQ;AACjC,oBAAA,QAAQ,UAAU,UAAU,WAAW;AACnC,wBAAA,QAAQ,UAAU,UAAU,eAAe;AAG3D,YAAI,KAAK,mCAAmC,WAAW,eAAe,OAAO;AAC7E,YAAI,KAAK,mCAAmC,WAAW,aAAa,MAAM;AAE1E,YAAG,IAAG;AACH,mBAAS,QAAQ,KAAK,MAAM,WAAW,EAAE,IAAI,cAAc,IAAE;AAAA,QAChE;AAEA,kBAAU,QAAQ,mCAAmC,WAAW,SAAS,MAAM;AAC/E,gBAAQ,QAAQ,mCAAmC,WAAW,oBAAoB,MAAM;AAC7E,mBAAA,QAAQ,oBAAoB,KAAK,CAAA,SAAM,KAAK,SAAO,EAAE,KAAK,oBAAoB,CAAC;AAE1F,iBAAS,QAAQ;AAAA,MAAA,OAEf;AAEF,iBAAS,QAAQ;AAAA,MACnB;AAAA,IACF;AAGM,UAAA,kBAAkB,CAAC,MAAW,cAAiB;AACnD,eAAS,QAAQ,KAAK;AACtB,aAAO,OAAO,MAAM;AAClB,cAAM,YAAY;AAClB,YAAI,cAAc,MAAM;AACtB,0BAAgB,WAAW;AAAA,YACzB,CAAC,aAAa,WAAW,GAAE,KAAK;AAAA,UAAA,CACjC;AAAA,QACH;AAAA,MAAA,CACD;AAAA,IAAA;AAIG,UAAA,WAAU,CAAC,UAAY;AAC3B,aAAO,OAAO,MAAM;AAChB,cAAM,YAAY;AAClB,YAAI,cAAc,MAAK;AACL,0BAAA,WAAW,EAAE,MAAA,CAAO;AAAA,QACtC;AAAA,MACF,GAAE,CAAE,CAAA;AAAA,IAAA,CACP;AAGK,UAAA,SAAQ,CAAC,UAAY;AACzB,aAAO,OAAO,MAAM;AAChB,cAAM,YAAY;AAClB,YAAI,cAAc,MAAK;AACrB,0BAAgB,WAAW,EAAE,oBAAmB,MAAO,CAAA;AAAA,QACzD;AAAA,MACF,GAAE,CAAE,CAAA;AAAA,IAAA,CACP;AAGD,cAAU,MAAM;AAEd,YAAM,0BAA0B;AAAA,QAC9B,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACrC,sBAAA,KAAK,MAAM,cAAA,CAAe;AAAA,QAAA,CACvC;AAAA;AAAA,MAAA;AAIS,kBAAA,MAAM,yBAAyB;AAAA,IAAA,CAC5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"FontStyleTool.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport {\r\n $getSelection,\r\n $isRangeSelection,\r\n $isRootOrShadowRoot,\r\n $isParagraphNode,\r\n FORMAT_TEXT_COMMAND,\r\n FORMAT_ELEMENT_COMMAND,\r\n type ElementFormatType,\r\n} from 'lexical'\r\nimport {\r\n $getSelectionStyleValueForProperty,\r\n $patchStyleText,\r\n} from '@lexical/selection'\r\n\r\nimport { $isLinkNode, TOGGLE_LINK_COMMAND,LinkNode } from '@lexical/link'\r\nimport { sanitizeUrl } from '../../utils/url'\r\nimport { getSelectedNode } from '../../utils/getSelectedNode'\r\nimport { $findMatchingParent,mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { onMounted, onUnmounted, ref,watch } from 'vue'\r\nimport { FONT_SIZE_OPTIONS,ROOT_FONT_SIZE,FONT_FAMILY_OPTIONS } from \"./FontStyleDefines\"\r\nimport { ShowLinkEditPanel } from \"../AutoLinkPlugin/LinkEditDialog\";\r\n\r\nconst editor = useLexicalComposer()\r\nconst fontSize = ref('14px')\r\nconst fontColor = ref<string>('#000')\r\nconst bgColor = ref<string>('#fff')\r\nconst fontFamily = ref<any>(FONT_FAMILY_OPTIONS[0])\r\nconst isBold = ref(false)\r\nconst isItalic = ref(false)\r\nconst isUnderline = ref(false)\r\nconst isStrikethrough = ref(false)\r\n\r\n// 对齐方式\r\nconst alignList = ref<ElementFormatType[]>([\"left\",\"center\",\"right\",\"justify\"])\r\nconst alignValue = ref(alignList.value[0])\r\nconst disabled = ref(false)\r\nconst isLink = ref(false)\r\nconst linkValue = ref(\"\");\r\n\r\nasync function insertLink() {\r\n\r\n const result:any = await ShowLinkEditPanel(linkValue.value);\r\n\r\n if(result.trim()){\r\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, sanitizeUrl(result))\r\n }\r\n else{\r\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null)\r\n }\r\n}\r\n\r\n// 更新状态栏\r\nfunction updateToolbar() {\r\n\r\n const selection = $getSelection()\r\n\r\n if ($isRangeSelection(selection)) {\r\n\r\n const anchorNode = selection.anchor.getNode()\r\n\r\n let element = anchorNode.getKey() === 'root'\r\n ? anchorNode\r\n : $findMatchingParent(anchorNode, (e) => {\r\n const parent = e.getParent()\r\n return parent !== null && $isRootOrShadowRoot(parent)\r\n });\r\n\r\n\r\n if (element === null){\r\n element = anchorNode.getTopLevelElementOrThrow()\r\n }\r\n\r\n let elementDOM = editor.getElementByKey(element.getKey());\r\n\r\n // 文本对齐\r\n alignValue.value = (elementDOM?.style.textAlign as ElementFormatType) \|\| \"left\";\r\n\r\n if(alignValue.value == \"start\"){ alignValue.value = \"left\"; }\r\n else if(alignValue.value == \"end\"){ alignValue.value = \"right\"; }\r\n\r\n // Update text format\r\n isBold.value = selection.hasFormat('bold')\r\n isItalic.value = selection.hasFormat('italic')\r\n isUnderline.value = selection.hasFormat('underline')\r\n isStrikethrough.value = selection.hasFormat('strikethrough')\r\n\r\n // Handle buttons\r\n var ff = $getSelectionStyleValueForProperty(selection, 'font-family', 'Arial');\r\n let fs = $getSelectionStyleValueForProperty(selection, 'font-size', '1rem');\r\n \r\n if(fs){\r\n fontSize.value = Math.round(parseFloat(fs) * ROOT_FONT_SIZE)+\"px\"\r\n }\r\n \r\n fontColor.value = $getSelectionStyleValueForProperty(selection, 'color', '#000')\r\n bgColor.value = $getSelectionStyleValueForProperty(selection, 'background-color', '#fff')\r\n fontFamily.value = FONT_FAMILY_OPTIONS.find(item=>item.value==ff) \|\| FONT_FAMILY_OPTIONS[0];\r\n\r\n disabled.value = false;\r\n\r\n // Update links\r\n const node = getSelectedNode(selection)\r\n const parent = node.getParent()\r\n isLink.value = $isLinkNode(parent) \|\| $isLinkNode(node)\r\n if(isLink.value){\r\n linkValue.value = $isLinkNode(parent) ? parent.getURL() : (node as LinkNode).getURL()\r\n }\r\n else{\r\n linkValue.value = \"\";\r\n }\r\n }\r\n else{\r\n\r\n disabled.value = true;\r\n }\r\n}\r\n\r\n// 文字样式\r\nconst fontStyleHandle = (data : any,styleName?:any)=>{\r\n fontSize.value = data.label;\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null) {\r\n $patchStyleText(selection, {\r\n [styleName \|\| \"font-size\"]:data.value\r\n })\r\n }\r\n })\r\n}\r\n\r\n// 字体颜色\r\nwatch(fontColor,(color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { color })\r\n }\r\n },{})\r\n})\r\n\r\n// bg颜色\r\nwatch(bgColor,(color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { 'background-color':color })\r\n }\r\n },{})\r\n})\r\n\r\n// 挂载的时候\r\nonMounted(() => {\r\n\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => updateToolbar())\r\n }),\r\n // editor.registerCommand(SELECTION_CHANGE_COMMAND, (_payload, _newEditor) => updateToolbar()!,lowPriority)\r\n )\r\n\r\n onUnmounted(() => unregisterMergeListener());\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n <!-- 字体 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n {{fontFamily.label}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontFamily.label == item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_FAMILY_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item,'font-family')\">\r\n <span :style=\"{fontFamily:item.value}\">\r\n {{item.label}}\r\n </span>\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体大小 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :disabled=\"disabled\">\r\n {{fontSize}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontSize==item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_SIZE_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item)\">{{item.label}}</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__fontcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"fontColor\" :disabled=\"disabled\" />\r\n </el-button>\r\n <!-- 背景颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__bgcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"bgColor\" :disabled=\"disabled\" />\r\n <MKSvgIcon class=\"view\" iconClass=\"doc-background-color\" /> \r\n </el-button>\r\n\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isBold ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'bold')\">\r\n <MKSvgIcon iconClass=\"doc-bold\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isItalic ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'italic')\">\r\n <MKSvgIcon iconClass=\"doc-italic\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isUnderline ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'underline')\">\r\n <MKSvgIcon iconClass=\"doc-underline\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isStrikethrough ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'strikethrough')\">\r\n <MKSvgIcon iconClass=\"doc-strikethrough\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${alignValue}`\" style=\"font-size: 18px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :disabled=\"disabled\" :class=\"{active:alignValue == item}\" v-for=\"item in alignList\" :value=\"item\" @click=\"editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, item)\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${item}`\" style=\"font-size: 18px;\" /> \r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" />\r\n <!-- 链接 -->\r\n <el-button-group>\r\n <el-button text :disabled=\"disabled\" :class=\"`${isLink ? 'active' : ''}`\" @click=\"insertLink\">\r\n <MKSvgIcon iconClass=\"doc-link\" /> \r\n </el-button>\r\n </el-button-group>\r\n</template>\r\n"],"names":["parent"],"mappings":"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"}

package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js CHANGED Viewed

@@ -1,10 +1,11 @@
-import { defineComponent, ref, computed, onMounted, resolveComponent, openBlock, createElementBlock, Fragment, createVNode, withCtx, normalizeClass, createElementVNode, createCommentVNode } from "vue";
+import { defineComponent, ref, computed, resolveComponent, openBlock, createElementBlock, Fragment, createVNode, withCtx, createElementVNode, normalizeClass, unref, createBlock, Teleport, createCommentVNode, nextTick } from "vue";
 import { useLexicalComposer } from "lexical-vue";
-import { DEVICE_VIEW_MODE } from "../commands.js";
 import { $generateHtmlFromNodes } from "@lexical/html";
+import { DEVICE_VIEW_MODE } from "../../core/index.js";
 import DocThemeCss from "../../themes/doc-theme.css.js";
 import DocEditorCss from "../../themes/doc-editor.css.js";
-const _hoisted_1 = ["srcdoc"];
+import { useModules } from "../ModulePlugin/composables.js";
+const _hoisted_1 = /* @__PURE__ */ createElementVNode("div", null, null, -1);
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "PreviewToolbar",
   props: {
@@ -20,46 +21,46 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return (_c = (_b = (_a = iframeContentRef.value) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.document) == null ? void 0 : _c.body;
     });
     const codeDialogVisible = ref(false);
-    const srcdoc = ref("");
-    const linkStr = props.css.split(",").map((path) => {
-      return `<link crossorigin href="${path}" />`;
-    }).join("");
+    ref("");
     props.css.split(",").map((path) => {
-      return `<link crossorigin href="${path}" />`;
-    }).join("");
-    const viewDevice = ref("pc");
-    const createViewContent = (content) => {
-      srcdoc.value = `
-    <html>
-      <head>
-        <style type="text/css">
-          ${DocEditorCss}
-          ${DocThemeCss}
-        </style>
-        ${linkStr}
-      </head>
-      <body style="font-size:${viewDevice.value == "pc" ? "14px" : "18px"}">${content}</body>
-    </html>
-  `;
-    };
+      return `<link crossorigin href="${path}" type="text/xml" />`;
+    }).join("\r\n");
     const show = function() {
-      editor.getEditorState().read(() => {
-        createViewContent($generateHtmlFromNodes(editor));
-        setTimeout(() => {
-          var _a;
-          if (iframeBody.value.scrollHeight > iframeBody.value.offsetHeight) {
-            iframeContentRef.value.style.height = ((_a = iframeBody.value) == null ? void 0 : _a.scrollHeight) + 10 + "px";
-          }
-        }, 100);
-      });
       codeDialogVisible.value = true;
+      nextTick(() => {
+        editor.getEditorState().read(() => {
+          var _a, _b;
+          const doc = (_b = (_a = iframeContentRef.value) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.document;
+          console.log(doc, doc.head);
+          const style = document.createElement("style");
+          style.setAttribute("type", "text/css");
+          style.innerHTML = [DocEditorCss, DocThemeCss].join("\r\n");
+          style.innerHTML += useModules().filter((item) => item.editorCss).map((item) => item.editorCss).join("\r\n");
+          doc.head.append(style);
+          props.js.split(",").filter((item) => !!item).forEach((path) => {
+            const script = document.createElement("script");
+            script.src = path;
+            script.setAttribute("crossorigin", "true");
+            doc.head.append(script);
+          });
+          props.css.split(",").filter((item) => !!item).forEach((path) => {
+            const link = document.createElement("link");
+            link.href = path;
+            link.setAttribute("rel", "stylesheet");
+            link.setAttribute("crossorigin", "true");
+            doc.head.append(link);
+          });
+          iframeBody.value.style.fontSize = DEVICE_VIEW_MODE.value == "pc" ? "14px" : "18px";
+          doc.body.innerHTML = $generateHtmlFromNodes(editor);
+          setTimeout(() => {
+            var _a2;
+            if (iframeBody.value.scrollHeight > iframeBody.value.offsetHeight) {
+              iframeContentRef.value.style.height = ((_a2 = iframeBody.value) == null ? void 0 : _a2.scrollHeight) + 10 + "px";
+            }
+          }, 100);
+        });
+      });
     };
-    onMounted(() => {
-      editor.registerCommand(DEVICE_VIEW_MODE, (payload) => {
-        viewDevice.value = payload;
-        return false;
-      }, 1);
-    });
     return (_ctx, _cache) => {
       const _component_MKSvgIcon = resolveComponent("MKSvgIcon");
       const _component_el_button = resolveComponent("el-button");
@@ -83,17 +84,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           fullscreen: ""
         }, {
           default: withCtx(() => [
-            codeDialogVisible.value ? (openBlock(), createElementBlock("div", {
-              key: 0,
-              class: normalizeClass(["mk-doc-editor__view_warp", viewDevice.value])
+            createElementVNode("div", {
+              class: normalizeClass(["mk-doc-editor__view_warp", unref(DEVICE_VIEW_MODE)])
             }, [
               createElementVNode("iframe", {
                 class: "mk-doc-editor__view_iframe",
                 ref_key: "iframeContentRef",
-                ref: iframeContentRef,
-                srcdoc: srcdoc.value
-              }, null, 8, _hoisted_1)
-            ], 2)) : createCommentVNode("", true)
+                ref: iframeContentRef
+              }, null, 512),
+              iframeBody.value ? (openBlock(), createBlock(Teleport, {
+                key: 0,
+                to: iframeBody.value
+              }, [
+                _hoisted_1
+              ], 8, ["to"])) : createCommentVNode("", true)
+            ], 2)
           ]),
           _: 1
         }, 8, ["modelValue"])

package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PreviewToolbar.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { ~~DEVICE_VIEW_MODE } from \"../commands\"\r\nimport {~~ $generateHtmlFromNodes} from '@lexical/html'\r\nimport { ~~onMounted,~~ref,computed,defineProps } from \"vue\"\r\nimport DocThemeCss from \"../../themes/doc-theme.css?raw\";\r\nimport DocEditorCss from \"../../themes/doc-editor.css?raw\";\r\n\r\nconst editor = useLexicalComposer()\r\n// 参数\r\nconst props = defineProps({\r\n js:{ type:String,default:`` },\r\n css:{ type:String,default:`` }\r\n})\r\n// iframe 编辑器\r\nconst iframeContentRef = ref(null as any);\r\nconst iframeBody = computed<any>(()=>iframeContentRef.value?.contentWindow?.document?.body)\r\n\r\nconst codeDialogVisible = ref(false);\r\nconst srcdoc = ref(\"\");\r\nconst linkStr = props.css.split(\",\").map(path=>{\r\n return `<link crossorigin href=\"${path}\" />`\r\n}).join(\"\");\r\~~nconst~~ scriptStr = props.css.split(\",\").map(path=>{\r\n return `<~~link~~ crossorigin ~~href~~=\"${path}\" ~~/>`\~~r\n}).join(\"\");\r\n // // ~~扩展的js和css~~\r\n // ~~props~~.~~js.split~~(~~\",\"~~).~~forEach~~(~~path~~=>{\r\n // const ~~script~~ = document.createElement(\"~~script~~\");\r\n // ~~script~~.~~src~~ = ~~path~~;\r\n ~~// script~~.~~setAttribute~~(\"~~crossorigin~~\"~~,\"true\"~~)\r\n // doc.head.append(~~script~~);\r\n // })\r\n // props.~~css~~.split(\",\").forEach(path=>{\r\n // const ~~link~~ = document.createElement(\"~~link~~\");\r\n ~~// link~~.~~href~~ = path;\r\n ~~// link~~.setAttribute(\"crossorigin\",\"true\")\r\n // doc.head.append(~~link~~);\r\n // })\r\n\~~r\n// pc \| mobile\r\nconst viewDevice = ref~~(~~'pc'~~)\r\n~~\r\n//~~ ~~创建预览内容\r\nconst~~ ~~createViewContent~~ = (~~content:string~~)~~=>{\~~r\n ~~srcdoc~~.~~value~~ = `\r\n ~~<html>\r~~\~~n <head>\r~~\~~n <style type=\~~"~~text/css~~\">\r\n ~~${DocEditorCss}~~\r\~~n ${DocThemeCss}~~\r\n ~~</style>\~~r\n ~~${linkStr~~}\r\n ~~</head>\~~r\n ~~<body~~ style~~=\"font-size:${(viewDevice~~.value=='pc~~'?\~~"14px\":\"18px\"~~)}\">${content}</body>\~~r\n ~~</html>\r~~\~~n `;\~~r\n~~}\r\n\r\n~~// ~~显示\~~r\~~nconst show = function(){\r\~~n~~\r\n editor~~.~~getEditorState()~~.~~read(()~~ => ~~{\r\n createViewContent(~~$generateHtmlFromNodes(editor))\r\n setTimeout(() => {\r\n if(iframeBody.value.scrollHeight > iframeBody.value.offsetHeight){\r\n iframeContentRef.value.style.height = (iframeBody.value?.scrollHeight + 10)+\"px\";\r\n }\r\n }, 100);\r\n })\r\n~~\r\n~~ ~~codeDialogVisible.value = true~~;\r\n \r\n}\r\~~nonMounted(()=>{\r\~~n ~~editor.registerCommand(DEVICE_VIEW_MODE,(payload: string) => {~~\r\n ~~viewDevice.value = payload;\r~~\~~n return false\~~r\n ~~},1)~~\r\n~~});\r~~\n\r\n</script>\r\n\r\n<template>\r\n <el-button text @click=\"show\">\r\n <MKSvgIcon iconClass=\"View\" /> \r\n </el-button>\r\n <el-dialog v-model=\"codeDialogVisible\" append-to-body title=\"预览\" width=\"80%\" fullscreen>\r\n <div class=\"mk-doc-editor__view_warp\" :class=\"~~viewDevice~~\" ~~v-if=\"codeDialogVisible\"~~>\r\n <iframe class=\"mk-doc-editor__view_iframe\" ref=\"iframeContentRef\" :~~srcdoc~~=\"~~srcdoc~~\"></~~iframe~~>\r\n </div>\r\n </el-dialog>\r\n</template>\r\n"],"names":[],"mappings":"~~;;;;;;;;;;;;;;AASA~~,UAAM,SAAS;AAEf,UAAM,QAAQ;AAKR,UAAA,mBAAmB,IAAI,IAAW;AACxC,UAAM,aAAa,SAAc;;AAAI,gDAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC,aAAvC,mBAAiD;AAAA,KAAI;AAEpF,UAAA,oBAAoB,IAAI,KAAK;~~AAC7B~~,~~UAAA~~,~~SAAS,IAAI,~~EAAE;~~AACrB~~,UAAM,~~UAAU,MAAM,~~IAAI,MAAM,GAAG,EAAE,IAAI,CAAM,SAAA;AAC7C,aAAO,2BAA2B,IAAI;AAAA,IAAA,CACvC,EAAE,KAAK,EAAE;~~AACQ~~,UAAM,IAAI,MAAM,GAAG,EAAE,IAAI,CAAM,SAAA;AAC/C,~~aAAO~~,~~2BAA2B~~,~~IAAI~~;~~AAAA~~,~~IAAA~~,~~CACvC~~,~~EAAE~~,KAAK,~~EAAE~~;~~AAgBJ~~,UAAA,~~aAAa~~,~~IAAI~~,IAAI~~;AAGrB~~,~~UAAA~~,~~oBAAoB~~,CAAC,~~YAAiB;AAC1C~~,~~aAAO~~,QAAQ~~;AAAA;AAAA;AAAA;AAAA~~,~~YAIL~~,~~YAAY~~;~~AAAA~~,~~YACZ~~,~~WAAW~~;~~AAAA;AAAA~~,~~UAEb~~,OAAO;~~AAAA~~;~~AAAA,+BAEe~~,~~WAAW~~,~~SAAO~~,~~OAAK~~,~~SAAO~~,~~MAAO~~,KAAK,OAAO;AAAA~~;AAAA;AAAA~~,~~IAAA~~;~~AAMjF~~,~~UAAM~~,~~OAAO~~,~~WAAU;AAEd~~,~~aAAA~~,iBAAiB,~~KAAK~~,~~MAAM~~;~~AACf~~,~~0BAAA~~,uBAAuB,MAAM~~,CAAC~~;~~AAChD~~,~~mBAAW~~,MAAM;;AACf,~~cAAG~~,WAAW,MAAM,eAAe,WAAW,MAAM,cAAa;AAC/D,~~6BAAiB,~~MAAM,MAAM,~~WAAU~~,~~gBAAW~~,UAAX,~~mBAAkB~~,gBAAe,KAAI;AAAA,~~UAC9E~~;AAAA,~~WACC~~,GAAG;AAAA,~~MAAA~~,CACP;~~AAED,wBAAkB,QAAQ;~~AAAA,~~IAAA;AAG5B~~,~~cAAU,MAAI~~;~~AACL,aAAA,gBAAgB,kBAAiB,CAAC,YAAoB;AAC3D,mBAAW,QAAQ;AACZ,eAAA;~~AAAA,~~SACP,CAAC;AAAA,~~IAAA~~,CACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"PreviewToolbar.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { $generateHtmlFromNodes} from '@lexical/html'\r\nimport { ref,computed,defineProps,watch, nextTick } from \"vue\"\r\nimport { DEVICE_VIEW_MODE } from \"../../core\"\r\nimport DocThemeCss from \"../../themes/doc-theme.css?raw\";\r\nimport DocEditorCss from \"../../themes/doc-editor.css?raw\";\r\nimport { useModules } from \"../ModulePlugin/composables\"\r\n\r\nconst editor = useLexicalComposer()\r\n// 参数\r\nconst props = defineProps({\r\n js:{ type:String,default:`` },\r\n css:{ type:String,default:`` }\r\n})\r\n// iframe 编辑器\r\nconst iframeContentRef = ref(null as any);\r\nconst iframeBody = computed<any>(()=>iframeContentRef.value?.contentWindow?.document?.body)\r\n\r\nconst codeDialogVisible = ref(false);\r\nconst srcdoc = ref(\"\");\r\nconst linkStr = props.css.split(\",\").map(path=>{\r\n return `<link crossorigin href=\"${path}\" type=\"text/xml\" />`\r\n}).join(\"\\r\\n\");\r\n\r\n// const scriptStr = props.css.split(\",\").map(path=>{\r\n// return `<script1 crossorigin src=\"${path}\"></script1>`\r\n// }).join(\"\");\r\n \r\n\r\n// 显示\r\nconst show = function(){\r\n\r\n codeDialogVisible.value = true;\r\n\r\n nextTick(()=>{\r\n\r\n editor.getEditorState().read(() => {\r\n\r\n const doc = iframeContentRef.value?.contentWindow?.document;\r\n\r\n console.log(doc,doc.head)\r\n\r\n // 样式\r\n const style = document.createElement(\"style\");\r\n style.setAttribute(\"type\",\"text/css\")\r\n\r\n // 默认样式\r\n style.innerHTML = [DocEditorCss,DocThemeCss].join(\"\\r\\n\");\r\n //模块渲染样式\r\n style.innerHTML += useModules().filter(item=>item.editorCss).map(item=>item.editorCss).join(\"\\r\\n\");\r\n doc.head.append(style);\r\n\r\n // 扩展的js和css\r\n props.js.split(\",\").filter(item=>!!item).forEach(path=>{\r\n const script = document.createElement(\"script\");\r\n script.src = path;\r\n script.setAttribute(\"crossorigin\",\"true\")\r\n doc.head.append(script);\r\n })\r\n props.css.split(\",\").filter(item=>!!item).forEach(path=>{\r\n const link = document.createElement(\"link\");\r\n link.href = path;\r\n link.setAttribute(\"rel\",\"stylesheet\")\r\n link.setAttribute(\"crossorigin\",\"true\")\r\n doc.head.append(link);\r\n })\r\n\r\n // 预览显示\r\n iframeBody.value.style.fontSize = DEVICE_VIEW_MODE.value == \"pc\" ? \"14px\" : \"18px\";\r\n\r\n // 预览内容\r\n doc.body.innerHTML = $generateHtmlFromNodes(editor);\r\n\r\n setTimeout(() => {\r\n if(iframeBody.value.scrollHeight > iframeBody.value.offsetHeight){\r\n iframeContentRef.value.style.height = (iframeBody.value?.scrollHeight + 10)+\"px\";\r\n }\r\n }, 100);\r\n })\r\n });\r\n\r\n\r\n \r\n}\r\n\r\n\r\n</script>\r\n\r\n<template>\r\n <el-button text @click=\"show\">\r\n <MKSvgIcon iconClass=\"View\" /> \r\n </el-button>\r\n <el-dialog v-model=\"codeDialogVisible\" append-to-body title=\"预览\" width=\"80%\" fullscreen>\r\n <div class=\"mk-doc-editor__view_warp\" :class=\"DEVICE_VIEW_MODE\">\r\n <iframe class=\"mk-doc-editor__view_iframe\" ref=\"iframeContentRef\"></iframe>\r\n <Teleport v-if=\"iframeBody\" :to=\"iframeBody\">\r\n <div></div>\r\n </Teleport>\r\n </div>\r\n </el-dialog>\r\n</template>\r\n"],"names":["_a"],"mappings":";;;;;;;;;;;;;;;AAUA,UAAM,SAAS;AAEf,UAAM,QAAQ;AAKR,UAAA,mBAAmB,IAAI,IAAW;AACxC,UAAM,aAAa,SAAc;;AAAI,gDAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC,aAAvC,mBAAiD;AAAA,KAAI;AAEpF,UAAA,oBAAoB,IAAI,KAAK;AACpB,QAAI,EAAE;AACL,UAAM,IAAI,MAAM,GAAG,EAAE,IAAI,CAAM,SAAA;AAC7C,aAAO,2BAA2B,IAAI;AAAA,IAAA,CACvC,EAAE,KAAK,MAAM;AAQd,UAAM,OAAO,WAAU;AAErB,wBAAkB,QAAQ;AAE1B,eAAS,MAAI;AAEJ,eAAA,iBAAiB,KAAK,MAAM;;AAE3B,gBAAA,OAAM,4BAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC;AAE3C,kBAAA,IAAI,KAAI,IAAI,IAAI;AAGlB,gBAAA,QAAQ,SAAS,cAAc,OAAO;AACtC,gBAAA,aAAa,QAAO,UAAU;AAGpC,gBAAM,YAAY,CAAC,cAAa,WAAW,EAAE,KAAK,MAAM;AAExD,gBAAM,aAAa,WAAA,EAAa,OAAO,UAAM,KAAK,SAAS,EAAE,IAAI,CAAM,SAAA,KAAK,SAAS,EAAE,KAAK,MAAM;AAC9F,cAAA,KAAK,OAAO,KAAK;AAGf,gBAAA,GAAG,MAAM,GAAG,EAAE,OAAO,CAAM,SAAA,CAAC,CAAC,IAAI,EAAE,QAAQ,CAAM,SAAA;AAC/C,kBAAA,SAAS,SAAS,cAAc,QAAQ;AAC9C,mBAAO,MAAM;AACN,mBAAA,aAAa,eAAc,MAAM;AACpC,gBAAA,KAAK,OAAO,MAAM;AAAA,UAAA,CACvB;AACK,gBAAA,IAAI,MAAM,GAAG,EAAE,OAAO,CAAM,SAAA,CAAC,CAAC,IAAI,EAAE,QAAQ,CAAM,SAAA;AAChD,kBAAA,OAAO,SAAS,cAAc,MAAM;AAC1C,iBAAK,OAAO;AACP,iBAAA,aAAa,OAAM,YAAY;AAC/B,iBAAA,aAAa,eAAc,MAAM;AAClC,gBAAA,KAAK,OAAO,IAAI;AAAA,UAAA,CACrB;AAGD,qBAAW,MAAM,MAAM,WAAW,iBAAiB,SAAS,OAAO,SAAS;AAGxE,cAAA,KAAK,YAAY,uBAAuB,MAAM;AAElD,qBAAW,MAAM;;AACf,gBAAG,WAAW,MAAM,eAAe,WAAW,MAAM,cAAa;AAC/D,+BAAiB,MAAM,MAAM,WAAUA,MAAA,WAAW,UAAX,gBAAAA,IAAkB,gBAAe,KAAI;AAAA,YAC9E;AAAA,aACC,GAAG;AAAA,QAAA,CACP;AAAA,MAAA,CACF;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue.js CHANGED Viewed

@@ -2,11 +2,10 @@ import { defineComponent, ref, onMounted, onUnmounted, resolveComponent, openBlo
 import { CAN_UNDO_COMMAND, CAN_REDO_COMMAND, UNDO_COMMAND, REDO_COMMAND } from "lexical";
 import { mergeRegister } from "@lexical/utils";
 import { useLexicalComposer } from "lexical-vue";
+import { ToolbarExtendPlugins, DEVICE_VIEW_MODE } from "../../core/index.js";
 import _sfc_main$3 from "./PreviewToolbar.vue.js";
 import _sfc_main$2 from "./FontStyleTool.vue.js";
 import _sfc_main$1 from "./ContentStyleTool.vue.js";
-import { ToolbarExtendPlugins } from "./defines.js";
-import { DEVICE_VIEW_MODE } from "../commands.js";
 const LowPriority = 1;
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
@@ -19,7 +18,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const editor = useLexicalComposer();
     const canUndo = ref(false);
     const canRedo = ref(false);
-    const viewDevice = ref("pc");
     onMounted(() => {
       const unregisterMergeListener = mergeRegister(
         editor.registerCommand(
@@ -37,14 +35,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             return false;
           },
           LowPriority
-        ),
-        editor.registerCommand(
-          DEVICE_VIEW_MODE,
-          (payload) => {
-            viewDevice.value = payload;
-            return false;
-          },
-          LowPriority
         )
       );
       onUnmounted(() => {
@@ -99,8 +89,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           default: withCtx(() => [
             createVNode(_component_el_button, {
               text: "",
-              class: normalizeClass(`${viewDevice.value == "pc" ? "active" : ""}`),
-              onClick: _cache[2] || (_cache[2] = ($event) => unref(editor).dispatchCommand(unref(DEVICE_VIEW_MODE), "pc"))
+              class: normalizeClass(`${unref(DEVICE_VIEW_MODE) == "pc" ? "active" : ""}`),
+              onClick: _cache[2] || (_cache[2] = ($event) => DEVICE_VIEW_MODE.value = "pc")
             }, {
               default: withCtx(() => [
                 createVNode(_component_MKSvgIcon, { iconClass: "Platform" })
@@ -109,8 +99,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             }, 8, ["class"]),
             createVNode(_component_el_button, {
               text: "",
-              class: normalizeClass(`${viewDevice.value == "mobile" ? "active" : ""}`),
-              onClick: _cache[3] || (_cache[3] = ($event) => unref(editor).dispatchCommand(unref(DEVICE_VIEW_MODE), "mobile"))
+              class: normalizeClass(`${unref(DEVICE_VIEW_MODE) == "mobile" ? "active" : ""}`),
+              onClick: _cache[3] || (_cache[3] = ($event) => DEVICE_VIEW_MODE.value = "mobile")
             }, {
               default: withCtx(() => [
                 createVNode(_component_MKSvgIcon, { iconClass: "Iphone" })

package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { CommandListenerPriority } from 'lexical'\r\nimport {\r\n CAN_REDO_COMMAND,\r\n CAN_UNDO_COMMAND,\r\n REDO_COMMAND,\r\n UNDO_COMMAND,\r\n} from 'lexical'\r\~~n\r\~~nimport { mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { onMounted, onUnmounted, ref,defineProps } from 'vue'\r\nimport ~~PreviewToolbar~~ from \"~~./PreviewToolbar.vue~~\"\r\nimport ~~FontStyleToolbar~~ from \"./~~FontStyleTool~~.vue\"\r\nimport ~~ContentStyleToolbar~~ from \"./~~ContentStyleTool~~.vue\"\r\nimport { ~~ToolbarExtendPlugins }~~ from \"./~~defines~~\"\r\nimport { ~~DEVICE_VIEW_MODE~~ } from \"~~../commands~~\"\r\n~~\r\n~~// 参数\r\~~nconst props = defineProps~~({\r\n js:{ type:String,default:`` },\r\n css:{ type:String,default:`` }\r\n})\r\n\r\nconst LowPriority: CommandListenerPriority = 1\r\n\r\nconst toolbarRef = ref<HTMLDivElement \| null>(null)\r\nconst editor = useLexicalComposer()\r\n\r\nconst canUndo = ref(false)\r\nconst canRedo = ref(false)\r\n~~// pc \| mobile~~\r\~~nconst viewDevice = ref('pc')\r\n\r\n\r\~~nonMounted(() => {\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerCommand(\r\n CAN_UNDO_COMMAND,\r\n (payload: boolean) => {\r\n canUndo.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n ),\r\n editor.registerCommand(\r\n CAN_REDO_COMMAND,\r\n (payload: boolean) => {\r\n canRedo.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n )~~,\r~~\~~n editor.registerCommand(\~~r\n ~~DEVICE_VIEW_MODE,\r\n (payload: string) => {\r\n viewDevice.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n )\r\n~~ )\r\n\r\n onUnmounted(() => {\r\n ToolbarExtendPlugins.length = 0;\r\n unregisterMergeListener()\r\n })\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n <div ref=\"toolbarRef\" class=\"mk-doc-editor-toolbar\">\r\n <el-button-group>\r\n <el-button text :disabled=\"!canUndo\" @click=\"editor.dispatchCommand(UNDO_COMMAND, undefined)\">\r\n <MKSvgIcon iconClass=\"RefreshLeft\" /> \r\n </el-button>\r\n <el-button text :disabled=\"!canRedo\" @click=\"editor.dispatchCommand(REDO_COMMAND, undefined)\">\r\n <MKSvgIcon iconClass=\"RefreshRight\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <!-- 内容 -->\r\n <ContentStyleToolbar />\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 文字样式 -->\r\n <FontStyleToolbar ~~/>\~~r\n <el-divider direction=\"vertical\" />\r\n \r\n <el-button-group>\r\n <el-button text :class=\"`${~~viewDevice~~=='pc' ? 'active' : ''}`\" @click=\"~~editor.dispatchCommand(~~DEVICE_VIEW_MODE, 'pc')\">\r\n <MKSvgIcon iconClass=\"Platform\" /> \r\n </el-button>\r\n <el-button text :class=\"`${~~viewDevice~~=='mobile' ? 'active' : ''}`\" @click=\"~~editor.dispatchCommand(~~DEVICE_VIEW_MODE, 'mobile')\">\r\n <MKSvgIcon iconClass=\"Iphone\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <el-dropdown>\r\n <el-button text>\r\n <MKSvgIcon iconClass=\"Plus\" style=\"margin-right: 5px;\" /> 插入\r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item v-for=\"item in ToolbarExtendPlugins\" :key=\"item\" @click=\"item.action()\">\r\n <MKSvgIcon :iconClass=\"item.icon\" /> \r\n {{item.text}}\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <PreviewToolbar :js=\"js\" :css=\"css\" />\r\n </el-button-group>\r\n </div>\r\n</template>\r\n"],"names":[],"mappings":"~~;;;;;;;;;AAwBA~~,MAAM,cAAuC;;;;;;;;AAEvC,UAAA,aAAa,IAA2B,IAAI;AAClD,UAAM,SAAS;AAET,UAAA,UAAU,IAAI,KAAK;AACnB,UAAA,UAAU,IAAI,KAAK;~~AAEnB~~,~~UAAA,aAAa,IAAI,IAAI;AAG3B,~~cAAU,MAAM;AACd,YAAM,0BAA0B;AAAA,QAC9B,OAAO;AAAA,UACL;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACL;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,~~QACA,OAAO;AAAA,UACL;AAAA,UACA,CAAC,YAAoB;AACnB,uBAAW,QAAQ;AACZ,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,~~MAAA;AAGF,kBAAY,MAAM;AAChB,6BAAqB,SAAS;AACN;MAAA,CACzB;AAAA,IAAA,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { CommandListenerPriority } from 'lexical'\r\nimport {\r\n CAN_REDO_COMMAND,\r\n CAN_UNDO_COMMAND,\r\n REDO_COMMAND,\r\n UNDO_COMMAND,\r\n} from 'lexical'\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { onMounted, onUnmounted, ref,defineProps } from 'vue'\r\nimport { DEVICE_VIEW_MODE } from \"../../core\"\r\nimport PreviewToolbar from \"./PreviewToolbar.vue\"\r\nimport FontStyleToolbar from \"./FontStyleTool.vue\"\r\nimport ContentStyleToolbar from \"./ContentStyleTool.vue\"\r\nimport { ToolbarExtendPlugins } from \"../../core\"\r\n// 参数\r\ndefineProps({\r\n js:{ type:String,default:`` },\r\n css:{ type:String,default:`` }\r\n})\r\n\r\nconst LowPriority: CommandListenerPriority = 1\r\n\r\nconst toolbarRef = ref<HTMLDivElement \| null>(null)\r\nconst editor = useLexicalComposer()\r\n\r\nconst canUndo = ref(false)\r\nconst canRedo = ref(false)\r\n\r\nonMounted(() => {\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerCommand(\r\n CAN_UNDO_COMMAND,\r\n (payload: boolean) => {\r\n canUndo.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n ),\r\n editor.registerCommand(\r\n CAN_REDO_COMMAND,\r\n (payload: boolean) => {\r\n canRedo.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n )\r\n )\r\n\r\n onUnmounted(() => {\r\n ToolbarExtendPlugins.length = 0;\r\n unregisterMergeListener()\r\n })\r\n})\r\n\r\n\r\n</script>\r\n\r\n<template>\r\n <div ref=\"toolbarRef\" class=\"mk-doc-editor-toolbar\">\r\n <el-button-group>\r\n <el-button text :disabled=\"!canUndo\" @click=\"editor.dispatchCommand(UNDO_COMMAND, undefined)\">\r\n <MKSvgIcon iconClass=\"RefreshLeft\" /> \r\n </el-button>\r\n <el-button text :disabled=\"!canRedo\" @click=\"editor.dispatchCommand(REDO_COMMAND, undefined)\">\r\n <MKSvgIcon iconClass=\"RefreshRight\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <!-- 内容 -->\r\n <ContentStyleToolbar />\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 文字样式 -->\r\n <FontStyleToolbar /> \r\n <el-divider direction=\"vertical\" />\r\n \r\n <el-button-group>\r\n <el-button text :class=\"`${DEVICE_VIEW_MODE=='pc' ? 'active' : ''}`\" @click=\"DEVICE_VIEW_MODE='pc'\">\r\n <MKSvgIcon iconClass=\"Platform\" /> \r\n </el-button>\r\n <el-button text :class=\"`${DEVICE_VIEW_MODE=='mobile' ? 'active' : ''}`\" @click=\"DEVICE_VIEW_MODE='mobile'\">\r\n <MKSvgIcon iconClass=\"Iphone\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <el-dropdown>\r\n <el-button text>\r\n <MKSvgIcon iconClass=\"Plus\" style=\"margin-right: 5px;\" /> 插入\r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item v-for=\"item in ToolbarExtendPlugins\" :key=\"item\" @click=\"item.action()\">\r\n <MKSvgIcon :iconClass=\"item.icon\" /> \r\n {{item.text}}\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <PreviewToolbar :js=\"js\" :css=\"css\" />\r\n </el-button-group>\r\n </div>\r\n</template>\r\n"],"names":[],"mappings":";;;;;;;;AAsBA,MAAM,cAAuC;;;;;;;;AAEvC,UAAA,aAAa,IAA2B,IAAI;AAClD,UAAM,SAAS;AAET,UAAA,UAAU,IAAI,KAAK;AACnB,UAAA,UAAU,IAAI,KAAK;AAEzB,cAAU,MAAM;AACd,YAAM,0BAA0B;AAAA,QAC9B,OAAO;AAAA,UACL;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACL;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,MAAA;AAGF,kBAAY,MAAM;AAChB,6BAAqB,SAAS;AACN;MAAA,CACzB;AAAA,IAAA,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/basic/doc-editor/plugins/nodes.js CHANGED Viewed

@@ -4,10 +4,13 @@ import { ListNode, ListItemNode } from "@lexical/list";
 import { CodeNode, CodeHighlightNode } from "@lexical/code";
 import { AutoLinkNode, LinkNode } from "@lexical/link";
 import { HashtagNode } from "@lexical/hashtag";
-import { ImageNode } from "./ImagePlugin/index.js";
-import { ImageTextNode } from "./ImageTextPlugin/index.js";
-import { HtmlBlockNode } from "./HtmlBlockPlugin/index.js";
+import "./ImagePlugin/commands.js";
+import { ImageNode, InlineImageNode } from "./ImagePlugin/ImageNode.js";
+import { ImageTextNode } from "./ImageTextPlugin/ImageTextNode.js";
 import { RichTextNode } from "./RichTextPlugin/nodes/RichTextNode.js";
+import "./ModulePlugin/commands.js";
+import { ModuleBlockNode } from "./ModulePlugin/ModuleBlockNode.js";
+import { ModuleContainerNode } from "./ModulePlugin/ModuleContainerNode.js";
 const Nodes = [
   HeadingNode,
   ListNode,
@@ -24,7 +27,9 @@ const Nodes = [
   RichTextNode,
   ImageNode,
   ImageTextNode,
-  HtmlBlockNode
+  InlineImageNode,
+  ModuleBlockNode,
+  ModuleContainerNode
 ];
 export {
   Nodes as default

package/dist/esm/components/basic/doc-editor/plugins/nodes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nodes.js","sources":["../../../../../../src/components/basic/doc-editor/plugins/nodes.ts"],"sourcesContent":["import { type Klass, type LexicalNode,TextNode,ElementNode } from 'lexical'\r\nimport { HeadingNode, QuoteNode } from '@lexical/rich-text'\r\nimport { TableCellNode, TableNode, TableRowNode } from '@lexical/table'\r\nimport { ListItemNode, ListNode } from '@lexical/list'\r\nimport { CodeHighlightNode, CodeNode } from '@lexical/code'\r\nimport { AutoLinkNode, LinkNode } from '@lexical/link'\r\nimport { HashtagNode } from '@lexical/hashtag'\r\nimport { ImageNode } from \"./ImagePlugin\"\r\nimport { ImageTextNode } from \"./ImageTextPlugin\"\r\nimport { ~~HtmlBlockNode~~ } from \"./~~HtmlBlockPlugin~~\"\r\nimport { ~~RichTextNode~~ } from \"./~~RichTextPlugin/nodes/RichTextNode~~\"\r\n\r\nconst Nodes: Array<Klass<LexicalNode>> = [\r\n HeadingNode,\r\n ListNode,\r\n ListItemNode,\r\n QuoteNode,\r\n CodeNode,\r\n CodeHighlightNode,\r\n TableNode,\r\n TableCellNode,\r\n TableRowNode,\r\n AutoLinkNode,\r\n LinkNode,\r\n HashtagNode,\r\n\r\n RichTextNode,\r\n ImageNode,\r\n ImageTextNode,\r\n ~~HtmlBlockNode~~\r\n]\r\n\r\nexport default Nodes\r\n"],"names":[],"mappings":"~~;;;;;;;;;;AAYA~~,MAAM,QAAmC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;"}
1	+ {"version":3,"file":"nodes.js","sources":["../../../../../../src/components/basic/doc-editor/plugins/nodes.ts"],"sourcesContent":["import { type Klass, type LexicalNode,TextNode,ElementNode,ParagraphNode } from 'lexical'\r\nimport { HeadingNode, QuoteNode } from '@lexical/rich-text'\r\nimport { TableCellNode, TableNode, TableRowNode } from '@lexical/table'\r\nimport { ListItemNode, ListNode } from '@lexical/list'\r\nimport { CodeHighlightNode, CodeNode } from '@lexical/code'\r\nimport { AutoLinkNode, LinkNode } from '@lexical/link'\r\nimport { HashtagNode } from '@lexical/hashtag'\r\nimport { ImageNode,InlineImageNode } from \"./ImagePlugin\"\r\nimport { ImageTextNode } from \"./ImageTextPlugin\"\r\nimport { RichTextNode } from \"./RichTextPlugin/nodes/RichTextNode\"\r\nimport { ModuleBlockNode,ModuleContainerNode } from \"./ModulePlugin\"\r\n\r\n\r\nconst Nodes: Array<Klass<LexicalNode>> = [\r\n HeadingNode,\r\n ListNode,\r\n ListItemNode,\r\n QuoteNode,\r\n CodeNode,\r\n CodeHighlightNode,\r\n TableNode,\r\n TableCellNode,\r\n TableRowNode,\r\n AutoLinkNode,\r\n LinkNode,\r\n HashtagNode,\r\n\r\n RichTextNode,\r\n ImageNode,\r\n ImageTextNode,\r\n InlineImageNode,\r\n ModuleBlockNode,\r\n ModuleContainerNode\r\n]\r\n\r\nexport default Nodes\r\n"],"names":[],"mappings":";;;;;;;;;;;;;AAaA,MAAM,QAAmC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;"}

package/dist/esm/components/basic/doc-editor/themes/DocTheme.js CHANGED Viewed

@@ -47,9 +47,8 @@ const theme = {
     h5: "mk-doc__h5",
     h6: "mk-doc__h6"
   },
-  image: "editor-image",
+  image: "mk-doc__img",
   indent: "mk-doc__indent",
-  inlineImage: "inline-editor-image",
   layoutContainer: "mk-doc__layoutContainer",
   layoutItem: "mk-doc__layoutItem",
   link: "mk-doc__link",

package/dist/esm/components/basic/doc-editor/themes/DocTheme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DocTheme.js","sources":["../../../../../../src/components/basic/doc-editor/themes/DocTheme.ts"],"sourcesContent":["/*\r\n Copyright (c) Meta Platforms, Inc. and affiliates.\r\n \r\n This source code is licensed under the MIT license found in the\r\n * LICENSE file in the root directory of this source tree.\r\n \r\n /\r\n\r\nimport type { EditorThemeClasses } from 'lexical'\r\n\r\nconst theme: EditorThemeClasses = {\r\n blockCursor: 'mk-doc__blockCursor',\r\n characterLimit: 'mk-doc__characterLimit',\r\n code: 'mk-doc__code',\r\n codeHighlight: {\r\n 'atrule': 'mk-doc__tokenAttr',\r\n 'attr': 'mk-doc__tokenAttr',\r\n 'boolean': 'mk-doc__tokenProperty',\r\n 'builtin': 'mk-doc__tokenSelector',\r\n 'cdata': 'mk-doc__tokenComment',\r\n 'char': 'mk-doc__tokenSelector',\r\n 'class': 'mk-doc__tokenFunction',\r\n 'class-name': 'mk-doc__tokenFunction',\r\n 'comment': 'mk-doc__tokenComment',\r\n 'constant': 'mk-doc__tokenProperty',\r\n 'deleted': 'mk-doc__tokenProperty',\r\n 'doctype': 'mk-doc__tokenComment',\r\n 'entity': 'mk-doc__tokenOperator',\r\n 'function': 'mk-doc__tokenFunction',\r\n 'important': 'mk-doc__tokenVariable',\r\n 'inserted': 'mk-doc__tokenSelector',\r\n 'keyword': 'mk-doc__tokenAttr',\r\n 'namespace': 'mk-doc__tokenVariable',\r\n 'number': 'mk-doc__tokenProperty',\r\n 'operator': 'mk-doc__tokenOperator',\r\n 'prolog': 'mk-doc__tokenComment',\r\n 'property': 'mk-doc__tokenProperty',\r\n 'punctuation': 'mk-doc__tokenPunctuation',\r\n 'regex': 'mk-doc__tokenVariable',\r\n 'selector': 'mk-doc__tokenSelector',\r\n 'string': 'mk-doc__tokenSelector',\r\n 'symbol': 'mk-doc__tokenProperty',\r\n 'tag': 'mk-doc__tokenProperty',\r\n 'url': 'mk-doc__tokenOperator',\r\n 'variable': 'mk-doc__tokenVariable',\r\n },\r\n embedBlock: {\r\n base: 'mk-doc__embedBlock',\r\n focus: 'mk-doc__embedBlockFocus',\r\n },\r\n hashtag: 'mk-doc__hashtag',\r\n heading: {\r\n h1: 'mk-doc__h1',\r\n h2: 'mk-doc__h2',\r\n h3: 'mk-doc__h3',\r\n h4: 'mk-doc__h4',\r\n h5: 'mk-doc__h5',\r\n h6: 'mk-doc__h6',\r\n },\r\n image: '~~editor~~-~~image~~',\r\n indent: 'mk-doc__indent',\r\n ~~inlineImage: 'inline-editor-image',\r\n~~ layoutContainer: 'mk-doc__layoutContainer',\r\n layoutItem: 'mk-doc__layoutItem',\r\n link: 'mk-doc__link',\r\n list: {\r\n checklist: 'mk-doc__checklist',\r\n listitem: 'mk-doc__listItem',\r\n listitemChecked: 'mk-doc__listItemChecked',\r\n listitemUnchecked: 'mk-doc__listItemUnchecked',\r\n nested: {\r\n listitem: 'mk-doc__nestedListItem',\r\n },\r\n olDepth: [\r\n 'mk-doc__ol1',\r\n 'mk-doc__ol2',\r\n 'mk-doc__ol3',\r\n 'mk-doc__ol4',\r\n 'mk-doc__ol5',\r\n ],\r\n ul: 'mk-doc__ul',\r\n },\r\n ltr: 'mk-doc__ltr',\r\n mark: 'mk-doc__mark',\r\n markOverlap: 'mk-doc__markOverlap',\r\n paragraph: 'mk-doc__paragraph',\r\n quote: 'mk-doc__quote',\r\n rtl: 'mk-doc__rtl',\r\n table: 'mk-doc__table',\r\n tableAddColumns: 'mk-doc__tableAddColumns',\r\n tableAddRows: 'mk-doc__tableAddRows',\r\n tableCell: 'mk-doc__tableCell',\r\n tableCellActionButton: 'mk-doc__tableCellActionButton',\r\n tableCellActionButtonContainer:\r\n 'mk-doc__tableCellActionButtonContainer',\r\n tableCellEditing: 'mk-doc__tableCellEditing',\r\n tableCellHeader: 'mk-doc__tableCellHeader',\r\n tableCellPrimarySelected: 'mk-doc__tableCellPrimarySelected',\r\n tableCellResizer: 'mk-doc__tableCellResizer',\r\n tableCellSelected: 'mk-doc__tableCellSelected',\r\n tableCellSortedIndicator: 'mk-doc__tableCellSortedIndicator',\r\n tableResizeRuler: 'mk-doc__tableCellResizeRuler',\r\n tableSelected: 'mk-doc__tableSelected',\r\n tableSelection: 'mk-doc__tableSelection',\r\n text: {\r\n bold: 'mk-doc__textBold',\r\n code: 'mk-doc__textCode',\r\n italic: 'mk-doc__textItalic',\r\n strikethrough: 'mk-doc__textStrikethrough',\r\n subscript: 'mk-doc__textSubscript',\r\n superscript: 'mk-doc__textSuperscript',\r\n underline: 'mk-doc__textUnderline',\r\n underlineStrikethrough: 'mk-doc__textUnderlineStrikethrough',\r\n },\r\n}\r\n\r\nexport default theme\r\n"],"names":[],"mappings":"AAUA,MAAM,QAA4B;AAAA,EAChC,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,MAAM;AAAA,EACN,eAAe;AAAA,IACb,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,cAAc;AAAA,IACd,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,aAAa;AAAA,IACb,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,UAAU;AAAA,IACV,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,EACd;AAAA,EACA,YAAY;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AAAA,EACA,SAAS;AAAA,EACT,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,~~aAAa;AAAA,EACb,~~iBAAiB;AAAA,EACjB,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,UAAU;AAAA,IACV,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,SAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,IAAI;AAAA,EACN;AAAA,EACA,KAAK;AAAA,EACL,MAAM;AAAA,EACN,aAAa;AAAA,EACb,WAAW;AAAA,EACX,OAAO;AAAA,EACP,KAAK;AAAA,EACL,OAAO;AAAA,EACP,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,WAAW;AAAA,EACX,uBAAuB;AAAA,EACvB,gCACE;AAAA,EACF,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,0BAA0B;AAAA,EAC1B,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,0BAA0B;AAAA,EAC1B,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,eAAe;AAAA,IACf,WAAW;AAAA,IACX,aAAa;AAAA,IACb,WAAW;AAAA,IACX,wBAAwB;AAAA,EAC1B;AACF;"}
1	+ {"version":3,"file":"DocTheme.js","sources":["../../../../../../src/components/basic/doc-editor/themes/DocTheme.ts"],"sourcesContent":["/*\r\n Copyright (c) Meta Platforms, Inc. and affiliates.\r\n \r\n This source code is licensed under the MIT license found in the\r\n * LICENSE file in the root directory of this source tree.\r\n \r\n /\r\n\r\nimport type { EditorThemeClasses } from 'lexical'\r\n\r\nconst theme: EditorThemeClasses = {\r\n blockCursor: 'mk-doc__blockCursor',\r\n characterLimit: 'mk-doc__characterLimit',\r\n code: 'mk-doc__code',\r\n codeHighlight: {\r\n 'atrule': 'mk-doc__tokenAttr',\r\n 'attr': 'mk-doc__tokenAttr',\r\n 'boolean': 'mk-doc__tokenProperty',\r\n 'builtin': 'mk-doc__tokenSelector',\r\n 'cdata': 'mk-doc__tokenComment',\r\n 'char': 'mk-doc__tokenSelector',\r\n 'class': 'mk-doc__tokenFunction',\r\n 'class-name': 'mk-doc__tokenFunction',\r\n 'comment': 'mk-doc__tokenComment',\r\n 'constant': 'mk-doc__tokenProperty',\r\n 'deleted': 'mk-doc__tokenProperty',\r\n 'doctype': 'mk-doc__tokenComment',\r\n 'entity': 'mk-doc__tokenOperator',\r\n 'function': 'mk-doc__tokenFunction',\r\n 'important': 'mk-doc__tokenVariable',\r\n 'inserted': 'mk-doc__tokenSelector',\r\n 'keyword': 'mk-doc__tokenAttr',\r\n 'namespace': 'mk-doc__tokenVariable',\r\n 'number': 'mk-doc__tokenProperty',\r\n 'operator': 'mk-doc__tokenOperator',\r\n 'prolog': 'mk-doc__tokenComment',\r\n 'property': 'mk-doc__tokenProperty',\r\n 'punctuation': 'mk-doc__tokenPunctuation',\r\n 'regex': 'mk-doc__tokenVariable',\r\n 'selector': 'mk-doc__tokenSelector',\r\n 'string': 'mk-doc__tokenSelector',\r\n 'symbol': 'mk-doc__tokenProperty',\r\n 'tag': 'mk-doc__tokenProperty',\r\n 'url': 'mk-doc__tokenOperator',\r\n 'variable': 'mk-doc__tokenVariable',\r\n },\r\n embedBlock: {\r\n base: 'mk-doc__embedBlock',\r\n focus: 'mk-doc__embedBlockFocus',\r\n },\r\n hashtag: 'mk-doc__hashtag',\r\n heading: {\r\n h1: 'mk-doc__h1',\r\n h2: 'mk-doc__h2',\r\n h3: 'mk-doc__h3',\r\n h4: 'mk-doc__h4',\r\n h5: 'mk-doc__h5',\r\n h6: 'mk-doc__h6',\r\n },\r\n image: 'mk-doc__img',\r\n indent: 'mk-doc__indent',\r\n layoutContainer: 'mk-doc__layoutContainer',\r\n layoutItem: 'mk-doc__layoutItem',\r\n link: 'mk-doc__link',\r\n list: {\r\n checklist: 'mk-doc__checklist',\r\n listitem: 'mk-doc__listItem',\r\n listitemChecked: 'mk-doc__listItemChecked',\r\n listitemUnchecked: 'mk-doc__listItemUnchecked',\r\n nested: {\r\n listitem: 'mk-doc__nestedListItem',\r\n },\r\n olDepth: [\r\n 'mk-doc__ol1',\r\n 'mk-doc__ol2',\r\n 'mk-doc__ol3',\r\n 'mk-doc__ol4',\r\n 'mk-doc__ol5',\r\n ],\r\n ul: 'mk-doc__ul',\r\n },\r\n ltr: 'mk-doc__ltr',\r\n mark: 'mk-doc__mark',\r\n markOverlap: 'mk-doc__markOverlap',\r\n paragraph: 'mk-doc__paragraph',\r\n quote: 'mk-doc__quote',\r\n rtl: 'mk-doc__rtl',\r\n table: 'mk-doc__table',\r\n tableAddColumns: 'mk-doc__tableAddColumns',\r\n tableAddRows: 'mk-doc__tableAddRows',\r\n tableCell: 'mk-doc__tableCell',\r\n tableCellActionButton: 'mk-doc__tableCellActionButton',\r\n tableCellActionButtonContainer:\r\n 'mk-doc__tableCellActionButtonContainer',\r\n tableCellEditing: 'mk-doc__tableCellEditing',\r\n tableCellHeader: 'mk-doc__tableCellHeader',\r\n tableCellPrimarySelected: 'mk-doc__tableCellPrimarySelected',\r\n tableCellResizer: 'mk-doc__tableCellResizer',\r\n tableCellSelected: 'mk-doc__tableCellSelected',\r\n tableCellSortedIndicator: 'mk-doc__tableCellSortedIndicator',\r\n tableResizeRuler: 'mk-doc__tableCellResizeRuler',\r\n tableSelected: 'mk-doc__tableSelected',\r\n tableSelection: 'mk-doc__tableSelection',\r\n text: {\r\n bold: 'mk-doc__textBold',\r\n code: 'mk-doc__textCode',\r\n italic: 'mk-doc__textItalic',\r\n strikethrough: 'mk-doc__textStrikethrough',\r\n subscript: 'mk-doc__textSubscript',\r\n superscript: 'mk-doc__textSuperscript',\r\n underline: 'mk-doc__textUnderline',\r\n underlineStrikethrough: 'mk-doc__textUnderlineStrikethrough',\r\n },\r\n}\r\n\r\nexport default theme\r\n"],"names":[],"mappings":"AAUA,MAAM,QAA4B;AAAA,EAChC,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,MAAM;AAAA,EACN,eAAe;AAAA,IACb,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,cAAc;AAAA,IACd,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,aAAa;AAAA,IACb,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,UAAU;AAAA,IACV,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,EACd;AAAA,EACA,YAAY;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AAAA,EACA,SAAS;AAAA,EACT,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,iBAAiB;AAAA,EACjB,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,UAAU;AAAA,IACV,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,QAAQ;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,SAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,IAAI;AAAA,EACN;AAAA,EACA,KAAK;AAAA,EACL,MAAM;AAAA,EACN,aAAa;AAAA,EACb,WAAW;AAAA,EACX,OAAO;AAAA,EACP,KAAK;AAAA,EACL,OAAO;AAAA,EACP,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,WAAW;AAAA,EACX,uBAAuB;AAAA,EACvB,gCACE;AAAA,EACF,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,0BAA0B;AAAA,EAC1B,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,0BAA0B;AAAA,EAC1B,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,eAAe;AAAA,IACf,WAAW;AAAA,IACX,aAAa;AAAA,IACb,WAAW;AAAA,IACX,wBAAwB;AAAA,EAC1B;AACF;"}

package/dist/esm/components/basic/doc-editor/themes/doc-editor-edit.css.js ADDED Viewed

@@ -0,0 +1,5 @@
+const DocEditorEditCss = '\r\n.mk-doc__img {\r\n  cursor: pointer;\r\n  z-index: 1;\r\n  position: relative;\r\n}\r\n\r\n\r\n.mk-doc-block-container__module-container{\r\n  cursor: pointer;\r\n  position: relative;\r\n  padding: 1px;\r\n  box-sizing: border-box;\r\n  outline: 2px solid #eff5ff;\r\n  white-space:initial;\r\n  word-break:initial;\r\n}\r\n\r\n.mk-doc-block-container__module-container.empty{\r\n  min-height: 200px;\r\n}\r\n.mk-doc-block-container__module-container::before{\r\n  content: "点此选中模块";\r\n  text-align: center;\r\n  background-color: #eff5ff;\r\n  color: #4284ff;\r\n  position: sticky;\r\n  width: 200px;\r\n  height: 20px;\r\n  left: 0;\r\n  outline: 2px solid #eff5ff;\r\n  top: 0px;\r\n  pointer-events: all;\r\n  white-space: pre-wrap;\r\n  word-break: break-word;\r\n  font-size: 14px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.mk-doc__embedBlock {\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 1px;\r\n  cursor: pointer;\r\n}\r\n.mk-doc__embedBlockFocus {\r\n  outline: 2px solid rgb(60, 132, 244);\r\n}\r\n\r\n.mk-doc__embedBlock >*{\r\n  pointer-events: none;\r\n}\r\n\r\n.mk-doc-active-mark{\r\n  position: absolute;\r\n  box-sizing:border-box;\r\n  background-color:#2776f63b;\r\n  z-index: 99;\r\n}\r\n.mk-doc-active-mark.box{\r\n  outline: 2px solid #2776f63b;\r\n  background-color: transparent;\r\n  pointer-events: none;\r\n}\r\n';
+export {
+  DocEditorEditCss as default
+};
+//# sourceMappingURL=doc-editor-edit.css.js.map

package/dist/esm/components/basic/doc-editor/themes/doc-editor-edit.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"doc-editor-edit.css.js","sources":["../../../../../../src/components/basic/doc-editor/themes/doc-editor-edit.css?raw"],"sourcesContent":["export default \"\\r\\n.mk-doc__img {\\r\\n cursor: pointer;\\r\\n z-index: 1;\\r\\n position: relative;\\r\\n}\\r\\n\\r\\n\\r\\n.mk-doc-block-container__module-container{\\r\\n cursor: pointer;\\r\\n position: relative;\\r\\n padding: 1px;\\r\\n box-sizing: border-box;\\r\\n outline: 2px solid #eff5ff;\\r\\n white-space:initial;\\r\\n word-break:initial;\\r\\n}\\r\\n\\r\\n.mk-doc-block-container__module-container.empty{\\r\\n min-height: 200px;\\r\\n}\\r\\n.mk-doc-block-container__module-container::before{\\r\\n content: \\\"点此选中模块\\\";\\r\\n text-align: center;\\r\\n background-color: #eff5ff;\\r\\n color: #4284ff;\\r\\n position: sticky;\\r\\n width: 200px;\\r\\n height: 20px;\\r\\n left: 0;\\r\\n outline: 2px solid #eff5ff;\\r\\n top: 0px;\\r\\n pointer-events: all;\\r\\n white-space: pre-wrap;\\r\\n word-break: break-word;\\r\\n font-size: 14px;\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: center;\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock {\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 1px;\\r\\n cursor: pointer;\\r\\n}\\r\\n.mk-doc__embedBlockFocus {\\r\\n outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock >*{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n.mk-doc-active-mark{\\r\\n position: absolute;\\r\\n box-sizing:border-box;\\r\\n background-color:#2776f63b;\\r\\n z-index: 99;\\r\\n}\\r\\n.mk-doc-active-mark.box{\\r\\n outline: 2px solid #2776f63b;\\r\\n background-color: transparent;\\r\\n pointer-events: none;\\r\\n}\\r\\n\""],"names":[],"mappings":"AAAA,MAAe,mBAAA;"}

package/dist/esm/components/basic/doc-editor/themes/doc-editor.css.js CHANGED Viewed

@@ -1,4 +1,4 @@
-const DocEditorCss = "html,body{\r\n  width:100%;\r\n  height:100%;\r\n  padding:0px;\r\n  margin:0px;\r\n  position: relative;\r\n  font-size: 14px;\r\n  color:#000;\r\n  overflow: hidden;\r\n}\r\nbody{\r\n  box-sizing: border-box;\r\n}\r\n.mk-doc-editor__stage__editable{\r\n  width: 100%;\r\n  min-height: 100%;\r\n  margin: auto;\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 10px 20px;\r\n  box-sizing: border-box;\r\n}\r\n.mk-doc-editor__stage__editable .mk-doc-editor-stage{\r\n  z-index: 1;\r\n  position: relative;\r\n  width: 100%;\r\n  min-height: 80%;\r\n  outline: 0;\r\n  border: 0;\r\n}\r\n.mk-doc-editor__stage__editable .mk-doc-editor__stage__placeholder{\r\n  position: absolute;\r\n  top: 10px;\r\n  left:20px;\r\n  z-index: 0;    \r\n  color: #ccc;\r\n}\r\n\r\n\r\n.mk-doc-active-mark{\r\n  position: absolute;\r\n  box-sizing:border-box;\r\n  background-color:#2776f63b;\r\n  pointer-events: none;\r\n  z-index: 1;\r\n}\r\n\r\n.mk-doc-loading-mark{\r\n  position: absolute;\r\n  box-sizing:border-box;\r\n  background-color:#201d1dd6;\r\n  pointer-events: none;\r\n  left: 0;\r\n  top: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  z-index: 2;    \r\n  display: flex;\r\n  align-items: center;\r\n  align-content: center;\r\n  justify-content: center;\r\n  color: #fff;\r\n}\r\n\r\n.mk-doc__embedBlock {\r\n  user-select: none;\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 1px;\r\n}\r\n.mk-doc__embedBlockFocus {\r\n  outline: 2px solid rgb(60, 132, 244);\r\n}\r\n\r\n.mk-doc-html-block >*{\r\n  user-select: none;\r\n  pointer-events: none;;\r\n}\r\n";
+const DocEditorCss = "html,body{\r\n  width:100%;\r\n  height:100%;\r\n  padding:0px;\r\n  margin:0px;\r\n  position: relative;\r\n  font-size: 14px;\r\n  color:#000;\r\n  overflow: hidden;\r\n}\r\nbody{\r\n  box-sizing: border-box;\r\n}\r\n.mk-doc-editor__stage__editable{\r\n  width: 100%;\r\n  min-height: 100%;\r\n  margin: auto;\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 10px 20px;\r\n  box-sizing: border-box;\r\n}\r\n.mk-doc-editor__stage__editable .mk-doc-editor-stage{\r\n  z-index: 1;\r\n  position: relative;\r\n  width: 100%;\r\n  min-height: 80%;\r\n  outline: 0;\r\n  border: 0;\r\n}\r\n.mk-doc-editor__stage__editable .mk-doc-editor__stage__placeholder{\r\n  position: absolute;\r\n  top: 10px;\r\n  left:20px;\r\n  z-index: 0;    \r\n  color: #ccc;\r\n}\r\n ";
 export {
   DocEditorCss as default
 };

package/dist/esm/components/basic/doc-editor/themes/doc-editor.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"doc-editor.css.js","sources":["../../../../../../src/components/basic/doc-editor/themes/doc-editor.css?raw"],"sourcesContent":["export default \"html,body{\\r\\n width:100%;\\r\\n height:100%;\\r\\n padding:0px;\\r\\n margin:0px;\\r\\n position: relative;\\r\\n font-size: 14px;\\r\\n color:#000;\\r\\n overflow: hidden;\\r\\n}\\r\\nbody{\\r\\n box-sizing: border-box;\\r\\n}\\r\\n.mk-doc-editor__stage__editable{\\r\\n width: 100%;\\r\\n min-height: 100%;\\r\\n margin: auto;\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 10px 20px;\\r\\n box-sizing: border-box;\\r\\n}\\r\\n.mk-doc-editor__stage__editable .mk-doc-editor-stage{\\r\\n z-index: 1;\\r\\n position: relative;\\r\\n width: 100%;\\r\\n min-height: 80%;\\r\\n outline: 0;\\r\\n border: 0;\\r\\n}\\r\\n.mk-doc-editor__stage__editable .mk-doc-editor__stage__placeholder{\\r\\n position: absolute;\\r\\n top: 10px;\\r\\n left:20px;\\r\\n z-index: 0; \\r\\n color: #ccc;\\r\\n}\\r\\n~~\\r\\n\\r\\n.mk-doc-active-mark{\\r\\n position:~~ absolute;\\r\\n box-sizing:border-box;\\r\\n background-color:#2776f63b;\\r\\n pointer-events: none;\\r\\n z-index: 1;\\r\\n}\\r\\n\\r\\n.mk-doc-loading-mark{\\r\\n position: absolute;\\r\\n box-sizing:border-box;\\r\\n background-color:#201d1dd6;\\r\\n pointer-events: none;\\r\\n left: 0;\\r\\n top: 0;\\r\\n width: 100%;\\r\\n height: 100%;\\r\\n z-index: 2; \\r\\n display: flex;\\r\\n align-items: center;\\r\\n align-content: center;\\r\\n justify-content: center;\\r\\n color: #fff;\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock {\\r\\n user-select: none;\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 1px;\\r\\n}\\r\\n.mk-doc__embedBlockFocus {\\r\\n outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n\\r\\n.mk-doc-html-block >*{\\r\\n user-select: none;\\r\\n pointer-events: none;;\\r\\n}\\r\\n\""],"names":[],"mappings":"AAAA,MAAe,eAAA;"}
1	+ {"version":3,"file":"doc-editor.css.js","sources":["../../../../../../src/components/basic/doc-editor/themes/doc-editor.css?raw"],"sourcesContent":["export default \"html,body{\\r\\n width:100%;\\r\\n height:100%;\\r\\n padding:0px;\\r\\n margin:0px;\\r\\n position: relative;\\r\\n font-size: 14px;\\r\\n color:#000;\\r\\n overflow: hidden;\\r\\n}\\r\\nbody{\\r\\n box-sizing: border-box;\\r\\n}\\r\\n.mk-doc-editor__stage__editable{\\r\\n width: 100%;\\r\\n min-height: 100%;\\r\\n margin: auto;\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 10px 20px;\\r\\n box-sizing: border-box;\\r\\n}\\r\\n.mk-doc-editor__stage__editable .mk-doc-editor-stage{\\r\\n z-index: 1;\\r\\n position: relative;\\r\\n width: 100%;\\r\\n min-height: 80%;\\r\\n outline: 0;\\r\\n border: 0;\\r\\n}\\r\\n.mk-doc-editor__stage__editable .mk-doc-editor__stage__placeholder{\\r\\n position: absolute;\\r\\n top: 10px;\\r\\n left:20px;\\r\\n z-index: 0; \\r\\n color: #ccc;\\r\\n}\\r\\n \""],"names":[],"mappings":"AAAA,MAAe,eAAA;"}

package/dist/esm/components/basic/doc-editor/themes/doc-theme.css.js CHANGED Viewed

@@ -7,8 +7,6 @@ const DocThemeCss = `\r
 }\r
 .mk-doc__paragraph {\r
   margin: 0;\r
-  position: relative;\r
-  line-height: 2em;\r
 }\r
 .mk-doc__quote {\r
   margin: 0;\r
@@ -280,36 +278,36 @@ const DocThemeCss = `\r
 .mk-doc__ol1 {\r
   padding: 0;\r
   margin: 0;\r
-  list-style-position: inside;\r
+  /* list-style-position: inside; */\r
 }\r
 .mk-doc__ol2 {\r
   padding: 0;\r
   margin: 0;\r
   list-style-type: upper-alpha;\r
-  list-style-position: inside;\r
+  /* list-style-position: inside; */\r
 }\r
 .mk-doc__ol3 {\r
   padding: 0;\r
   margin: 0;\r
   list-style-type: lower-alpha;\r
-  list-style-position: inside;\r
+  /* list-style-position: inside; */\r
 }\r
 .mk-doc__ol4 {\r
   padding: 0;\r
   margin: 0;\r
   list-style-type: upper-roman;\r
-  list-style-position: inside;\r
+  /* list-style-position: inside; */\r
 }\r
 .mk-doc__ol5 {\r
   padding: 0;\r
   margin: 0;\r
   list-style-type: lower-roman;\r
-  list-style-position: inside;\r
+  /* list-style-position: inside; */\r
 }\r
 .mk-doc__ul {\r
   padding: 0;\r
   margin: 0;\r
-  list-style-position: inside;\r
+  /* list-style-position: inside; */\r
 }\r
 .mk-doc__listItem {\r
   margin: 0 32px;\r
@@ -432,20 +430,16 @@ const DocThemeCss = `\r
   padding: 8px 16px;\r
 }\r
 \r
-/* block结构 */\r
-.mk-doc-block{\r
-  position: relative;\r
-}\r
-.mk-doc-block.mk-doc-block-image-text::after{\r
+\r
+.mk-doc__image-text::after,.mk-doc-block-container__module-container::after{\r
   content: ".";\r
   font-size: 0;\r
   clear: both;\r
   display: block;\r
 }\r
-.mk-doc-html-block {\r
+.mk-doc-block-container__module-container {\r
   line-height: normal;\r
 }\r
-\r
 `;
 export {
   DocThemeCss as default