@maketribe/ms-app 3.2.32 → 3.2.34

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/ContentStyleTool.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContentStyleTool.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/ContentStyleTool.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport {\r\n  $createParagraphNode,\r\n  $getSelection,\r\n  $isRangeSelection,\r\n  $isRootOrShadowRoot\r\n} from 'lexical'\r\nimport { $patchStyleText,$setBlocksType } from '@lexical/selection'\r\nimport type { HeadingTagType } from '@lexical/rich-text'\r\nimport { $createHeadingNode,$isHeadingNode } from '@lexical/rich-text'\r\nimport { \r\n  INSERT_CHECK_LIST_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, \r\n} from '@lexical/list'\r\nimport { $findMatchingParent } from '@lexical/utils'\r\nimport {  useLexicalComposer } from 'lexical-vue'\r\nimport { onMounted, onUnmounted, ref } from 'vue'\r\n\r\nconst editor = useLexicalComposer()\r\n\r\n// 内容类型\r\nconst CONTENT_TYPE_DEFINES = [\r\n  {value:\"paragraph\",label:\"正文\"},\r\n  {value:\"bullet\",label:\"无序列表\"},\r\n  {value:\"number\",label:\"有序列表\"},\r\n  {value:\"h1\",label:\"标题 1\"},\r\n  {value:\"h2\",label:\"标题 2\"},\r\n  {value:\"h3\",label:\"标题 3\"}\r\n];\r\n\r\nconst disabled = ref(false)\r\n\r\nconst contentType = ref<any>(CONTENT_TYPE_DEFINES[0]);\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\r\n        = 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    if (element === null){ element = anchorNode.getTopLevelElementOrThrow() }\r\n      \r\n    const elementKey = element.getKey()\r\n    const elementDOM = editor.getElementByKey(elementKey)\r\n\r\n    if (elementDOM !== null) {\r\n      const type = $isHeadingNode(element) ? element.getTag() : element.getType();\r\n      contentType.value = CONTENT_TYPE_DEFINES.find(item=>item.value == type) || CONTENT_TYPE_DEFINES[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 setContentType = (type:any)=>{\r\n\r\n  contentType.value = type;\r\n   \r\n  editor.update(() => {\r\n\r\n      const selection = $getSelection()\r\n   \r\n      if ($isRangeSelection(selection)){\r\n\r\n        // 清空字体大小\r\n        $patchStyleText(selection, { [\"font-size\"]:\"\" })\r\n   \r\n        if(type.value == \"paragraph\"){\r\n          $setBlocksType(selection, () => $createParagraphNode())\r\n        }\r\n        else if(type.value == \"bullet\"){\r\n          editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, undefined)\r\n        }\r\n        else if(type.value == \"bullet\"){\r\n          editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, undefined)\r\n        }\r\n        else if(type.value == \"check-list\"){\r\n          editor.dispatchCommand(INSERT_CHECK_LIST_COMMAND, undefined)\r\n        }\r\n        else{\r\n          $setBlocksType(selection, () => {\r\n            return $createHeadingNode(type.value as  HeadingTagType)\r\n          })\r\n        }\r\n      }\r\n  })\r\n}\r\n\r\n// 挂载的时候\r\nonMounted(() => {\r\n\r\nconst unregisterMergeListener = editor.registerUpdateListener(({ editorState }) => {\r\n  editorState.read(() => updateToolbar())\r\n})\r\n\r\n\r\nonUnmounted(() => unregisterMergeListener());\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n  <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n    <el-button text :disabled=\"disabled\">\r\n      {{contentType.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:contentType.label == item.label}\" :disabled=\"disabled\" v-for=\"item in CONTENT_TYPE_DEFINES\" :value=\"item.value\" @click=\"setContentType(item)\">\r\n          <template v-if=\"item.value.indexOf('h')!=0 \">\r\n            <div class=\"mk-doc-editor-toolbar-content-style-item text\">{{item.label}}</div>\r\n          </template>\r\n          <template v-else>\r\n           <div class=\"mk-doc-editor-toolbar-content-style-item\" v-html=\"`<${item.value}>${item.label}</${item.value}>`\"></div>\r\n          </template>\r\n        </el-dropdown-item>\r\n      </el-dropdown-menu>\r\n    </template>\r\n  </el-dropdown>\r\n</template>\r\n"],"names":["useLexicalComposer","ref","selection","$getSelection","$isRangeSelection","$findMatchingParent","$isRootOrShadowRoot","$isHeadingNode","$patchStyleText","$setBlocksType","$createParagraphNode","INSERT_UNORDERED_LIST_COMMAND","INSERT_ORDERED_LIST_COMMAND","INSERT_CHECK_LIST_COMMAND","$createHeadingNode","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;AAiBA,UAAM,SAASA,WAAAA;AAGf,UAAM,uBAAuB;AAAA,MAC3B,EAAC,OAAM,aAAY,OAAM,KAAI;AAAA,MAC7B,EAAC,OAAM,UAAS,OAAM,OAAM;AAAA,MAC5B,EAAC,OAAM,UAAS,OAAM,OAAM;AAAA,MAC5B,EAAC,OAAM,MAAK,OAAM,OAAM;AAAA,MACxB,EAAC,OAAM,MAAK,OAAM,OAAM;AAAA,MACxB,EAAC,OAAM,MAAK,OAAM,OAAM;AAAA,IAAA;AAGpB,UAAA,WAAWC,QAAI,KAAK;AAE1B,UAAM,cAAcA,IAAA,IAAS,qBAAqB,CAAC,CAAC;AAKpD,aAAS,gBAAgB;AAEvB,YAAMC,aAAYC,QAAAA;AAEd,UAAAC,QAAAA,kBAAkBF,UAAS,GAAG;AAE1B,cAAA,aAAaA,WAAU,OAAO,QAAQ;AAExC,YAAA,UACE,WAAW,aAAa,SACtB,aACAG,MAAA,oBAAoB,YAAY,CAAC,MAAM;AACjC,gBAAA,SAAS,EAAE;AACV,iBAAA,WAAW,QAAQC,QAAA,oBAAoB,MAAM;AAAA,QAAA,CACrD;AAEP,YAAI,YAAY,MAAK;AAAE,oBAAU,WAAW;QAA4B;AAElE,cAAA,aAAa,QAAQ;AACrB,cAAA,aAAa,OAAO,gBAAgB,UAAU;AAEpD,YAAI,eAAe,MAAM;AACjB,gBAAA,OAAOC,wBAAe,OAAO,IAAI,QAAQ,OAAO,IAAI,QAAQ;AACtD,sBAAA,QAAQ,qBAAqB,KAAK,CAAA,SAAM,KAAK,SAAS,IAAI,KAAK,qBAAqB,CAAC;AAAA,QACnG;AACA,iBAAS,QAAQ;AAAA,MAAA,OAEf;AAEF,iBAAS,QAAQ;AAAA,MACnB;AAAA,IACF;AAGM,UAAA,iBAAiB,CAAC,SAAW;AAEjC,kBAAY,QAAQ;AAEpB,aAAO,OAAO,MAAM;AAEhB,cAAML,cAAYC,QAAAA;AAEd,YAAAC,QAAAA,kBAAkBF,WAAS,GAAE;AAG/BM,oBAAAA,gBAAgBN,aAAW,EAAE,CAAC,WAAW,GAAE,GAAI,CAAA;AAE5C,cAAA,KAAK,SAAS,aAAY;AACZO,sBAAAA,eAAAP,aAAW,MAAMQ,QAAA,qBAAA,CAAsB;AAAA,UAAA,WAEhD,KAAK,SAAS,UAAS;AACtB,mBAAA,gBAAgBC,oCAA+B,MAAS;AAAA,UAAA,WAEzD,KAAK,SAAS,UAAS;AACtB,mBAAA,gBAAgBC,kCAA6B,MAAS;AAAA,UAAA,WAEvD,KAAK,SAAS,cAAa;AAC1B,mBAAA,gBAAgBC,gCAA2B,MAAS;AAAA,UAAA,OAEzD;AACFJ,sBAAA,eAAeP,aAAW,MAAM;AACvB,qBAAAY,SAAA,mBAAmB,KAAK,KAAwB;AAAA,YAAA,CACxD;AAAA,UACH;AAAA,QACF;AAAA,MAAA,CACH;AAAA,IAAA;AAIHC,QAAAA,UAAU,MAAM;AAEhB,YAAM,0BAA0B,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACrE,oBAAA,KAAK,MAAM,cAAA,CAAe;AAAA,MAAA,CACvC;AAGWC,sBAAA,MAAM,yBAAyB;AAAA,IAAA,CAC1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ContentStyleTool.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/ContentStyleTool.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport {\r\n  $createParagraphNode,\r\n  $getSelection,\r\n  $isRangeSelection,\r\n  $isRootOrShadowRoot\r\n} from 'lexical'\r\nimport { $patchStyleText,$setBlocksType } from '@lexical/selection'\r\nimport type { HeadingTagType } from '@lexical/rich-text'\r\nimport { $createHeadingNode,$isHeadingNode } from '@lexical/rich-text'\r\nimport { \r\n  INSERT_CHECK_LIST_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, \r\n} from '@lexical/list'\r\nimport { $findMatchingParent } from '@lexical/utils'\r\nimport {  useLexicalComposer } from '../../core/composables'\r\nimport { onMounted, onUnmounted, ref } from 'vue'\r\n\r\nconst editor = useLexicalComposer()\r\n\r\n// 内容类型\r\nconst CONTENT_TYPE_DEFINES = [\r\n  {value:\"paragraph\",label:\"正文\"},\r\n  {value:\"bullet\",label:\"无序列表\"},\r\n  {value:\"number\",label:\"有序列表\"},\r\n  {value:\"h1\",label:\"标题 1\"},\r\n  {value:\"h2\",label:\"标题 2\"},\r\n  {value:\"h3\",label:\"标题 3\"}\r\n];\r\n\r\nconst disabled = ref(false)\r\n\r\nconst contentType = ref<any>(CONTENT_TYPE_DEFINES[0]);\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\r\n        = 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    if (element === null){ element = anchorNode.getTopLevelElementOrThrow() }\r\n      \r\n    const elementKey = element.getKey()\r\n    const elementDOM = editor.getElementByKey(elementKey)\r\n\r\n    if (elementDOM !== null) {\r\n      const type = $isHeadingNode(element) ? element.getTag() : element.getType();\r\n      contentType.value = CONTENT_TYPE_DEFINES.find(item=>item.value == type) || CONTENT_TYPE_DEFINES[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 setContentType = (type:any)=>{\r\n\r\n  contentType.value = type;\r\n   \r\n  editor.update(() => {\r\n\r\n      const selection = $getSelection()\r\n   \r\n      if ($isRangeSelection(selection)){\r\n\r\n        // 清空字体大小\r\n        $patchStyleText(selection, { [\"font-size\"]:\"\" })\r\n   \r\n        if(type.value == \"paragraph\"){\r\n          $setBlocksType(selection, () => $createParagraphNode())\r\n        }\r\n        else if(type.value == \"bullet\"){\r\n          editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, undefined)\r\n        }\r\n        else if(type.value == \"bullet\"){\r\n          editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, undefined)\r\n        }\r\n        else if(type.value == \"check-list\"){\r\n          editor.dispatchCommand(INSERT_CHECK_LIST_COMMAND, undefined)\r\n        }\r\n        else{\r\n          $setBlocksType(selection, () => {\r\n            return $createHeadingNode(type.value as  HeadingTagType)\r\n          })\r\n        }\r\n      }\r\n  })\r\n}\r\n\r\n// 挂载的时候\r\nonMounted(() => {\r\n\r\nconst unregisterMergeListener = editor.registerUpdateListener(({ editorState }) => {\r\n  editorState.read(() => updateToolbar())\r\n})\r\n\r\n\r\nonUnmounted(() => unregisterMergeListener());\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n  <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n    <el-button text :disabled=\"disabled\">\r\n      {{contentType.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:contentType.label == item.label}\" v-for=\"item in CONTENT_TYPE_DEFINES\" :value=\"item.value\" @click=\"setContentType(item)\">\r\n          <template v-if=\"item.value.indexOf('h')!=0 \">\r\n            <div class=\"mk-doc-editor-toolbar-content-style-item text\">{{item.label}}</div>\r\n          </template>\r\n          <template v-else>\r\n           <div class=\"mk-doc-editor-toolbar-content-style-item\" v-html=\"`<${item.value}>${item.label}</${item.value}>`\"></div>\r\n          </template>\r\n        </el-dropdown-item>\r\n      </el-dropdown-menu>\r\n    </template>\r\n  </el-dropdown>\r\n</template>\r\n"],"names":["useLexicalComposer","ref","selection","$getSelection","$isRangeSelection","$findMatchingParent","$isRootOrShadowRoot","$isHeadingNode","$patchStyleText","$setBlocksType","$createParagraphNode","INSERT_UNORDERED_LIST_COMMAND","INSERT_ORDERED_LIST_COMMAND","INSERT_CHECK_LIST_COMMAND","$createHeadingNode","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAiBA,UAAM,SAASA,mBAAAA;AAGf,UAAM,uBAAuB;AAAA,MAC3B,EAAC,OAAM,aAAY,OAAM,KAAI;AAAA,MAC7B,EAAC,OAAM,UAAS,OAAM,OAAM;AAAA,MAC5B,EAAC,OAAM,UAAS,OAAM,OAAM;AAAA,MAC5B,EAAC,OAAM,MAAK,OAAM,OAAM;AAAA,MACxB,EAAC,OAAM,MAAK,OAAM,OAAM;AAAA,MACxB,EAAC,OAAM,MAAK,OAAM,OAAM;AAAA,IAAA;AAGpB,UAAA,WAAWC,QAAI,KAAK;AAE1B,UAAM,cAAcA,IAAA,IAAS,qBAAqB,CAAC,CAAC;AAKpD,aAAS,gBAAgB;AAEvB,YAAMC,aAAYC,QAAAA;AAEd,UAAAC,QAAAA,kBAAkBF,UAAS,GAAG;AAE1B,cAAA,aAAaA,WAAU,OAAO,QAAQ;AAExC,YAAA,UACE,WAAW,aAAa,SACtB,aACAG,MAAA,oBAAoB,YAAY,CAAC,MAAM;AACjC,gBAAA,SAAS,EAAE;AACV,iBAAA,WAAW,QAAQC,QAAA,oBAAoB,MAAM;AAAA,QAAA,CACrD;AAEP,YAAI,YAAY,MAAK;AAAE,oBAAU,WAAW;QAA4B;AAElE,cAAA,aAAa,QAAQ;AACrB,cAAA,aAAa,OAAO,gBAAgB,UAAU;AAEpD,YAAI,eAAe,MAAM;AACjB,gBAAA,OAAOC,wBAAe,OAAO,IAAI,QAAQ,OAAO,IAAI,QAAQ;AACtD,sBAAA,QAAQ,qBAAqB,KAAK,CAAA,SAAM,KAAK,SAAS,IAAI,KAAK,qBAAqB,CAAC;AAAA,QACnG;AACA,iBAAS,QAAQ;AAAA,MAAA,OAEf;AAEF,iBAAS,QAAQ;AAAA,MACnB;AAAA,IACF;AAGM,UAAA,iBAAiB,CAAC,SAAW;AAEjC,kBAAY,QAAQ;AAEpB,aAAO,OAAO,MAAM;AAEhB,cAAML,cAAYC,QAAAA;AAEd,YAAAC,QAAAA,kBAAkBF,WAAS,GAAE;AAG/BM,oBAAAA,gBAAgBN,aAAW,EAAE,CAAC,WAAW,GAAE,GAAI,CAAA;AAE5C,cAAA,KAAK,SAAS,aAAY;AACZO,sBAAAA,eAAAP,aAAW,MAAMQ,QAAA,qBAAA,CAAsB;AAAA,UAAA,WAEhD,KAAK,SAAS,UAAS;AACtB,mBAAA,gBAAgBC,oCAA+B,MAAS;AAAA,UAAA,WAEzD,KAAK,SAAS,UAAS;AACtB,mBAAA,gBAAgBC,kCAA6B,MAAS;AAAA,UAAA,WAEvD,KAAK,SAAS,cAAa;AAC1B,mBAAA,gBAAgBC,gCAA2B,MAAS;AAAA,UAAA,OAEzD;AACFJ,sBAAA,eAAeP,aAAW,MAAM;AACvB,qBAAAY,SAAA,mBAAmB,KAAK,KAAwB;AAAA,YAAA,CACxD;AAAA,UACH;AAAA,QACF;AAAA,MAAA,CACH;AAAA,IAAA;AAIHC,QAAAA,UAAU,MAAM;AAEhB,YAAM,0BAA0B,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACrE,oBAAA,KAAK,MAAM,cAAA,CAAe;AAAA,MAAA,CACvC;AAGWC,sBAAA,MAAM,yBAAyB;AAAA,IAAA,CAC1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue.js

