@maketribe/ms-app 3.2.25 → 3.2.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/assets/iconfonts/iconfont.js +1 -1
- package/dist/cjs/assets/iconfonts/iconfont.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/core/{element-module.js → element-block.js} +31 -12
- package/dist/cjs/components/basic/doc-editor/core/element-block.js.map +1 -0
- package/dist/cjs/components/basic/doc-editor/core/index.js +5 -6
- package/dist/cjs/components/basic/doc-editor/core/index.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/core/utils.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/editor.vue.js +4 -4
- package/dist/cjs/components/basic/doc-editor/editor.vue.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/{DecoratorModuleToolbarPlugin → ElementBlockSelectionPlugin}/index.vue.js +8 -8
- package/dist/cjs/components/basic/doc-editor/plugins/ElementBlockSelectionPlugin/index.vue.js.map +1 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/GridNode.js +164 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/GridNode.js.map +1 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/ImageTextGridNode.js +89 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/ImageTextGridNode.js.map +1 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/LayoutGridNode.js +89 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/LayoutGridNode.js.map +1 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/ModuleGridNode.js +115 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/ModuleGridNode.js.map +1 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/TextGridNode.js +83 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/TextGridNode.js.map +1 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/index.vue.js +143 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/index.vue.js.map +1 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/utils.js +33 -0
- package/dist/cjs/components/basic/doc-editor/plugins/GridPlugin/utils.js.map +1 -0
- package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/ImageNode.js +18 -21
- package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/ImageNode.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/index.vue.js +16 -11
- package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/index.vue.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/utils.js +6 -6
- package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/utils.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.js +25 -13
- package/dist/cjs/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ModulePlugin/index.vue.js +46 -108
- package/dist/cjs/components/basic/doc-editor/plugins/ModulePlugin/index.vue.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ModulePlugin/utils.js +0 -12
- package/dist/cjs/components/basic/doc-editor/plugins/ModulePlugin/utils.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue.js +26 -0
- package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js +0 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue.js +41 -5
- package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/plugins/nodes.js +10 -4
- package/dist/cjs/components/basic/doc-editor/plugins/nodes.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/themes/doc-editor-edit.css.js +1 -1
- package/dist/cjs/components/basic/doc-editor/themes/doc-editor-edit.css.js.map +1 -1
- package/dist/cjs/components/basic/doc-editor/themes/doc-theme.css.js +3 -5
- package/dist/cjs/components/basic/doc-editor/themes/doc-theme.css.js.map +1 -1
- package/dist/cjs/components/basic/upload-file/ui/upload-image/upload-image.js +0 -2
- package/dist/cjs/components/basic/upload-file/ui/upload-image/upload-image.js.map +1 -1
- package/dist/cjs/modules/cms/dataviews/cms-ad-contents/CmsAdContentsForm.js +4 -0
- package/dist/cjs/modules/cms/dataviews/cms-ad-contents/CmsAdContentsForm.js.map +1 -1
- package/dist/cjs/modules/cms/dataviews/cms-ad-defines/CmsAdDefinesForm.js +2 -0
- package/dist/cjs/modules/cms/dataviews/cms-ad-defines/CmsAdDefinesForm.js.map +1 -1
- package/dist/cjs/modules/cms/pages/cms-ad/index.vue2.js +8 -5
- package/dist/cjs/modules/cms/pages/cms-ad/index.vue2.js.map +1 -1
- package/dist/cjs/modules/cms/pages/cms-contents/components/part-banner-edit.vue.js +35 -6
- package/dist/cjs/modules/cms/pages/cms-contents/components/part-banner-edit.vue.js.map +1 -1
- package/dist/cjs/modules/ms/components/image-select/image-select-panel.js +7 -1
- package/dist/cjs/modules/ms/components/image-select/image-select-panel.js.map +1 -1
- package/dist/esm/assets/iconfonts/iconfont.js +1 -1
- package/dist/esm/assets/iconfonts/iconfont.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/core/{element-module.js → element-block.js} +32 -13
- package/dist/esm/components/basic/doc-editor/core/element-block.js.map +1 -0
- package/dist/esm/components/basic/doc-editor/core/index.js +6 -7
- package/dist/esm/components/basic/doc-editor/core/index.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/core/utils.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/editor.vue.js +4 -4
- package/dist/esm/components/basic/doc-editor/editor.vue.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/{DecoratorModuleToolbarPlugin → ElementBlockSelectionPlugin}/index.vue.js +8 -8
- package/dist/esm/components/basic/doc-editor/plugins/ElementBlockSelectionPlugin/index.vue.js.map +1 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/GridNode.js +164 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/GridNode.js.map +1 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/ImageTextGridNode.js +89 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/ImageTextGridNode.js.map +1 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/LayoutGridNode.js +89 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/LayoutGridNode.js.map +1 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/ModuleGridNode.js +115 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/ModuleGridNode.js.map +1 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/TextGridNode.js +83 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/TextGridNode.js.map +1 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/index.vue.js +144 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/index.vue.js.map +1 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/utils.js +33 -0
- package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/utils.js.map +1 -0
- package/dist/esm/components/basic/doc-editor/plugins/ImagePlugin/ImageNode.js +18 -21
- package/dist/esm/components/basic/doc-editor/plugins/ImagePlugin/ImageNode.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/ImagePlugin/index.vue.js +17 -12
- package/dist/esm/components/basic/doc-editor/plugins/ImagePlugin/index.vue.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/ImagePlugin/utils.js +6 -6
- package/dist/esm/components/basic/doc-editor/plugins/ImagePlugin/utils.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.js +25 -13
- package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/index.vue.js +50 -112
- package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/index.vue.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/utils.js +0 -12
- package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/utils.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue.js +26 -0
- package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js +0 -1
- package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue.js +43 -7
- package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/plugins/nodes.js +10 -4
- package/dist/esm/components/basic/doc-editor/plugins/nodes.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/themes/doc-editor-edit.css.js +1 -1
- package/dist/esm/components/basic/doc-editor/themes/doc-editor-edit.css.js.map +1 -1
- package/dist/esm/components/basic/doc-editor/themes/doc-theme.css.js +3 -5
- package/dist/esm/components/basic/doc-editor/themes/doc-theme.css.js.map +1 -1
- package/dist/esm/components/basic/upload-file/ui/upload-image/upload-image.js +0 -2
- package/dist/esm/components/basic/upload-file/ui/upload-image/upload-image.js.map +1 -1
- package/dist/esm/modules/cms/dataviews/cms-ad-contents/CmsAdContentsForm.js +4 -0
- package/dist/esm/modules/cms/dataviews/cms-ad-contents/CmsAdContentsForm.js.map +1 -1
- package/dist/esm/modules/cms/dataviews/cms-ad-defines/CmsAdDefinesForm.js +2 -0
- package/dist/esm/modules/cms/dataviews/cms-ad-defines/CmsAdDefinesForm.js.map +1 -1
- package/dist/esm/modules/cms/pages/cms-ad/index.vue2.js +9 -6
- package/dist/esm/modules/cms/pages/cms-ad/index.vue2.js.map +1 -1
- package/dist/esm/modules/cms/pages/cms-contents/components/part-banner-edit.vue.js +35 -6
- package/dist/esm/modules/cms/pages/cms-contents/components/part-banner-edit.vue.js.map +1 -1
- package/dist/esm/modules/ms/components/image-select/image-select-panel.js +9 -3
- package/dist/esm/modules/ms/components/image-select/image-select-panel.js.map +1 -1
- package/dist/style/components/basic/doc-editor/index.css +1 -1
- package/dist/style/components/index.css +1 -1
- package/dist/style/index.css +2 -2
- package/dist/style/src/components/basic/doc-editor/index.scss +2 -0
- package/dist/types/components/basic/doc-editor/core/element-block.d.ts +44 -0
- package/dist/types/components/basic/doc-editor/core/index.d.ts +8 -4
- package/dist/types/components/basic/doc-editor/plugins/GridPlugin/GridNode.d.ts +88 -0
- package/dist/types/components/basic/doc-editor/plugins/GridPlugin/ImageTextGridNode.d.ts +50 -0
- package/dist/types/components/basic/doc-editor/plugins/GridPlugin/LayoutGridNode.d.ts +58 -0
- package/dist/types/components/basic/doc-editor/plugins/GridPlugin/ModuleGridNode.d.ts +58 -0
- package/dist/types/components/basic/doc-editor/plugins/GridPlugin/TextGridNode.d.ts +51 -0
- package/dist/types/components/basic/doc-editor/plugins/GridPlugin/index.d.ts +5 -0
- package/dist/types/components/basic/doc-editor/plugins/GridPlugin/utils.d.ts +3 -0
- package/dist/types/components/basic/doc-editor/plugins/ImagePlugin/ImageNode.d.ts +4 -13
- package/dist/types/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.d.ts +18 -10
- package/dist/types/components/basic/doc-editor/plugins/ModulePlugin/index.d.ts +0 -1
- package/dist/types/components/basic/doc-editor/plugins/ModulePlugin/utils.d.ts +0 -6
- package/dist/types/components/basic/doc-editor/plugins/index.d.ts +3 -3
- package/dist/types/components/basic/dynamic-form-panel/type.d.ts +2 -2
- package/dist/types/modules/cms/dataviews/cms-ad-contents/CmsAdContentsForm.d.ts +1 -0
- package/package.json +5 -5
- package/dist/cjs/components/basic/doc-editor/core/decorator-module.js +0 -13
- package/dist/cjs/components/basic/doc-editor/core/decorator-module.js.map +0 -1
- package/dist/cjs/components/basic/doc-editor/core/element-module.js.map +0 -1
- package/dist/cjs/components/basic/doc-editor/plugins/DecoratorModuleToolbarPlugin/index.vue.js.map +0 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ImageTextPlugin/ImageTextNode.js +0 -106
- package/dist/cjs/components/basic/doc-editor/plugins/ImageTextPlugin/ImageTextNode.js.map +0 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ImageTextPlugin/index.vue.js +0 -45
- package/dist/cjs/components/basic/doc-editor/plugins/ImageTextPlugin/index.vue.js.map +0 -1
- package/dist/cjs/components/basic/doc-editor/plugins/ModulePlugin/ModuleContainerNode.js +0 -143
- package/dist/cjs/components/basic/doc-editor/plugins/ModulePlugin/ModuleContainerNode.js.map +0 -1
- package/dist/cjs/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockCantainerNode.js +0 -123
- package/dist/cjs/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockCantainerNode.js.map +0 -1
- package/dist/cjs/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockNode.js +0 -84
- package/dist/cjs/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockNode.js.map +0 -1
- package/dist/esm/components/basic/doc-editor/core/decorator-module.js +0 -13
- package/dist/esm/components/basic/doc-editor/core/decorator-module.js.map +0 -1
- package/dist/esm/components/basic/doc-editor/core/element-module.js.map +0 -1
- package/dist/esm/components/basic/doc-editor/plugins/DecoratorModuleToolbarPlugin/index.vue.js.map +0 -1
- package/dist/esm/components/basic/doc-editor/plugins/ImageTextPlugin/ImageTextNode.js +0 -106
- package/dist/esm/components/basic/doc-editor/plugins/ImageTextPlugin/ImageTextNode.js.map +0 -1
- package/dist/esm/components/basic/doc-editor/plugins/ImageTextPlugin/index.vue.js +0 -46
- package/dist/esm/components/basic/doc-editor/plugins/ImageTextPlugin/index.vue.js.map +0 -1
- package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/ModuleContainerNode.js +0 -143
- package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/ModuleContainerNode.js.map +0 -1
- package/dist/esm/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockCantainerNode.js +0 -123
- package/dist/esm/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockCantainerNode.js.map +0 -1
- package/dist/esm/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockNode.js +0 -84
- package/dist/esm/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockNode.js.map +0 -1
- package/dist/types/components/basic/doc-editor/core/decorator-module.d.ts +0 -60
- package/dist/types/components/basic/doc-editor/core/element-module.d.ts +0 -15
- package/dist/types/components/basic/doc-editor/plugins/ImageTextPlugin/ImageTextNode.d.ts +0 -63
- package/dist/types/components/basic/doc-editor/plugins/ImageTextPlugin/index.d.ts +0 -1
- package/dist/types/components/basic/doc-editor/plugins/ModulePlugin/ModuleContainerNode.d.ts +0 -86
- package/dist/types/components/basic/doc-editor/plugins/ModulePlugin/ModuleRenderComponent.d.ts +0 -23
- package/dist/types/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockCantainerNode.d.ts +0 -63
- package/dist/types/components/basic/doc-editor/plugins/RichTextPlugin/nodes/BaseBlockNode.d.ts +0 -58
- /package/dist/cjs/components/basic/doc-editor/plugins/{DecoratorModuleToolbarPlugin → ElementBlockSelectionPlugin}/index.vue2.js +0 -0
- /package/dist/cjs/components/basic/doc-editor/plugins/{DecoratorModuleToolbarPlugin → ElementBlockSelectionPlugin}/index.vue2.js.map +0 -0
- /package/dist/cjs/components/basic/doc-editor/plugins/{ImageTextPlugin → GridPlugin}/index.vue2.js +0 -0
- /package/dist/cjs/components/basic/doc-editor/plugins/{ImageTextPlugin → GridPlugin}/index.vue2.js.map +0 -0
- /package/dist/esm/components/basic/doc-editor/plugins/{DecoratorModuleToolbarPlugin → ElementBlockSelectionPlugin}/index.vue2.js +0 -0
- /package/dist/esm/components/basic/doc-editor/plugins/{DecoratorModuleToolbarPlugin → ElementBlockSelectionPlugin}/index.vue2.js.map +0 -0
- /package/dist/esm/components/basic/doc-editor/plugins/{ImageTextPlugin → GridPlugin}/index.vue2.js +0 -0
- /package/dist/esm/components/basic/doc-editor/plugins/{ImageTextPlugin → GridPlugin}/index.vue2.js.map +0 -0
- /package/dist/types/components/basic/doc-editor/plugins/{DecoratorModuleToolbarPlugin → ElementBlockSelectionPlugin}/index.vue.d.ts +0 -0
- /package/dist/types/components/basic/doc-editor/plugins/{ImageTextPlugin → GridPlugin}/index.vue.d.ts +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport {
|
|
1
|
+
{"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { \r\n COMMAND_PRIORITY_EDITOR,$getNodeByKey,$getSelection,$isNodeSelection\r\n} from 'lexical'\r\nimport { onMounted, onUnmounted,ref } from 'vue'\r\nimport { ModuleType,useModule } from \"./composables\"\r\nimport { ModuleBlockNode,$createModuleBlockNode,$isModuleBlockNode } from \"./ModuleBlockNode\"\r\nimport { $isModuleGridNode } from \"../GridPlugin/ModuleGridNode\"\r\nimport { INSERT_MODULE_COMMAND,type ModulePropType } from \"./commands\"\r\nimport { showModuleSelectDialog,findModuleNodeEl } from \"./utils\"\r\nimport { createDefaultFormData } from \"../../../dynamic-form-panel/utils\"\r\nimport { useElementBlockSelection } from '../../core'\r\nimport { showDynamicFormDialoger } from \"../../../dynamic-form-panel\"\r\n\r\n// 编辑器\r\nconst editor = useLexicalComposer()\r\n\r\n// 使用元素模块 集成了模块选中删除以及工具条\r\nconst { isSelected, curSelectKey, curSelectPos } = useElementBlockSelection(findModuleNodeEl,()=>{\r\n \r\n const node = $getNodeByKey(curSelectKey.value)\r\n\r\n if($isModuleBlockNode(node)){\r\n\r\n const { module } = useModule(node.__name);\r\n\r\n return [\r\n {\r\n title:`编辑【${module.title}】`,icon:\"Edit\",action:async ()=>{\r\n\r\n var result = await showDynamicFormDialoger(module.title,module.options,node.__data)\r\n\r\n editor.update(() => {\r\n node.setContent(result)\r\n })\r\n\r\n } \r\n },\r\n {\r\n title:`插入【${module.title}】之前`,icon:\"BottomLeft\",action:async ()=>{\r\n\r\n // 打开模块面板\r\n const result = (await showModuleSelectDialog()) as ModuleType;\r\n const defaultData = createDefaultFormData(result.options);\r\n // 插入模块\r\n editor.dispatchCommand(INSERT_MODULE_COMMAND,{ name:result.name,data:defaultData})\r\n\r\n editor.update(() => {\r\n node.insertBefore($createModuleBlockNode(result.name,defaultData))\r\n })\r\n\r\n } \r\n },\r\n {\r\n title:`插入【${module.title}】之后`,icon:\"BottomRight\",action:async ()=>{\r\n\r\n // 打开模块面板\r\n const result = (await showModuleSelectDialog()) as ModuleType;\r\n const defaultData = createDefaultFormData(result.options);\r\n // 插入模块\r\n editor.dispatchCommand(INSERT_MODULE_COMMAND,{ name:result.name,data:defaultData})\r\n\r\n editor.update(() => {\r\n node.insertAfter($createModuleBlockNode(result.name,defaultData))\r\n })\r\n\r\n } \r\n }\r\n ]\r\n }\r\n\r\n return null;\r\n})\r\n\r\n\r\nonMounted(() => {\r\n\r\n if (!editor.hasNodes([ModuleBlockNode])){\r\n throw new Error('ModuleBlockPlugin: 未注册模块模版节点!')\r\n }\r\n\r\n // 注册指令\r\n const unregister = mergeRegister(\r\n\r\n // 插入模块\r\n editor.registerCommand<ModulePropType>(INSERT_MODULE_COMMAND,(payload) => {\r\n\r\n const selection = $getSelection()\r\n const node = $isNodeSelection(selection) ? selection?.getNodes()[0] : null;\r\n\r\n if($isModuleGridNode(node)){\r\n node.append($createModuleBlockNode(payload.name,payload.data))\r\n }\r\n \r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n\r\n );\r\n\r\n onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template>\r\n <div class=\"mk-doc-active-mark\" v-if=\"isSelected\" :style=\"curSelectPos\">\r\n \r\n </div>\r\n</template>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAkBA,UAAM,SAAS;AAGf,UAAM,EAAE,YAAY,cAAc,iBAAiB,yBAAyB,kBAAiB,MAAI;AAEzF,YAAA,OAAO,cAAc,aAAa,KAAK;AAE1C,UAAA,mBAAmB,IAAI,GAAE;AAE1B,cAAM,EAAE,OAAW,IAAA,UAAU,KAAK,MAAM;AAEjC,eAAA;AAAA,UACL;AAAA,YACE,OAAM,MAAM,OAAO,KAAK;AAAA,YAAI,MAAK;AAAA,YAAO,QAAO,YAAU;AAEnD,kBAAA,SAAS,MAAM,wBAAwB,OAAO,OAAM,OAAO,SAAQ,KAAK,MAAM;AAElF,qBAAO,OAAO,MAAM;AAClB,qBAAK,WAAW,MAAM;AAAA,cAAA,CACvB;AAAA,YAEH;AAAA,UACF;AAAA,UACA;AAAA,YACE,OAAM,MAAM,OAAO,KAAK;AAAA,YAAM,MAAK;AAAA,YAAa,QAAO,YAAU;AAGzD,oBAAA,SAAU,MAAM;AAChB,oBAAA,cAAc,sBAAsB,OAAO,OAAO;AAEjD,qBAAA,gBAAgB,uBAAsB,EAAE,MAAK,OAAO,MAAK,MAAK,aAAY;AAEjF,qBAAO,OAAO,MAAM;AAClB,qBAAK,aAAa,uBAAuB,OAAO,MAAK,WAAW,CAAC;AAAA,cAAA,CAClE;AAAA,YAEH;AAAA,UACF;AAAA,UACA;AAAA,YACE,OAAM,MAAM,OAAO,KAAK;AAAA,YAAM,MAAK;AAAA,YAAc,QAAO,YAAU;AAG1D,oBAAA,SAAU,MAAM;AAChB,oBAAA,cAAc,sBAAsB,OAAO,OAAO;AAEjD,qBAAA,gBAAgB,uBAAsB,EAAE,MAAK,OAAO,MAAK,MAAK,aAAY;AAEjF,qBAAO,OAAO,MAAM;AAClB,qBAAK,YAAY,uBAAuB,OAAO,MAAK,WAAW,CAAC;AAAA,cAAA,CACjE;AAAA,YAEH;AAAA,UACF;AAAA,QAAA;AAAA,MAEJ;AAEO,aAAA;AAAA,IAAA,CACR;AAGD,cAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAAC,eAAe,CAAC,GAAE;AAChC,cAAA,IAAI,MAAM,+BAA+B;AAAA,MACjD;AAGA,YAAM,aAAa;AAAA;AAAA,QAGjB,OAAO,gBAAgC,uBAAsB,CAAC,YAAY;AAExE,gBAAM,YAAY;AACZ,gBAAA,OAAO,iBAAiB,SAAS,IAAI,uCAAW,WAAW,KAAK;AAEnE,cAAA,kBAAkB,IAAI,GAAE;AACzB,iBAAK,OAAO,uBAAuB,QAAQ,MAAK,QAAQ,IAAI,CAAC;AAAA,UAC/D;AAEO,iBAAA;AAAA,WACP,uBAAuB;AAAA,MAAA;AAIf,kBAAA,MAAM,YAAY;AAAA,IAAA,CAC/B;;;;;;;;;;"}
|
|
@@ -4,7 +4,6 @@ import { ElInput, ElButton } from "element-plus";
|
|
|
4
4
|
import { Search } from "@element-plus/icons-vue";
|
|
5
5
|
import { useModules } from "./composables.js";
|
|
6
6
|
import { ModuleBlockNode } from "./ModuleBlockNode.js";
|
|
7
|
-
import { ModuleContainerNode } from "./ModuleContainerNode.js";
|
|
8
7
|
const showModuleSelectDialog = async () => {
|
|
9
8
|
return new Promise((resolve) => {
|
|
10
9
|
const Modules = useModules();
|
|
@@ -131,16 +130,6 @@ const createModuleMetaData = (html, options) => {
|
|
|
131
130
|
data
|
|
132
131
|
};
|
|
133
132
|
};
|
|
134
|
-
const findModuleContainerEl = (element) => {
|
|
135
|
-
var el = element;
|
|
136
|
-
if (el.classList.contains(ModuleContainerNode.getMarkClassName())) {
|
|
137
|
-
return el;
|
|
138
|
-
}
|
|
139
|
-
while (el != null && !el.classList.contains(ModuleContainerNode.getMarkClassName())) {
|
|
140
|
-
el = el.parentElement;
|
|
141
|
-
}
|
|
142
|
-
return el;
|
|
143
|
-
};
|
|
144
133
|
const findModuleNodeEl = (element) => {
|
|
145
134
|
var el = element;
|
|
146
135
|
if (el.classList.contains(ModuleBlockNode.getMarkClassName())) {
|
|
@@ -154,7 +143,6 @@ const findModuleNodeEl = (element) => {
|
|
|
154
143
|
export {
|
|
155
144
|
createHtml,
|
|
156
145
|
createModuleMetaData,
|
|
157
|
-
findModuleContainerEl,
|
|
158
146
|
findModuleNodeEl,
|
|
159
147
|
showModuleSelectDialog
|
|
160
148
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/utils.tsx"],"sourcesContent":["\r\nimport { Fragment,ref,unref,resolveComponent,h,reactive } from 'vue'\r\nimport { Dialoger } from '@maketribe/dm'\r\nimport { ElButton,ElCollapse,ElCollapseItem,ElInput } from \"element-plus\";\r\nimport { Search } from \"@element-plus/icons-vue\";\r\nimport { useModules,type ModuleType } from \"./composables\"\r\nimport { DynamicFormItemType } from \"../../../dynamic-form-panel\"\r\n\r\nimport { ModuleBlockNode,$createModuleBlockNode,$isModuleBlockNode } from \"./ModuleBlockNode\"\r\nimport { ModuleContainerNode} from \"./ModuleContainerNode\"\r\n\r\n/**\r\n * 显示模块模版选择\r\n * @returns \r\n */\r\nexport const showModuleSelectDialog = async () => {\r\n\r\n return new Promise(resolve => {\r\n\r\n const Modules = useModules();\r\n const selectOption = ref<ModuleType|null>(null);\r\n const searchInputValue = ref(\"\");\r\n\r\n // 取消编辑\r\n const handleCancelClick = () => {\r\n dialogInstance.destroy();\r\n };\r\n\r\n // 确认编辑\r\n const handleConfirmClick = () => {\r\n dialogInstance.destroy();\r\n resolve({...selectOption.value as any});\r\n };\r\n\r\n // 点击块\r\n const clickHandle = (item:any)=>{\r\n selectOption.value = item;\r\n }\r\n\r\n const dialogInstance = Dialoger.customRender({\r\n title: \"模版选择\",\r\n class: \"mk-doc-editor__module-template_dialog\",\r\n width: \"700px\",\r\n onClose: () => {\r\n dialogInstance.destroy();\r\n },\r\n body: () => {\r\n\r\n // 循环体\r\n const templateListComponent = Modules.filter(item=>{\r\n if(searchInputValue.value){\r\n return item.name.indexOf(searchInputValue.value) >= 0 || item.title.indexOf(searchInputValue.value) >= 0\r\n }\r\n else{\r\n return true;\r\n }\r\n }).map(item=>{\r\n\r\n return <div \r\n class={`mk-doc-editor__module-template_dialog_list-item ${(item.cover ? 'cover':'')} ${(selectOption.value?.name == item.name ? 'active':'')}`} \r\n onClick={()=>clickHandle(item)}>\r\n {item.cover ? <img src={item.cover} /> :null}\r\n <div class=\"mk-doc-editor__module-template_dialog_list-item_title\">{item.title}</div>\r\n </div>\r\n })\r\n\r\n return <div class=\"mk-doc-editor__module-template_dialog_warp\">\r\n <ElInput v-model={searchInputValue.value} prefix-icon={Search} clearable={true} />\r\n <div class=\"mk-doc-editor__module-template_dialog_list-body\">\r\n {templateListComponent}\r\n </div>\r\n </div>\r\n },\r\n footer: () => {\r\n return <Fragment>\r\n <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n <ElButton type=\"primary\" onClick={handleConfirmClick} disabled={!selectOption.value}>\r\n 确定\r\n </ElButton>\r\n </Fragment>\r\n },\r\n });\r\n });\r\n}\r\n\r\n// 元素属性列表\r\nconst ElAttrList = [\"src\",\"alt\",\"poster\",\"href\",\"_target\"];\r\n\r\n/**\r\n * 创建html\r\n * @param template \r\n * @param data \r\n */\r\nexport const createHtml = (template:string,data:any)=>{\r\n\r\n const parser = new DOMParser();\r\n const element = parser.parseFromString(template,\"text/html\")\r\n const list = [element.body];\r\n\r\n Object.keys(data).forEach(key=>{\r\n\r\n for(let i=0;i<list.length;i++){\r\n\r\n const el = list[i];\r\n const val = data[key] as any;\r\n \r\n // 忽略文本节点\r\n if(el.nodeType != 3){\r\n // 属性解析\r\n if(ElAttrList.filter(attr=>el.hasAttribute(`data-${key}-${attr}`)).\r\n some(attr=> el.setAttribute(attr,val))){ break; }\r\n // 文本解析\r\n else if(el.hasAttribute(`data-${key}`)){\r\n el.textContent = val;\r\n break;\r\n }\r\n else if(el.hasAttribute(`data-${key}-html`)){\r\n el.innerHTML = val;\r\n break;\r\n } \r\n }\r\n\r\n // 广域递归\r\n if(el.childNodes.length){\r\n el.childNodes.forEach((sub:any)=>list.push(sub))\r\n }\r\n }\r\n })\r\n\r\n return element.body.innerHTML.replaceAll(/[\\r|\\n|\\r\\n]+/g,\"\")\r\n}\r\n\r\n/**\r\n * 创建html\r\n * @param template \r\n * @param data \r\n */\r\nexport const createModuleMetaData = (html:string,options:DynamicFormItemType[])=>{\r\n\r\n\r\n const parser = new DOMParser();\r\n const element = parser.parseFromString(html,\"text/html\")\r\n const list = [element.body];\r\n const data:any = {};\r\n\r\n options.forEach(item=>{\r\n\r\n for(let i=0;i<list.length;i++){\r\n\r\n const el = list[i];\r\n const val = \"\";\r\n\r\n // 忽略文本节点\r\n if(el.nodeType != 3){\r\n // 属性解析\r\n if(ElAttrList.filter(attr=>el.hasAttribute(`data-${item.name}-${attr}`)).\r\n some(attr=> data[item.name] = el.getAttribute(attr))){ break; }\r\n // 文本解析\r\n else if(el.hasAttribute(`data-${item.name}`)){\r\n data[item.name] = el.textContent;\r\n break;\r\n }\r\n // html 解析\r\n else if(el.hasAttribute(`data-${item.name}-html`)){\r\n data[item.name] = el.innerHTML;\r\n break;\r\n } \r\n }\r\n\r\n // 广域递归\r\n if(el.childNodes.length){\r\n el.childNodes.forEach((sub:any)=>list.push(sub))\r\n }\r\n\r\n data[item.name] = val;\r\n }\r\n })\r\n\r\n return { data }\r\n}\r\n\r\n/**\r\n * 查找容器节点\r\n * @param element \r\n * @returns \r\n */\r\nexport const findModuleContainerEl = (element:HTMLElement):HTMLElement|null => {\r\n\r\n var el:HTMLElement|null = element\r\n\r\n if(el.classList.contains(ModuleContainerNode.getMarkClassName())){\r\n return el;\r\n }\r\n\r\n while (el != null && !el.classList.contains(ModuleContainerNode.getMarkClassName())) {\r\n el = el.parentElement;\r\n }\r\n\r\n return el\r\n}\r\n\r\n/**\r\n * 查找模块节点\r\n * @param element \r\n * @returns \r\n */\r\nexport const findModuleNodeEl = (element:HTMLElement):HTMLElement|null => {\r\n\r\n var el:HTMLElement|null = element\r\n\r\n if(el.classList.contains(ModuleBlockNode.getMarkClassName())){\r\n return el;\r\n }\r\n\r\n while (el != null && !el.classList.contains(ModuleBlockNode.getMarkClassName())) {\r\n el = el.parentElement;\r\n }\r\n\r\nreturn el\r\n}\r\n\r\n// 测试代码\r\n// console.log(createHtml(\"<div data-title>111</div>\",{title:\"asdasdasdasd\"}))\r\n// console.log(createModuleMetaData(\"<div data-title>asdasdasd<img data-path-src src='aaa.jpg'></div>\",[\r\n// { name:\"title\", title:\"标题\", component:\"el-input\", props:{ clearable:true }, defaultValue:\"测试标题\" },\r\n// { name:\"path\", title:\"标题\", component:\"el-input\", props:{ clearable:true }, defaultValue:\"111\" }\r\n// ]))\r\n"],"names":["showModuleSelectDialog","Promise","resolve","Modules","useModules","selectOption","ref","searchInputValue","handleCancelClick","dialogInstance","destroy","handleConfirmClick","value","clickHandle","item","Dialoger","customRender","title","class","width","onClose","body","templateListComponent","filter","name","indexOf","map","_createVNode","cover","onClick","ElInput","$event","Search","footer","_Fragment","ElButton","default","_createTextVNode","ElAttrList","createHtml","template","data","parser","DOMParser","element","parseFromString","list","Object","keys","forEach","key","i","length","el","val","nodeType","attr","hasAttribute","some","setAttribute","textContent","innerHTML","childNodes","sub","push","replaceAll","createModuleMetaData","html","options","getAttribute","findModuleContainerEl","classList","contains","ModuleContainerNode","getMarkClassName","parentElement","findModuleNodeEl","ModuleBlockNode"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/utils.tsx"],"sourcesContent":["\r\nimport { Fragment,ref,unref,resolveComponent,h,reactive } from 'vue'\r\nimport { Dialoger } from '@maketribe/dm'\r\nimport { ElButton,ElCollapse,ElCollapseItem,ElInput } from \"element-plus\";\r\nimport { Search } from \"@element-plus/icons-vue\";\r\nimport { useModules,type ModuleType } from \"./composables\"\r\nimport { DynamicFormItemType } from \"../../../dynamic-form-panel\"\r\n\r\nimport { ModuleBlockNode } from \"./ModuleBlockNode\"\r\n\r\n/**\r\n * 显示模块模版选择\r\n * @returns \r\n */\r\nexport const showModuleSelectDialog = async () => {\r\n\r\n return new Promise(resolve => {\r\n\r\n const Modules = useModules();\r\n const selectOption = ref<ModuleType|null>(null);\r\n const searchInputValue = ref(\"\");\r\n\r\n // 取消编辑\r\n const handleCancelClick = () => {\r\n dialogInstance.destroy();\r\n };\r\n\r\n // 确认编辑\r\n const handleConfirmClick = () => {\r\n dialogInstance.destroy();\r\n resolve({...selectOption.value as any});\r\n };\r\n\r\n // 点击块\r\n const clickHandle = (item:any)=>{\r\n selectOption.value = item;\r\n }\r\n\r\n const dialogInstance = Dialoger.customRender({\r\n title: \"模版选择\",\r\n class: \"mk-doc-editor__module-template_dialog\",\r\n width: \"700px\",\r\n onClose: () => {\r\n dialogInstance.destroy();\r\n },\r\n body: () => {\r\n\r\n // 循环体\r\n const templateListComponent = Modules.filter(item=>{\r\n if(searchInputValue.value){\r\n return item.name.indexOf(searchInputValue.value) >= 0 || item.title.indexOf(searchInputValue.value) >= 0\r\n }\r\n else{\r\n return true;\r\n }\r\n }).map(item=>{\r\n\r\n return <div \r\n class={`mk-doc-editor__module-template_dialog_list-item ${(item.cover ? 'cover':'')} ${(selectOption.value?.name == item.name ? 'active':'')}`} \r\n onClick={()=>clickHandle(item)}>\r\n {item.cover ? <img src={item.cover} /> :null}\r\n <div class=\"mk-doc-editor__module-template_dialog_list-item_title\">{item.title}</div>\r\n </div>\r\n })\r\n\r\n return <div class=\"mk-doc-editor__module-template_dialog_warp\">\r\n <ElInput v-model={searchInputValue.value} prefix-icon={Search} clearable={true} />\r\n <div class=\"mk-doc-editor__module-template_dialog_list-body\">\r\n {templateListComponent}\r\n </div>\r\n </div>\r\n },\r\n footer: () => {\r\n return <Fragment>\r\n <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n <ElButton type=\"primary\" onClick={handleConfirmClick} disabled={!selectOption.value}>\r\n 确定\r\n </ElButton>\r\n </Fragment>\r\n },\r\n });\r\n });\r\n}\r\n\r\n// 元素属性列表\r\nconst ElAttrList = [\"src\",\"alt\",\"poster\",\"href\",\"_target\"];\r\n\r\n/**\r\n * 创建html\r\n * @param template \r\n * @param data \r\n */\r\nexport const createHtml = (template:string,data:any)=>{\r\n\r\n const parser = new DOMParser();\r\n const element = parser.parseFromString(template,\"text/html\")\r\n const list = [element.body];\r\n\r\n Object.keys(data).forEach(key=>{\r\n\r\n for(let i=0;i<list.length;i++){\r\n\r\n const el = list[i];\r\n const val = data[key] as any;\r\n \r\n // 忽略文本节点\r\n if(el.nodeType != 3){\r\n // 属性解析\r\n if(ElAttrList.filter(attr=>el.hasAttribute(`data-${key}-${attr}`)).\r\n some(attr=> el.setAttribute(attr,val))){ break; }\r\n // 文本解析\r\n else if(el.hasAttribute(`data-${key}`)){\r\n el.textContent = val;\r\n break;\r\n }\r\n else if(el.hasAttribute(`data-${key}-html`)){\r\n el.innerHTML = val;\r\n break;\r\n } \r\n }\r\n\r\n // 广域递归\r\n if(el.childNodes.length){\r\n el.childNodes.forEach((sub:any)=>list.push(sub))\r\n }\r\n }\r\n })\r\n\r\n return element.body.innerHTML.replaceAll(/[\\r|\\n|\\r\\n]+/g,\"\")\r\n}\r\n\r\n/**\r\n * 创建html\r\n * @param template \r\n * @param data \r\n */\r\nexport const createModuleMetaData = (html:string,options:DynamicFormItemType[])=>{\r\n\r\n\r\n const parser = new DOMParser();\r\n const element = parser.parseFromString(html,\"text/html\")\r\n const list = [element.body];\r\n const data:any = {};\r\n\r\n options.forEach(item=>{\r\n\r\n for(let i=0;i<list.length;i++){\r\n\r\n const el = list[i];\r\n const val = \"\";\r\n\r\n // 忽略文本节点\r\n if(el.nodeType != 3){\r\n // 属性解析\r\n if(ElAttrList.filter(attr=>el.hasAttribute(`data-${item.name}-${attr}`)).\r\n some(attr=> data[item.name] = el.getAttribute(attr))){ break; }\r\n // 文本解析\r\n else if(el.hasAttribute(`data-${item.name}`)){\r\n data[item.name] = el.textContent;\r\n break;\r\n }\r\n // html 解析\r\n else if(el.hasAttribute(`data-${item.name}-html`)){\r\n data[item.name] = el.innerHTML;\r\n break;\r\n } \r\n }\r\n\r\n // 广域递归\r\n if(el.childNodes.length){\r\n el.childNodes.forEach((sub:any)=>list.push(sub))\r\n }\r\n\r\n data[item.name] = val;\r\n }\r\n })\r\n\r\n return { data }\r\n}\r\n\r\n/**\r\n * 查找模块节点\r\n * @param element \r\n * @returns \r\n */\r\nexport const findModuleNodeEl = (element:HTMLElement):HTMLElement|null => {\r\n\r\n var el:HTMLElement|null = element\r\n\r\n if(el.classList.contains(ModuleBlockNode.getMarkClassName())){\r\n return el;\r\n }\r\n\r\n while (el != null && !el.classList.contains(ModuleBlockNode.getMarkClassName())) {\r\n el = el.parentElement;\r\n }\r\n\r\n return el\r\n}\r\n\r\n// 测试代码\r\n// console.log(createHtml(\"<div data-title>111</div>\",{title:\"asdasdasdasd\"}))\r\n// console.log(createModuleMetaData(\"<div data-title>asdasdasd<img data-path-src src='aaa.jpg'></div>\",[\r\n// { name:\"title\", title:\"标题\", component:\"el-input\", props:{ clearable:true }, defaultValue:\"测试标题\" },\r\n// { name:\"path\", title:\"标题\", component:\"el-input\", props:{ clearable:true }, defaultValue:\"111\" }\r\n// ]))\r\n"],"names":["showModuleSelectDialog","Promise","resolve","Modules","useModules","selectOption","ref","searchInputValue","handleCancelClick","dialogInstance","destroy","handleConfirmClick","value","clickHandle","item","Dialoger","customRender","title","class","width","onClose","body","templateListComponent","filter","name","indexOf","map","_createVNode","cover","onClick","ElInput","$event","Search","footer","_Fragment","ElButton","default","_createTextVNode","ElAttrList","createHtml","template","data","parser","DOMParser","element","parseFromString","list","Object","keys","forEach","key","i","length","el","val","nodeType","attr","hasAttribute","some","setAttribute","textContent","innerHTML","childNodes","sub","push","replaceAll","createModuleMetaData","html","options","getAttribute","findModuleNodeEl","classList","contains","ModuleBlockNode","getMarkClassName","parentElement"],"mappings":"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"}
|
|
@@ -20,6 +20,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
20
20
|
const isItalic = ref(false);
|
|
21
21
|
const isUnderline = ref(false);
|
|
22
22
|
const isStrikethrough = ref(false);
|
|
23
|
+
const isSubscript = ref(false);
|
|
24
|
+
const isSuperscript = ref(false);
|
|
23
25
|
const alignList = ref(["left", "center", "right", "justify"]);
|
|
24
26
|
const alignValue = ref(alignList.value[0]);
|
|
25
27
|
const disabled = ref(false);
|
|
@@ -55,6 +57,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
55
57
|
isItalic.value = selection.hasFormat("italic");
|
|
56
58
|
isUnderline.value = selection.hasFormat("underline");
|
|
57
59
|
isStrikethrough.value = selection.hasFormat("strikethrough");
|
|
60
|
+
isSubscript.value = selection.hasFormat("subscript");
|
|
61
|
+
isSuperscript.value = selection.hasFormat("superscript");
|
|
58
62
|
var ff = $getSelectionStyleValueForProperty(selection, "font-family", "Arial");
|
|
59
63
|
let fs = $getSelectionStyleValueForProperty(selection, "font-size", "1rem");
|
|
60
64
|
if (fs) {
|
|
@@ -289,6 +293,28 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
289
293
|
createVNode(_component_MKSvgIcon, { iconClass: "doc-strikethrough" })
|
|
290
294
|
]),
|
|
291
295
|
_: 1
|
|
296
|
+
}, 8, ["disabled", "class"]),
|
|
297
|
+
createVNode(_component_el_button, {
|
|
298
|
+
disabled: disabled.value,
|
|
299
|
+
text: "",
|
|
300
|
+
class: normalizeClass(`${isSubscript.value ? "active" : ""}`),
|
|
301
|
+
onClick: _cache[6] || (_cache[6] = ($event) => unref(editor).dispatchCommand(unref(FORMAT_TEXT_COMMAND), "subscript"))
|
|
302
|
+
}, {
|
|
303
|
+
default: withCtx(() => [
|
|
304
|
+
createVNode(_component_MKSvgIcon, { iconClass: "doc-sub" })
|
|
305
|
+
]),
|
|
306
|
+
_: 1
|
|
307
|
+
}, 8, ["disabled", "class"]),
|
|
308
|
+
createVNode(_component_el_button, {
|
|
309
|
+
disabled: disabled.value,
|
|
310
|
+
text: "",
|
|
311
|
+
class: normalizeClass(`${isSuperscript.value ? "active" : ""}`),
|
|
312
|
+
onClick: _cache[7] || (_cache[7] = ($event) => unref(editor).dispatchCommand(unref(FORMAT_TEXT_COMMAND), "superscript"))
|
|
313
|
+
}, {
|
|
314
|
+
default: withCtx(() => [
|
|
315
|
+
createVNode(_component_MKSvgIcon, { iconClass: "doc-sup" })
|
|
316
|
+
]),
|
|
317
|
+
_: 1
|
|
292
318
|
}, 8, ["disabled", "class"])
|
|
293
319
|
]),
|
|
294
320
|
_: 1
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FontStyleTool.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport {\r\n $getSelection,\r\n $isRangeSelection,\r\n $isRootOrShadowRoot,\r\n $isParagraphNode,\r\n FORMAT_TEXT_COMMAND,\r\n FORMAT_ELEMENT_COMMAND,\r\n type ElementFormatType,\r\n} from 'lexical'\r\nimport {\r\n $getSelectionStyleValueForProperty,\r\n $patchStyleText,\r\n} from '@lexical/selection'\r\n\r\nimport { $isLinkNode, TOGGLE_LINK_COMMAND,LinkNode } from '@lexical/link'\r\nimport { sanitizeUrl } from '../../utils/url'\r\nimport { getSelectedNode } from '../../utils/getSelectedNode'\r\nimport { $findMatchingParent,mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { onMounted, onUnmounted, ref,watch } from 'vue'\r\nimport { FONT_SIZE_OPTIONS,ROOT_FONT_SIZE,FONT_FAMILY_OPTIONS } from \"./FontStyleDefines\"\r\nimport { ShowLinkEditPanel } from \"../AutoLinkPlugin/LinkEditDialog\";\r\n\r\nconst editor = useLexicalComposer()\r\nconst fontSize = ref('14px')\r\nconst fontColor = ref<string>('#000')\r\nconst bgColor = ref<string>('#fff')\r\nconst fontFamily = ref<any>(FONT_FAMILY_OPTIONS[0])\r\nconst isBold = ref(false)\r\nconst isItalic = ref(false)\r\nconst isUnderline = ref(false)\r\nconst isStrikethrough = ref(false)\r\n\r\n// 对齐方式\r\nconst alignList = ref<ElementFormatType[]>([\"left\",\"center\",\"right\",\"justify\"])\r\nconst alignValue = ref(alignList.value[0])\r\nconst disabled = ref(false)\r\nconst isLink = ref(false)\r\nconst linkValue = ref(\"\");\r\n\r\nasync function insertLink() {\r\n\r\n const result:any = await ShowLinkEditPanel(linkValue.value);\r\n\r\n if(result.trim()){\r\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, sanitizeUrl(result))\r\n }\r\n else{\r\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null)\r\n }\r\n}\r\n\r\n// 更新状态栏\r\nfunction updateToolbar() {\r\n\r\n const selection = $getSelection()\r\n\r\n if ($isRangeSelection(selection)) {\r\n\r\n const anchorNode = selection.anchor.getNode()\r\n\r\n let element = anchorNode.getKey() === 'root'\r\n ? anchorNode\r\n : $findMatchingParent(anchorNode, (e) => {\r\n const parent = e.getParent()\r\n return parent !== null && $isRootOrShadowRoot(parent)\r\n });\r\n\r\n\r\n if (element === null){\r\n element = anchorNode.getTopLevelElementOrThrow()\r\n }\r\n\r\n let elementDOM = editor.getElementByKey(element.getKey());\r\n\r\n // 文本对齐\r\n alignValue.value = (elementDOM?.style.textAlign as ElementFormatType) || \"left\";\r\n\r\n if(alignValue.value == \"start\"){ alignValue.value = \"left\"; }\r\n else if(alignValue.value == \"end\"){ alignValue.value = \"right\"; }\r\n\r\n // Update text format\r\n isBold.value = selection.hasFormat('bold')\r\n isItalic.value = selection.hasFormat('italic')\r\n isUnderline.value = selection.hasFormat('underline')\r\n isStrikethrough.value = selection.hasFormat('strikethrough')\r\n\r\n // Handle buttons\r\n var ff = $getSelectionStyleValueForProperty(selection, 'font-family', 'Arial');\r\n let fs = $getSelectionStyleValueForProperty(selection, 'font-size', '1rem');\r\n \r\n if(fs){\r\n fontSize.value = Math.round(parseFloat(fs) * ROOT_FONT_SIZE)+\"px\"\r\n }\r\n \r\n fontColor.value = $getSelectionStyleValueForProperty(selection, 'color', '#000')\r\n bgColor.value = $getSelectionStyleValueForProperty(selection, 'background-color', '#fff')\r\n fontFamily.value = FONT_FAMILY_OPTIONS.find(item=>item.value==ff) || FONT_FAMILY_OPTIONS[0];\r\n\r\n disabled.value = false;\r\n\r\n // Update links\r\n const node = getSelectedNode(selection)\r\n const parent = node.getParent()\r\n isLink.value = $isLinkNode(parent) || $isLinkNode(node)\r\n if(isLink.value){\r\n linkValue.value = $isLinkNode(parent) ? parent.getURL() : (node as LinkNode).getURL()\r\n }\r\n else{\r\n linkValue.value = \"\";\r\n }\r\n }\r\n else{\r\n\r\n disabled.value = true;\r\n }\r\n}\r\n\r\n// 文字样式\r\nconst fontStyleHandle = (data : any,styleName?:any)=>{\r\n fontSize.value = data.label;\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null) {\r\n $patchStyleText(selection, {\r\n [styleName || \"font-size\"]:data.value\r\n })\r\n }\r\n })\r\n}\r\n\r\n// 字体颜色\r\nwatch(fontColor,(color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { color })\r\n }\r\n },{})\r\n})\r\n\r\n// bg颜色\r\nwatch(bgColor,(color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { 'background-color':color })\r\n }\r\n },{})\r\n})\r\n\r\n// 挂载的时候\r\nonMounted(() => {\r\n\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => updateToolbar())\r\n }),\r\n // editor.registerCommand(SELECTION_CHANGE_COMMAND, (_payload, _newEditor) => updateToolbar()!,lowPriority)\r\n )\r\n\r\n onUnmounted(() => unregisterMergeListener());\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n <!-- 字体 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n {{fontFamily.label}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontFamily.label == item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_FAMILY_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item,'font-family')\">\r\n <span :style=\"{fontFamily:item.value}\">\r\n {{item.label}}\r\n </span>\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体大小 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :disabled=\"disabled\">\r\n {{fontSize}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontSize==item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_SIZE_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item)\">{{item.label}}</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__fontcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"fontColor\" :disabled=\"disabled\" />\r\n </el-button>\r\n <!-- 背景颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__bgcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"bgColor\" :disabled=\"disabled\" />\r\n <MKSvgIcon class=\"view\" iconClass=\"doc-background-color\" /> \r\n </el-button>\r\n\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isBold ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'bold')\">\r\n <MKSvgIcon iconClass=\"doc-bold\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isItalic ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'italic')\">\r\n <MKSvgIcon iconClass=\"doc-italic\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isUnderline ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'underline')\">\r\n <MKSvgIcon iconClass=\"doc-underline\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isStrikethrough ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'strikethrough')\">\r\n <MKSvgIcon iconClass=\"doc-strikethrough\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${alignValue}`\" style=\"font-size: 18px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :disabled=\"disabled\" :class=\"{active:alignValue == item}\" v-for=\"item in alignList\" :value=\"item\" @click=\"editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, item)\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${item}`\" style=\"font-size: 18px;\" /> \r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" />\r\n <!-- 链接 -->\r\n <el-button-group>\r\n <el-button text :disabled=\"disabled\" :class=\"`${isLink ? 'active' : ''}`\" @click=\"insertLink\">\r\n <MKSvgIcon iconClass=\"doc-link\" /> \r\n </el-button>\r\n </el-button-group>\r\n</template>\r\n"],"names":["parent"],"mappings":"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"}
|
|
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\nwatch(fontColor,(color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { color })\r\n }\r\n },{})\r\n})\r\n\r\n// bg颜色\r\nwatch(bgColor,(color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { 'background-color':color })\r\n }\r\n },{})\r\n})\r\n\r\n// 挂载的时候\r\nonMounted(() => {\r\n\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => updateToolbar())\r\n }),\r\n // editor.registerCommand(SELECTION_CHANGE_COMMAND, (_payload, _newEditor) => updateToolbar()!,lowPriority)\r\n )\r\n\r\n onUnmounted(() => unregisterMergeListener());\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n <!-- 字体 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n {{fontFamily.label}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontFamily.label == item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_FAMILY_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item,'font-family')\">\r\n <span :style=\"{fontFamily:item.value}\">\r\n {{item.label}}\r\n </span>\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体大小 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :disabled=\"disabled\">\r\n {{fontSize}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontSize==item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_SIZE_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item)\">{{item.label}}</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__fontcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"fontColor\" :disabled=\"disabled\" />\r\n </el-button>\r\n <!-- 背景颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__bgcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"bgColor\" :disabled=\"disabled\" />\r\n <MKSvgIcon class=\"view\" iconClass=\"doc-background-color\" /> \r\n </el-button>\r\n\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isBold ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'bold')\">\r\n <MKSvgIcon iconClass=\"doc-bold\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isItalic ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'italic')\">\r\n <MKSvgIcon iconClass=\"doc-italic\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isUnderline ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'underline')\">\r\n <MKSvgIcon iconClass=\"doc-underline\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isStrikethrough ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'strikethrough')\">\r\n <MKSvgIcon iconClass=\"doc-strikethrough\" /> \r\n </el-button>\r\n <el-button :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":["parent"],"mappings":"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"}
|
|
@@ -31,7 +31,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
31
31
|
editor.getEditorState().read(() => {
|
|
32
32
|
var _a, _b;
|
|
33
33
|
const doc = (_b = (_a = iframeContentRef.value) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.document;
|
|
34
|
-
console.log(doc, doc.head);
|
|
35
34
|
const style = document.createElement("style");
|
|
36
35
|
style.setAttribute("type", "text/css");
|
|
37
36
|
style.innerHTML = [DocEditorCss, DocThemeCss].join("\r\n");
|
package/dist/esm/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PreviewToolbar.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { $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
|
|
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":["_a"],"mappings":";;;;;;;;;;;;;;;AAUA,UAAM,SAAS;AAEf,UAAM,QAAQ;AAKR,UAAA,mBAAmB,IAAI,IAAW;AACxC,UAAM,aAAa,SAAc;;AAAI,gDAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC,aAAvC,mBAAiD;AAAA,KAAI;AAEpF,UAAA,oBAAoB,IAAI,KAAK;AACpB,QAAI,EAAE;AACL,UAAM,IAAI,MAAM,GAAG,EAAE,IAAI,CAAM,SAAA;AAC7C,aAAO,2BAA2B,IAAI;AAAA,IAAA,CACvC,EAAE,KAAK,MAAM;AAQd,UAAM,OAAO,WAAU;AAErB,wBAAkB,QAAQ;AAE1B,eAAS,MAAI;AAEJ,eAAA,iBAAiB,KAAK,MAAM;;AAE3B,gBAAA,OAAM,4BAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC;AAG7C,gBAAA,QAAQ,SAAS,cAAc,OAAO;AACtC,gBAAA,aAAa,QAAO,UAAU;AAGpC,gBAAM,YAAY,CAAC,cAAa,WAAW,EAAE,KAAK,MAAM;AAExD,gBAAM,aAAa,WAAA,EAAa,OAAO,UAAM,KAAK,SAAS,EAAE,IAAI,CAAM,SAAA,KAAK,SAAS,EAAE,KAAK,MAAM;AAC9F,cAAA,KAAK,OAAO,KAAK;AAGf,gBAAA,GAAG,MAAM,GAAG,EAAE,OAAO,CAAM,SAAA,CAAC,CAAC,IAAI,EAAE,QAAQ,CAAM,SAAA;AAC/C,kBAAA,SAAS,SAAS,cAAc,QAAQ;AAC9C,mBAAO,MAAM;AACN,mBAAA,aAAa,eAAc,MAAM;AACpC,gBAAA,KAAK,OAAO,MAAM;AAAA,UAAA,CACvB;AACK,gBAAA,IAAI,MAAM,GAAG,EAAE,OAAO,CAAM,SAAA,CAAC,CAAC,IAAI,EAAE,QAAQ,CAAM,SAAA;AAChD,kBAAA,OAAO,SAAS,cAAc,MAAM;AAC1C,iBAAK,OAAO;AACP,iBAAA,aAAa,OAAM,YAAY;AAC/B,iBAAA,aAAa,eAAc,MAAM;AAClC,gBAAA,KAAK,OAAO,IAAI;AAAA,UAAA,CACrB;AAGD,qBAAW,MAAM,MAAM,WAAW,iBAAiB,SAAS,OAAO,SAAS;AAGxE,cAAA,KAAK,YAAY,uBAAuB,MAAM;AAElD,qBAAW,MAAM;;AACf,gBAAG,WAAW,MAAM,eAAe,WAAW,MAAM,cAAa;AAC/D,+BAAiB,MAAM,MAAM,WAAUA,MAAA,WAAW,UAAX,gBAAAA,IAAkB,gBAAe,KAAI;AAAA,YAC9E;AAAA,aACC,GAAG;AAAA,QAAA,CACP;AAAA,MAAA,CACF;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,11 +1,17 @@
|
|
|
1
1
|
import { defineComponent, ref, onMounted, onUnmounted, resolveComponent, openBlock, createElementBlock, createVNode, withCtx, unref, normalizeClass, Fragment, renderList, createBlock, createTextVNode, toDisplayString } from "vue";
|
|
2
|
-
import { CAN_UNDO_COMMAND, CAN_REDO_COMMAND, UNDO_COMMAND, REDO_COMMAND } from "lexical";
|
|
3
|
-
import { mergeRegister } from "@lexical/utils";
|
|
2
|
+
import { CAN_UNDO_COMMAND, CAN_REDO_COMMAND, $getSelection, $isNodeSelection, $isRangeSelection, UNDO_COMMAND, REDO_COMMAND } from "lexical";
|
|
3
|
+
import { mergeRegister, $findMatchingParent } from "@lexical/utils";
|
|
4
4
|
import { useLexicalComposer } from "lexical-vue";
|
|
5
5
|
import { ToolbarExtendPlugins, DEVICE_VIEW_MODE } from "../../core/index.js";
|
|
6
6
|
import _sfc_main$3 from "./PreviewToolbar.vue.js";
|
|
7
7
|
import _sfc_main$2 from "./FontStyleTool.vue.js";
|
|
8
8
|
import _sfc_main$1 from "./ContentStyleTool.vue.js";
|
|
9
|
+
import { $isTextGridNode } from "../GridPlugin/TextGridNode.js";
|
|
10
|
+
import "../GridPlugin/LayoutGridNode.js";
|
|
11
|
+
import { $isImageTextGridNode } from "../GridPlugin/ImageTextGridNode.js";
|
|
12
|
+
import { $isModuleGridNode } from "../GridPlugin/ModuleGridNode.js";
|
|
13
|
+
import "../ModulePlugin/commands.js";
|
|
14
|
+
import { $isModuleBlockNode } from "../ModulePlugin/ModuleBlockNode.js";
|
|
9
15
|
const LowPriority = 1;
|
|
10
16
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
11
17
|
__name: "index",
|
|
@@ -15,6 +21,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
15
21
|
},
|
|
16
22
|
setup(__props) {
|
|
17
23
|
const toolbarRef = ref(null);
|
|
24
|
+
const toolbarDisabled = ref(false);
|
|
18
25
|
const editor = useLexicalComposer();
|
|
19
26
|
const canUndo = ref(false);
|
|
20
27
|
const canRedo = ref(false);
|
|
@@ -35,7 +42,33 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
35
42
|
return false;
|
|
36
43
|
},
|
|
37
44
|
LowPriority
|
|
38
|
-
)
|
|
45
|
+
),
|
|
46
|
+
editor.registerUpdateListener(({ editorState }) => {
|
|
47
|
+
editorState.read(() => {
|
|
48
|
+
const selection = $getSelection();
|
|
49
|
+
const node = $isNodeSelection(selection) ? selection == null ? void 0 : selection.getNodes()[0] : null;
|
|
50
|
+
if (node) {
|
|
51
|
+
if ($isModuleBlockNode(node) || $isTextGridNode(node) || $isImageTextGridNode(node) || $isModuleGridNode(node)) {
|
|
52
|
+
toolbarDisabled.value = true;
|
|
53
|
+
} else {
|
|
54
|
+
toolbarDisabled.value = false;
|
|
55
|
+
}
|
|
56
|
+
} else if ($isRangeSelection(selection)) {
|
|
57
|
+
const anchorNode = selection.anchor.getNode();
|
|
58
|
+
let element = anchorNode.getKey() === "root" ? anchorNode : $findMatchingParent(anchorNode, (e) => {
|
|
59
|
+
const parent = e.getParent();
|
|
60
|
+
return parent !== null && $isTextGridNode(parent);
|
|
61
|
+
});
|
|
62
|
+
if (element != null && $isTextGridNode(element.getParent())) {
|
|
63
|
+
toolbarDisabled.value = true;
|
|
64
|
+
} else {
|
|
65
|
+
toolbarDisabled.value = false;
|
|
66
|
+
}
|
|
67
|
+
} else {
|
|
68
|
+
toolbarDisabled.value = false;
|
|
69
|
+
}
|
|
70
|
+
});
|
|
71
|
+
})
|
|
39
72
|
);
|
|
40
73
|
onUnmounted(() => {
|
|
41
74
|
ToolbarExtendPlugins.length = 0;
|
|
@@ -111,7 +144,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
111
144
|
_: 1
|
|
112
145
|
}),
|
|
113
146
|
createVNode(_component_el_divider, { direction: "vertical" }),
|
|
114
|
-
createVNode(_component_el_dropdown,
|
|
147
|
+
createVNode(_component_el_dropdown, { disabled: toolbarDisabled.value }, {
|
|
115
148
|
dropdown: withCtx(() => [
|
|
116
149
|
createVNode(_component_el_dropdown_menu, null, {
|
|
117
150
|
default: withCtx(() => [
|
|
@@ -134,7 +167,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
134
167
|
})
|
|
135
168
|
]),
|
|
136
169
|
default: withCtx(() => [
|
|
137
|
-
createVNode(_component_el_button, {
|
|
170
|
+
createVNode(_component_el_button, {
|
|
171
|
+
text: "",
|
|
172
|
+
disabled: toolbarDisabled.value
|
|
173
|
+
}, {
|
|
138
174
|
default: withCtx(() => [
|
|
139
175
|
createVNode(_component_MKSvgIcon, {
|
|
140
176
|
iconClass: "Plus",
|
|
@@ -143,10 +179,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
143
179
|
createTextVNode(" 插入 ")
|
|
144
180
|
]),
|
|
145
181
|
_: 1
|
|
146
|
-
})
|
|
182
|
+
}, 8, ["disabled"])
|
|
147
183
|
]),
|
|
148
184
|
_: 1
|
|
149
|
-
}),
|
|
185
|
+
}, 8, ["disabled"]),
|
|
150
186
|
createVNode(_component_el_divider, { direction: "vertical" }),
|
|
151
187
|
createVNode(_component_el_button_group, null, {
|
|
152
188
|
default: withCtx(() => [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { CommandListenerPriority } from 'lexical'\r\nimport {\r\n CAN_REDO_COMMAND,\r\n CAN_UNDO_COMMAND,\r\n REDO_COMMAND,\r\n UNDO_COMMAND,\r\n} from 'lexical'\r\nimport {
|
|
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":[],"mappings":";;;;;;;;;;;;;;AA2BA,MAAM,cAAuC;;;;;;;;AAEvC,UAAA,aAAa,IAA2B,IAAI;AAC5C,UAAA,kBAAkB,IAAI,KAAK;AACjC,UAAM,SAAS;AAET,UAAA,UAAU,IAAI,KAAK;AACnB,UAAA,UAAU,IAAI,KAAK;AAEzB,cAAU,MAAM;AAEd,YAAM,0BAA0B;AAAA,QAC9B,OAAO;AAAA,UACL;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACL;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACjD,sBAAY,KAAK,MAAM;AAErB,kBAAM,YAAY;AACZ,kBAAA,OAAO,iBAAiB,SAAS,IAAI,uCAAW,WAAW,KAAK;AAEtE,gBAAG,MAAK;AACF,kBAAA,mBAAmB,IAAI,KAAK,gBAAgB,IAAI,KAAK,qBAAqB,IAAI,KAAK,kBAAkB,IAAI,GAAI;AAC/G,gCAAgB,QAAQ;AAAA,cAAA,OAEtB;AACF,gCAAgB,QAAQ;AAAA,cAC1B;AAAA,YAAA,WAEO,kBAAkB,SAAS,GAAG;AAE/B,oBAAA,aAAa,UAAU,OAAO,QAAQ;AAExC,kBAAA,UAAU,WAAW,aAAa,SAClC,aACA,oBAAoB,YAAY,CAAC,MAAM;AACjC,sBAAA,SAAS,EAAE;AACV,uBAAA,WAAW,QAAQ,gBAAgB,MAAM;AAAA,cAAA,CACjD;AAGH,kBAAG,WAAW,QAAQ,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;AAGH,kBAAY,MAAM;AAChB,6BAAqB,SAAS;AACN;MAAA,CACzB;AAAA,IAAA,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -6,11 +6,14 @@ import { AutoLinkNode, LinkNode } from "@lexical/link";
|
|
|
6
6
|
import { HashtagNode } from "@lexical/hashtag";
|
|
7
7
|
import "./ImagePlugin/commands.js";
|
|
8
8
|
import { ImageNode, InlineImageNode } from "./ImagePlugin/ImageNode.js";
|
|
9
|
-
import { ImageTextNode } from "./ImageTextPlugin/ImageTextNode.js";
|
|
10
9
|
import { RichTextNode } from "./RichTextPlugin/nodes/RichTextNode.js";
|
|
11
10
|
import "./ModulePlugin/commands.js";
|
|
12
11
|
import { ModuleBlockNode } from "./ModulePlugin/ModuleBlockNode.js";
|
|
13
|
-
import {
|
|
12
|
+
import { GridNode } from "./GridPlugin/GridNode.js";
|
|
13
|
+
import { TextGridNode } from "./GridPlugin/TextGridNode.js";
|
|
14
|
+
import { LayoutGridNode } from "./GridPlugin/LayoutGridNode.js";
|
|
15
|
+
import { ImageTextGridNode } from "./GridPlugin/ImageTextGridNode.js";
|
|
16
|
+
import { ModuleGridNode } from "./GridPlugin/ModuleGridNode.js";
|
|
14
17
|
const Nodes = [
|
|
15
18
|
HeadingNode,
|
|
16
19
|
ListNode,
|
|
@@ -26,10 +29,13 @@ const Nodes = [
|
|
|
26
29
|
HashtagNode,
|
|
27
30
|
RichTextNode,
|
|
28
31
|
ImageNode,
|
|
29
|
-
ImageTextNode,
|
|
30
32
|
InlineImageNode,
|
|
31
33
|
ModuleBlockNode,
|
|
32
|
-
|
|
34
|
+
GridNode,
|
|
35
|
+
TextGridNode,
|
|
36
|
+
LayoutGridNode,
|
|
37
|
+
ImageTextGridNode,
|
|
38
|
+
ModuleGridNode
|
|
33
39
|
];
|
|
34
40
|
export {
|
|
35
41
|
Nodes as default
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nodes.js","sources":["../../../../../../src/components/basic/doc-editor/plugins/nodes.ts"],"sourcesContent":["import { type Klass, type LexicalNode,TextNode,ElementNode,ParagraphNode } from 'lexical'\r\nimport { HeadingNode, QuoteNode } from '@lexical/rich-text'\r\nimport { TableCellNode, TableNode, TableRowNode } from '@lexical/table'\r\nimport { ListItemNode, ListNode } from '@lexical/list'\r\nimport { CodeHighlightNode, CodeNode } from '@lexical/code'\r\nimport { AutoLinkNode, LinkNode } from '@lexical/link'\r\nimport { HashtagNode } from '@lexical/hashtag'\r\nimport { ImageNode,InlineImageNode } from \"./ImagePlugin\"\r\nimport {
|
|
1
|
+
{"version":3,"file":"nodes.js","sources":["../../../../../../src/components/basic/doc-editor/plugins/nodes.ts"],"sourcesContent":["import { type Klass, type LexicalNode,TextNode,ElementNode,ParagraphNode } from 'lexical'\r\nimport { HeadingNode, QuoteNode } from '@lexical/rich-text'\r\nimport { TableCellNode, TableNode, TableRowNode } from '@lexical/table'\r\nimport { ListItemNode, ListNode } from '@lexical/list'\r\nimport { CodeHighlightNode, CodeNode } from '@lexical/code'\r\nimport { AutoLinkNode, LinkNode } from '@lexical/link'\r\nimport { HashtagNode } from '@lexical/hashtag'\r\nimport { ImageNode,InlineImageNode } from \"./ImagePlugin\"\r\nimport { RichTextNode } from \"./RichTextPlugin/nodes/RichTextNode\"\r\nimport { ModuleBlockNode } from \"./ModulePlugin\"\r\nimport { GridNode,LayoutGridNode,TextGridNode,ImageTextGridNode,ModuleGridNode } from \"./GridPlugin\"\r\n\r\n\r\nconst Nodes: Array<Klass<LexicalNode>> = [\r\n HeadingNode,\r\n ListNode,\r\n ListItemNode,\r\n QuoteNode,\r\n CodeNode,\r\n CodeHighlightNode,\r\n TableNode,\r\n TableCellNode,\r\n TableRowNode,\r\n AutoLinkNode,\r\n LinkNode,\r\n HashtagNode,\r\n\r\n RichTextNode,\r\n ImageNode,\r\n InlineImageNode,\r\n ModuleBlockNode,\r\n GridNode,\r\n TextGridNode,\r\n LayoutGridNode,\r\n ImageTextGridNode,\r\n ModuleGridNode\r\n]\r\n\r\nexport default Nodes\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAaA,MAAM,QAAmC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const DocEditorEditCss = '\r\n.mk-doc__img {\r\n cursor: pointer;\r\n z-index: 1;\r\n position: relative;\r\n}\r\n\r\n\r\n
|
|
1
|
+
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: 50px;\r\n padding-top: 20px;\r\n}\r\n\r\n.mk-doc__grid::before{\r\n text-align: center;\r\n background-color: #eff5ff;\r\n color: #4284ff;\r\n left: 0;\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: 200px;\r\n height: 20px;\r\n cursor: pointer;\r\n}\r\n\r\n.mk-doc__grid::before{\r\n content: "选中格子";\r\n position: absolute;\r\n}\r\n.mk-doc__grid.mk-doc__layout-grid::before{\r\n content: "选中布局容器";\r\n}\r\n.mk-doc__grid.mk-doc__text-grid{\r\n cursor: text;\r\n}\r\n.mk-doc__grid.mk-doc__text-grid::before{\r\n content: "选中文本容器";\r\n}\r\n.mk-doc__grid.mk-doc__image-text::before{\r\n content: "选中图文环绕容器";\r\n}\r\n.mk-doc__grid.mk-doc__module-grid::before{\r\n content: "选中模块容器";\r\n width: 200px;\r\n height: 20px;\r\n margin-top: -20px;\r\n position: sticky;\r\n}\r\n\r\n.mk-doc__grid.mk-doc__module-grid a{\r\n pointer-events: none;\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.mk-doc__embedBlock {\r\n position: relative;\r\n z-index: 1;\r\n padding: 1px;\r\n cursor: pointer;\r\n}\r\n.mk-doc__embedBlockFocus {\r\n outline: 2px solid rgb(60, 132, 244);\r\n}\r\n\r\n.mk-doc__embedBlock >*{\r\n pointer-events: none;\r\n}\r\n\r\n.mk-doc-active-mark{\r\n position: absolute;\r\n box-sizing:border-box;\r\n background-color:#2776f63b;\r\n z-index: 99;\r\n pointer-events: none;\r\n}\r\n.mk-doc-active-mark.box{\r\n outline: 2px solid #2776f63b;\r\n background-color: transparent;\r\n}\r\n';
|
|
2
2
|
export {
|
|
3
3
|
DocEditorEditCss as default
|
|
4
4
|
};
|
|
@@ -1 +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\\r\\n
|
|
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: 50px;\\r\\n padding-top: 20px;\\r\\n}\\r\\n\\r\\n.mk-doc__grid::before{\\r\\n text-align: center;\\r\\n background-color: #eff5ff;\\r\\n color: #4284ff;\\r\\n left: 0;\\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: 200px;\\r\\n height: 20px;\\r\\n cursor: pointer;\\r\\n}\\r\\n\\r\\n.mk-doc__grid::before{\\r\\n content: \\\"选中格子\\\";\\r\\n position: absolute;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__layout-grid::before{\\r\\n content: \\\"选中布局容器\\\";\\r\\n}\\r\\n.mk-doc__grid.mk-doc__text-grid{\\r\\n cursor: text;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__text-grid::before{\\r\\n content: \\\"选中文本容器\\\";\\r\\n}\\r\\n.mk-doc__grid.mk-doc__image-text::before{\\r\\n content: \\\"选中图文环绕容器\\\";\\r\\n}\\r\\n.mk-doc__grid.mk-doc__module-grid::before{\\r\\n content: \\\"选中模块容器\\\";\\r\\n width: 200px;\\r\\n height: 20px;\\r\\n margin-top: -20px;\\r\\n position: sticky;\\r\\n}\\r\\n\\r\\n.mk-doc__grid.mk-doc__module-grid a{\\r\\n pointer-events: none;\\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.mk-doc__embedBlock {\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 1px;\\r\\n cursor: pointer;\\r\\n}\\r\\n.mk-doc__embedBlockFocus {\\r\\n outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock >*{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n.mk-doc-active-mark{\\r\\n position: absolute;\\r\\n box-sizing:border-box;\\r\\n background-color:#2776f63b;\\r\\n z-index: 99;\\r\\n pointer-events: none;\\r\\n}\\r\\n.mk-doc-active-mark.box{\\r\\n outline: 2px solid #2776f63b;\\r\\n background-color: transparent;\\r\\n}\\r\\n\""],"names":[],"mappings":"AAAA,MAAe,mBAAA;"}
|
|
@@ -430,16 +430,14 @@ const DocThemeCss = `\r
|
|
|
430
430
|
padding: 8px 16px;\r
|
|
431
431
|
}\r
|
|
432
432
|
\r
|
|
433
|
-
|
|
434
|
-
.mk-
|
|
433
|
+
.mk-doc__image-text::after,\r
|
|
434
|
+
.mk-doc__module-grid::after{\r
|
|
435
435
|
content: ".";\r
|
|
436
436
|
font-size: 0;\r
|
|
437
437
|
clear: both;\r
|
|
438
438
|
display: block;\r
|
|
439
439
|
}\r
|
|
440
|
-
|
|
441
|
-
line-height: normal;\r
|
|
442
|
-
}\r
|
|
440
|
+
\r
|
|
443
441
|
`;
|
|
444
442
|
export {
|
|
445
443
|
DocThemeCss as default
|
|
@@ -1 +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\\r\\n.mk-doc__image-text::after,.mk-doc-block-container__module-container::after{\\r\\n content: \\\".\\\";\\r\\n font-size: 0;\\r\\n clear: both;\\r\\n display: block;\\r\\n}\\r\\n.mk-doc-block-container__module-container {\\r\\n line-height: normal;\\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;AAAA;AAAA;"}
|
|
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;"}
|