@@ -6,13 +6,21 @@ const link = require("@lexical/link");
 const url = require("../../utils/url.js");
 const getSelectedNode = require("../../utils/getSelectedNode.js");
 const utils = require("@lexical/utils");
-const lexicalVue = require("lexical-vue");
+require("@lexical/text");
+require("@lexical/overflow");
+require("tiny-invariant");
+require("@lexical/history");
+const useLexicalComposer = require("../../core/composables/useLexicalComposer.js");
+require("@lexical/list");
+require("@lexical/dragon");
+require("@lexical/plain-text");
+require("@lexical/rich-text");
 const FontStyleDefines = require("./FontStyleDefines.js");
 const LinkEditDialog = require("../AutoLinkPlugin/LinkEditDialog.js");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "FontStyleTool",
   setup(__props) {
-    const editor = lexicalVue.useLexicalComposer();
+    const editor = useLexicalComposer.useLexicalComposer();
     const fontSize = vue.ref("14px");
     const fontColor = vue.ref("#000");
     const bgColor = vue.ref("#fff");

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue.js.map

@@ -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  $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\nconst isSubscript = ref(false)\r\nconst isSuperscript = 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    isSubscript.value = selection.hasFormat('subscript')\r\n    isSuperscript.value = selection.hasFormat('superscript')\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\nconst setFontColor = (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\nconst setBgColor = (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\n// 挂载的时候\r\nonMounted(() => {\r\n\r\n  const unregisterMergeListener = mergeRegister(\r\n    editor.registerUpdateListener(({ editorState }) => {\r\n      editorState.read(() => updateToolbar())\r\n    })\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\" @change=\"setFontColor\"  />\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\" @change=\"setBgColor\" /> \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 :disabled=\"disabled\" text :class=\"`${isSubscript ? 'active' : ''}`\"  @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND,  'subscript')\">\r\n        <MKSvgIcon iconClass=\"doc-sub\" /> \r\n      </el-button>\r\n      <el-button :disabled=\"disabled\" text :class=\"`${isSuperscript ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND,  'superscript')\">\r\n        <MKSvgIcon iconClass=\"doc-sup\" /> \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":["useLexicalComposer","ref","FONT_FAMILY_OPTIONS","ShowLinkEditPanel","TOGGLE_LINK_COMMAND","sanitizeUrl","selection","$getSelection","$isRangeSelection","$findMatchingParent","parent","$isRootOrShadowRoot","$getSelectionStyleValueForProperty","ROOT_FONT_SIZE","getSelectedNode","$isLinkNode","$patchStyleText","onMounted","mergeRegister","onUnmounted"],"mappings":"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"}
+{"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 '../../core/composables'\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\nconst isSubscript = ref(false)\r\nconst isSuperscript = 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    isSubscript.value = selection.hasFormat('subscript')\r\n    isSuperscript.value = selection.hasFormat('superscript')\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\nconst setFontColor = (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\nconst setBgColor = (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\n// 挂载的时候\r\nonMounted(() => {\r\n\r\n  const unregisterMergeListener = mergeRegister(\r\n    editor.registerUpdateListener(({ editorState }) => {\r\n      editorState.read(() => updateToolbar())\r\n    })\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\" @change=\"setFontColor\"  />\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\" @change=\"setBgColor\" /> \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 :disabled=\"disabled\" text :class=\"`${isSubscript ? 'active' : ''}`\"  @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND,  'subscript')\">\r\n        <MKSvgIcon iconClass=\"doc-sub\" /> \r\n      </el-button>\r\n      <el-button :disabled=\"disabled\" text :class=\"`${isSuperscript ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND,  'superscript')\">\r\n        <MKSvgIcon iconClass=\"doc-sup\" /> \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":["useLexicalComposer","ref","FONT_FAMILY_OPTIONS","ShowLinkEditPanel","TOGGLE_LINK_COMMAND","sanitizeUrl","selection","$getSelection","$isRangeSelection","$findMatchingParent","parent","$isRootOrShadowRoot","$getSelectionStyleValueForProperty","ROOT_FONT_SIZE","getSelectedNode","$isLinkNode","$patchStyleText","onMounted","mergeRegister","onUnmounted"],"mappings":"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"}

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js

@@ -1,11 +1,22 @@
 "use strict";
 const vue = require("vue");
-const lexicalVue = require("lexical-vue");
+require("@lexical/text");
+require("@lexical/utils");
+require("@lexical/overflow");
+require("lexical");
+require("tiny-invariant");
+require("@lexical/history");
+const useLexicalComposer = require("../../core/composables/useLexicalComposer.js");
+require("@lexical/list");
+require("@lexical/dragon");
+require("@lexical/plain-text");
+require("@lexical/rich-text");
 const html = require("@lexical/html");
 const index = require("../../core/index.js");
 const docTheme = require("../../themes/doc-theme.css.js");
 const docEditor = require("../../themes/doc-editor.css.js");
-const composables = require("../ModulePlugin/composables.js");
+const composables$1 = require("../ModulePlugin/composables.js");
+const composables = require("../TemplatePlugin/composables.js");
 const _hoisted_1 = /* @__PURE__ */ vue.createElementVNode("div", null, null, -1);
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "PreviewToolbar",
@@ -14,7 +25,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     css: { type: String, default: `` }
   },
   setup(__props) {
-    const editor = lexicalVue.useLexicalComposer();
+    const editor = useLexicalComposer.useLexicalComposer();
+    const { Modules } = composables$1.useModule();
     const props = __props;
     const iframeContentRef = vue.ref(null);
     const iframeBody = vue.computed(() => {
@@ -35,7 +47,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           const style = document.createElement("style");
           style.setAttribute("type", "text/css");
           style.innerHTML = [docEditor, docTheme].join("\r\n");
-          style.innerHTML += composables.useModules().filter((item) => item.editorCss).map((item) => item.editorCss).join("\r\n");
+          style.innerHTML += Modules.filter((item) => item.editorCss).map((item) => item.editorCss).join("\r\n");
+          style.innerHTML += composables.Templates.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");

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js.map

@@ -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 { $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      // 样式\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":["useLexicalComposer","ref","computed","nextTick","DocEditorCss","DocThemeCss","useModules","DEVICE_VIEW_MODE","$generateHtmlFromNodes","_a"],"mappings":";;;;;;;;;;;;;;;;AAUA,UAAM,SAASA,WAAAA;AAEf,UAAM,QAAQ;AAKR,UAAA,mBAAmBC,QAAI,IAAW;AACxC,UAAM,aAAaC,IAAc,SAAA;;AAAI,gDAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC,aAAvC,mBAAiD;AAAA,KAAI;AAEpF,UAAA,oBAAoBD,QAAI,KAAK;AACpBA,QAAAA,IAAI,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;AAE1BE,UAAAA,SAAS,MAAI;AAEJ,eAAA,iBAAiB,KAAK,MAAM;;AAE3B,gBAAA,OAAM,4BAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC;AAG7C,gBAAA,QAAQ,SAAS,cAAc,OAAO;AACtC,gBAAA,aAAa,QAAO,UAAU;AAGpC,gBAAM,YAAY,CAACC,WAAaC,QAAW,EAAE,KAAK,MAAM;AAExD,gBAAM,aAAaC,YAAA,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,WAAWC,MAAiB,iBAAA,SAAS,OAAO,SAAS;AAGxE,cAAA,KAAK,YAAYC,KAAA,uBAAuB,MAAM;AAElD,qBAAW,MAAM;;AACf,gBAAG,WAAW,MAAM,eAAe,WAAW,MAAM,cAAa;AAC/D,+BAAiB,MAAM,MAAM,WAAUC,MAAA,WAAW,UAAX,gBAAAA,IAAkB,gBAAe,KAAI;AAAA,YAC9E;AAAA,aACC,GAAG;AAAA,QAAA,CACP;AAAA,MAAA,CACF;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"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 '../../core/composables'\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 { useModule } from \"../ModulePlugin/composables\"\r\nimport { Templates } from \"../TemplatePlugin/composables\"\r\n\r\nconst editor = useLexicalComposer()\r\nconst { Modules } = useModule();\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      // 样式\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 += Modules.filter(item=>item.editorCss).map(item=>item.editorCss).join(\"\\r\\n\");\r\n      // 模版样式\r\n      style.innerHTML += Templates.filter(item=>item.editorCss).map(item=>item.editorCss).join(\"\\r\\n\");\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":["useLexicalComposer","useModule","ref","computed","nextTick","DocEditorCss","DocThemeCss","Templates","DEVICE_VIEW_MODE","$generateHtmlFromNodes","_a"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,UAAM,SAASA,mBAAAA;AACT,UAAA,EAAE,YAAYC,cAAAA;AAEpB,UAAM,QAAQ;AAKR,UAAA,mBAAmBC,QAAI,IAAW;AACxC,UAAM,aAAaC,IAAc,SAAA;;AAAI,gDAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC,aAAvC,mBAAiD;AAAA,KAAI;AAEpF,UAAA,oBAAoBD,QAAI,KAAK;AACpBA,QAAAA,IAAI,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;AAE1BE,UAAAA,SAAS,MAAI;AAEJ,eAAA,iBAAiB,KAAK,MAAM;;AAE3B,gBAAA,OAAM,4BAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC;AAG7C,gBAAA,QAAQ,SAAS,cAAc,OAAO;AACtC,gBAAA,aAAa,QAAO,UAAU;AAGpC,gBAAM,YAAY,CAACC,WAAaC,QAAW,EAAE,KAAK,MAAM;AAExD,gBAAM,aAAa,QAAQ,OAAO,CAAA,SAAM,KAAK,SAAS,EAAE,IAAI,CAAM,SAAA,KAAK,SAAS,EAAE,KAAK,MAAM;AAE7F,gBAAM,aAAaC,YAAA,UAAU,OAAO,CAAA,SAAM,KAAK,SAAS,EAAE,IAAI,CAAM,SAAA,KAAK,SAAS,EAAE,KAAK,MAAM;AAE3F,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,WAAWC,MAAiB,iBAAA,SAAS,OAAO,SAAS;AAGxE,cAAA,KAAK,YAAYC,KAAA,uBAAuB,MAAM;AAElD,qBAAW,MAAM;;AACf,gBAAG,WAAW,MAAM,eAAe,WAAW,MAAM,cAAa;AAC/D,+BAAiB,MAAM,MAAM,WAAUC,MAAA,WAAW,UAAX,gBAAAA,IAAkB,gBAAe,KAAI;AAAA,YAC9E;AAAA,aACC,GAAG;AAAA,QAAA,CACP;AAAA,MAAA,CACF;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue.js

@@ -2,7 +2,15 @@
 const vue = require("vue");
 const lexical = require("lexical");
 const utils = require("@lexical/utils");
-const lexicalVue = require("lexical-vue");
+require("@lexical/text");
+require("@lexical/overflow");
+require("tiny-invariant");
+require("@lexical/history");
+const useLexicalComposer = require("../../core/composables/useLexicalComposer.js");
+require("@lexical/list");
+require("@lexical/dragon");
+require("@lexical/plain-text");
+require("@lexical/rich-text");
 const index = require("../../core/index.js");
 const PreviewToolbar_vue_vue_type_script_setup_true_lang = require("./PreviewToolbar.vue.js");
 const FontStyleTool_vue_vue_type_script_setup_true_lang = require("./FontStyleTool.vue.js");
@@ -23,7 +31,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   setup(__props) {
     const toolbarRef = vue.ref(null);
     const toolbarDisabled = vue.ref(false);
-    const editor = lexicalVue.useLexicalComposer();
+    const editor = useLexicalComposer.useLexicalComposer();
     const canUndo = vue.ref(false);
     const canRedo = vue.ref(false);
     vue.onMounted(() => {

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue.js.map

@@ -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$getSelection,\r\n$isNodeSelection,\r\n  $isRangeSelection,\r\n  CAN_REDO_COMMAND,\r\n  CAN_UNDO_COMMAND,\r\n  REDO_COMMAND,\r\n  UNDO_COMMAND,\r\n} from 'lexical'\r\nimport { $findMatchingParent,mergeRegister } from '@lexical/utils'\r\nimport {  useLexicalComposer } from 'lexical-vue'\r\nimport { onMounted, onUnmounted, ref } 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\nimport { $isTextGridNode,$isImageTextGridNode,$isModuleGridNode } from \"../GridPlugin\"\r\nimport { $isModuleBlockNode } from \"../ModulePlugin\"\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 toolbarDisabled = ref(false)\r\nconst editor = useLexicalComposer()\r\n\r\nconst canUndo = ref(false)\r\nconst canRedo = ref(false)\r\n\r\nonMounted(() => {\r\n \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.registerUpdateListener(({ editorState }) => {\r\n      editorState.read(() => {\r\n\r\n        const selection = $getSelection()\r\n        const node = $isNodeSelection(selection) ? selection?.getNodes()[0] : null;\r\n\r\n        if(node){\r\n          if ($isModuleBlockNode(node) || $isTextGridNode(node) || $isImageTextGridNode(node) || $isModuleGridNode(node) ) {\r\n            toolbarDisabled.value = true;\r\n          }\r\n          else{\r\n            toolbarDisabled.value = false;\r\n          }\r\n        }\r\n        else 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 && $isTextGridNode(parent)\r\n            });\r\n\r\n          // 文本节点内 也不允许插入奇怪的东西\r\n          if(element != null && $isTextGridNode(element.getParent())){\r\n            toolbarDisabled.value = true;\r\n          }\r\n          else{\r\n            toolbarDisabled.value = false;\r\n          }\r\n        }\r\n        else{\r\n          toolbarDisabled.value = false;\r\n        }\r\n      })\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 :disabled=\"toolbarDisabled\">\r\n      <el-button text :disabled=\"toolbarDisabled\">\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":["ref","useLexicalComposer","onMounted","mergeRegister","CAN_UNDO_COMMAND","CAN_REDO_COMMAND","$getSelection","$isNodeSelection","$isModuleBlockNode","$isTextGridNode","$isImageTextGridNode","$isModuleGridNode","$isRangeSelection","$findMatchingParent","onUnmounted","ToolbarExtendPlugins"],"mappings":";;;;;;;;;;;;;;;AA2BA,MAAM,cAAuC;;;;;;;;AAEvC,UAAA,aAAaA,QAA2B,IAAI;AAC5C,UAAA,kBAAkBA,QAAI,KAAK;AACjC,UAAM,SAASC,WAAAA;AAET,UAAA,UAAUD,QAAI,KAAK;AACnB,UAAA,UAAUA,QAAI,KAAK;AAEzBE,QAAAA,UAAU,MAAM;AAEd,YAAM,0BAA0BC,MAAA;AAAA,QAC9B,OAAO;AAAA,UACLC,QAAA;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACLC,QAAA;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACjD,sBAAY,KAAK,MAAM;AAErB,kBAAM,YAAYC,QAAAA;AACZ,kBAAA,OAAOC,yBAAiB,SAAS,IAAI,uCAAW,WAAW,KAAK;AAEtE,gBAAG,MAAK;AACF,kBAAAC,mCAAmB,IAAI,KAAKC,aAAAA,gBAAgB,IAAI,KAAKC,kBAAA,qBAAqB,IAAI,KAAKC,iCAAkB,IAAI,GAAI;AAC/G,gCAAgB,QAAQ;AAAA,cAAA,OAEtB;AACF,gCAAgB,QAAQ;AAAA,cAC1B;AAAA,YAAA,WAEOC,QAAAA,kBAAkB,SAAS,GAAG;AAE/B,oBAAA,aAAa,UAAU,OAAO,QAAQ;AAExC,kBAAA,UAAU,WAAW,aAAa,SAClC,aACAC,MAAA,oBAAoB,YAAY,CAAC,MAAM;AACjC,sBAAA,SAAS,EAAE;AACV,uBAAA,WAAW,QAAQJ,aAAA,gBAAgB,MAAM;AAAA,cAAA,CACjD;AAGH,kBAAG,WAAW,QAAQA,aAAAA,gBAAgB,QAAQ,UAAW,CAAA,GAAE;AACzD,gCAAgB,QAAQ;AAAA,cAAA,OAEtB;AACF,gCAAgB,QAAQ;AAAA,cAC1B;AAAA,YAAA,OAEE;AACF,8BAAgB,QAAQ;AAAA,YAC1B;AAAA,UAAA,CACD;AAAA,QAAA,CACF;AAAA,MAAA;AAGHK,UAAAA,YAAY,MAAM;AAChBC,cAAA,qBAAqB,SAAS;AACN;MAAA,CACzB;AAAA,IAAA,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"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$getSelection,\r\n$isNodeSelection,\r\n  $isRangeSelection,\r\n  CAN_REDO_COMMAND,\r\n  CAN_UNDO_COMMAND,\r\n  REDO_COMMAND,\r\n  UNDO_COMMAND,\r\n} from 'lexical'\r\nimport { $findMatchingParent,mergeRegister } from '@lexical/utils'\r\nimport {  useLexicalComposer } from '../../core/composables'\r\nimport { onMounted, onUnmounted, ref } 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\nimport { $isTextGridNode,$isImageTextGridNode,$isModuleGridNode } from \"../GridPlugin\"\r\nimport { $isModuleBlockNode } from \"../ModulePlugin\"\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 toolbarDisabled = ref(false)\r\nconst editor = useLexicalComposer()\r\n\r\nconst canUndo = ref(false)\r\nconst canRedo = ref(false)\r\n\r\nonMounted(() => {\r\n \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.registerUpdateListener(({ editorState }) => {\r\n      editorState.read(() => {\r\n\r\n        const selection = $getSelection()\r\n        const node = $isNodeSelection(selection) ? selection?.getNodes()[0] : null;\r\n\r\n        if(node){\r\n          if ($isModuleBlockNode(node) || $isTextGridNode(node) || $isImageTextGridNode(node) || $isModuleGridNode(node) ) {\r\n            toolbarDisabled.value = true;\r\n          }\r\n          else{\r\n            toolbarDisabled.value = false;\r\n          }\r\n        }\r\n        else 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 && $isTextGridNode(parent)\r\n            });\r\n\r\n          // 文本节点内 也不允许插入奇怪的东西\r\n          if(element != null && $isTextGridNode(element.getParent())){\r\n            toolbarDisabled.value = true;\r\n          }\r\n          else{\r\n            toolbarDisabled.value = false;\r\n          }\r\n        }\r\n        else{\r\n          toolbarDisabled.value = false;\r\n        }\r\n      })\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 :disabled=\"toolbarDisabled\">\r\n      <el-button text :disabled=\"toolbarDisabled\">\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":["ref","useLexicalComposer","onMounted","mergeRegister","CAN_UNDO_COMMAND","CAN_REDO_COMMAND","$getSelection","$isNodeSelection","$isModuleBlockNode","$isTextGridNode","$isImageTextGridNode","$isModuleGridNode","$isRangeSelection","$findMatchingParent","onUnmounted","ToolbarExtendPlugins"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,cAAuC;;;;;;;;AAEvC,UAAA,aAAaA,QAA2B,IAAI;AAC5C,UAAA,kBAAkBA,QAAI,KAAK;AACjC,UAAM,SAASC,mBAAAA;AAET,UAAA,UAAUD,QAAI,KAAK;AACnB,UAAA,UAAUA,QAAI,KAAK;AAEzBE,QAAAA,UAAU,MAAM;AAEd,YAAM,0BAA0BC,MAAA;AAAA,QAC9B,OAAO;AAAA,UACLC,QAAA;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACLC,QAAA;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACjD,sBAAY,KAAK,MAAM;AAErB,kBAAM,YAAYC,QAAAA;AACZ,kBAAA,OAAOC,yBAAiB,SAAS,IAAI,uCAAW,WAAW,KAAK;AAEtE,gBAAG,MAAK;AACF,kBAAAC,mCAAmB,IAAI,KAAKC,aAAAA,gBAAgB,IAAI,KAAKC,kBAAA,qBAAqB,IAAI,KAAKC,iCAAkB,IAAI,GAAI;AAC/G,gCAAgB,QAAQ;AAAA,cAAA,OAEtB;AACF,gCAAgB,QAAQ;AAAA,cAC1B;AAAA,YAAA,WAEOC,QAAAA,kBAAkB,SAAS,GAAG;AAE/B,oBAAA,aAAa,UAAU,OAAO,QAAQ;AAExC,kBAAA,UAAU,WAAW,aAAa,SAClC,aACAC,MAAA,oBAAoB,YAAY,CAAC,MAAM;AACjC,sBAAA,SAAS,EAAE;AACV,uBAAA,WAAW,QAAQJ,aAAA,gBAAgB,MAAM;AAAA,cAAA,CACjD;AAGH,kBAAG,WAAW,QAAQA,aAAAA,gBAAgB,QAAQ,UAAW,CAAA,GAAE;AACzD,gCAAgB,QAAQ;AAAA,cAAA,OAEtB;AACF,gCAAgB,QAAQ;AAAA,cAC1B;AAAA,YAAA,OAEE;AACF,8BAAgB,QAAQ;AAAA,YAC1B;AAAA,UAAA,CACD;AAAA,QAAA,CACF;AAAA,MAAA;AAGHK,UAAAA,YAAY,MAAM;AAChBC,cAAA,qBAAqB,SAAS;AACN;MAAA,CACzB;AAAA,IAAA,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/components/basic/doc-editor/themes/doc-editor-edit.css.js

@@ -1,4 +1,4 @@
 "use strict";
-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.mk-doc__grid{\r\n  outline: 2px solid #eff5ff;\r\n  position: relative;\r\n  cursor: pointer;\r\n  white-space:initial;\r\n  word-break:initial;\r\n  min-height: 150px;\r\n}\r\n.mk-doc__grid.doc-edit-active::before{\r\n  text-align: center;\r\n  background-color: #eff5ff;\r\n  color: #4284ff;\r\n  left: -20px;\r\n  top: 0px;\r\n  pointer-events: all;\r\n  font-size: 14px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 999; \r\n  width: 20px;\r\n  cursor: pointer;\r\n  font-size: 12px;\r\n  padding: 5px 0;\r\n}\r\n\r\n.mk-doc__grid.doc-edit-active::before{\r\n  content: "容器";\r\n  position: absolute;\r\n}\r\n.mk-doc__grid.mk-doc__layout-grid.doc-edit-active::before{\r\n  content: "布局容器";\r\n}\r\n/* 文本框可编辑文字 */\r\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\r\n  cursor: text;\r\n}\r\n.mk-doc__grid.mk-doc__text-grid.doc-edit-active::before{\r\n  content: "文本容器";\r\n}\r\n\r\n/* 图文环绕容器 */\r\n.mk-doc__grid.mk-doc__image-text.doc-edit-active::before{\r\n  content: "图文环绕容器";\r\n}\r\n\r\n/* 图文环绕容器下的文本框不做选中 */\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\r\n  outline: 0;\r\n  padding-top: 0;\r\n}\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid::before{\r\n  display: none;\r\n}\r\n\r\n/* 模块容器 */\r\n.mk-doc__grid.mk-doc__module-grid.doc-edit-active::before{\r\n  content: "模块容器";\r\n  top: -20px;\r\n  left: -2px;\r\n  height: 20px;\r\n  width: auto;\r\n  padding: 0 5px;\r\n}\r\n\r\n/* 避免模块下的a标签点击 */\r\n.mk-doc__grid.mk-doc__module-grid a{\r\n  pointer-events: none;\r\n}\r\n\r\n/* 给布局下的格子加内边距方便编辑 */\r\n.mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\r\n  margin: 10px;\r\n}\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-element-block-mark{\r\n  position: absolute;\r\n  box-sizing:border-box;\r\n  background-color:#2776f63b;\r\n  z-index: 99;\r\n  pointer-events: none;\r\n}\r\n.mk-doc-active-element-block-mark.box{\r\n  outline: 2px solid #2776f63b;\r\n  background-color: transparent;\r\n}\r\n';
+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.mk-doc__grid{\r\n  outline: 2px solid #eff5ff;\r\n  position: relative;\r\n  cursor: pointer;\r\n  white-space:initial;\r\n  word-break:initial;\r\n  min-height: 20px;\r\n}\r\n\r\n/* 文本框可编辑文字 */\r\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\r\n  cursor: text;\r\n}\r\n\r\n/* 图文环绕容器下的文本框不做选中 */\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\r\n  outline: 0;\r\n  padding-top: 0;\r\n}\r\n.mk-doc__grid.mk-doc__image-text img{\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n\r\n\r\n\r\n/* 避免模块下的a标签点击 */\r\n.mk-doc__grid.mk-doc__module-grid a{\r\n  pointer-events: none;\r\n}\r\n\r\n/* 给布局下的格子加内边距方便编辑 */\r\n/* .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\r\n  margin: 10px;\r\n} */\r\n.mk-doc-active-grid-mark{\r\n  text-align: center;\r\n  background-color: #eff5ff;\r\n  color: #4284ff;\r\n  left: -20px;\r\n  top: 0px;\r\n  pointer-events: all;\r\n  font-size: 14px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 999; \r\n  width: 20px;\r\n  cursor: pointer;\r\n  font-size: 12px;\r\n  padding: 5px 0;\r\n}\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";
 module.exports = DocEditorEditCss;
 //# sourceMappingURL=doc-editor-edit.css.js.map

package/dist/cjs/components/basic/doc-editor/themes/doc-editor-edit.css.js.map

@@ -1 +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.mk-doc__grid{\\r\\n  outline: 2px solid #eff5ff;\\r\\n  position: relative;\\r\\n  cursor: pointer;\\r\\n  white-space:initial;\\r\\n  word-break:initial;\\r\\n  min-height: 150px;\\r\\n}\\r\\n.mk-doc__grid.doc-edit-active::before{\\r\\n  text-align: center;\\r\\n  background-color: #eff5ff;\\r\\n  color: #4284ff;\\r\\n  left: -20px;\\r\\n  top: 0px;\\r\\n  pointer-events: all;\\r\\n  font-size: 14px;\\r\\n  display: flex;\\r\\n  align-items: center;\\r\\n  justify-content: center;\\r\\n  z-index: 999; \\r\\n  width: 20px;\\r\\n  cursor: pointer;\\r\\n  font-size: 12px;\\r\\n  padding: 5px 0;\\r\\n}\\r\\n\\r\\n.mk-doc__grid.doc-edit-active::before{\\r\\n  content: \\\"容器\\\";\\r\\n  position: absolute;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__layout-grid.doc-edit-active::before{\\r\\n  content: \\\"布局容器\\\";\\r\\n}\\r\\n/* 文本框可编辑文字 */\\r\\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\\r\\n  cursor: text;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__text-grid.doc-edit-active::before{\\r\\n  content: \\\"文本容器\\\";\\r\\n}\\r\\n\\r\\n/* 图文环绕容器 */\\r\\n.mk-doc__grid.mk-doc__image-text.doc-edit-active::before{\\r\\n  content: \\\"图文环绕容器\\\";\\r\\n}\\r\\n\\r\\n/* 图文环绕容器下的文本框不做选中 */\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\\r\\n  outline: 0;\\r\\n  padding-top: 0;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid::before{\\r\\n  display: none;\\r\\n}\\r\\n\\r\\n/* 模块容器 */\\r\\n.mk-doc__grid.mk-doc__module-grid.doc-edit-active::before{\\r\\n  content: \\\"模块容器\\\";\\r\\n  top: -20px;\\r\\n  left: -2px;\\r\\n  height: 20px;\\r\\n  width: auto;\\r\\n  padding: 0 5px;\\r\\n}\\r\\n\\r\\n/* 避免模块下的a标签点击 */\\r\\n.mk-doc__grid.mk-doc__module-grid a{\\r\\n  pointer-events: none;\\r\\n}\\r\\n\\r\\n/* 给布局下的格子加内边距方便编辑 */\\r\\n.mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\\r\\n  margin: 10px;\\r\\n}\\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-element-block-mark{\\r\\n  position: absolute;\\r\\n  box-sizing:border-box;\\r\\n  background-color:#2776f63b;\\r\\n  z-index: 99;\\r\\n  pointer-events: none;\\r\\n}\\r\\n.mk-doc-active-element-block-mark.box{\\r\\n  outline: 2px solid #2776f63b;\\r\\n  background-color: transparent;\\r\\n}\\r\\n\""],"names":[],"mappings":";AAAA,MAAe,mBAAA;;"}
+{"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.mk-doc__grid{\\r\\n  outline: 2px solid #eff5ff;\\r\\n  position: relative;\\r\\n  cursor: pointer;\\r\\n  white-space:initial;\\r\\n  word-break:initial;\\r\\n  min-height: 20px;\\r\\n}\\r\\n\\r\\n/* 文本框可编辑文字 */\\r\\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\\r\\n  cursor: text;\\r\\n}\\r\\n\\r\\n/* 图文环绕容器下的文本框不做选中 */\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\\r\\n  outline: 0;\\r\\n  padding-top: 0;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__image-text img{\\r\\n  position: relative;\\r\\n  z-index: 1;\\r\\n}\\r\\n\\r\\n\\r\\n\\r\\n/* 避免模块下的a标签点击 */\\r\\n.mk-doc__grid.mk-doc__module-grid a{\\r\\n  pointer-events: none;\\r\\n}\\r\\n\\r\\n/* 给布局下的格子加内边距方便编辑 */\\r\\n/* .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\\r\\n  margin: 10px;\\r\\n} */\\r\\n.mk-doc-active-grid-mark{\\r\\n  text-align: center;\\r\\n  background-color: #eff5ff;\\r\\n  color: #4284ff;\\r\\n  left: -20px;\\r\\n  top: 0px;\\r\\n  pointer-events: all;\\r\\n  font-size: 14px;\\r\\n  display: flex;\\r\\n  align-items: center;\\r\\n  justify-content: center;\\r\\n  z-index: 999; \\r\\n  width: 20px;\\r\\n  cursor: pointer;\\r\\n  font-size: 12px;\\r\\n  padding: 5px 0;\\r\\n}\\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\""],"names":[],"mappings":";AAAA,MAAe,mBAAA;;"}

package/dist/cjs/components/basic/doc-editor/themes/doc-theme.css.js

@@ -431,8 +431,7 @@ const DocThemeCss = `\r
   padding: 8px 16px;\r
 }\r
 \r
-.mk-doc__image-text::after,\r
-.mk-doc__module-grid::after{\r
+.mk-doc__image-text::after{\r
   content: ".";\r
   font-size: 0;\r
   clear: both;\r

package/dist/cjs/components/basic/doc-editor/themes/doc-theme.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"doc-theme.css.js","sources":["../../../../../../src/components/basic/doc-editor/themes/doc-theme.css?raw"],"sourcesContent":["export default \"\\r\\n .mk-doc__ltr {\\r\\n  text-align: left;\\r\\n}\\r\\n.mk-doc__rtl {\\r\\n  text-align: right;\\r\\n}\\r\\n.mk-doc__paragraph {\\r\\n  margin: 0;\\r\\n}\\r\\n.mk-doc__quote {\\r\\n  margin: 0;\\r\\n  margin-left: 20px;\\r\\n  margin-bottom: 10px;\\r\\n  font-size: 15px;\\r\\n  color: rgb(101, 103, 107);\\r\\n  border-left-color: rgb(206, 208, 212);\\r\\n  border-left-width: 4px;\\r\\n  border-left-style: solid;\\r\\n  padding-left: 16px;\\r\\n}\\r\\n.mk-doc__quote .mk-doc__paragraph {\\r\\n  text-indent: 0;\\r\\n\\r\\n}\\r\\n.mk-doc__h1 {\\r\\n  font-size: 2rem;\\r\\n  color: rgb(5, 5, 5);\\r\\n  font-weight: 400;\\r\\n  margin: 0;\\r\\n}\\r\\n.mk-doc__h2 {\\r\\n  font-size: 1.5rem;\\r\\n  color: rgb(101, 103, 107);\\r\\n  font-weight: 700;\\r\\n  margin: 0;\\r\\n  text-transform: uppercase;\\r\\n}\\r\\n.mk-doc__h3 {\\r\\n  font-size: 1.17rem;\\r\\n  margin: 0;\\r\\n  text-transform: uppercase;\\r\\n}\\r\\n.mk-doc__indent {\\r\\n  --lexical-indent-base-value: 40px;\\r\\n}\\r\\n.mk-doc__textBold {\\r\\n  font-weight: bold;\\r\\n}\\r\\n.mk-doc__textItalic {\\r\\n  font-style: italic;\\r\\n}\\r\\n.mk-doc__textUnderline {\\r\\n  text-decoration: underline;\\r\\n}\\r\\n.mk-doc__textStrikethrough {\\r\\n  text-decoration: line-through;\\r\\n}\\r\\n.mk-doc__textUnderlineStrikethrough {\\r\\n  text-decoration: underline line-through;\\r\\n}\\r\\n.mk-doc__textSubscript {\\r\\n  font-size: 0.8em;\\r\\n  vertical-align: sub !important;\\r\\n}\\r\\n.mk-doc__textSuperscript {\\r\\n  font-size: 0.8em;\\r\\n  vertical-align: super;\\r\\n}\\r\\n.mk-doc__textCode {\\r\\n  background-color: rgb(240, 242, 245);\\r\\n  padding: 1px 0.25rem;\\r\\n  font-family: Menlo, Consolas, Monaco, monospace;\\r\\n  font-size: 94%;\\r\\n}\\r\\n.mk-doc__hashtag {\\r\\n  background-color: rgba(88, 144, 255, 0.15);\\r\\n  border-bottom: 1px solid rgba(88, 144, 255, 0.3);\\r\\n}\\r\\n.mk-doc__link {\\r\\n  color: rgb(33, 111, 219);\\r\\n  text-decoration: none;\\r\\n}\\r\\n.mk-doc__link:hover {\\r\\n  text-decoration: underline;\\r\\n  cursor: pointer;\\r\\n}\\r\\n.mk-doc__code {\\r\\n  background-color: rgb(240, 242, 245);\\r\\n  font-family: Menlo, Consolas, Monaco, monospace;\\r\\n  display: block;\\r\\n  padding: 8px 8px 8px 52px;\\r\\n  line-height: 1.53;\\r\\n  font-size: 13px;\\r\\n  margin: 0;\\r\\n  margin-top: 8px;\\r\\n  margin-bottom: 8px;\\r\\n  overflow-x: auto;\\r\\n  position: relative;\\r\\n  tab-size: 2;\\r\\n}\\r\\n.mk-doc__code:before {\\r\\n  content: attr(data-gutter);\\r\\n  position: absolute;\\r\\n  background-color: #eee;\\r\\n  left: 0;\\r\\n  top: 0;\\r\\n  border-right: 1px solid #ccc;\\r\\n  padding: 8px;\\r\\n  color: #777;\\r\\n  white-space: pre-wrap;\\r\\n  text-align: right;\\r\\n  min-width: 25px;\\r\\n}\\r\\n.mk-doc__table {\\r\\n  border-collapse: collapse;\\r\\n  border-spacing: 0;\\r\\n  overflow-y: scroll;\\r\\n  overflow-x: scroll;\\r\\n  table-layout: fixed;\\r\\n  width: max-content;\\r\\n  margin: 30px 0;\\r\\n}\\r\\n.mk-doc__tableSelection *::selection {\\r\\n  background-color: transparent;\\r\\n}\\r\\n.mk-doc__tableSelected {\\r\\n  outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n.mk-doc__tableCell {\\r\\n  border: 1px solid #bbb;\\r\\n  width: 75px;\\r\\n  min-width: 75px;\\r\\n  vertical-align: top;\\r\\n  text-align: start;\\r\\n  padding: 6px 8px;\\r\\n  position: relative;\\r\\n  outline: none;\\r\\n}\\r\\n.mk-doc__tableCellSortedIndicator {\\r\\n  display: block;\\r\\n  opacity: 0.5;\\r\\n  position: absolute;\\r\\n  bottom: 0;\\r\\n  left: 0;\\r\\n  width: 100%;\\r\\n  height: 4px;\\r\\n  background-color: #999;\\r\\n}\\r\\n.mk-doc__tableCellResizer {\\r\\n  position: absolute;\\r\\n  right: -4px;\\r\\n  height: 100%;\\r\\n  width: 8px;\\r\\n  cursor: ew-resize;\\r\\n  z-index: 10;\\r\\n  top: 0;\\r\\n}\\r\\n.mk-doc__tableCellHeader {\\r\\n  background-color: #f2f3f5;\\r\\n  text-align: start;\\r\\n}\\r\\n.mk-doc__tableCellSelected {\\r\\n  background-color: #c9dbf0;\\r\\n}\\r\\n.mk-doc__tableCellPrimarySelected {\\r\\n  border: 2px solid rgb(60, 132, 244);\\r\\n  display: block;\\r\\n  height: calc(100% - 2px);\\r\\n  position: absolute;\\r\\n  width: calc(100% - 2px);\\r\\n  left: -1px;\\r\\n  top: -1px;\\r\\n  z-index: 2;\\r\\n}\\r\\n.mk-doc__tableCellEditing {\\r\\n  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);\\r\\n  border-radius: 3px;\\r\\n}\\r\\n.mk-doc__tableAddColumns {\\r\\n  position: absolute;\\r\\n  top: 0;\\r\\n  width: 20px;\\r\\n  background-color: #eee;\\r\\n  height: 100%;\\r\\n  right: -25px;\\r\\n  animation: table-controls 0.2s ease;\\r\\n  border: 0;\\r\\n  cursor: pointer;\\r\\n}\\r\\n.mk-doc__tableAddColumns:after {\\r\\n  background-image: url(../images/icons/plus.svg);\\r\\n  background-size: contain;\\r\\n  background-position: center;\\r\\n  background-repeat: no-repeat;\\r\\n  display: block;\\r\\n  content: ' ';\\r\\n  position: absolute;\\r\\n  top: 0;\\r\\n  left: 0;\\r\\n  width: 100%;\\r\\n  height: 100%;\\r\\n  opacity: 0.4;\\r\\n}\\r\\n.mk-doc__tableAddColumns:hover {\\r\\n  background-color: #c9dbf0;\\r\\n}\\r\\n.mk-doc__tableAddRows {\\r\\n  position: absolute;\\r\\n  bottom: -25px;\\r\\n  width: calc(100% - 25px);\\r\\n  background-color: #eee;\\r\\n  height: 20px;\\r\\n  left: 0;\\r\\n  animation: table-controls 0.2s ease;\\r\\n  border: 0;\\r\\n  cursor: pointer;\\r\\n}\\r\\n.mk-doc__tableAddRows:after {\\r\\n  background-image: url(../images/icons/plus.svg);\\r\\n  background-size: contain;\\r\\n  background-position: center;\\r\\n  background-repeat: no-repeat;\\r\\n  display: block;\\r\\n  content: ' ';\\r\\n  position: absolute;\\r\\n  top: 0;\\r\\n  left: 0;\\r\\n  width: 100%;\\r\\n  height: 100%;\\r\\n  opacity: 0.4;\\r\\n}\\r\\n.mk-doc__tableAddRows:hover {\\r\\n  background-color: #c9dbf0;\\r\\n}\\r\\n@keyframes table-controls {\\r\\n  0% {\\r\\n    opacity: 0;\\r\\n  }\\r\\n  100% {\\r\\n    opacity: 1;\\r\\n  }\\r\\n}\\r\\n.mk-doc__tableCellResizeRuler {\\r\\n  display: block;\\r\\n  position: absolute;\\r\\n  width: 1px;\\r\\n  background-color: rgb(60, 132, 244);\\r\\n  height: 100%;\\r\\n  top: 0;\\r\\n}\\r\\n.mk-doc__tableCellActionButtonContainer {\\r\\n  display: block;\\r\\n  right: 5px;\\r\\n  top: 6px;\\r\\n  position: absolute;\\r\\n  z-index: 4;\\r\\n  width: 20px;\\r\\n  height: 20px;\\r\\n}\\r\\n.mk-doc__tableCellActionButton {\\r\\n  background-color: #eee;\\r\\n  display: block;\\r\\n  border: 0;\\r\\n  border-radius: 20px;\\r\\n  width: 20px;\\r\\n  height: 20px;\\r\\n  color: #222;\\r\\n  cursor: pointer;\\r\\n}\\r\\n.mk-doc__tableCellActionButton:hover {\\r\\n  background-color: #ddd;\\r\\n}\\r\\n.mk-doc__characterLimit {\\r\\n  display: inline;\\r\\n  background-color: #ffbbbb !important;\\r\\n}\\r\\n.mk-doc__ol1 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ol2 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  list-style-type: upper-alpha;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ol3 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  list-style-type: lower-alpha;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ol4 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  list-style-type: upper-roman;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ol5 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  list-style-type: lower-roman;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ul {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__listItem {\\r\\n  margin: 0 32px;\\r\\n}\\r\\n.mk-doc__listItemChecked,\\r\\n.mk-doc__listItemUnchecked {\\r\\n  position: relative;\\r\\n  margin-left: 8px;\\r\\n  margin-right: 8px;\\r\\n  padding-left: 24px;\\r\\n  padding-right: 24px;\\r\\n  list-style-type: none;\\r\\n  outline: none;\\r\\n}\\r\\n.mk-doc__listItemChecked {\\r\\n  text-decoration: line-through;\\r\\n}\\r\\n.mk-doc__listItemUnchecked:before,\\r\\n.mk-doc__listItemChecked:before {\\r\\n  content: '';\\r\\n  width: 16px;\\r\\n  height: 16px;\\r\\n  top: 2px;\\r\\n  left: 0;\\r\\n  cursor: pointer;\\r\\n  display: block;\\r\\n  background-size: cover;\\r\\n  position: absolute;\\r\\n}\\r\\n.mk-doc__listItemUnchecked[dir='rtl']:before,\\r\\n.mk-doc__listItemChecked[dir='rtl']:before {\\r\\n  left: auto;\\r\\n  right: 0;\\r\\n}\\r\\n.mk-doc__listItemUnchecked:focus:before,\\r\\n.mk-doc__listItemChecked:focus:before {\\r\\n  box-shadow: 0 0 0 2px #a6cdfe;\\r\\n  border-radius: 2px;\\r\\n}\\r\\n.mk-doc__listItemUnchecked:before {\\r\\n  border: 1px solid #999;\\r\\n  border-radius: 2px;\\r\\n}\\r\\n.mk-doc__listItemChecked:before {\\r\\n  border: 1px solid rgb(61, 135, 245);\\r\\n  border-radius: 2px;\\r\\n  background-color: #3d87f5;\\r\\n  background-repeat: no-repeat;\\r\\n}\\r\\n.mk-doc__listItemChecked:after {\\r\\n  content: '';\\r\\n  cursor: pointer;\\r\\n  border-color: #fff;\\r\\n  border-style: solid;\\r\\n  position: absolute;\\r\\n  display: block;\\r\\n  top: 6px;\\r\\n  width: 3px;\\r\\n  left: 7px;\\r\\n  right: 7px;\\r\\n  height: 6px;\\r\\n  transform: rotate(45deg);\\r\\n  border-width: 0 2px 2px 0;\\r\\n}\\r\\n.mk-doc__nestedListItem {\\r\\n  list-style-type: none;\\r\\n}\\r\\n.mk-doc__nestedListItem:before,\\r\\n.mk-doc__nestedListItem:after {\\r\\n  display: none;\\r\\n}\\r\\n.mk-doc__tokenComment {\\r\\n  color: slategray;\\r\\n}\\r\\n.mk-doc__tokenPunctuation {\\r\\n  color: #999;\\r\\n}\\r\\n.mk-doc__tokenProperty {\\r\\n  color: #905;\\r\\n}\\r\\n.mk-doc__tokenSelector {\\r\\n  color: #690;\\r\\n}\\r\\n.mk-doc__tokenOperator {\\r\\n  color: #9a6e3a;\\r\\n}\\r\\n.mk-doc__tokenAttr {\\r\\n  color: #07a;\\r\\n}\\r\\n.mk-doc__tokenVariable {\\r\\n  color: #e90;\\r\\n}\\r\\n.mk-doc__tokenFunction {\\r\\n  color: #dd4a68;\\r\\n}\\r\\n.mk-doc__mark {\\r\\n  background: rgba(255, 212, 0, 0.14);\\r\\n  border-bottom: 2px solid rgba(255, 212, 0, 0.3);\\r\\n  padding-bottom: 2px;\\r\\n}\\r\\n.mk-doc__markOverlap {\\r\\n  background: rgba(255, 212, 0, 0.3);\\r\\n  border-bottom: 2px solid rgba(255, 212, 0, 0.7);\\r\\n}\\r\\n.mk-doc__mark.selected {\\r\\n  background: rgba(255, 212, 0, 0.5);\\r\\n  border-bottom: 2px solid rgba(255, 212, 0, 1);\\r\\n}\\r\\n.mk-doc__markOverlap.selected {\\r\\n  background: rgba(255, 212, 0, 0.7);\\r\\n  border-bottom: 2px solid rgba(255, 212, 0, 0.7);\\r\\n}\\r\\n.mk-doc__layoutContainer {\\r\\n  display: grid;\\r\\n  gap: 10px;\\r\\n  margin: 10px 0;\\r\\n}\\r\\n.mk-doc__layoutItem {\\r\\n  border: 1px dashed #ddd;\\r\\n  padding: 8px 16px;\\r\\n}\\r\\n\\r\\n.mk-doc__image-text::after,\\r\\n.mk-doc__module-grid::after{\\r\\n  content: \\\".\\\";\\r\\n  font-size: 0;\\r\\n  clear: both;\\r\\n  display: block;\\r\\n}\\r\\n\\r\\n\""],"names":[],"mappings":";AAAA,MAAe,cAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;"}
+{"version":3,"file":"doc-theme.css.js","sources":["../../../../../../src/components/basic/doc-editor/themes/doc-theme.css?raw"],"sourcesContent":["export default \"\\r\\n .mk-doc__ltr {\\r\\n  text-align: left;\\r\\n}\\r\\n.mk-doc__rtl {\\r\\n  text-align: right;\\r\\n}\\r\\n.mk-doc__paragraph {\\r\\n  margin: 0;\\r\\n}\\r\\n.mk-doc__quote {\\r\\n  margin: 0;\\r\\n  margin-left: 20px;\\r\\n  margin-bottom: 10px;\\r\\n  font-size: 15px;\\r\\n  color: rgb(101, 103, 107);\\r\\n  border-left-color: rgb(206, 208, 212);\\r\\n  border-left-width: 4px;\\r\\n  border-left-style: solid;\\r\\n  padding-left: 16px;\\r\\n}\\r\\n.mk-doc__quote .mk-doc__paragraph {\\r\\n  text-indent: 0;\\r\\n\\r\\n}\\r\\n.mk-doc__h1 {\\r\\n  font-size: 2rem;\\r\\n  color: rgb(5, 5, 5);\\r\\n  font-weight: 400;\\r\\n  margin: 0;\\r\\n}\\r\\n.mk-doc__h2 {\\r\\n  font-size: 1.5rem;\\r\\n  color: rgb(101, 103, 107);\\r\\n  font-weight: 700;\\r\\n  margin: 0;\\r\\n  text-transform: uppercase;\\r\\n}\\r\\n.mk-doc__h3 {\\r\\n  font-size: 1.17rem;\\r\\n  margin: 0;\\r\\n  text-transform: uppercase;\\r\\n}\\r\\n.mk-doc__indent {\\r\\n  --lexical-indent-base-value: 40px;\\r\\n}\\r\\n.mk-doc__textBold {\\r\\n  font-weight: bold;\\r\\n}\\r\\n.mk-doc__textItalic {\\r\\n  font-style: italic;\\r\\n}\\r\\n.mk-doc__textUnderline {\\r\\n  text-decoration: underline;\\r\\n}\\r\\n.mk-doc__textStrikethrough {\\r\\n  text-decoration: line-through;\\r\\n}\\r\\n.mk-doc__textUnderlineStrikethrough {\\r\\n  text-decoration: underline line-through;\\r\\n}\\r\\n.mk-doc__textSubscript {\\r\\n  font-size: 0.8em;\\r\\n  vertical-align: sub !important;\\r\\n}\\r\\n.mk-doc__textSuperscript {\\r\\n  font-size: 0.8em;\\r\\n  vertical-align: super;\\r\\n}\\r\\n.mk-doc__textCode {\\r\\n  background-color: rgb(240, 242, 245);\\r\\n  padding: 1px 0.25rem;\\r\\n  font-family: Menlo, Consolas, Monaco, monospace;\\r\\n  font-size: 94%;\\r\\n}\\r\\n.mk-doc__hashtag {\\r\\n  background-color: rgba(88, 144, 255, 0.15);\\r\\n  border-bottom: 1px solid rgba(88, 144, 255, 0.3);\\r\\n}\\r\\n.mk-doc__link {\\r\\n  color: rgb(33, 111, 219);\\r\\n  text-decoration: none;\\r\\n}\\r\\n.mk-doc__link:hover {\\r\\n  text-decoration: underline;\\r\\n  cursor: pointer;\\r\\n}\\r\\n.mk-doc__code {\\r\\n  background-color: rgb(240, 242, 245);\\r\\n  font-family: Menlo, Consolas, Monaco, monospace;\\r\\n  display: block;\\r\\n  padding: 8px 8px 8px 52px;\\r\\n  line-height: 1.53;\\r\\n  font-size: 13px;\\r\\n  margin: 0;\\r\\n  margin-top: 8px;\\r\\n  margin-bottom: 8px;\\r\\n  overflow-x: auto;\\r\\n  position: relative;\\r\\n  tab-size: 2;\\r\\n}\\r\\n.mk-doc__code:before {\\r\\n  content: attr(data-gutter);\\r\\n  position: absolute;\\r\\n  background-color: #eee;\\r\\n  left: 0;\\r\\n  top: 0;\\r\\n  border-right: 1px solid #ccc;\\r\\n  padding: 8px;\\r\\n  color: #777;\\r\\n  white-space: pre-wrap;\\r\\n  text-align: right;\\r\\n  min-width: 25px;\\r\\n}\\r\\n.mk-doc__table {\\r\\n  border-collapse: collapse;\\r\\n  border-spacing: 0;\\r\\n  overflow-y: scroll;\\r\\n  overflow-x: scroll;\\r\\n  table-layout: fixed;\\r\\n  width: max-content;\\r\\n  margin: 30px 0;\\r\\n}\\r\\n.mk-doc__tableSelection *::selection {\\r\\n  background-color: transparent;\\r\\n}\\r\\n.mk-doc__tableSelected {\\r\\n  outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n.mk-doc__tableCell {\\r\\n  border: 1px solid #bbb;\\r\\n  width: 75px;\\r\\n  min-width: 75px;\\r\\n  vertical-align: top;\\r\\n  text-align: start;\\r\\n  padding: 6px 8px;\\r\\n  position: relative;\\r\\n  outline: none;\\r\\n}\\r\\n.mk-doc__tableCellSortedIndicator {\\r\\n  display: block;\\r\\n  opacity: 0.5;\\r\\n  position: absolute;\\r\\n  bottom: 0;\\r\\n  left: 0;\\r\\n  width: 100%;\\r\\n  height: 4px;\\r\\n  background-color: #999;\\r\\n}\\r\\n.mk-doc__tableCellResizer {\\r\\n  position: absolute;\\r\\n  right: -4px;\\r\\n  height: 100%;\\r\\n  width: 8px;\\r\\n  cursor: ew-resize;\\r\\n  z-index: 10;\\r\\n  top: 0;\\r\\n}\\r\\n.mk-doc__tableCellHeader {\\r\\n  background-color: #f2f3f5;\\r\\n  text-align: start;\\r\\n}\\r\\n.mk-doc__tableCellSelected {\\r\\n  background-color: #c9dbf0;\\r\\n}\\r\\n.mk-doc__tableCellPrimarySelected {\\r\\n  border: 2px solid rgb(60, 132, 244);\\r\\n  display: block;\\r\\n  height: calc(100% - 2px);\\r\\n  position: absolute;\\r\\n  width: calc(100% - 2px);\\r\\n  left: -1px;\\r\\n  top: -1px;\\r\\n  z-index: 2;\\r\\n}\\r\\n.mk-doc__tableCellEditing {\\r\\n  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);\\r\\n  border-radius: 3px;\\r\\n}\\r\\n.mk-doc__tableAddColumns {\\r\\n  position: absolute;\\r\\n  top: 0;\\r\\n  width: 20px;\\r\\n  background-color: #eee;\\r\\n  height: 100%;\\r\\n  right: -25px;\\r\\n  animation: table-controls 0.2s ease;\\r\\n  border: 0;\\r\\n  cursor: pointer;\\r\\n}\\r\\n.mk-doc__tableAddColumns:after {\\r\\n  background-image: url(../images/icons/plus.svg);\\r\\n  background-size: contain;\\r\\n  background-position: center;\\r\\n  background-repeat: no-repeat;\\r\\n  display: block;\\r\\n  content: ' ';\\r\\n  position: absolute;\\r\\n  top: 0;\\r\\n  left: 0;\\r\\n  width: 100%;\\r\\n  height: 100%;\\r\\n  opacity: 0.4;\\r\\n}\\r\\n.mk-doc__tableAddColumns:hover {\\r\\n  background-color: #c9dbf0;\\r\\n}\\r\\n.mk-doc__tableAddRows {\\r\\n  position: absolute;\\r\\n  bottom: -25px;\\r\\n  width: calc(100% - 25px);\\r\\n  background-color: #eee;\\r\\n  height: 20px;\\r\\n  left: 0;\\r\\n  animation: table-controls 0.2s ease;\\r\\n  border: 0;\\r\\n  cursor: pointer;\\r\\n}\\r\\n.mk-doc__tableAddRows:after {\\r\\n  background-image: url(../images/icons/plus.svg);\\r\\n  background-size: contain;\\r\\n  background-position: center;\\r\\n  background-repeat: no-repeat;\\r\\n  display: block;\\r\\n  content: ' ';\\r\\n  position: absolute;\\r\\n  top: 0;\\r\\n  left: 0;\\r\\n  width: 100%;\\r\\n  height: 100%;\\r\\n  opacity: 0.4;\\r\\n}\\r\\n.mk-doc__tableAddRows:hover {\\r\\n  background-color: #c9dbf0;\\r\\n}\\r\\n@keyframes table-controls {\\r\\n  0% {\\r\\n    opacity: 0;\\r\\n  }\\r\\n  100% {\\r\\n    opacity: 1;\\r\\n  }\\r\\n}\\r\\n.mk-doc__tableCellResizeRuler {\\r\\n  display: block;\\r\\n  position: absolute;\\r\\n  width: 1px;\\r\\n  background-color: rgb(60, 132, 244);\\r\\n  height: 100%;\\r\\n  top: 0;\\r\\n}\\r\\n.mk-doc__tableCellActionButtonContainer {\\r\\n  display: block;\\r\\n  right: 5px;\\r\\n  top: 6px;\\r\\n  position: absolute;\\r\\n  z-index: 4;\\r\\n  width: 20px;\\r\\n  height: 20px;\\r\\n}\\r\\n.mk-doc__tableCellActionButton {\\r\\n  background-color: #eee;\\r\\n  display: block;\\r\\n  border: 0;\\r\\n  border-radius: 20px;\\r\\n  width: 20px;\\r\\n  height: 20px;\\r\\n  color: #222;\\r\\n  cursor: pointer;\\r\\n}\\r\\n.mk-doc__tableCellActionButton:hover {\\r\\n  background-color: #ddd;\\r\\n}\\r\\n.mk-doc__characterLimit {\\r\\n  display: inline;\\r\\n  background-color: #ffbbbb !important;\\r\\n}\\r\\n.mk-doc__ol1 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ol2 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  list-style-type: upper-alpha;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ol3 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  list-style-type: lower-alpha;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ol4 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  list-style-type: upper-roman;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ol5 {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  list-style-type: lower-roman;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__ul {\\r\\n  padding: 0;\\r\\n  margin: 0;\\r\\n  /* list-style-position: inside; */\\r\\n}\\r\\n.mk-doc__listItem {\\r\\n  margin: 0 32px;\\r\\n}\\r\\n.mk-doc__listItemChecked,\\r\\n.mk-doc__listItemUnchecked {\\r\\n  position: relative;\\r\\n  margin-left: 8px;\\r\\n  margin-right: 8px;\\r\\n  padding-left: 24px;\\r\\n  padding-right: 24px;\\r\\n  list-style-type: none;\\r\\n  outline: none;\\r\\n}\\r\\n.mk-doc__listItemChecked {\\r\\n  text-decoration: line-through;\\r\\n}\\r\\n.mk-doc__listItemUnchecked:before,\\r\\n.mk-doc__listItemChecked:before {\\r\\n  content: '';\\r\\n  width: 16px;\\r\\n  height: 16px;\\r\\n  top: 2px;\\r\\n  left: 0;\\r\\n  cursor: pointer;\\r\\n  display: block;\\r\\n  background-size: cover;\\r\\n  position: absolute;\\r\\n}\\r\\n.mk-doc__listItemUnchecked[dir='rtl']:before,\\r\\n.mk-doc__listItemChecked[dir='rtl']:before {\\r\\n  left: auto;\\r\\n  right: 0;\\r\\n}\\r\\n.mk-doc__listItemUnchecked:focus:before,\\r\\n.mk-doc__listItemChecked:focus:before {\\r\\n  box-shadow: 0 0 0 2px #a6cdfe;\\r\\n  border-radius: 2px;\\r\\n}\\r\\n.mk-doc__listItemUnchecked:before {\\r\\n  border: 1px solid #999;\\r\\n  border-radius: 2px;\\r\\n}\\r\\n.mk-doc__listItemChecked:before {\\r\\n  border: 1px solid rgb(61, 135, 245);\\r\\n  border-radius: 2px;\\r\\n  background-color: #3d87f5;\\r\\n  background-repeat: no-repeat;\\r\\n}\\r\\n.mk-doc__listItemChecked:after {\\r\\n  content: '';\\r\\n  cursor: pointer;\\r\\n  border-color: #fff;\\r\\n  border-style: solid;\\r\\n  position: absolute;\\r\\n  display: block;\\r\\n  top: 6px;\\r\\n  width: 3px;\\r\\n  left: 7px;\\r\\n  right: 7px;\\r\\n  height: 6px;\\r\\n  transform: rotate(45deg);\\r\\n  border-width: 0 2px 2px 0;\\r\\n}\\r\\n.mk-doc__nestedListItem {\\r\\n  list-style-type: none;\\r\\n}\\r\\n.mk-doc__nestedListItem:before,\\r\\n.mk-doc__nestedListItem:after {\\r\\n  display: none;\\r\\n}\\r\\n.mk-doc__tokenComment {\\r\\n  color: slategray;\\r\\n}\\r\\n.mk-doc__tokenPunctuation {\\r\\n  color: #999;\\r\\n}\\r\\n.mk-doc__tokenProperty {\\r\\n  color: #905;\\r\\n}\\r\\n.mk-doc__tokenSelector {\\r\\n  color: #690;\\r\\n}\\r\\n.mk-doc__tokenOperator {\\r\\n  color: #9a6e3a;\\r\\n}\\r\\n.mk-doc__tokenAttr {\\r\\n  color: #07a;\\r\\n}\\r\\n.mk-doc__tokenVariable {\\r\\n  color: #e90;\\r\\n}\\r\\n.mk-doc__tokenFunction {\\r\\n  color: #dd4a68;\\r\\n}\\r\\n.mk-doc__mark {\\r\\n  background: rgba(255, 212, 0, 0.14);\\r\\n  border-bottom: 2px solid rgba(255, 212, 0, 0.3);\\r\\n  padding-bottom: 2px;\\r\\n}\\r\\n.mk-doc__markOverlap {\\r\\n  background: rgba(255, 212, 0, 0.3);\\r\\n  border-bottom: 2px solid rgba(255, 212, 0, 0.7);\\r\\n}\\r\\n.mk-doc__mark.selected {\\r\\n  background: rgba(255, 212, 0, 0.5);\\r\\n  border-bottom: 2px solid rgba(255, 212, 0, 1);\\r\\n}\\r\\n.mk-doc__markOverlap.selected {\\r\\n  background: rgba(255, 212, 0, 0.7);\\r\\n  border-bottom: 2px solid rgba(255, 212, 0, 0.7);\\r\\n}\\r\\n.mk-doc__layoutContainer {\\r\\n  display: grid;\\r\\n  gap: 10px;\\r\\n  margin: 10px 0;\\r\\n}\\r\\n.mk-doc__layoutItem {\\r\\n  border: 1px dashed #ddd;\\r\\n  padding: 8px 16px;\\r\\n}\\r\\n\\r\\n.mk-doc__image-text::after{\\r\\n  content: \\\".\\\";\\r\\n  font-size: 0;\\r\\n  clear: both;\\r\\n  display: block;\\r\\n}\\r\\n\\r\\n\""],"names":[],"mappings":";AAAA,MAAe,cAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;"}

package/dist/cjs/index.js

@@ -148,6 +148,7 @@ const uploadImageOptions = require("./components/basic/upload-file/ui/upload-ima
 const uploadFileOptions = require("./components/basic/upload-file/ui/upload-file/upload-file-options.js");
 const uploadVideoOptions = require("./components/basic/upload-file/ui/upload-video/upload-video-options.js");
 const composables = require("./components/basic/doc-editor/plugins/ModulePlugin/composables.js");
+const composables$1 = require("./components/basic/doc-editor/plugins/TemplatePlugin/composables.js");
 const imageCropperApi = require("./components/basic/image-cropper/image-cropper-api.js");
 const imageCropperContentOptions = require("./components/basic/image-cropper/image-cropper-content-options.js");
 const dataFormOptions = require("./components/data-model/data-form/data-form-options.js");
@@ -341,6 +342,7 @@ exports.uploadFileUiProps = uploadFileOptions.uploadFileUiProps;
 exports.uploadVideoEmits = uploadVideoOptions.uploadVideoEmits;
 exports.uploadVideoProps = uploadVideoOptions.uploadVideoProps;
 exports.registerDocModule = composables.registerDocModule;
+exports.registerDocTemplate = composables$1.registerDocTemplate;
 exports.ImageCropper = imageCropperApi.ImageCropper;
 exports.imageCropperContentEmits = imageCropperContentOptions.imageCropperContentEmits;
 exports.imageCropperContentProps = imageCropperContentOptions.imageCropperContentProps;

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/index.ts"],"sourcesContent":["import \"./assets/iconfonts/iconfont.js\";\r\nimport \"./assets/iconfonts/oa-iconfont.js\";\r\nexport * from \"./constants\";\r\n\r\nexport * from \"./core\";\r\n\r\nimport { installer } from \"./installer\";\r\n\r\nexport * from \"./layouts\";\r\nexport * from \"./composables\";\r\nexport * from \"./components\";\r\nexport * from \"./tokens\";\r\n\r\nexport const install = installer.install;\r\nexport const version = installer.version;\r\n\r\nexport * from \"./init-application\";\r\nexport * from \"./define-data-table\";\r\nexport * from \"./define-data-form\";\r\nexport * from \"./define-data-tree\";\r\n\r\nexport * from \"./modules/ms\";\r\nexport * from \"./modules/cms\";\r\n"],"names":["installer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaO,MAAM,UAAUA,UAAU,UAAA;AAC1B,MAAM,UAAUA,UAAAA,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../src/index.ts"],"sourcesContent":["import \"./assets/iconfonts/iconfont.js\";\r\nimport \"./assets/iconfonts/oa-iconfont.js\";\r\nexport * from \"./constants\";\r\n\r\nexport * from \"./core\";\r\n\r\nimport { installer } from \"./installer\";\r\n\r\nexport * from \"./layouts\";\r\nexport * from \"./composables\";\r\nexport * from \"./components\";\r\nexport * from \"./tokens\";\r\n\r\nexport const install = installer.install;\r\nexport const version = installer.version;\r\n\r\nexport * from \"./init-application\";\r\nexport * from \"./define-data-table\";\r\nexport * from \"./define-data-form\";\r\nexport * from \"./define-data-tree\";\r\n\r\nexport * from \"./modules/ms\";\r\nexport * from \"./modules/cms\";\r\n"],"names":["installer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaO,MAAM,UAAUA,UAAU,UAAA;AAC1B,MAAM,UAAUA,UAAAA,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/modules/cms/pages/cms-contents/article-edit-add-page.vue2.js

@@ -429,15 +429,6 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                             })
                           ]),
                           _: 1
-                        }),
-                        vue.createVNode(_component_el_row, null, {
-                          default: vue.withCtx(() => [
-                            vue.createVNode(vue.unref(index$4.MKDataFormItem), {
-                              style: { "width": "100%" },
-                              name: "sortNo"
-                            })
-                          ]),
-                          _: 1
                         })
                       ]),
                       _: 1
@@ -578,7 +569,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                               vue.createVNode(vue.unref(index$5.MKUploadImage), {
                                 modelValue: articleForm.data.banner,
                                 "onUpdate:modelValue": _cache[10] || (_cache[10] = ($event) => articleForm.data.banner = $event),
-                                width: "100%",
+                                style: { "width": "100%" },
                                 height: "300px",
                                 uploadContext: new (vue.unref(index$6.ImageUploadContext))(vue.unref(CmsSettings).content.bannerImageSize)
                               }, null, 8, ["modelValue", "uploadContext"])

package/dist/cjs/modules/cms/pages/cms-contents/article-edit-add-page.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"article-edit-add-page.vue2.js","sources":["../../../../../../src/modules/cms/pages/cms-contents/article-edit-add-page.vue"],"sourcesContent":["<template>\r\n  <div class=\"mk-cms-article-eidtadd__warp\">\r\n    <el-page-header style=\"background-color: #fff;padding: 10px;\" :icon=\"ArrowLeftBold\" title=\"返回\"\r\n      @back=\"() => router.push({ name: 'cms/contents', query: { pid: articleForm?.data?.cmsPartId } })\">\r\n      <template #content>\r\n        <template v-if=\"!articleForm.loading\">\r\n          <el-text v-if=\"!articleForm.data?.modifier\">{{ !!route.query.id ? \"编辑文章\" : \"创建文章\" }}</el-text>\r\n          <el-text v-else>{{ articleForm.data?.modifierName }} 于 {{ articleForm.data?.updatedAt }} 更新</el-text>\r\n        </template>\r\n      </template>\r\n      <template #extra>\r\n        <div class=\"mk-cms-article-eidtadd__header_tools\">\r\n\r\n          <template v-if=\"!articleForm.loading\">\r\n            <el-tag v-if=\"!articleForm.data?.publishTime\" effect=\"dark\" round>未发布</el-tag>\r\n            <el-text v-else>发布时间：{{ articleForm.data?.publishTime }}</el-text>\r\n          </template>\r\n\r\n          <el-dropdown split-button type=\"primary\" style=\"margin-left: 10px;\" @click=\"saveHandle\">\r\n            <MKSvgIcon iconClass=\"save\" style=\"margin-right: 10px;\" />\r\n            保存\r\n            <template #dropdown>\r\n              <el-dropdown-menu>\r\n                <el-dropdown-item v-if=\"CmsSettings.publish.mode == 'static'\"  @click=\"saveAndViewHandle\">\r\n                  <MKSvgIcon iconClass=\"View\" style=\"margin-right: 5px;\" />\r\n                  保存并预览\r\n                </el-dropdown-item>\r\n                <el-dropdown-item @click=\"saveAndPublishHandle\">\r\n                  <MKSvgIcon iconClass=\"Share\" style=\"margin-right: 5px;\" />\r\n                  保存并发布\r\n                </el-dropdown-item>\r\n              </el-dropdown-menu>\r\n            </template>\r\n          </el-dropdown>\r\n        </div>\r\n      </template>\r\n    </el-page-header>\r\n    <div class=\"mk-cms-article-eidtadd__body\" v-loading=\"articleForm.loading\">\r\n\r\n      <MKDocEditor v-if=\"articleForm.data\"  :css=\"CmsSettings.content.doc.css\" :js=\"CmsSettings.content.doc.js\" :content=\"content\" @change=\"EditorChangeHandle\">\r\n        <template #header>\r\n          <div class=\"mk-cms-article-eidtadd__body__header\">\r\n            <el-row>\r\n              <el-input class=\"title\" type=\"textarea\" :autosize=\"{ minRows: 1, maxRows: 4 }\" maxlength=\"150\"\r\n                show-word-limit placeholder=\"请输入标题\" v-model=\"title\" />\r\n            </el-row>\r\n            <el-row>\r\n              <el-input class=\"sub-title\" type=\"textarea\" :autosize=\"{ minRows: 1, maxRows: 4 }\" maxlength=\"150\"\r\n                show-word-limit placeholder=\"[选填] 请输入子标题\" v-model=\"subTitle\" />\r\n            </el-row>\r\n          </div>\r\n        </template>\r\n        <template #after-extentions>\r\n          <div class=\"mk-cms-article-eidtadd__body__extentions\" :class=\"{ hide: closeExtentions! }\" ref=\"extentionsRef\">\r\n            <MKSvgIcon icon-class=\"ArrowLeft\" class=\"open\" @click=\"closeExtentionsHandle\" v-if=\"closeExtentions\">\r\n            </MKSvgIcon>\r\n            <MKSvgIcon v-else icon-class=\"ArrowRight\" class=\"close\" @click=\"hideExtentionsHandle\">\r\n            </MKSvgIcon>\r\n            <el-divider content-position=\"left\">文章设置</el-divider>\r\n            <MKDataForm :dataForm=\"articleForm\">\r\n              <MKForm :dataForm=\"articleForm\" style=\"width:225px\" label-width=\"110px\">\r\n                <el-row v-if=\"CmsSettings.content.useTop\">\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isTop\"></MKDataFormItem>\r\n                </el-row>\r\n                <el-row v-if=\"CmsSettings.content.useNew\">\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isNew\"></MKDataFormItem>\r\n                </el-row>\r\n                <el-row v-if=\"CmsSettings.content.useHotRecommend\">\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isHotRecommend\"></MKDataFormItem>\r\n                </el-row>\r\n                <el-row v-if=\"CmsSettings.content.usePartRecommend\">\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isPartRecommend\"></MKDataFormItem>\r\n                </el-row>\r\n                <el-row>\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isShowList\"></MKDataFormItem>\r\n                </el-row>\r\n                <!-- <el-row>\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isDraft\"></MKDataFormItem>\r\n                </el-row> -->\r\n                <el-row>\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"sortNo\"></MKDataFormItem>\r\n                </el-row>\r\n              </MKForm>\r\n            </MKDataForm>\r\n          </div>\r\n        </template>\r\n        <template #footer>\r\n          <div class=\"mk-cms-article-eidtadd__body__footer\">\r\n            <el-tabs v-model=\"articleOptionsActive\">\r\n              <el-tab-pane label=\"基础内容\" name=\"content\">\r\n                <div class=\"content\">\r\n                  <el-row :gutter=\"20\">\r\n                    <el-col :span=\"6\">\r\n                      <el-input placeholder=\"[选填] 作者\" v-model=\"articleForm.data.author\" clearable>\r\n                        <template #prefix>\r\n                          <MKSvgIcon iconClass=\"UserFilled\" />\r\n                        </template>\r\n                      </el-input>\r\n                    </el-col>\r\n                    <el-col :span=\"6\">\r\n                      <el-date-picker v-model=\"releaseDate\" type=\"datetime\" placeholder=\"发布时间\"\r\n                        :default-time=\"new Date()\" />\r\n                    </el-col>\r\n                    <el-col :span=\"12\">\r\n                      <el-input placeholder=\"[选填] 发布地址\" v-model=\"articleForm.data.locationDesc\" clearable>\r\n                        <template #prefix>\r\n                          <MKSvgIcon iconClass=\"Location\" />\r\n                        </template>\r\n                      </el-input>\r\n                    </el-col>\r\n                  </el-row>\r\n                  <el-row v-if=\"CmsSettings.content.useTags\">\r\n                    <el-select v-model=\"tags\" multiple filterable allow-create default-first-option\r\n                      :reserve-keyword=\"false\" placeholder=\"[可选] 选择文章标签\" style=\"width: 100%\">\r\n                      <template #prefix>\r\n                        <MKSvgIcon iconClass=\"CollectionTag\" />\r\n                      </template>\r\n                    </el-select>\r\n                  </el-row>\r\n                  <el-divider content-position=\"left\">\r\n                    文章封面/简介\r\n                    <el-switch v-model=\"descAutoCreate\" style=\"margin-left: 10px;\" inline-prompt active-text=\"自动生成\"\r\n                      inactive-text=\"手动撰写\" />\r\n                  </el-divider>\r\n                  <el-row class=\"cover-desc\">\r\n                    <MKUploadImage style=\"margin-right: 10px;\" v-model=\"articleForm.data.cover\" width=\"115px\" height=\"115px\" \r\n                    :uploadContext=\"new ImageUploadContext(CmsSettings.content.coverImageSize)\">\r\n\r\n                    </MKUploadImage>\r\n                    <el-input class=\"desc\" type=\"textarea\" :autosize=\"{ minRows: 5, maxRows: 30 }\" maxlength=\"1000\"\r\n                      show-word-limit placeholder=\"[选填] 文章简介\" v-model=\"desc\" />\r\n                  </el-row>\r\n                  <el-divider content-position=\"left\">文章Banner图</el-divider>\r\n                  <el-row>\r\n                    <MKUploadImage v-model=\"articleForm.data.banner\" width=\"100%\" height=\"300px\" :uploadContext=\"new ImageUploadContext(CmsSettings.content.bannerImageSize)\">\r\n\r\n                    </MKUploadImage>\r\n                  </el-row>\r\n                </div>\r\n              </el-tab-pane>\r\n              <el-tab-pane label=\"文章资源库\" name=\"atlas\"  v-if=\"CmsSettings.content.useAtlas\">\r\n                <ArticleAtlas v-model=\"atlas\" :articleId=\"parseInt(articleForm.data?.id)\" />\r\n              </el-tab-pane>\r\n              <el-tab-pane label=\"页面设置\" name=\"settings\"  v-if=\"CmsSettings.publish.mode == 'static'\">\r\n                <MKDataForm :dataForm=\"articleForm\" label-width=\"120px\">\r\n                  <MKForm :dataForm=\"articleForm\">\r\n                    <el-row>\r\n                      <MKDataFormItem style=\"width: 100%;\" name=\"seoKeywords\"></MKDataFormItem>\r\n                    </el-row>\r\n                    <el-row>\r\n                      <MKDataFormItem style=\"width: 100%;\" name=\"seoDesc\"></MKDataFormItem>\r\n                    </el-row>\r\n                  </MKForm>\r\n                </MKDataForm>\r\n              </el-tab-pane>\r\n            </el-tabs>\r\n          </div>\r\n        </template>\r\n      </MKDocEditor>\r\n    </div>\r\n  </div>\r\n</template>\r\n<script setup lang='ts'>\r\nimport { onMounted, reactive, ref, computed } from \"vue\";\r\nimport { ArrowLeftBold } from \"@element-plus/icons-vue\"\r\nimport { MKDocEditor, MKSvgIcon, MKUploadImage } from '../../../../components'\r\nimport { MKDataForm, MKForm, MKDataFormItem } from \"../../../../components\";\r\nimport ArticleAtlas from \"./components/article-atlas.vue\";\r\nimport { CmsArticlesForm } from \"../../dataviews\";\r\nimport { useRoute, useRouter } from \"vue-router\";\r\nimport { ImageUploadContext } from \"../../../ms\";\r\nimport { useCmsSettings } from \"../../cms-settings\"\r\n// cms 配置\r\nconst CmsSettings = useCmsSettings(true);\r\n\r\nconst route = useRoute()\r\nconst router = useRouter();\r\n\r\n\r\n// 文章请求\r\nconst articleForm = reactive(new CmsArticlesForm()) as CmsArticlesForm;\r\nconst articleOptionsActive = ref(\"content\");\r\n\r\n\r\n// 标题\r\nconst title = computed({\r\n  get() { return articleForm.data?.title || \"\"; },\r\n  set(val) { articleForm.data.title = val; }\r\n});\r\n// 子标题\r\nconst subTitle = computed({\r\n  get() { return articleForm.data?.subTitle || \"\"; },\r\n  set(val) { articleForm.data.subTitle = val; }\r\n});\r\n// 获取默认简介\r\nconst getDefaultDescContent = () => {\r\n  if (!descAutoCreate.value) {\r\n    return \"\";\r\n  }\r\n  let val: any = \"\";\r\n  const div = document.createElement(\"div\");\r\n  div.innerHTML = content.value;\r\n  val = div.textContent?.substring(0, 700);\r\n  if (div.textContent!.length > 700) {\r\n    val += \"...\";\r\n  }\r\n  return val;\r\n}\r\nconst descAutoCreate = ref(true)\r\n// 简介\r\nconst desc = computed({\r\n  get() {\r\n    return articleForm.data?.desc || getDefaultDescContent();\r\n  },\r\n  set(val) {\r\n    articleForm.data.desc = val;\r\n  }\r\n});\r\n// 发布时间\r\nconst releaseDate = computed({\r\n  get() { return articleForm.data?.releaseDate || articleForm.data?.publishTime; },\r\n  set(val) { articleForm.data.releaseDate = val; }\r\n});\r\n// 标签\r\nconst tags = ref([]);\r\n//  computed({ \r\n//   get() { return articleForm.data?.tags || [] }, \r\n//   set(val) { articleForm.data.tags = val; } \r\n// });\r\n// 内容\r\nconst content = computed({\r\n  get() { return articleForm.data?.content || \"\"; },\r\n  set(val) { articleForm.data.content = val; }\r\n});\r\n\r\n// 图集\r\nconst atlas = computed({\r\n  get() {\r\n    return articleForm.data?.atlas\r\n  },\r\n  set(val) { articleForm.data.atlas = val; }\r\n});\r\n\r\n// 表单初始化\r\nconst formInitDataInfo = ()=>{\r\n // 初始化数据加载\r\n if (route.query.id) {\r\n    articleForm.editRecord(route.query.id);\r\n  }\r\n  else if (route.query.partId) {\r\n    articleForm.addRecord({ cmsPartId: route.query.partId,isDraft:1 });\r\n  }\r\n  else {\r\n    articleForm.addRecord({ isDraft:1 });\r\n  }\r\n}\r\n\r\nonMounted(() => {\r\n  formInitDataInfo();\r\n  articleForm.init();\r\n\r\n})\r\n\r\n// 保存\r\nconst saveHandle = async () => {\r\n\r\n  // 简介不存在的时候使用自动生成的\r\n  if (!articleForm.data?.desc) {\r\n    desc.value = getDefaultDescContent();\r\n  }\r\n\r\n  let result = await articleForm.submit();\r\n\r\n  router.back();\r\n\r\n  return result;\r\n}\r\n\r\n// 保存并预览\r\nconst saveAndViewHandle = async ()=>{\r\n  const partId = articleForm.data.cmsPartId;\r\n  const data = await saveHandle();\r\n  if(data.data.code == 200 && data.data.data){\r\n    window.open('/api/cms/content/preview/content/' + partId + '/' + data.data.data)\r\n  }\r\n}\r\n\r\n// 保存并发布\r\nconst saveAndPublishHandle = async ()=>{\r\n  const result:any = await articleForm.saveAndPublish(CmsSettings.publish.mode);\r\n  if(result.data.code == 200){\r\n    router.back();\r\n  }\r\n}\r\n\r\n// 隐藏扩展\r\nconst closeExtentions = ref(true);\r\nconst extentionsRef = ref();\r\nconst hideExtentionsHandle = () => {\r\n  closeExtentions.value = true;\r\n}\r\n//展示扩展\r\nconst closeExtentionsHandle = () => {\r\n  closeExtentions.value = false;\r\n}\r\n\r\nconst EditorChangeHandle = (v: any) => {\r\n  articleForm.data.content = v;\r\n}\r\n\r\n</script>\r\n"],"names":["useCmsSettings","useRoute","useRouter","reactive","CmsArticlesForm","ref","computed","onMounted"],"mappings":"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"}
+{"version":3,"file":"article-edit-add-page.vue2.js","sources":["../../../../../../src/modules/cms/pages/cms-contents/article-edit-add-page.vue"],"sourcesContent":["<template>\r\n  <div class=\"mk-cms-article-eidtadd__warp\">\r\n    <el-page-header style=\"background-color: #fff;padding: 10px;\" :icon=\"ArrowLeftBold\" title=\"返回\"\r\n      @back=\"() => router.push({ name: 'cms/contents', query: { pid: articleForm?.data?.cmsPartId } })\">\r\n      <template #content>\r\n        <template v-if=\"!articleForm.loading\">\r\n          <el-text v-if=\"!articleForm.data?.modifier\">{{ !!route.query.id ? \"编辑文章\" : \"创建文章\" }}</el-text>\r\n          <el-text v-else>{{ articleForm.data?.modifierName }} 于 {{ articleForm.data?.updatedAt }} 更新</el-text>\r\n        </template>\r\n      </template>\r\n      <template #extra>\r\n        <div class=\"mk-cms-article-eidtadd__header_tools\">\r\n\r\n          <template v-if=\"!articleForm.loading\">\r\n            <el-tag v-if=\"!articleForm.data?.publishTime\" effect=\"dark\" round>未发布</el-tag>\r\n            <el-text v-else>发布时间：{{ articleForm.data?.publishTime }}</el-text>\r\n          </template>\r\n\r\n          <el-dropdown split-button type=\"primary\" style=\"margin-left: 10px;\" @click=\"saveHandle\">\r\n            <MKSvgIcon iconClass=\"save\" style=\"margin-right: 10px;\" />\r\n            保存\r\n            <template #dropdown>\r\n              <el-dropdown-menu>\r\n                <el-dropdown-item v-if=\"CmsSettings.publish.mode == 'static'\"  @click=\"saveAndViewHandle\">\r\n                  <MKSvgIcon iconClass=\"View\" style=\"margin-right: 5px;\" />\r\n                  保存并预览\r\n                </el-dropdown-item>\r\n                <el-dropdown-item @click=\"saveAndPublishHandle\">\r\n                  <MKSvgIcon iconClass=\"Share\" style=\"margin-right: 5px;\" />\r\n                  保存并发布\r\n                </el-dropdown-item>\r\n              </el-dropdown-menu>\r\n            </template>\r\n          </el-dropdown>\r\n        </div>\r\n      </template>\r\n    </el-page-header>\r\n    <div class=\"mk-cms-article-eidtadd__body\" v-loading=\"articleForm.loading\">\r\n\r\n      <MKDocEditor v-if=\"articleForm.data\"  :css=\"CmsSettings.content.doc.css\" :js=\"CmsSettings.content.doc.js\" :content=\"content\" @change=\"EditorChangeHandle\">\r\n        <template #header>\r\n          <div class=\"mk-cms-article-eidtadd__body__header\">\r\n            <el-row>\r\n              <el-input class=\"title\" type=\"textarea\" :autosize=\"{ minRows: 1, maxRows: 4 }\" maxlength=\"150\"\r\n                show-word-limit placeholder=\"请输入标题\" v-model=\"title\" />\r\n            </el-row>\r\n            <el-row>\r\n              <el-input class=\"sub-title\" type=\"textarea\" :autosize=\"{ minRows: 1, maxRows: 4 }\" maxlength=\"150\"\r\n                show-word-limit placeholder=\"[选填] 请输入子标题\" v-model=\"subTitle\" />\r\n            </el-row>\r\n          </div>\r\n        </template>\r\n        <template #after-extentions>\r\n          <div class=\"mk-cms-article-eidtadd__body__extentions\" :class=\"{ hide: closeExtentions! }\" ref=\"extentionsRef\">\r\n            <MKSvgIcon icon-class=\"ArrowLeft\" class=\"open\" @click=\"closeExtentionsHandle\" v-if=\"closeExtentions\">\r\n            </MKSvgIcon>\r\n            <MKSvgIcon v-else icon-class=\"ArrowRight\" class=\"close\" @click=\"hideExtentionsHandle\">\r\n            </MKSvgIcon>\r\n            <el-divider content-position=\"left\">文章设置</el-divider>\r\n            <MKDataForm :dataForm=\"articleForm\">\r\n              <MKForm :dataForm=\"articleForm\" style=\"width:225px\" label-width=\"110px\">\r\n                <el-row v-if=\"CmsSettings.content.useTop\">\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isTop\"></MKDataFormItem>\r\n                </el-row>\r\n                <el-row v-if=\"CmsSettings.content.useNew\">\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isNew\"></MKDataFormItem>\r\n                </el-row>\r\n                <el-row v-if=\"CmsSettings.content.useHotRecommend\">\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isHotRecommend\"></MKDataFormItem>\r\n                </el-row>\r\n                <el-row v-if=\"CmsSettings.content.usePartRecommend\">\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isPartRecommend\"></MKDataFormItem>\r\n                </el-row>\r\n                <el-row>\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isShowList\"></MKDataFormItem>\r\n                </el-row>\r\n                <!-- <el-row>\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"isDraft\"></MKDataFormItem>\r\n                </el-row> -->\r\n                <!-- <el-row>\r\n                  <MKDataFormItem style=\"width: 100%;\" name=\"sortNo\"></MKDataFormItem>\r\n                </el-row> -->\r\n              </MKForm>\r\n            </MKDataForm>\r\n          </div>\r\n        </template>\r\n        <template #footer>\r\n          <div class=\"mk-cms-article-eidtadd__body__footer\">\r\n            <el-tabs v-model=\"articleOptionsActive\">\r\n              <el-tab-pane label=\"基础内容\" name=\"content\">\r\n                <div class=\"content\">\r\n                  <el-row :gutter=\"20\">\r\n                    <el-col :span=\"6\">\r\n                      <el-input placeholder=\"[选填] 作者\" v-model=\"articleForm.data.author\" clearable>\r\n                        <template #prefix>\r\n                          <MKSvgIcon iconClass=\"UserFilled\" />\r\n                        </template>\r\n                      </el-input>\r\n                    </el-col>\r\n                    <el-col :span=\"6\">\r\n                      <el-date-picker v-model=\"releaseDate\" type=\"datetime\" placeholder=\"发布时间\"\r\n                        :default-time=\"new Date()\" />\r\n                    </el-col>\r\n                    <el-col :span=\"12\">\r\n                      <el-input placeholder=\"[选填] 发布地址\" v-model=\"articleForm.data.locationDesc\" clearable>\r\n                        <template #prefix>\r\n                          <MKSvgIcon iconClass=\"Location\" />\r\n                        </template>\r\n                      </el-input>\r\n                    </el-col>\r\n                  </el-row>\r\n                  <el-row v-if=\"CmsSettings.content.useTags\">\r\n                    <el-select v-model=\"tags\" multiple filterable allow-create default-first-option\r\n                      :reserve-keyword=\"false\" placeholder=\"[可选] 选择文章标签\" style=\"width: 100%\">\r\n                      <template #prefix>\r\n                        <MKSvgIcon iconClass=\"CollectionTag\" />\r\n                      </template>\r\n                    </el-select>\r\n                  </el-row>\r\n                  <el-divider content-position=\"left\">\r\n                    文章封面/简介\r\n                    <el-switch v-model=\"descAutoCreate\" style=\"margin-left: 10px;\" inline-prompt active-text=\"自动生成\"\r\n                      inactive-text=\"手动撰写\" />\r\n                  </el-divider>\r\n                  <el-row class=\"cover-desc\">\r\n                    <MKUploadImage style=\"margin-right: 10px;\" v-model=\"articleForm.data.cover\" width=\"115px\" height=\"115px\" \r\n                    :uploadContext=\"new ImageUploadContext(CmsSettings.content.coverImageSize)\">\r\n\r\n                    </MKUploadImage>\r\n                    <el-input class=\"desc\" type=\"textarea\" :autosize=\"{ minRows: 5, maxRows: 30 }\" maxlength=\"1000\"\r\n                      show-word-limit placeholder=\"[选填] 文章简介\" v-model=\"desc\" />\r\n                  </el-row>\r\n                  <el-divider content-position=\"left\">文章Banner图</el-divider>\r\n                  <el-row>\r\n                    <MKUploadImage v-model=\"articleForm.data.banner\" style=\"width: 100%;\" height=\"300px\" :uploadContext=\"new ImageUploadContext(CmsSettings.content.bannerImageSize)\">\r\n\r\n                    </MKUploadImage>\r\n                  </el-row>\r\n                </div>\r\n              </el-tab-pane>\r\n              <el-tab-pane label=\"文章资源库\" name=\"atlas\"  v-if=\"CmsSettings.content.useAtlas\">\r\n                <ArticleAtlas v-model=\"atlas\" :articleId=\"parseInt(articleForm.data?.id)\" />\r\n              </el-tab-pane>\r\n              <el-tab-pane label=\"页面设置\" name=\"settings\"  v-if=\"CmsSettings.publish.mode == 'static'\">\r\n                <MKDataForm :dataForm=\"articleForm\" label-width=\"120px\">\r\n                  <MKForm :dataForm=\"articleForm\">\r\n                    <el-row>\r\n                      <MKDataFormItem style=\"width: 100%;\" name=\"seoKeywords\"></MKDataFormItem>\r\n                    </el-row>\r\n                    <el-row>\r\n                      <MKDataFormItem style=\"width: 100%;\" name=\"seoDesc\"></MKDataFormItem>\r\n                    </el-row>\r\n                  </MKForm>\r\n                </MKDataForm>\r\n              </el-tab-pane>\r\n            </el-tabs>\r\n          </div>\r\n        </template>\r\n      </MKDocEditor>\r\n    </div>\r\n  </div>\r\n</template>\r\n<script setup lang='ts'>\r\nimport { onMounted, reactive, ref, computed } from \"vue\";\r\nimport { ArrowLeftBold } from \"@element-plus/icons-vue\"\r\nimport { MKDocEditor, MKSvgIcon, MKUploadImage } from '../../../../components'\r\nimport { MKDataForm, MKForm, MKDataFormItem } from \"../../../../components\";\r\nimport ArticleAtlas from \"./components/article-atlas.vue\";\r\nimport { CmsArticlesForm } from \"../../dataviews\";\r\nimport { useRoute, useRouter } from \"vue-router\";\r\nimport { ImageUploadContext } from \"../../../ms\";\r\nimport { useCmsSettings } from \"../../cms-settings\"\r\n// cms 配置\r\nconst CmsSettings = useCmsSettings(true);\r\n\r\nconst route = useRoute()\r\nconst router = useRouter();\r\n\r\n\r\n// 文章请求\r\nconst articleForm = reactive(new CmsArticlesForm()) as CmsArticlesForm;\r\nconst articleOptionsActive = ref(\"content\");\r\n\r\n\r\n// 标题\r\nconst title = computed({\r\n  get() { return articleForm.data?.title || \"\"; },\r\n  set(val) { articleForm.data.title = val; }\r\n});\r\n// 子标题\r\nconst subTitle = computed({\r\n  get() { return articleForm.data?.subTitle || \"\"; },\r\n  set(val) { articleForm.data.subTitle = val; }\r\n});\r\n// 获取默认简介\r\nconst getDefaultDescContent = () => {\r\n  if (!descAutoCreate.value) {\r\n    return \"\";\r\n  }\r\n  let val: any = \"\";\r\n  const div = document.createElement(\"div\");\r\n  div.innerHTML = content.value;\r\n  val = div.textContent?.substring(0, 700);\r\n  if (div.textContent!.length > 700) {\r\n    val += \"...\";\r\n  }\r\n  return val;\r\n}\r\nconst descAutoCreate = ref(true)\r\n// 简介\r\nconst desc = computed({\r\n  get() {\r\n    return articleForm.data?.desc || getDefaultDescContent();\r\n  },\r\n  set(val) {\r\n    articleForm.data.desc = val;\r\n  }\r\n});\r\n// 发布时间\r\nconst releaseDate = computed({\r\n  get() { return articleForm.data?.releaseDate || articleForm.data?.publishTime; },\r\n  set(val) { articleForm.data.releaseDate = val; }\r\n});\r\n// 标签\r\nconst tags = ref([]);\r\n//  computed({ \r\n//   get() { return articleForm.data?.tags || [] }, \r\n//   set(val) { articleForm.data.tags = val; } \r\n// });\r\n// 内容\r\nconst content = computed({\r\n  get() { return articleForm.data?.content || \"\"; },\r\n  set(val) { articleForm.data.content = val; }\r\n});\r\n\r\n// 图集\r\nconst atlas = computed({\r\n  get() {\r\n    return articleForm.data?.atlas\r\n  },\r\n  set(val) { articleForm.data.atlas = val; }\r\n});\r\n\r\n// 表单初始化\r\nconst formInitDataInfo = ()=>{\r\n // 初始化数据加载\r\n if (route.query.id) {\r\n    articleForm.editRecord(route.query.id);\r\n  }\r\n  else if (route.query.partId) {\r\n    articleForm.addRecord({ cmsPartId: route.query.partId,isDraft:1 });\r\n  }\r\n  else {\r\n    articleForm.addRecord({ isDraft:1 });\r\n  }\r\n}\r\n\r\nonMounted(() => {\r\n  formInitDataInfo();\r\n  articleForm.init();\r\n\r\n})\r\n\r\n// 保存\r\nconst saveHandle = async () => {\r\n\r\n  // 简介不存在的时候使用自动生成的\r\n  if (!articleForm.data?.desc) {\r\n    desc.value = getDefaultDescContent();\r\n  }\r\n\r\n  let result = await articleForm.submit();\r\n\r\n  router.back();\r\n\r\n  return result;\r\n}\r\n\r\n// 保存并预览\r\nconst saveAndViewHandle = async ()=>{\r\n  const partId = articleForm.data.cmsPartId;\r\n  const data = await saveHandle();\r\n  if(data.data.code == 200 && data.data.data){\r\n    window.open('/api/cms/content/preview/content/' + partId + '/' + data.data.data)\r\n  }\r\n}\r\n\r\n// 保存并发布\r\nconst saveAndPublishHandle = async ()=>{\r\n  const result:any = await articleForm.saveAndPublish(CmsSettings.publish.mode);\r\n  if(result.data.code == 200){\r\n    router.back();\r\n  }\r\n}\r\n\r\n// 隐藏扩展\r\nconst closeExtentions = ref(true);\r\nconst extentionsRef = ref();\r\nconst hideExtentionsHandle = () => {\r\n  closeExtentions.value = true;\r\n}\r\n//展示扩展\r\nconst closeExtentionsHandle = () => {\r\n  closeExtentions.value = false;\r\n}\r\n\r\nconst EditorChangeHandle = (v: any) => {\r\n  articleForm.data.content = v;\r\n}\r\n\r\n</script>\r\n"],"names":["useCmsSettings","useRoute","useRouter","reactive","CmsArticlesForm","ref","computed","onMounted"],"mappings":"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"}