npm - @maketribe/ms-app - Versions diffs - 3.2.39 → 3.2.41 - Mend

@maketribe/ms-app 3.2.39 → 3.2.41

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

Files changed (47) hide show

package/dist/cjs/components/basic/doc-editor/core/nodes/RichElementNode.js CHANGED Viewed

@@ -75,6 +75,9 @@ class RichElementNode extends lexical.ElementNode {
       })
     };
   }
+  updateDOM(_prevNode, _dom, _config) {
+    return false;
+  }
   /**
    * 导出JSON
    * @returns
@@ -111,6 +114,15 @@ class RichElementNode extends lexical.ElementNode {
   createDOM(config) {
     return this.exportDOM().element;
   }
+  canBeEmpty() {
+    return false;
+  }
+  canInsertTextBefore() {
+    return false;
+  }
+  canInsertTextAfter() {
+    return false;
+  }
 }
 const $covertRichElementDOM = (domNode) => {
   return {

package/dist/cjs/components/basic/doc-editor/core/nodes/RichElementNode.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichElementNode.js","sources":["../../../../../../../src/components/basic/doc-editor/core/nodes/RichElementNode.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, SerializedElementNode, NodeKey, Spread, EditorConfig, DOMExportOutput, DOMConversion, LexicalNode } from 'lexical'\r\nimport { $isTextNode, ElementNode } from 'lexical'\r\n\r\n/*\r\n 节点序列化 \r\n /\r\nexport type SerializedRichElementNode = Spread<{ tag: string, style?: string, class?: string \| null }, SerializedElementNode>\r\n\r\n/\r\n 格子\r\n /\r\nexport class RichElementNode extends ElementNode {\r\n\r\n __tagName: string\r\n __class?: string \| null \| undefined\r\n __style: string\r\n\r\n static getType(): string { return \"rich-element\"; }\r\n\r\n static clone(node: RichElementNode): RichElementNode {\r\n return new RichElementNode(node.__tagName, node.__class, node.__style, node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedRichElementNode): RichElementNode {\r\n return new RichElementNode(serializedNode.tag, serializedNode.class, serializedNode.style)\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div: $covertRichElementDOM,\r\n section: $covertRichElementDOM,\r\n b: () => ({\r\n conversion: convertBringAttentionToElement,\r\n priority: 4\r\n }),\r\n code: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n em: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n i: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n s: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n span: () => ({\r\n conversion: convertSpanElement,\r\n priority: 4\r\n }),\r\n strong: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sub: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sup: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n u: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n })\r\n }\r\n }\r\n\r\n /\r\n \r\n * @param tagName \r\n * @param className \r\n * @param style \r\n * @param key \r\n /\r\n constructor(tagName: string, className?: string \| null, style?: string, key?: NodeKey) {\r\n super(key)\r\n this.__tagName = tagName,\r\n this.__class = className;\r\n this.__style = style \|\| \"\";\r\n }\r\n\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedRichElementNode {\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n tag: this.__tagName,\r\n class: this.__class,\r\n style: this.__style,\r\n version: 1\r\n }\r\n }\r\n\r\n /\r\n 导出DOM\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n\r\n const element = document.createElement(this.__tagName)\r\n\r\n if (this.__class) {\r\n element.setAttribute(\"class\", this.__class)\r\n }\r\n\r\n if (this.__style) {\r\n element.setAttribute(\"style\", this.__style)\r\n }\r\n\r\n return { element }\r\n }\r\n\r\n /\r\n 创建渲染DOM\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n return this.exportDOM().element as HTMLElement;\r\n }\r\n\r\n}\r\n\r\n\r\n/\r\n 转换DOM\r\n * @param node \r\n * @returns \r\n */\r\nconst $covertRichElementDOM = (domNode: HTMLElement): DOMConversion<HTMLElement> \| null => {\r\n return {\r\n conversion: () => {\r\n return {\r\n node: new RichElementNode(domNode.tagName, domNode.getAttribute(\"class\"), domNode.getAttribute(\"style\") \|\| \"\")\r\n };\r\n },\r\n priority: 3\r\n };\r\n}\r\n\r\nconst nodeNameToTextFormat: any = {\r\n code: \"code\",\r\n em: \"italic\",\r\n i: \"italic\",\r\n s: \"strikethrough\",\r\n strong: \"bold\",\r\n sub: \"subscript\",\r\n sup: \"superscript\",\r\n u: \"underline\"\r\n};\r\n\r\nfunction convertBringAttentionToElement(domNode: HTMLElement) {\r\n const b = domNode;\r\n const hasNormalFontWeight = b.style.fontWeight === \"normal\";\r\n return {\r\n forChild: applyTextFormatFromStyle(b.style, hasNormalFontWeight ? void 0 : \"bold\", domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertTextFormatElement(domNode: HTMLElement) {\r\n const format = nodeNameToTextFormat[domNode.nodeName.toLowerCase()];\r\n if (format === void 0) {\r\n return {\r\n node: null\r\n };\r\n }\r\n return {\r\n forChild: applyTextFormatFromStyle(domNode.style, format, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertSpanElement(domNode: HTMLElement) {\r\n const span = domNode;\r\n const style = span.style;\r\n return {\r\n forChild: applyTextFormatFromStyle(style, null, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction applyTextFormatFromStyle(style: any, shouldApply: any, domNode: HTMLElement) {\r\n const fontWeight = style.fontWeight;\r\n const textDecoration = style.textDecoration.split(\" \");\r\n const hasBoldFontWeight = fontWeight === \"700\" \|\| fontWeight === \"bold\";\r\n const hasLinethroughTextDecoration = textDecoration.includes(\"line-through\");\r\n const hasItalicFontStyle = style.fontStyle === \"italic\";\r\n const hasUnderlineTextDecoration = textDecoration.includes(\"underline\");\r\n const verticalAlign = style.verticalAlign;\r\n\r\n return (lexicalNode: LexicalNode) => {\r\n\r\n if (!$isTextNode(lexicalNode)) {\r\n return lexicalNode;\r\n }\r\n\r\n if (hasBoldFontWeight && !lexicalNode.hasFormat(\"bold\")) {\r\n lexicalNode.toggleFormat(\"bold\");\r\n }\r\n if (hasLinethroughTextDecoration && !lexicalNode.hasFormat(\"strikethrough\")) {\r\n lexicalNode.toggleFormat(\"strikethrough\");\r\n }\r\n if (hasItalicFontStyle && !lexicalNode.hasFormat(\"italic\")) {\r\n lexicalNode.toggleFormat(\"italic\");\r\n }\r\n if (hasUnderlineTextDecoration && !lexicalNode.hasFormat(\"underline\")) {\r\n lexicalNode.toggleFormat(\"underline\");\r\n }\r\n if (verticalAlign === \"sub\" && !lexicalNode.hasFormat(\"subscript\")) {\r\n lexicalNode.toggleFormat(\"subscript\");\r\n }\r\n if (verticalAlign === \"super\" && !lexicalNode.hasFormat(\"superscript\")) {\r\n lexicalNode.toggleFormat(\"superscript\");\r\n }\r\n if (shouldApply && !lexicalNode.hasFormat(shouldApply)) {\r\n lexicalNode.toggleFormat(shouldApply);\r\n }\r\n\r\n // let styleStr = \"\";\r\n\r\n // if(style.color){\r\n // styleStr += `color:${style.color};`\r\n // }\r\n // if(style.fontSize){\r\n // styleStr += `font-size:${style.fontSize};`\r\n // }\r\n // if(style.fontFamily){\r\n // styleStr += `font-family:${style.fontFamily};`\r\n // }\r\n // if(style.backgroundColor){\r\n // styleStr += `background-color:${style.backgroundColor};`\r\n // }\r\n\r\n // 行内样式\r\n const inlineStyle = domNode.getAttribute(\"style\")\r\n if (inlineStyle) {\r\n lexicalNode.setStyle(inlineStyle);\r\n }\r\n\r\n return lexicalNode;\r\n };\r\n}\r\n"],"names":["ElementNode","$isTextNode"],"mappings":";;;;;;AAgBO,MAAM,wBAAwBA,QAAAA,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAsE/C,YAAY,SAAiB,WAA2B,OAAgB,KAAe;AACrF,UAAM,GAAG;AArEX;AACA;AACA;AAoEO,SAAA,YAAY,SACf,KAAK,UAAU;AACjB,SAAK,UAAU,SAAS;AAAA,EAC1B;AAAA,EArEA,OAAO,UAAkB;AAAS,WAAA;AAAA,EAAgB;AAAA,EAElD,OAAO,MAAM,MAAwC;AAC5C,WAAA,IAAI,gBAAgB,KAAK,WAAW,KAAK,SAAS,KAAK,SAAS,KAAK,KAAK;AAAA,EACnF;AAAA,EAEA,OAAO,WAAW,gBAA4D;AAC5E,WAAO,IAAI,gBAAgB,eAAe,KAAK,eAAe,OAAO,eAAe,KAAK;AAAA,EAC3F;AAAA,EAEA,OAAO,YAAqC;AACnC,WAAA;AAAA,MACL,KAAK;AAAA,MACL,SAAS;AAAA,MACT,GAAG,OAAO;AAAA,QACR,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEZ,MAAM,OAAO;AAAA,QACX,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEZ,IAAI,OAAO;AAAA,QACT,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEZ,GAAG,OAAO;AAAA,QACR,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEZ,GAAG,OAAO;AAAA,QACR,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEZ,MAAM,OAAO;AAAA,QACX,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEZ,QAAQ,OAAO;AAAA,QACb,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK,OAAO;AAAA,QACV,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK,OAAO;AAAA,QACV,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEZ,GAAG,OAAO;AAAA,QACR,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,IACZ;AAAA,EAEJ;AAAA;AAAA;AAAA;AAAA;AAAA,EAqBA,aAAwC;AAC/B,WAAA;AAAA,MACL,GAAG,MAAM,WAAW;AAAA,MACpB,MAAM,KAAK,QAAQ;AAAA,MACnB,KAAK,KAAK;AAAA,MACV,OAAO,KAAK;AAAA,MACZ,OAAO,KAAK;AAAA,MACZ,SAAS;AAAA,IAAA;AAAA,EAEb;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,YAA6B;AAE3B,UAAM,UAAU,SAAS,cAAc,KAAK,SAAS;AAErD,QAAI,KAAK,SAAS;AACR,cAAA,aAAa,SAAS,KAAK,OAAO;AAAA,IAC5C;AAEA,QAAI,KAAK,SAAS;AACR,cAAA,aAAa,SAAS,KAAK,OAAO;AAAA,IAC5C;AAEA,WAAO,EAAE,QAAQ;AAAA,EACnB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,UAAU,QAAmC;AACpC,WAAA,KAAK,UAAY,EAAA;AAAA,EAC1B;AAEF;AAQA,MAAM,wBAAwB,CAAC,YAA4D;AAClF,SAAA;AAAA,IACL,YAAY,MAAM;AACT,aAAA;AAAA,QACL,MAAM,IAAI,gBAAgB,QAAQ,SAAS,QAAQ,aAAa,OAAO,GAAG,QAAQ,aAAa,OAAO,KAAK,EAAE;AAAA,MAAA;AAAA,IAEjH;AAAA,IACA,UAAU;AAAA,EAAA;AAEd;AAEA,MAAM,uBAA4B;AAAA,EAChC,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,GAAG;AAAA,EACH,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,KAAK;AAAA,EACL,GAAG;AACL;AAEA,SAAS,+BAA+B,SAAsB;AAC5D,QAAM,IAAI;AACJ,QAAA,sBAAsB,EAAE,MAAM,eAAe;AAC5C,SAAA;AAAA,IACL,UAAU,yBAAyB,EAAE,OAAO,sBAAsB,SAAS,QAAQ,OAAO;AAAA,IAC1F,MAAM;AAAA,EAAA;AAEV;AAEA,SAAS,yBAAyB,SAAsB;AACtD,QAAM,SAAS,qBAAqB,QAAQ,SAAS,YAAa,CAAA;AAClE,MAAI,WAAW,QAAQ;AACd,WAAA;AAAA,MACL,MAAM;AAAA,IAAA;AAAA,EAEV;AACO,SAAA;AAAA,IACL,UAAU,yBAAyB,QAAQ,OAAO,QAAQ,OAAO;AAAA,IACjE,MAAM;AAAA,EAAA;AAEV;AAEA,SAAS,mBAAmB,SAAsB;AAChD,QAAM,OAAO;AACb,QAAM,QAAQ,KAAK;AACZ,SAAA;AAAA,IACL,UAAU,yBAAyB,OAAO,MAAM,OAAO;AAAA,IACvD,MAAM;AAAA,EAAA;AAEV;AAEA,SAAS,yBAAyB,OAAY,aAAkB,SAAsB;AACpF,QAAM,aAAa,MAAM;AACzB,QAAM,iBAAiB,MAAM,eAAe,MAAM,GAAG;AAC/C,QAAA,oBAAoB,eAAe,SAAS,eAAe;AAC3D,QAAA,+BAA+B,eAAe,SAAS,cAAc;AACrE,QAAA,qBAAqB,MAAM,cAAc;AACzC,QAAA,6BAA6B,eAAe,SAAS,WAAW;AACtE,QAAM,gBAAgB,MAAM;AAE5B,SAAO,CAAC,gBAA6B;AAE/B,QAAA,CAACC,QAAAA,YAAY,WAAW,GAAG;AACtB,aAAA;AAAA,IACT;AAEA,QAAI,qBAAqB,CAAC,YAAY,UAAU,MAAM,GAAG;AACvD,kBAAY,aAAa,MAAM;AAAA,IACjC;AACA,QAAI,gCAAgC,CAAC,YAAY,UAAU,eAAe,GAAG;AAC3E,kBAAY,aAAa,eAAe;AAAA,IAC1C;AACA,QAAI,sBAAsB,CAAC,YAAY,UAAU,QAAQ,GAAG;AAC1D,kBAAY,aAAa,QAAQ;AAAA,IACnC;AACA,QAAI,8BAA8B,CAAC,YAAY,UAAU,WAAW,GAAG;AACrE,kBAAY,aAAa,WAAW;AAAA,IACtC;AACA,QAAI,kBAAkB,SAAS,CAAC,YAAY,UAAU,WAAW,GAAG;AAClE,kBAAY,aAAa,WAAW;AAAA,IACtC;AACA,QAAI,kBAAkB,WAAW,CAAC,YAAY,UAAU,aAAa,GAAG;AACtE,kBAAY,aAAa,aAAa;AAAA,IACxC;AACA,QAAI,eAAe,CAAC,YAAY,UAAU,WAAW,GAAG;AACtD,kBAAY,aAAa,WAAW;AAAA,IACtC;AAkBM,UAAA,cAAc,QAAQ,aAAa,OAAO;AAChD,QAAI,aAAa;AACf,kBAAY,SAAS,WAAW;AAAA,IAClC;AAEO,WAAA;AAAA,EAAA;AAEX;;"}
1	+ {"version":3,"file":"RichElementNode.js","sources":["../../../../../../../src/components/basic/doc-editor/core/nodes/RichElementNode.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, SerializedElementNode, NodeKey, Spread, EditorConfig, DOMExportOutput, DOMConversion, LexicalNode } from 'lexical'\r\nimport { $isTextNode, ParagraphNode,ElementNode } from 'lexical'\r\n\r\n/*\r\n 节点序列化 \r\n /\r\nexport type SerializedRichElementNode = Spread<{ tag: string, style?: string, class?: string \| null }, SerializedElementNode>\r\n/\r\n 格子\r\n /\r\nexport class RichElementNode extends ElementNode {\r\n\r\n __tagName: string\r\n __class?: string \| null \| undefined\r\n __style: string\r\n\r\n static getType(): string { return \"rich-element\"; }\r\n\r\n static clone(node: RichElementNode): RichElementNode {\r\n return new RichElementNode(node.__tagName, node.__class, node.__style, node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedRichElementNode): RichElementNode {\r\n return new RichElementNode(serializedNode.tag, serializedNode.class, serializedNode.style)\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div: $covertRichElementDOM,\r\n section: $covertRichElementDOM,\r\n b: () => ({\r\n conversion: convertBringAttentionToElement,\r\n priority: 4\r\n }),\r\n code: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n em: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n i: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n s: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n span: () => ({\r\n conversion: convertSpanElement,\r\n priority: 4\r\n }),\r\n strong: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sub: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sup: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n u: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n })\r\n }\r\n }\r\n\r\n /\r\n \r\n * @param tagName \r\n * @param className \r\n * @param style \r\n * @param key \r\n /\r\n constructor(tagName: string, className?: string \| null, style?: string, key?: NodeKey) {\r\n super(key)\r\n this.__tagName = tagName,\r\n this.__class = className;\r\n this.__style = style \|\| \"\";\r\n }\r\n\r\n\r\n updateDOM(_prevNode: unknown, _dom: HTMLElement, _config: EditorConfig): boolean {\r\n return false;\r\n }\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedRichElementNode {\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n tag: this.__tagName,\r\n class: this.__class,\r\n style: this.__style,\r\n version: 1\r\n }\r\n }\r\n\r\n /\r\n 导出DOM\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n\r\n const element = document.createElement(this.__tagName)\r\n\r\n if (this.__class) {\r\n element.setAttribute(\"class\", this.__class)\r\n }\r\n\r\n if (this.__style) {\r\n element.setAttribute(\"style\", this.__style)\r\n }\r\n\r\n return { element }\r\n }\r\n\r\n /\r\n 创建渲染DOM\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n return this.exportDOM().element as HTMLElement;\r\n }\r\n\r\n canBeEmpty() {\r\n return false;\r\n }\r\n canInsertTextBefore() {\r\n return false;\r\n }\r\n canInsertTextAfter() {\r\n return false;\r\n }\r\n\r\n}\r\n\r\n\r\n/\r\n 转换DOM\r\n * @param node \r\n * @returns \r\n */\r\nconst $covertRichElementDOM = (domNode: HTMLElement): DOMConversion<HTMLElement> \| null => {\r\n return {\r\n conversion: () => {\r\n return {\r\n node: new RichElementNode(domNode.tagName, domNode.getAttribute(\"class\"), domNode.getAttribute(\"style\") \|\| \"\")\r\n };\r\n },\r\n priority: 3\r\n };\r\n}\r\n\r\nconst nodeNameToTextFormat: any = {\r\n code: \"code\",\r\n em: \"italic\",\r\n i: \"italic\",\r\n s: \"strikethrough\",\r\n strong: \"bold\",\r\n sub: \"subscript\",\r\n sup: \"superscript\",\r\n u: \"underline\"\r\n};\r\n\r\nfunction convertBringAttentionToElement(domNode: HTMLElement) {\r\n const b = domNode;\r\n const hasNormalFontWeight = b.style.fontWeight === \"normal\";\r\n return {\r\n forChild: applyTextFormatFromStyle(b.style, hasNormalFontWeight ? void 0 : \"bold\", domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertTextFormatElement(domNode: HTMLElement) {\r\n const format = nodeNameToTextFormat[domNode.nodeName.toLowerCase()];\r\n if (format === void 0) {\r\n return {\r\n node: null\r\n };\r\n }\r\n return {\r\n forChild: applyTextFormatFromStyle(domNode.style, format, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertSpanElement(domNode: HTMLElement) {\r\n const span = domNode;\r\n const style = span.style;\r\n return {\r\n forChild: applyTextFormatFromStyle(style, null, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction applyTextFormatFromStyle(style: any, shouldApply: any, domNode: HTMLElement) {\r\n const fontWeight = style.fontWeight;\r\n const textDecoration = style.textDecoration.split(\" \");\r\n const hasBoldFontWeight = fontWeight === \"700\" \|\| fontWeight === \"bold\";\r\n const hasLinethroughTextDecoration = textDecoration.includes(\"line-through\");\r\n const hasItalicFontStyle = style.fontStyle === \"italic\";\r\n const hasUnderlineTextDecoration = textDecoration.includes(\"underline\");\r\n const verticalAlign = style.verticalAlign;\r\n\r\n return (lexicalNode: LexicalNode) => {\r\n\r\n if (!$isTextNode(lexicalNode)) {\r\n return lexicalNode;\r\n }\r\n\r\n if (hasBoldFontWeight && !lexicalNode.hasFormat(\"bold\")) {\r\n lexicalNode.toggleFormat(\"bold\");\r\n }\r\n if (hasLinethroughTextDecoration && !lexicalNode.hasFormat(\"strikethrough\")) {\r\n lexicalNode.toggleFormat(\"strikethrough\");\r\n }\r\n if (hasItalicFontStyle && !lexicalNode.hasFormat(\"italic\")) {\r\n lexicalNode.toggleFormat(\"italic\");\r\n }\r\n if (hasUnderlineTextDecoration && !lexicalNode.hasFormat(\"underline\")) {\r\n lexicalNode.toggleFormat(\"underline\");\r\n }\r\n if (verticalAlign === \"sub\" && !lexicalNode.hasFormat(\"subscript\")) {\r\n lexicalNode.toggleFormat(\"subscript\");\r\n }\r\n if (verticalAlign === \"super\" && !lexicalNode.hasFormat(\"superscript\")) {\r\n lexicalNode.toggleFormat(\"superscript\");\r\n }\r\n if (shouldApply && !lexicalNode.hasFormat(shouldApply)) {\r\n lexicalNode.toggleFormat(shouldApply);\r\n }\r\n\r\n // let styleStr = \"\";\r\n\r\n // if(style.color){\r\n // styleStr += `color:${style.color};`\r\n // }\r\n // if(style.fontSize){\r\n // styleStr += `font-size:${style.fontSize};`\r\n // }\r\n // if(style.fontFamily){\r\n // styleStr += `font-family:${style.fontFamily};`\r\n // }\r\n // if(style.backgroundColor){\r\n // styleStr += `background-color:${style.backgroundColor};`\r\n // }\r\n\r\n // 行内样式\r\n const inlineStyle = domNode.getAttribute(\"style\")\r\n if (inlineStyle) {\r\n lexicalNode.setStyle(inlineStyle);\r\n }\r\n\r\n return lexicalNode;\r\n };\r\n}\r\n"],"names":["ElementNode","$isTextNode"],"mappings":"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"}

package/dist/cjs/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue.js CHANGED Viewed

@@ -3,7 +3,7 @@ const vue = require("vue");
 const useCanShowPlaceholder = require("../../composables/useCanShowPlaceholder.js");
 require("@lexical/overflow");
 require("@lexical/text");
-require("@lexical/utils");
+const utils = require("@lexical/utils");
 const lexical = require("lexical");
 require("tiny-invariant");
 const useMounted = require("../../composables/useMounted.js");
@@ -55,11 +55,27 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       }
     };
     useMounted.useMounted(() => {
-      return editor.registerUpdateListener(({ editorState }) => {
-        editorState.read(() => {
-          htmlContent.value = html.$generateHtmlFromNodes(editor);
-        });
-      });
+      return utils.mergeRegister(
+        editor.registerUpdateListener(({ editorState }) => {
+          editorState.read(() => {
+            htmlContent.value = html.$generateHtmlFromNodes(editor);
+          });
+        }),
+        // 删除空容器
+        editor.registerCommand(lexical.KEY_BACKSPACE_COMMAND, () => {
+          const selection = lexical.$getSelection();
+          if (lexical.$isRangeSelection(selection)) {
+            var node = selection.anchor.getNode();
+            if (node instanceof lexical.ElementNode) {
+              if (node.isEmpty()) {
+                editor.update(() => node.remove());
+                return true;
+              }
+            }
+          }
+          return false;
+        }, 1)
+      );
     });
     vue.watch(() => props.content, setHtml, { immediate: true });
     vue.watch(htmlContent, (value) => emit("change", value));

package/dist/cjs/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../../src/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { ref,defineProps,computed,defineEmits,watch } from \"vue\"\r\nimport { useCanShowPlaceholder, useLexicalComposer, useRichTextSetup,useMounted } from '../../composables'\r\nimport { $getSelection ,$selectAll~~,$createParagraphNode~~ } from 'lexical'\r\nimport { ~~$insertNodeToNearestRoot~~ } from '@lexical/utils'\r\nimport { $generateHtmlFromNodes,$generateNodesFromDOM } from '@lexical/html'\r\nimport ContentEditable from \"./ContentEditable.vue\"\r\nimport DecoratedTeleports from \"./DecoratedTeleports\"\r\n\r\n// 事件\r\nconst emit = defineEmits([\"change\"]);\r\n\r\n// 参数\r\nconst props = defineProps({\r\n content:{ type:String,default:`` },\r\n placeholder:{ type:String,default:`` }\r\n})\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nconst canShowPlaceholder = useCanShowPlaceholder(editor)\r\n\r\nconst parser = new DOMParser();\r\n\r\n// html 内容\r\nconst htmlContent = ref(\"\");\r\n\r\n// 空内容\r\nconst contentIsEmpty = computed(()=>htmlContent.value == `<p class=\"mk-doc__paragraph\"><br></p>` \|\| !htmlContent.value);\r\n\r\n// 设置 HTML\r\nconst setHtml = (html : any)=>{\r\n\r\n // 内容不同则重置 \r\n if(htmlContent.value != html){\r\n\r\n let nodes : Array<any> = [];\r\n\r\n htmlContent.value = html;\r\n\r\n editor.update(()=>{\r\n\r\n if(html.trim()){\r\n // Once you have the DOM instance it's easy to generate LexicalNodes.\r\n nodes = $generateNodesFromDOM(editor,parser.parseFromString(html.trim(),\"text/html\"));\r\n // console.log($generateNodesFromDOM,parser.parseFromString(html.trim(),\"text/html\"));\r\n }\r\n\r\n // 设置权限替换\r\n $selectAll();\r\n $getSelection()?.insertText(\"\")\r\n if(nodes.length > 0){\r\n $getSelection()?.insertNodes(nodes); \r\n }\r\n })\r\n }\r\n}\r\n\r\nuseMounted(()=>{\r\n return editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => {\r\n htmlContent.value = $generateHtmlFromNodes(editor);\r\n })\r\n })\r\n})\r\n\r\n\r\n// 初始化\r\nwatch(()=>props.content,setHtml,{ immediate:true });\r\n\r\n// 监听内容变化\r\nwatch(htmlContent,(value:any)=>emit('change',value));\r\n\r\n// 使用富文本\r\nuseRichTextSetup(editor)\r\n\r\n</script>\r\n\r\n<template>\r\n <div class=\"mk-doc-editor__stage__editable\" :class=\"{placeholder:canShowPlaceholder && contentIsEmpty}\">\r\n <ContentEditable />\r\n <template v-if=\"canShowPlaceholder && contentIsEmpty\">\r\n <div class=\"mk-doc-editor__stage__placeholder mk-doc__paragraph\" style=\"user-select: text;white-space: pre-wrap;word-break: break-word;\">\r\n {{placeholder}}\r\n </div>\r\n </template>\r\n <DecoratedTeleports />\r\n </div>\r\n\r\n</template>\r\n"],"names":["useLexicalComposer","useCanShowPlaceholder","ref","computed","html","$generateNodesFromDOM","$selectAll","$getSelection","useMounted","$generateHtmlFromNodes","watch","useRichTextSetup"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,UAAM,OAAO;AAGb,UAAM,QAAQ;AAKd,UAAM,SAASA,mBAAAA;AAET,UAAA,qBAAqBC,4CAAsB,MAAM;AAEjD,UAAA,SAAS,IAAI;AAGb,UAAA,cAAcC,QAAI,EAAE;AAGpB,UAAA,iBAAiBC,aAAS,MAAI,YAAY,SAAS,2CAA2C,CAAC,YAAY,KAAK;AAGhH,UAAA,UAAU,CAACC,WAAa;AAGvB,UAAA,YAAY,SAASA,QAAK;AAE3B,YAAI,QAAqB,CAAA;AAEzB,oBAAY,QAAQA;AAEpB,eAAO,OAAO,MAAI;;AAEb,cAAAA,OAAK,QAAO;AAEL,oBAAAC,KAAAA,sBAAsB,QAAO,OAAO,gBAAgBD,OAAK,KAAK,GAAE,WAAW,CAAC;AAAA,UAEtF;AAGWE,kBAAAA;AACGC,sCAAA,MAAAA,mBAAG,WAAW;AACzB,cAAA,MAAM,SAAS,GAAE;AACJA,wCAAA,MAAAA,mBAAG,YAAY;AAAA,UAC/B;AAAA,QAAA,CACD;AAAA,MACH;AAAA,IAAA;AAGJC,eAAAA,WAAW,MAAI;~~AACb~~,~~aAAO~~,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;~~AACxD~~,~~oBAAY~~,KAAK,MAAM;AACT,~~sBAAA~~,QAAQC,4BAAuB,MAAM;AAAA,~~QAAA~~,CAClD;AAAA,~~MAAA~~,CACF;AAAA,~~IAAA~~,~~CACF~~;AAIDC,QAAA,MAAM,MAAI,MAAM,SAAQ,SAAQ,EAAE,WAAU,MAAM;AAGlDA,QAAA,MAAM,aAAY,CAAC,UAAY,KAAK,UAAS,KAAK,CAAC;AAGnDC,qBAAA,iBAAiB,MAAM;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../../src/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { ref,defineProps,computed,defineEmits,watch } from \"vue\"\r\nimport { useCanShowPlaceholder, useLexicalComposer, useRichTextSetup,useMounted } from '../../composables'\r\nimport { $getSelection ,$selectAll,KEY_BACKSPACE_COMMAND, ElementNode, $isRangeSelection } from 'lexical'\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { $generateHtmlFromNodes,$generateNodesFromDOM } from '@lexical/html'\r\nimport ContentEditable from \"./ContentEditable.vue\"\r\nimport DecoratedTeleports from \"./DecoratedTeleports\"\r\n\r\n// 事件\r\nconst emit = defineEmits([\"change\"]);\r\n\r\n// 参数\r\nconst props = defineProps({\r\n content:{ type:String,default:`` },\r\n placeholder:{ type:String,default:`` }\r\n})\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nconst canShowPlaceholder = useCanShowPlaceholder(editor)\r\n\r\nconst parser = new DOMParser();\r\n\r\n// html 内容\r\nconst htmlContent = ref(\"\");\r\n\r\n// 空内容\r\nconst contentIsEmpty = computed(()=>htmlContent.value == `<p class=\"mk-doc__paragraph\"><br></p>` \|\| !htmlContent.value);\r\n\r\n// 设置 HTML\r\nconst setHtml = (html : any)=>{\r\n\r\n // 内容不同则重置 \r\n if(htmlContent.value != html){\r\n\r\n let nodes : Array<any> = [];\r\n\r\n htmlContent.value = html;\r\n\r\n editor.update(()=>{\r\n\r\n if(html.trim()){\r\n // Once you have the DOM instance it's easy to generate LexicalNodes.\r\n nodes = $generateNodesFromDOM(editor,parser.parseFromString(html.trim(),\"text/html\"));\r\n // console.log($generateNodesFromDOM,parser.parseFromString(html.trim(),\"text/html\"));\r\n }\r\n\r\n // 设置权限替换\r\n $selectAll();\r\n $getSelection()?.insertText(\"\")\r\n if(nodes.length > 0){\r\n $getSelection()?.insertNodes(nodes); \r\n }\r\n })\r\n }\r\n}\r\n\r\nuseMounted(()=>{\r\n return mergeRegister(\r\n editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => {\r\n htmlContent.value = $generateHtmlFromNodes(editor);\r\n })\r\n }),\r\n // 删除空容器\r\n editor.registerCommand(KEY_BACKSPACE_COMMAND,()=>{\r\n\r\n const selection = $getSelection()\r\n\r\n if( $isRangeSelection(selection) ){ \r\n\r\n var node = selection.anchor.getNode()\r\n\r\n if(node instanceof ElementNode){\r\n if(node.isEmpty()){\r\n editor.update(()=> node.remove())\r\n return true;\r\n }\r\n }\r\n }\r\n return false;\r\n },1)\r\n )\r\n})\r\n\r\n\r\n// 初始化\r\nwatch(()=>props.content,setHtml,{ immediate:true });\r\n\r\n// 监听内容变化\r\nwatch(htmlContent,(value:any)=>emit('change',value));\r\n\r\n// 使用富文本\r\nuseRichTextSetup(editor)\r\n\r\n</script>\r\n\r\n<template>\r\n <div class=\"mk-doc-editor__stage__editable\" :class=\"{placeholder:canShowPlaceholder && contentIsEmpty}\">\r\n <ContentEditable />\r\n <template v-if=\"canShowPlaceholder && contentIsEmpty\">\r\n <div class=\"mk-doc-editor__stage__placeholder mk-doc__paragraph\" style=\"user-select: text;white-space: pre-wrap;word-break: break-word;\">\r\n {{placeholder}}\r\n </div>\r\n </template>\r\n <DecoratedTeleports />\r\n </div>\r\n\r\n</template>\r\n"],"names":["useLexicalComposer","useCanShowPlaceholder","ref","computed","html","$generateNodesFromDOM","$selectAll","$getSelection","useMounted","mergeRegister","$generateHtmlFromNodes","KEY_BACKSPACE_COMMAND","$isRangeSelection","ElementNode","watch","useRichTextSetup"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,UAAM,OAAO;AAGb,UAAM,QAAQ;AAKd,UAAM,SAASA,mBAAAA;AAET,UAAA,qBAAqBC,4CAAsB,MAAM;AAEjD,UAAA,SAAS,IAAI;AAGb,UAAA,cAAcC,QAAI,EAAE;AAGpB,UAAA,iBAAiBC,aAAS,MAAI,YAAY,SAAS,2CAA2C,CAAC,YAAY,KAAK;AAGhH,UAAA,UAAU,CAACC,WAAa;AAGvB,UAAA,YAAY,SAASA,QAAK;AAE3B,YAAI,QAAqB,CAAA;AAEzB,oBAAY,QAAQA;AAEpB,eAAO,OAAO,MAAI;;AAEb,cAAAA,OAAK,QAAO;AAEL,oBAAAC,KAAAA,sBAAsB,QAAO,OAAO,gBAAgBD,OAAK,KAAK,GAAE,WAAW,CAAC;AAAA,UAEtF;AAGWE,kBAAAA;AACGC,sCAAA,MAAAA,mBAAG,WAAW;AACzB,cAAA,MAAM,SAAS,GAAE;AACJA,wCAAA,MAAAA,mBAAG,YAAY;AAAA,UAC/B;AAAA,QAAA,CACD;AAAA,MACH;AAAA,IAAA;AAGJC,eAAAA,WAAW,MAAI;AACN,aAAAC,MAAA;AAAA,QACL,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACjD,sBAAY,KAAK,MAAM;AACT,wBAAA,QAAQC,4BAAuB,MAAM;AAAA,UAAA,CAClD;AAAA,QAAA,CACF;AAAA;AAAA,QAED,OAAO,gBAAgBC,QAAAA,uBAAsB,MAAI;AAE/C,gBAAM,YAAYJ,QAAAA;AAEd,cAAAK,QAAAA,kBAAkB,SAAS,GAAG;AAE5B,gBAAA,OAAO,UAAU,OAAO,QAAQ;AAEpC,gBAAG,gBAAgBC,QAAAA,aAAY;AAC1B,kBAAA,KAAK,WAAU;AAChB,uBAAO,OAAO,MAAK,KAAK,OAAQ,CAAA;AACzB,uBAAA;AAAA,cACT;AAAA,YACF;AAAA,UACF;AACO,iBAAA;AAAA,WACP,CAAC;AAAA,MAAA;AAAA,IACL,CACD;AAIDC,QAAA,MAAM,MAAI,MAAM,SAAQ,SAAQ,EAAE,WAAU,MAAM;AAGlDA,QAAA,MAAM,aAAY,CAAC,UAAY,KAAK,UAAS,KAAK,CAAC;AAGnDC,qBAAA,iBAAiB,MAAM;;;;;;;;;;;;;"}

package/dist/cjs/components/basic/doc-editor/plugins/AutoLinkPlugin/LinkEditDialog.js CHANGED Viewed

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const vue = require("vue");
 const dm = require("@maketribe/dm");
 const elementPlus = require("element-plus");
-const ShowLinkEditPanel = async (href) => {
+const showLinkEditPanel = async (href) => {
   return new Promise((resolve, reject) => {
     const hrefValue = vue.ref(href);
     const handleCancelClick = () => {
@@ -47,5 +47,5 @@ const ShowLinkEditPanel = async (href) => {
     });
   });
 };
-exports.ShowLinkEditPanel = ShowLinkEditPanel;
+exports.showLinkEditPanel = showLinkEditPanel;
 //# sourceMappingURL=LinkEditDialog.js.map

package/dist/cjs/components/basic/doc-editor/plugins/AutoLinkPlugin/LinkEditDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LinkEditDialog.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/AutoLinkPlugin/LinkEditDialog.tsx"],"sourcesContent":["\r\nimport { Fragment,ref~~,unref~~ } from 'vue'\r\nimport { Dialoger } from '@maketribe/dm'\r\nimport { ElButton ,ElInput } from \"element-plus\";\r\n/*\r\n \r\n * @param href \r\n * @returns \r\n */\r\nexport const ~~ShowLinkEditPanel~~ = async (href:any) => {\r\n return new Promise((resolve,reject) => {\r\n\r\n const hrefValue = ref(href)\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(hrefValue.value);\r\n };\r\n\r\n const dialogInstance = Dialoger.customRender({\r\n title: \"设置连接\",\r\n class: \"mk-html-editor-dialog\",\r\n width: \"500px\",\r\n onClose: () => {\r\n dialogInstance.destroy();\r\n },\r\n body: () => {\r\n return <ElInput v-model={hrefValue.value} clearable={true} placeholder='http://www.xxx.com' v-slots={\r\n {\r\n prepend:()=>{\r\n return \"地址：\";\r\n }\r\n }\r\n }></ElInput>\r\n },\r\n footer: () => {\r\n return <Fragment>\r\n <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n <ElButton type=\"primary\" onClick={handleConfirmClick}>\r\n 确定\r\n </ElButton>\r\n </Fragment>\r\n },\r\n });\r\n });\r\n}\r\n"],"names":["~~ShowLinkEditPanel~~","href","Promise","resolve","reject","hrefValue","ref","handleCancelClick","dialogInstance","destroy","handleConfirmClick","value","Dialoger","customRender","title","class","width","onClose","body","_createVNode","ElInput","$event","prepend","footer","_Fragment","ElButton","default","_createTextVNode"],"mappings":";;;;;AASaA,MAAAA,oBAAoB,OAAQC,SAAa;AACpD,SAAO,IAAIC,QAAQ,CAACC,SAAQC,WAAW;AAErC,UAAMC,YAAYC,QAAIL,IAAI;AAG1B,UAAMM,oBAAoBA,MAAM;AAC9BC,qBAAeC,QAAO;AAAA;AAIxB,UAAMC,qBAAqBA,MAAM;AAC/BF,qBAAeC,QAAO;AACtBN,cAAQE,UAAUM,KAAK;AAAA;AAGzB,UAAMH,iBAAiBI,GAAQ,SAACC,aAAa;AAAA,MAC3CC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPC,SAASA,MAAM;AACbT,uBAAeC,QAAO;AAAA,MACvB;AAAA,MACDS,MAAMA,MAAM;AACV,eAAAC,IAAAA,YAAAC,YAAAA,SAAA;AAAA,UAAA,cAAyBf,UAAUM;AAAAA,UAAK,uBAAAU,YAAfhB,UAAUM,QAAKU;AAAAA,UAAA,aAAa;AAAA,UAAI,eAAA;AAAA,WACvD;AAAA,UACEC,SAAQA,MAAI;AACV,mBAAO;AAAA,UACT;AAAA,SACD;AAAA,MAEJ;AAAA,MACDC,QAAQA,MAAM;AACZ,eAAAJ,IAAA,YAAAK,IAAA,UAAAL,MAAAA,CAAAA,IAAAA,YAAAM,YAAAA,UAAA;AAAA,UAAA,WACqBlB;AAAAA,QAAiB,GAAA;AAAA,UAAAmB,SAAAA,MAAA,CAAAC,oBAAA,IAAA,CAAA;AAAA,SAAAR,GAAAA,IAAA,YAAAM,sBAAA;AAAA,UAAA,QAAA;AAAA,UAAA,WACFf;AAAAA,QAAkB,GAAA;AAAA,UAAAgB,SAAAA,MAAA,CAAAC,oBAAA,IAAA,CAAA;AAAA,QAAA,CAAA,CAAA,CAAA;AAAA,MAIxD;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;;"}
1	+ {"version":3,"file":"LinkEditDialog.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/AutoLinkPlugin/LinkEditDialog.tsx"],"sourcesContent":["\r\nimport { Fragment,ref } from 'vue'\r\nimport { Dialoger } from '@maketribe/dm'\r\nimport { ElButton ,ElInput } from \"element-plus\";\r\n/*\r\n \r\n * @param href \r\n * @returns \r\n */\r\nexport const showLinkEditPanel = async (href:any) => {\r\n return new Promise((resolve,reject) => {\r\n\r\n const hrefValue = ref(href)\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(hrefValue.value);\r\n };\r\n\r\n const dialogInstance = Dialoger.customRender({\r\n title: \"设置连接\",\r\n class: \"mk-html-editor-dialog\",\r\n width: \"500px\",\r\n onClose: () => {\r\n dialogInstance.destroy();\r\n },\r\n body: () => {\r\n return <ElInput v-model={hrefValue.value} clearable={true} placeholder='http://www.xxx.com' v-slots={\r\n {\r\n prepend:()=>{\r\n return \"地址：\";\r\n }\r\n }\r\n }></ElInput>\r\n },\r\n footer: () => {\r\n return <Fragment>\r\n <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n <ElButton type=\"primary\" onClick={handleConfirmClick}>\r\n 确定\r\n </ElButton>\r\n </Fragment>\r\n },\r\n });\r\n });\r\n}\r\n"],"names":["showLinkEditPanel","href","Promise","resolve","reject","hrefValue","ref","handleCancelClick","dialogInstance","destroy","handleConfirmClick","value","Dialoger","customRender","title","class","width","onClose","body","_createVNode","ElInput","$event","prepend","footer","_Fragment","ElButton","default","_createTextVNode"],"mappings":";;;;;AASaA,MAAAA,oBAAoB,OAAQC,SAAa;AACpD,SAAO,IAAIC,QAAQ,CAACC,SAAQC,WAAW;AAErC,UAAMC,YAAYC,QAAIL,IAAI;AAG1B,UAAMM,oBAAoBA,MAAM;AAC9BC,qBAAeC,QAAO;AAAA;AAIxB,UAAMC,qBAAqBA,MAAM;AAC/BF,qBAAeC,QAAO;AACtBN,cAAQE,UAAUM,KAAK;AAAA;AAGzB,UAAMH,iBAAiBI,GAAQ,SAACC,aAAa;AAAA,MAC3CC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPC,SAASA,MAAM;AACbT,uBAAeC,QAAO;AAAA,MACvB;AAAA,MACDS,MAAMA,MAAM;AACV,eAAAC,IAAAA,YAAAC,YAAAA,SAAA;AAAA,UAAA,cAAyBf,UAAUM;AAAAA,UAAK,uBAAAU,YAAfhB,UAAUM,QAAKU;AAAAA,UAAA,aAAa;AAAA,UAAI,eAAA;AAAA,WACvD;AAAA,UACEC,SAAQA,MAAI;AACV,mBAAO;AAAA,UACT;AAAA,SACD;AAAA,MAEJ;AAAA,MACDC,QAAQA,MAAM;AACZ,eAAAJ,IAAA,YAAAK,IAAA,UAAAL,MAAAA,CAAAA,IAAAA,YAAAM,YAAAA,UAAA;AAAA,UAAA,WACqBlB;AAAAA,QAAiB,GAAA;AAAA,UAAAmB,SAAAA,MAAA,CAAAC,oBAAA,IAAA,CAAA;AAAA,SAAAR,GAAAA,IAAA,YAAAM,sBAAA;AAAA,UAAA,QAAA;AAAA,UAAA,WACFf;AAAAA,QAAkB,GAAA;AAAA,UAAAgB,SAAAA,MAAA,CAAAC,oBAAA,IAAA,CAAA;AAAA,QAAA,CAAA,CAAA,CAAA;AAAA,MAIxD;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;;"}

package/dist/cjs/components/basic/doc-editor/plugins/AutoLinkPlugin/index.vue.js CHANGED Viewed

@@ -1,38 +1,12 @@
 "use strict";
 const vue = require("vue");
 require("../../core/index.js");
-const index_vue_vue_type_script_setup_true_lang = require("../../core/plugins/LexicalAutoLinkPlugin/index.vue2.js");
 const LexicalLinkPlugin_vue_vue_type_script_setup_true_lang = require("../../core/plugins/LexicalLinkPlugin.vue2.js");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "index",
   setup(__props) {
-    const URL_MATCHER = /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
-    const EMAIL_MATCHER = /(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))/;
-    const MATCHERS = [
-      (text) => {
-        const match = URL_MATCHER.exec(text);
-        return match && {
-          index: match.index,
-          length: match[0].length,
-          text: match[0],
-          url: match[0]
-        };
-      },
-      (text) => {
-        const match = EMAIL_MATCHER.exec(text);
-        return match && {
-          index: match.index,
-          length: match[0].length,
-          text: match[0],
-          url: `mailto:${match[0]}`
-        };
-      }
-    ];
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
-        vue.createVNode(vue.unref(index_vue_vue_type_script_setup_true_lang), { matchers: MATCHERS }),
-        vue.createVNode(vue.unref(LexicalLinkPlugin_vue_vue_type_script_setup_true_lang))
-      ], 64);
+      return vue.openBlock(), vue.createBlock(vue.unref(LexicalLinkPlugin_vue_vue_type_script_setup_true_lang));
     };
   }
 });

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":[~~"../../../../../../../src/components/basic/doc-editor/plugins/AutoLinkPlugin/index.vue"~~],"sourcesContent":[~~"<script setup lang=\"ts\">\r\nimport { LexicalAutoLinkPlugin,LexicalLinkPlugin } from '../../core'\r\n\r\n\r\nconst URL_MATCHER = /((https?:\\/\\/(www\\.)?)\|(www\\.))[-a-zA-Z0-9@:%._+~#=~~]{1,~~256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_+.~#?&//=])/\r\n\r\nconst EMAIL_MATCHER = /(([^<>()[\\]\\\\.,;:\\s@\~~"]+(\\.[^<>()[\\]\\\\.,;:\\s@\"]+))\|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\])\|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))/\r\n\r\nconst MATCHERS = [\r\n (text: string) => {\r\n const match = URL_MATCHER.exec(text)\r\n return (\r\n match && {\r\n index: match.index,\r\n length: match[0].length,\r\n text: match[0],\r\n url: match[0],\r\n }\r\n )\r\n },\r\n (text: string) => {\r\n const match = EMAIL_MATCHER.exec(text)\r\n return (\r\n match && {\r\n index: match.index,\r\n length: match[0].length,\r\n text: match[0],\r\n url: `mailto:${match[0]}`,\r\n }\r\n )\r\n },\r\n]\r\n</script>\r\n\r\n<template>\r\n <LexicalAutoLinkPlugin :matchers=\"MATCHERS\" />\r\n <LexicalLinkPlugin />\r\n</template>\r\n"],"names":[],"mappings":";;;;;;;;AAIA,UAAM,cAAc;AAEpB,UAAM,gBAAgB;AAEtB,UAAM,WAAW;AAAA,MACf,CAAC,SAAiB;AACV,cAAA,QAAQ,YAAY,KAAK,IAAI;AACnC,eACE,SAAS;AAAA,UACP,OAAO,MAAM;AAAA,UACb,QAAQ,MAAM,CAAC,EAAE;AAAA,UACjB,MAAM,MAAM,CAAC;AAAA,UACb,KAAK,MAAM,CAAC;AAAA,QAAA;AAAA,MAGlB;AAAA,MACA,CAAC,SAAiB;AACV,cAAA,QAAQ,cAAc,KAAK,IAAI;AACrC,eACE,SAAS;AAAA,UACP,OAAO,MAAM;AAAA,UACb,QAAQ,MAAM,CAAC,EAAE;AAAA,UACjB,MAAM,MAAM,CAAC;AAAA,UACb,KAAK,UAAU,MAAM,CAAC,CAAC;AAAA,QAAA;AAAA,MAG7B;AAAA,IAAA;;;;;;;;;;"}
1	+ {"version":3,"file":"index.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

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

@@ -89,7 +89,6 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       const _component_el_dropdown = vue.resolveComponent("el-dropdown");
       return vue.openBlock(), vue.createBlock(_component_el_dropdown, {
         "max-height": "300px",
-        trigger: "click",
         disabled: disabled.value
       }, {
         dropdown: vue.withCtx(() => [

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

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

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

@@ -37,7 +37,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const isLink = vue.ref(false);
     const linkValue = vue.ref("");
     async function insertLink() {
-      const result = await LinkEditDialog.ShowLinkEditPanel(linkValue.value);
+      const result = await LinkEditDialog.showLinkEditPanel(linkValue.value);
       if (result.trim()) {
         editor.dispatchCommand(link.TOGGLE_LINK_COMMAND, url.sanitizeUrl(result));
       } else {
@@ -136,7 +136,6 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
         vue.createVNode(_component_el_dropdown, {
           "max-height": "300px",
-          trigger: "click",
           disabled: disabled.value
         }, {
           dropdown: vue.withCtx(() => [
@@ -182,7 +181,6 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         vue.createVNode(_component_el_divider, { direction: "vertical" }),
         vue.createVNode(_component_el_dropdown, {
           "max-height": "300px",
-          trigger: "click",
           disabled: disabled.value
         }, {
           dropdown: vue.withCtx(() => [

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

	@@ -1 +1 @@
1	- {"version":3,"file":"FontStyleTool.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/FontStyleTool.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport {\r\n $getSelection,\r\n $isRangeSelection,\r\n $isRootOrShadowRoot,\r\n $isParagraphNode,\r\n FORMAT_TEXT_COMMAND,\r\n FORMAT_ELEMENT_COMMAND,\r\n type ElementFormatType,\r\n} from 'lexical'\r\nimport {\r\n $getSelectionStyleValueForProperty,\r\n $patchStyleText,\r\n} from '@lexical/selection'\r\n\r\nimport { $isLinkNode, TOGGLE_LINK_COMMAND,LinkNode } from '@lexical/link'\r\nimport { sanitizeUrl } from '../../utils/url'\r\nimport { getSelectedNode } from '../../utils/getSelectedNode'\r\nimport { $findMatchingParent,mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer } from '../../core/composables'\r\nimport { onMounted, onUnmounted, ref,watch } from 'vue'\r\nimport { FONT_SIZE_OPTIONS,ROOT_FONT_SIZE,FONT_FAMILY_OPTIONS } from \"./FontStyleDefines\"\r\nimport { ShowLinkEditPanel } from \"../AutoLinkPlugin/LinkEditDialog\";\r\n\r\nconst editor = useLexicalComposer()\r\nconst fontSize = ref('14px')\r\nconst fontColor = ref<string>('#000')\r\nconst bgColor = ref<string>('#fff')\r\nconst fontFamily = ref<any>(FONT_FAMILY_OPTIONS[0])\r\nconst isBold = ref(false)\r\nconst isItalic = ref(false)\r\nconst isUnderline = ref(false)\r\nconst isStrikethrough = ref(false)\r\n\r\nconst isSubscript = ref(false)\r\nconst isSuperscript = ref(false)\r\n\r\n// 对齐方式\r\nconst alignList = ref<ElementFormatType[]>([\"left\",\"center\",\"right\",\"justify\"])\r\nconst alignValue = ref(alignList.value[0])\r\nconst disabled = ref(false)\r\nconst isLink = ref(false)\r\nconst linkValue = ref(\"\");\r\n\r\nasync function insertLink() {\r\n\r\n const result:any = await ShowLinkEditPanel(linkValue.value);\r\n\r\n if(result.trim()){\r\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, sanitizeUrl(result))\r\n }\r\n else{\r\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null)\r\n }\r\n}\r\n\r\n// 更新状态栏\r\nfunction updateToolbar() {\r\n\r\n const selection = $getSelection()\r\n\r\n if ($isRangeSelection(selection)) {\r\n\r\n const anchorNode = selection.anchor.getNode()\r\n\r\n let element = anchorNode.getKey() === 'root'\r\n ? anchorNode\r\n : $findMatchingParent(anchorNode, (e) => {\r\n const parent = e.getParent()\r\n return parent !== null && $isRootOrShadowRoot(parent)\r\n });\r\n\r\n\r\n if (element === null){\r\n element = anchorNode.getTopLevelElementOrThrow()\r\n }\r\n\r\n let elementDOM = editor.getElementByKey(element.getKey());\r\n\r\n // 文本对齐\r\n alignValue.value = (elementDOM?.style.textAlign as ElementFormatType) \|\| \"left\";\r\n\r\n if(alignValue.value == \"start\"){ alignValue.value = \"left\"; }\r\n else if(alignValue.value == \"end\"){ alignValue.value = \"right\"; }\r\n\r\n // Update text format\r\n isBold.value = selection.hasFormat('bold')\r\n isItalic.value = selection.hasFormat('italic')\r\n isUnderline.value = selection.hasFormat('underline')\r\n isStrikethrough.value = selection.hasFormat('strikethrough')\r\n isSubscript.value = selection.hasFormat('subscript')\r\n isSuperscript.value = selection.hasFormat('superscript')\r\n\r\n // Handle buttons\r\n var ff = $getSelectionStyleValueForProperty(selection, 'font-family', 'Arial');\r\n let fs = $getSelectionStyleValueForProperty(selection, 'font-size', '1rem');\r\n \r\n if(fs){\r\n fontSize.value = Math.round(parseFloat(fs) * ROOT_FONT_SIZE)+\"px\"\r\n }\r\n \r\n fontColor.value = $getSelectionStyleValueForProperty(selection, 'color', '#000')\r\n bgColor.value = $getSelectionStyleValueForProperty(selection, 'background-color', '#fff')\r\n fontFamily.value = FONT_FAMILY_OPTIONS.find(item=>item.value==ff) \|\| FONT_FAMILY_OPTIONS[0];\r\n\r\n disabled.value = false;\r\n\r\n // Update links\r\n const node = getSelectedNode(selection)\r\n const parent = node.getParent()\r\n isLink.value = $isLinkNode(parent) \|\| $isLinkNode(node)\r\n if(isLink.value){\r\n linkValue.value = $isLinkNode(parent) ? parent.getURL() : (node as LinkNode).getURL()\r\n }\r\n else{\r\n linkValue.value = \"\";\r\n }\r\n }\r\n else{\r\n\r\n disabled.value = true;\r\n }\r\n}\r\n\r\n// 文字样式\r\nconst fontStyleHandle = (data : any,styleName?:any)=>{\r\n fontSize.value = data.label;\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null) {\r\n $patchStyleText(selection, {\r\n [styleName \|\| \"font-size\"]:data.value\r\n })\r\n }\r\n })\r\n}\r\n\r\n// 字体颜色\r\nconst setFontColor = (color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { color })\r\n }\r\n },{})\r\n}\r\n\r\n// bg颜色\r\nconst setBgColor = (color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { 'background-color':color })\r\n }\r\n },{})\r\n}\r\n\r\n\r\n// 挂载的时候\r\nonMounted(() => {\r\n\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => updateToolbar())\r\n })\r\n )\r\n\r\n onUnmounted(() => unregisterMergeListener());\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n <!-- 字体 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n {{fontFamily.label}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontFamily.label == item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_FAMILY_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item,'font-family')\">\r\n <span :style=\"{fontFamily:item.value}\">\r\n {{item.label}}\r\n </span>\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体大小 -->\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :disabled=\"disabled\">\r\n {{fontSize}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontSize==item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_SIZE_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item)\">{{item.label}}</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__fontcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"fontColor\" :disabled=\"disabled\" @change=\"setFontColor\" />\r\n </el-button>\r\n <!-- 背景颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__bgcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"bgColor\" :disabled=\"disabled\" />\r\n <MKSvgIcon class=\"view\" iconClass=\"doc-background-color\" @change=\"setBgColor\" /> \r\n </el-button>\r\n\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isBold ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'bold')\">\r\n <MKSvgIcon iconClass=\"doc-bold\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isItalic ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'italic')\">\r\n <MKSvgIcon iconClass=\"doc-italic\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isUnderline ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'underline')\">\r\n <MKSvgIcon iconClass=\"doc-underline\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isStrikethrough ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'strikethrough')\">\r\n <MKSvgIcon iconClass=\"doc-strikethrough\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isSubscript ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'subscript')\">\r\n <MKSvgIcon iconClass=\"doc-sub\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isSuperscript ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'superscript')\">\r\n <MKSvgIcon iconClass=\"doc-sup\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${alignValue}`\" style=\"font-size: 18px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :disabled=\"disabled\" :class=\"{active:alignValue == item}\" v-for=\"item in alignList\" :value=\"item\" @click=\"editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, item)\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${item}`\" style=\"font-size: 18px;\" /> \r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" />\r\n <!-- 链接 -->\r\n <el-button-group>\r\n <el-button text :disabled=\"disabled\" :class=\"`${isLink ? 'active' : ''}`\" @click=\"insertLink\">\r\n <MKSvgIcon iconClass=\"doc-link\" /> \r\n </el-button>\r\n </el-button-group>\r\n</template>\r\n"],"names":["useLexicalComposer","ref","FONT_FAMILY_OPTIONS","ShowLinkEditPanel","TOGGLE_LINK_COMMAND","sanitizeUrl","selection","$getSelection","$isRangeSelection","$findMatchingParent","parent","$isRootOrShadowRoot","$getSelectionStyleValueForProperty","ROOT_FONT_SIZE","getSelectedNode","$isLinkNode","$patchStyleText","onMounted","mergeRegister","onUnmounted"],"mappings":"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"}
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 '../../core/composables'\r\nimport { onMounted, onUnmounted, ref,watch } from 'vue'\r\nimport { FONT_SIZE_OPTIONS,ROOT_FONT_SIZE,FONT_FAMILY_OPTIONS } from \"./FontStyleDefines\"\r\nimport { showLinkEditPanel } from \"../AutoLinkPlugin/LinkEditDialog\";\r\n\r\nconst editor = useLexicalComposer()\r\nconst fontSize = ref('14px')\r\nconst fontColor = ref<string>('#000')\r\nconst bgColor = ref<string>('#fff')\r\nconst fontFamily = ref<any>(FONT_FAMILY_OPTIONS[0])\r\nconst isBold = ref(false)\r\nconst isItalic = ref(false)\r\nconst isUnderline = ref(false)\r\nconst isStrikethrough = ref(false)\r\n\r\nconst isSubscript = ref(false)\r\nconst isSuperscript = ref(false)\r\n\r\n// 对齐方式\r\nconst alignList = ref<ElementFormatType[]>([\"left\",\"center\",\"right\",\"justify\"])\r\nconst alignValue = ref(alignList.value[0])\r\nconst disabled = ref(false)\r\nconst isLink = ref(false)\r\nconst linkValue = ref(\"\");\r\n\r\nasync function insertLink() {\r\n\r\n const result:any = await showLinkEditPanel(linkValue.value);\r\n\r\n if(result.trim()){\r\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, sanitizeUrl(result))\r\n }\r\n else{\r\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null)\r\n }\r\n}\r\n\r\n// 更新状态栏\r\nfunction updateToolbar() {\r\n\r\n const selection = $getSelection()\r\n\r\n if ($isRangeSelection(selection)) {\r\n\r\n const anchorNode = selection.anchor.getNode()\r\n\r\n let element = anchorNode.getKey() === 'root'\r\n ? anchorNode\r\n : $findMatchingParent(anchorNode, (e) => {\r\n const parent = e.getParent()\r\n return parent !== null && $isRootOrShadowRoot(parent)\r\n });\r\n\r\n\r\n if (element === null){\r\n element = anchorNode.getTopLevelElementOrThrow()\r\n }\r\n\r\n let elementDOM = editor.getElementByKey(element.getKey());\r\n\r\n // 文本对齐\r\n alignValue.value = (elementDOM?.style.textAlign as ElementFormatType) \|\| \"left\";\r\n\r\n if(alignValue.value == \"start\"){ alignValue.value = \"left\"; }\r\n else if(alignValue.value == \"end\"){ alignValue.value = \"right\"; }\r\n\r\n // Update text format\r\n isBold.value = selection.hasFormat('bold')\r\n isItalic.value = selection.hasFormat('italic')\r\n isUnderline.value = selection.hasFormat('underline')\r\n isStrikethrough.value = selection.hasFormat('strikethrough')\r\n isSubscript.value = selection.hasFormat('subscript')\r\n isSuperscript.value = selection.hasFormat('superscript')\r\n\r\n // Handle buttons\r\n var ff = $getSelectionStyleValueForProperty(selection, 'font-family', 'Arial');\r\n let fs = $getSelectionStyleValueForProperty(selection, 'font-size', '1rem');\r\n \r\n if(fs){\r\n fontSize.value = Math.round(parseFloat(fs) * ROOT_FONT_SIZE)+\"px\"\r\n }\r\n \r\n fontColor.value = $getSelectionStyleValueForProperty(selection, 'color', '#000')\r\n bgColor.value = $getSelectionStyleValueForProperty(selection, 'background-color', '#fff')\r\n fontFamily.value = FONT_FAMILY_OPTIONS.find(item=>item.value==ff) \|\| FONT_FAMILY_OPTIONS[0];\r\n\r\n disabled.value = false;\r\n\r\n // Update links\r\n const node = getSelectedNode(selection)\r\n const parent = node.getParent()\r\n isLink.value = $isLinkNode(parent) \|\| $isLinkNode(node)\r\n if(isLink.value){\r\n linkValue.value = $isLinkNode(parent) ? parent.getURL() : (node as LinkNode).getURL()\r\n }\r\n else{\r\n linkValue.value = \"\";\r\n }\r\n }\r\n else{\r\n\r\n disabled.value = true;\r\n }\r\n}\r\n\r\n// 文字样式\r\nconst fontStyleHandle = (data : any,styleName?:any)=>{\r\n fontSize.value = data.label;\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null) {\r\n $patchStyleText(selection, {\r\n [styleName \|\| \"font-size\"]:data.value\r\n })\r\n }\r\n })\r\n}\r\n\r\n// 字体颜色\r\nconst setFontColor = (color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { color })\r\n }\r\n },{})\r\n}\r\n\r\n// bg颜色\r\nconst setBgColor = (color:any)=>{\r\n editor.update(() => {\r\n const selection = $getSelection()\r\n if (selection !== null){\r\n $patchStyleText(selection, { 'background-color':color })\r\n }\r\n },{})\r\n}\r\n\r\n\r\n// 挂载的时候\r\nonMounted(() => {\r\n\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => updateToolbar())\r\n })\r\n )\r\n\r\n onUnmounted(() => unregisterMergeListener());\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n <!-- 字体 -->\r\n <el-dropdown max-height=\"300px\" :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\" :disabled=\"disabled\">\r\n <el-button text :disabled=\"disabled\">\r\n {{fontSize}} <MKSvgIcon iconClass=\"ArrowDownBold\" style=\"margin-left: 8px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :class=\"{active:fontSize==item.label}\" :disabled=\"disabled\" v-for=\"item in FONT_SIZE_OPTIONS\" :value=\"item.value\" @click=\"fontStyleHandle(item)\">{{item.label}}</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 字体颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__fontcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"fontColor\" :disabled=\"disabled\" @change=\"setFontColor\" />\r\n </el-button>\r\n <!-- 背景颜色 -->\r\n <el-button text class=\"mk-doc-editor-toolbar__bgcolor\" :disabled=\"disabled\" >\r\n <el-color-picker v-model=\"bgColor\" :disabled=\"disabled\" />\r\n <MKSvgIcon class=\"view\" iconClass=\"doc-background-color\" @change=\"setBgColor\" /> \r\n </el-button>\r\n\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isBold ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'bold')\">\r\n <MKSvgIcon iconClass=\"doc-bold\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isItalic ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'italic')\">\r\n <MKSvgIcon iconClass=\"doc-italic\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isUnderline ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'underline')\">\r\n <MKSvgIcon iconClass=\"doc-underline\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isStrikethrough ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'strikethrough')\">\r\n <MKSvgIcon iconClass=\"doc-strikethrough\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isSubscript ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'subscript')\">\r\n <MKSvgIcon iconClass=\"doc-sub\" /> \r\n </el-button>\r\n <el-button :disabled=\"disabled\" text :class=\"`${isSuperscript ? 'active' : ''}`\" @click=\"editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'superscript')\">\r\n <MKSvgIcon iconClass=\"doc-sup\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <el-dropdown max-height=\"300px\" trigger=\"click\" :disabled=\"disabled\">\r\n <el-button text :style=\"{fontFamily:fontFamily.value}\" :disabled=\"disabled\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${alignValue}`\" style=\"font-size: 18px;\" /> \r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :disabled=\"disabled\" :class=\"{active:alignValue == item}\" v-for=\"item in alignList\" :value=\"item\" @click=\"editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, item)\">\r\n <MKSvgIcon :iconClass=\"`doc-align-${item}`\" style=\"font-size: 18px;\" /> \r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" />\r\n <!-- 链接 -->\r\n <el-button-group>\r\n <el-button text :disabled=\"disabled\" :class=\"`${isLink ? 'active' : ''}`\" @click=\"insertLink\">\r\n <MKSvgIcon iconClass=\"doc-link\" /> \r\n </el-button>\r\n </el-button-group>\r\n</template>\r\n"],"names":["useLexicalComposer","ref","FONT_FAMILY_OPTIONS","showLinkEditPanel","TOGGLE_LINK_COMMAND","sanitizeUrl","selection","$getSelection","$isRangeSelection","$findMatchingParent","parent","$isRootOrShadowRoot","$getSelectionStyleValueForProperty","ROOT_FONT_SIZE","getSelectedNode","$isLinkNode","$patchStyleText","onMounted","mergeRegister","onUnmounted"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
 "use strict";
-const DocEditorEditCss = '\r\n.mk-doc__img {\r\n  cursor: pointer;\r\n  z-index: 1;\r\n  position: relative;\r\n}\r\n\r\n.mk-doc__grid{\r\n  outline: 2px solid #eff5ff;\r\n  position: relative;\r\n  cursor: pointer;\r\n  white-space:initial;\r\n  word-break:initial;\r\n  min-height: 20px;\r\n}\r\n\r\n/* 文本框可编辑文字 */\r\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\r\n  cursor: text;\r\n}\r\n\r\n/* 图文环绕容器下的文本框不做选中 */\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\r\n  outline: 0;\r\n  padding-top: 0;\r\n}\r\n.mk-doc__grid.mk-doc__image-text img{\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n\r\n\r\n\r\n/* 避免模块下的a标签点击 */\r\n.mk-doc__grid.mk-doc__module-grid a{\r\n  pointer-events: none;\r\n}\r\n\r\n/* 给布局下的格子加内边距方便编辑 */\r\n/* .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\r\n  margin: 10px;\r\n} */\r\n.mk-doc-active-grid-mark{\r\n  text-align: center;\r\n  background-color: #eff5ff;\r\n  color: #4284ff;\r\n  left: -20px;\r\n  top: 0px;\r\n  pointer-events: all;\r\n  font-size: 14px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 999; \r\n  width: 20px;\r\n  cursor: pointer;\r\n  font-size: 12px;\r\n  padding: 5px 0;\r\n}\r\n\r\n/* 块选中 */\r\n.mk-doc__embedBlock {\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 1px;\r\n  cursor: pointer;\r\n}\r\n.mk-doc__embedBlockFocus {\r\n  outline: 2px solid rgb(60, 132, 244);\r\n}\r\n\r\n.mk-doc__embedBlock >*{\r\n  pointer-events: none;\r\n}\r\n\r\np{ margin: 0; }\r\n\r\n/* 段落的编辑样式 */\r\n.mk-doc__paragraph>br{ \r\n  display: none;\r\n}\r\n.mk-doc__paragraph::after{ \r\n  content: "↩︎";\r\n  margin-left: 8px;\r\n  color: #ccc;\r\n}\r\n.placeholder .mk-doc__paragraph::after{ \r\n  display: none;\r\n}\r\n';
+const DocEditorEditCss = '\r\n.mk-doc__img {\r\n  cursor: pointer;\r\n  z-index: 1;\r\n  position: relative;\r\n}\r\n\r\n.mk-doc__grid{\r\n  outline: 2px solid #eff5ff;\r\n  position: relative;\r\n  cursor: pointer;\r\n  white-space:initial;\r\n  word-break:initial;\r\n  min-height: 20px;\r\n}\r\n\r\n/* 文本框可编辑文字 */\r\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\r\n  cursor: text;\r\n}\r\n\r\n/* 图文环绕容器下的文本框不做选中 */\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\r\n  outline: 0;\r\n  padding-top: 0;\r\n}\r\n.mk-doc__grid.mk-doc__image-text img{\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n\r\n\r\n\r\n/* 避免模块下的a标签点击 */\r\n.mk-doc__grid.mk-doc__module-grid a{\r\n  pointer-events: none;\r\n}\r\n\r\n/* 给布局下的格子加内边距方便编辑 */\r\n/* .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\r\n  margin: 10px;\r\n} */\r\n.mk-doc-active-grid-mark{\r\n  text-align: center;\r\n  background-color: #eff5ff;\r\n  color: #4284ff;\r\n  left: -20px;\r\n  top: 0px;\r\n  pointer-events: all;\r\n  font-size: 14px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 999; \r\n  width: 20px;\r\n  cursor: pointer;\r\n  font-size: 12px;\r\n  padding: 5px 0;\r\n}\r\n\r\n/* 块选中 */\r\n.mk-doc__embedBlock {\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 1px;\r\n  cursor: pointer;\r\n}\r\n.mk-doc__embedBlockFocus {\r\n  outline: 2px solid rgb(60, 132, 244);\r\n}\r\n\r\n.mk-doc__embedBlock >*{\r\n  pointer-events: none;\r\n}\r\n\r\np{ margin: 0; }\r\n\r\n/* 段落的编辑样式 */\r\n.mk-doc__paragraph>br:not(.mk-doc__image-text>.mk-doc__text-grid .mk-doc__paragraph>br)\r\n{ \r\n  display: none;\r\n}\r\n.mk-doc__paragraph:not(.mk-doc__image-text>.mk-doc__text-grid .mk-doc__paragraph)::after,\r\n.mk-doc__listItem::after,\r\n.mk-doc__paragraph.mk-doc__ltr::after{ \r\n  content: "↩︎";\r\n  margin-left: 8px;\r\n  color: #ccc;\r\n}\r\n.placeholder .mk-doc__paragraph::after{ \r\n  display: none;\r\n}\r\n';
 module.exports = DocEditorEditCss;
 //# sourceMappingURL=doc-editor-edit.css.js.map

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

	@@ -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.mk-doc__grid{\\r\\n outline: 2px solid #eff5ff;\\r\\n position: relative;\\r\\n cursor: pointer;\\r\\n white-space:initial;\\r\\n word-break:initial;\\r\\n min-height: 20px;\\r\\n}\\r\\n\\r\\n/* 文本框可编辑文字 /\\r\\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\\r\\n cursor: text;\\r\\n}\\r\\n\\r\\n/ 图文环绕容器下的文本框不做选中 /\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\\r\\n outline: 0;\\r\\n padding-top: 0;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__image-text img{\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n}\\r\\n\\r\\n\\r\\n\\r\\n/ 避免模块下的a标签点击 /\\r\\n.mk-doc__grid.mk-doc__module-grid a{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n/ 给布局下的格子加内边距方便编辑 /\\r\\n/ .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\\r\\n margin: 10px;\\r\\n} /\\r\\n.mk-doc-active-grid-mark{\\r\\n text-align: center;\\r\\n background-color: #eff5ff;\\r\\n color: #4284ff;\\r\\n left: -20px;\\r\\n top: 0px;\\r\\n pointer-events: all;\\r\\n font-size: 14px;\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: center;\\r\\n z-index: 999; \\r\\n width: 20px;\\r\\n cursor: pointer;\\r\\n font-size: 12px;\\r\\n padding: 5px 0;\\r\\n}\\r\\n\\r\\n/ 块选中 /\\r\\n.mk-doc__embedBlock {\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 1px;\\r\\n cursor: pointer;\\r\\n}\\r\\n.mk-doc__embedBlockFocus {\\r\\n outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock >{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\np{ margin: 0; }\\r\\n\\r\\n/* 段落的编辑样式 */\\r\\n.mk-doc__paragraph>br{ \\r\\n display: none;\\r\\n}\\r\\n.mk-doc__paragraph::after{ \\r\\n content: \\\"↩︎\\\";\\r\\n margin-left: 8px;\\r\\n color: #ccc;\\r\\n}\\r\\n.placeholder .mk-doc__paragraph::after{ \\r\\n display: none;\\r\\n}\\r\\n\""],"names":[],"mappings":";AAAA,MAAe,mBAAA;;"}
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: 20px;\\r\\n}\\r\\n\\r\\n/* 文本框可编辑文字 /\\r\\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\\r\\n cursor: text;\\r\\n}\\r\\n\\r\\n/ 图文环绕容器下的文本框不做选中 /\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\\r\\n outline: 0;\\r\\n padding-top: 0;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__image-text img{\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n}\\r\\n\\r\\n\\r\\n\\r\\n/ 避免模块下的a标签点击 /\\r\\n.mk-doc__grid.mk-doc__module-grid a{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n/ 给布局下的格子加内边距方便编辑 /\\r\\n/ .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\\r\\n margin: 10px;\\r\\n} /\\r\\n.mk-doc-active-grid-mark{\\r\\n text-align: center;\\r\\n background-color: #eff5ff;\\r\\n color: #4284ff;\\r\\n left: -20px;\\r\\n top: 0px;\\r\\n pointer-events: all;\\r\\n font-size: 14px;\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: center;\\r\\n z-index: 999; \\r\\n width: 20px;\\r\\n cursor: pointer;\\r\\n font-size: 12px;\\r\\n padding: 5px 0;\\r\\n}\\r\\n\\r\\n/ 块选中 /\\r\\n.mk-doc__embedBlock {\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 1px;\\r\\n cursor: pointer;\\r\\n}\\r\\n.mk-doc__embedBlockFocus {\\r\\n outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock >{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\np{ margin: 0; }\\r\\n\\r\\n/* 段落的编辑样式 */\\r\\n.mk-doc__paragraph>br:not(.mk-doc__image-text>.mk-doc__text-grid .mk-doc__paragraph>br)\\r\\n{ \\r\\n display: none;\\r\\n}\\r\\n.mk-doc__paragraph:not(.mk-doc__image-text>.mk-doc__text-grid .mk-doc__paragraph)::after,\\r\\n.mk-doc__listItem::after,\\r\\n.mk-doc__paragraph.mk-doc__ltr::after{ \\r\\n content: \\\"↩︎\\\";\\r\\n margin-left: 8px;\\r\\n color: #ccc;\\r\\n}\\r\\n.placeholder .mk-doc__paragraph::after{ \\r\\n display: none;\\r\\n}\\r\\n\""],"names":[],"mappings":";AAAA,MAAe,mBAAA;;"}

package/dist/cjs/modules/ms/components/rich-text-editor/content.css.js CHANGED Viewed

@@ -1,4 +1,4 @@
 "use strict";
-const contentStyle = 'p{ margin: 0; }\r\n\r\n\r\nbody>p>br,body>div>br{ \r\n  display: none;\r\n}\r\nbody>p::after,body>div::after{ \r\n  content: "↩︎";\r\n  margin-left: 8px;\r\n  color: #ccc;\r\n}\r\n\r\n\r\n';
+const contentStyle = 'p{ margin: 0; }\r\n\r\n\r\n/* body>p>br,body>div>br{ \r\n  display: none;\r\n}\r\nbody>p::after,body>div::after{ \r\n  content: "↩︎";\r\n  margin-left: 8px;\r\n  color: #ccc;\r\n} */\r\n\r\nbody>div>br::marker{\r\n  content: "↩︎";\r\n  margin-left: 8px;\r\n  color: #ccc;\r\n}\r\n\r\n';
 module.exports = contentStyle;
 //# sourceMappingURL=content.css.js.map

package/dist/cjs/modules/ms/components/rich-text-editor/content.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"content.css.js","sources":["../../../../../../src/modules/ms/components/rich-text-editor/content.css?raw"],"sourcesContent":["export default \"p{ margin: 0; }\\r\\n\\r\\n\\r\\~~nbody~~>p>br,body>div>br{ \\r\\n display: none;\\r\\n}\\r\\nbody>p::after,body>div::after{ \\r\\n content: \\\"↩︎\\\";\\r\\n margin-left: 8px;\\r\\n color: #ccc;\\r\\n}\\r\\n\\r\\n\\r\\n\""],"names":[],"mappings":";AAAA,MAAe,eAAA;;"}
1	+ {"version":3,"file":"content.css.js","sources":["../../../../../../src/modules/ms/components/rich-text-editor/content.css?raw"],"sourcesContent":["export default \"p{ margin: 0; }\\r\\n\\r\\n\\r\\n/* body>p>br,body>div>br{ \\r\\n display: none;\\r\\n}\\r\\nbody>p::after,body>div::after{ \\r\\n content: \\\"↩︎\\\";\\r\\n margin-left: 8px;\\r\\n color: #ccc;\\r\\n} */\\r\\n\\r\\nbody>div>br::marker{\\r\\n content: \\\"↩︎\\\";\\r\\n margin-left: 8px;\\r\\n color: #ccc;\\r\\n}\\r\\n\\r\\n\""],"names":[],"mappings":";AAAA,MAAe,eAAA;;"}

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

@@ -73,6 +73,9 @@ class RichElementNode extends ElementNode {
       })
     };
   }
+  updateDOM(_prevNode, _dom, _config) {
+    return false;
+  }
   /**
    * 导出JSON
    * @returns
@@ -109,6 +112,15 @@ class RichElementNode extends ElementNode {
   createDOM(config) {
     return this.exportDOM().element;
   }
+  canBeEmpty() {
+    return false;
+  }
+  canInsertTextBefore() {
+    return false;
+  }
+  canInsertTextAfter() {
+    return false;
+  }
 }
 const $covertRichElementDOM = (domNode) => {
   return {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RichElementNode.js","sources":["../../../../../../../src/components/basic/doc-editor/core/nodes/RichElementNode.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, SerializedElementNode, NodeKey, Spread, EditorConfig, DOMExportOutput, DOMConversion, LexicalNode } from 'lexical'\r\nimport { $isTextNode, ElementNode } from 'lexical'\r\n\r\n/*\r\n 节点序列化 \r\n /\r\nexport type SerializedRichElementNode = Spread<{ tag: string, style?: string, class?: string \| null }, SerializedElementNode>\r\n\r\n/\r\n 格子\r\n /\r\nexport class RichElementNode extends ElementNode {\r\n\r\n __tagName: string\r\n __class?: string \| null \| undefined\r\n __style: string\r\n\r\n static getType(): string { return \"rich-element\"; }\r\n\r\n static clone(node: RichElementNode): RichElementNode {\r\n return new RichElementNode(node.__tagName, node.__class, node.__style, node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedRichElementNode): RichElementNode {\r\n return new RichElementNode(serializedNode.tag, serializedNode.class, serializedNode.style)\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div: $covertRichElementDOM,\r\n section: $covertRichElementDOM,\r\n b: () => ({\r\n conversion: convertBringAttentionToElement,\r\n priority: 4\r\n }),\r\n code: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n em: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n i: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n s: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n span: () => ({\r\n conversion: convertSpanElement,\r\n priority: 4\r\n }),\r\n strong: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sub: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sup: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n u: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n })\r\n }\r\n }\r\n\r\n /\r\n \r\n * @param tagName \r\n * @param className \r\n * @param style \r\n * @param key \r\n /\r\n constructor(tagName: string, className?: string \| null, style?: string, key?: NodeKey) {\r\n super(key)\r\n this.__tagName = tagName,\r\n this.__class = className;\r\n this.__style = style \|\| \"\";\r\n }\r\n\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedRichElementNode {\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n tag: this.__tagName,\r\n class: this.__class,\r\n style: this.__style,\r\n version: 1\r\n }\r\n }\r\n\r\n /\r\n 导出DOM\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n\r\n const element = document.createElement(this.__tagName)\r\n\r\n if (this.__class) {\r\n element.setAttribute(\"class\", this.__class)\r\n }\r\n\r\n if (this.__style) {\r\n element.setAttribute(\"style\", this.__style)\r\n }\r\n\r\n return { element }\r\n }\r\n\r\n /\r\n 创建渲染DOM\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n return this.exportDOM().element as HTMLElement;\r\n }\r\n\r\n}\r\n\r\n\r\n/\r\n 转换DOM\r\n * @param node \r\n * @returns \r\n */\r\nconst $covertRichElementDOM = (domNode: HTMLElement): DOMConversion<HTMLElement> \| null => {\r\n return {\r\n conversion: () => {\r\n return {\r\n node: new RichElementNode(domNode.tagName, domNode.getAttribute(\"class\"), domNode.getAttribute(\"style\") \|\| \"\")\r\n };\r\n },\r\n priority: 3\r\n };\r\n}\r\n\r\nconst nodeNameToTextFormat: any = {\r\n code: \"code\",\r\n em: \"italic\",\r\n i: \"italic\",\r\n s: \"strikethrough\",\r\n strong: \"bold\",\r\n sub: \"subscript\",\r\n sup: \"superscript\",\r\n u: \"underline\"\r\n};\r\n\r\nfunction convertBringAttentionToElement(domNode: HTMLElement) {\r\n const b = domNode;\r\n const hasNormalFontWeight = b.style.fontWeight === \"normal\";\r\n return {\r\n forChild: applyTextFormatFromStyle(b.style, hasNormalFontWeight ? void 0 : \"bold\", domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertTextFormatElement(domNode: HTMLElement) {\r\n const format = nodeNameToTextFormat[domNode.nodeName.toLowerCase()];\r\n if (format === void 0) {\r\n return {\r\n node: null\r\n };\r\n }\r\n return {\r\n forChild: applyTextFormatFromStyle(domNode.style, format, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertSpanElement(domNode: HTMLElement) {\r\n const span = domNode;\r\n const style = span.style;\r\n return {\r\n forChild: applyTextFormatFromStyle(style, null, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction applyTextFormatFromStyle(style: any, shouldApply: any, domNode: HTMLElement) {\r\n const fontWeight = style.fontWeight;\r\n const textDecoration = style.textDecoration.split(\" \");\r\n const hasBoldFontWeight = fontWeight === \"700\" \|\| fontWeight === \"bold\";\r\n const hasLinethroughTextDecoration = textDecoration.includes(\"line-through\");\r\n const hasItalicFontStyle = style.fontStyle === \"italic\";\r\n const hasUnderlineTextDecoration = textDecoration.includes(\"underline\");\r\n const verticalAlign = style.verticalAlign;\r\n\r\n return (lexicalNode: LexicalNode) => {\r\n\r\n if (!$isTextNode(lexicalNode)) {\r\n return lexicalNode;\r\n }\r\n\r\n if (hasBoldFontWeight && !lexicalNode.hasFormat(\"bold\")) {\r\n lexicalNode.toggleFormat(\"bold\");\r\n }\r\n if (hasLinethroughTextDecoration && !lexicalNode.hasFormat(\"strikethrough\")) {\r\n lexicalNode.toggleFormat(\"strikethrough\");\r\n }\r\n if (hasItalicFontStyle && !lexicalNode.hasFormat(\"italic\")) {\r\n lexicalNode.toggleFormat(\"italic\");\r\n }\r\n if (hasUnderlineTextDecoration && !lexicalNode.hasFormat(\"underline\")) {\r\n lexicalNode.toggleFormat(\"underline\");\r\n }\r\n if (verticalAlign === \"sub\" && !lexicalNode.hasFormat(\"subscript\")) {\r\n lexicalNode.toggleFormat(\"subscript\");\r\n }\r\n if (verticalAlign === \"super\" && !lexicalNode.hasFormat(\"superscript\")) {\r\n lexicalNode.toggleFormat(\"superscript\");\r\n }\r\n if (shouldApply && !lexicalNode.hasFormat(shouldApply)) {\r\n lexicalNode.toggleFormat(shouldApply);\r\n }\r\n\r\n // let styleStr = \"\";\r\n\r\n // if(style.color){\r\n // styleStr += `color:${style.color};`\r\n // }\r\n // if(style.fontSize){\r\n // styleStr += `font-size:${style.fontSize};`\r\n // }\r\n // if(style.fontFamily){\r\n // styleStr += `font-family:${style.fontFamily};`\r\n // }\r\n // if(style.backgroundColor){\r\n // styleStr += `background-color:${style.backgroundColor};`\r\n // }\r\n\r\n // 行内样式\r\n const inlineStyle = domNode.getAttribute(\"style\")\r\n if (inlineStyle) {\r\n lexicalNode.setStyle(inlineStyle);\r\n }\r\n\r\n return lexicalNode;\r\n };\r\n}\r\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"RichElementNode.js","sources":["../../../../../../../src/components/basic/doc-editor/core/nodes/RichElementNode.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, SerializedElementNode, NodeKey, Spread, EditorConfig, DOMExportOutput, DOMConversion, LexicalNode } from 'lexical'\r\nimport { $isTextNode, ParagraphNode,ElementNode } from 'lexical'\r\n\r\n/*\r\n 节点序列化 \r\n /\r\nexport type SerializedRichElementNode = Spread<{ tag: string, style?: string, class?: string \| null }, SerializedElementNode>\r\n/\r\n 格子\r\n /\r\nexport class RichElementNode extends ElementNode {\r\n\r\n __tagName: string\r\n __class?: string \| null \| undefined\r\n __style: string\r\n\r\n static getType(): string { return \"rich-element\"; }\r\n\r\n static clone(node: RichElementNode): RichElementNode {\r\n return new RichElementNode(node.__tagName, node.__class, node.__style, node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedRichElementNode): RichElementNode {\r\n return new RichElementNode(serializedNode.tag, serializedNode.class, serializedNode.style)\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div: $covertRichElementDOM,\r\n section: $covertRichElementDOM,\r\n b: () => ({\r\n conversion: convertBringAttentionToElement,\r\n priority: 4\r\n }),\r\n code: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n em: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n i: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n s: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n span: () => ({\r\n conversion: convertSpanElement,\r\n priority: 4\r\n }),\r\n strong: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sub: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sup: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n u: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n })\r\n }\r\n }\r\n\r\n /\r\n \r\n * @param tagName \r\n * @param className \r\n * @param style \r\n * @param key \r\n /\r\n constructor(tagName: string, className?: string \| null, style?: string, key?: NodeKey) {\r\n super(key)\r\n this.__tagName = tagName,\r\n this.__class = className;\r\n this.__style = style \|\| \"\";\r\n }\r\n\r\n\r\n updateDOM(_prevNode: unknown, _dom: HTMLElement, _config: EditorConfig): boolean {\r\n return false;\r\n }\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedRichElementNode {\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n tag: this.__tagName,\r\n class: this.__class,\r\n style: this.__style,\r\n version: 1\r\n }\r\n }\r\n\r\n /\r\n 导出DOM\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n\r\n const element = document.createElement(this.__tagName)\r\n\r\n if (this.__class) {\r\n element.setAttribute(\"class\", this.__class)\r\n }\r\n\r\n if (this.__style) {\r\n element.setAttribute(\"style\", this.__style)\r\n }\r\n\r\n return { element }\r\n }\r\n\r\n /\r\n 创建渲染DOM\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n return this.exportDOM().element as HTMLElement;\r\n }\r\n\r\n canBeEmpty() {\r\n return false;\r\n }\r\n canInsertTextBefore() {\r\n return false;\r\n }\r\n canInsertTextAfter() {\r\n return false;\r\n }\r\n\r\n}\r\n\r\n\r\n/\r\n 转换DOM\r\n * @param node \r\n * @returns \r\n */\r\nconst $covertRichElementDOM = (domNode: HTMLElement): DOMConversion<HTMLElement> \| null => {\r\n return {\r\n conversion: () => {\r\n return {\r\n node: new RichElementNode(domNode.tagName, domNode.getAttribute(\"class\"), domNode.getAttribute(\"style\") \|\| \"\")\r\n };\r\n },\r\n priority: 3\r\n };\r\n}\r\n\r\nconst nodeNameToTextFormat: any = {\r\n code: \"code\",\r\n em: \"italic\",\r\n i: \"italic\",\r\n s: \"strikethrough\",\r\n strong: \"bold\",\r\n sub: \"subscript\",\r\n sup: \"superscript\",\r\n u: \"underline\"\r\n};\r\n\r\nfunction convertBringAttentionToElement(domNode: HTMLElement) {\r\n const b = domNode;\r\n const hasNormalFontWeight = b.style.fontWeight === \"normal\";\r\n return {\r\n forChild: applyTextFormatFromStyle(b.style, hasNormalFontWeight ? void 0 : \"bold\", domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertTextFormatElement(domNode: HTMLElement) {\r\n const format = nodeNameToTextFormat[domNode.nodeName.toLowerCase()];\r\n if (format === void 0) {\r\n return {\r\n node: null\r\n };\r\n }\r\n return {\r\n forChild: applyTextFormatFromStyle(domNode.style, format, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertSpanElement(domNode: HTMLElement) {\r\n const span = domNode;\r\n const style = span.style;\r\n return {\r\n forChild: applyTextFormatFromStyle(style, null, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction applyTextFormatFromStyle(style: any, shouldApply: any, domNode: HTMLElement) {\r\n const fontWeight = style.fontWeight;\r\n const textDecoration = style.textDecoration.split(\" \");\r\n const hasBoldFontWeight = fontWeight === \"700\" \|\| fontWeight === \"bold\";\r\n const hasLinethroughTextDecoration = textDecoration.includes(\"line-through\");\r\n const hasItalicFontStyle = style.fontStyle === \"italic\";\r\n const hasUnderlineTextDecoration = textDecoration.includes(\"underline\");\r\n const verticalAlign = style.verticalAlign;\r\n\r\n return (lexicalNode: LexicalNode) => {\r\n\r\n if (!$isTextNode(lexicalNode)) {\r\n return lexicalNode;\r\n }\r\n\r\n if (hasBoldFontWeight && !lexicalNode.hasFormat(\"bold\")) {\r\n lexicalNode.toggleFormat(\"bold\");\r\n }\r\n if (hasLinethroughTextDecoration && !lexicalNode.hasFormat(\"strikethrough\")) {\r\n lexicalNode.toggleFormat(\"strikethrough\");\r\n }\r\n if (hasItalicFontStyle && !lexicalNode.hasFormat(\"italic\")) {\r\n lexicalNode.toggleFormat(\"italic\");\r\n }\r\n if (hasUnderlineTextDecoration && !lexicalNode.hasFormat(\"underline\")) {\r\n lexicalNode.toggleFormat(\"underline\");\r\n }\r\n if (verticalAlign === \"sub\" && !lexicalNode.hasFormat(\"subscript\")) {\r\n lexicalNode.toggleFormat(\"subscript\");\r\n }\r\n if (verticalAlign === \"super\" && !lexicalNode.hasFormat(\"superscript\")) {\r\n lexicalNode.toggleFormat(\"superscript\");\r\n }\r\n if (shouldApply && !lexicalNode.hasFormat(shouldApply)) {\r\n lexicalNode.toggleFormat(shouldApply);\r\n }\r\n\r\n // let styleStr = \"\";\r\n\r\n // if(style.color){\r\n // styleStr += `color:${style.color};`\r\n // }\r\n // if(style.fontSize){\r\n // styleStr += `font-size:${style.fontSize};`\r\n // }\r\n // if(style.fontFamily){\r\n // styleStr += `font-family:${style.fontFamily};`\r\n // }\r\n // if(style.backgroundColor){\r\n // styleStr += `background-color:${style.backgroundColor};`\r\n // }\r\n\r\n // 行内样式\r\n const inlineStyle = domNode.getAttribute(\"style\")\r\n if (inlineStyle) {\r\n lexicalNode.setStyle(inlineStyle);\r\n }\r\n\r\n return lexicalNode;\r\n };\r\n}\r\n"],"names":[],"mappings":"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"}

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

@@ -2,8 +2,8 @@ import { defineComponent, ref, computed, watch, openBlock, createElementBlock, n
 import { useCanShowPlaceholder } from "../../composables/useCanShowPlaceholder.js";
 import "@lexical/overflow";
 import "@lexical/text";
-import "@lexical/utils";
-import { $selectAll, $getSelection } from "lexical";
+import { mergeRegister } from "@lexical/utils";
+import { $selectAll, $getSelection, KEY_BACKSPACE_COMMAND, $isRangeSelection, ElementNode } from "lexical";
 import "tiny-invariant";
 import { useMounted } from "../../composables/useMounted.js";
 import "@lexical/history";
@@ -54,11 +54,27 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
     };
     useMounted(() => {
-      return editor.registerUpdateListener(({ editorState }) => {
-        editorState.read(() => {
-          htmlContent.value = $generateHtmlFromNodes(editor);
-        });
-      });
+      return mergeRegister(
+        editor.registerUpdateListener(({ editorState }) => {
+          editorState.read(() => {
+            htmlContent.value = $generateHtmlFromNodes(editor);
+          });
+        }),
+        // 删除空容器
+        editor.registerCommand(KEY_BACKSPACE_COMMAND, () => {
+          const selection = $getSelection();
+          if ($isRangeSelection(selection)) {
+            var node = selection.anchor.getNode();
+            if (node instanceof ElementNode) {
+              if (node.isEmpty()) {
+                editor.update(() => node.remove());
+                return true;
+              }
+            }
+          }
+          return false;
+        }, 1)
+      );
     });
     watch(() => props.content, setHtml, { immediate: true });
     watch(htmlContent, (value) => emit("change", value));

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../../src/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { ref,defineProps,computed,defineEmits,watch } from \"vue\"\r\nimport { useCanShowPlaceholder, useLexicalComposer, useRichTextSetup,useMounted } from '../../composables'\r\nimport { $getSelection ,$selectAll~~,$createParagraphNode~~ } from 'lexical'\r\nimport { ~~$insertNodeToNearestRoot~~ } from '@lexical/utils'\r\nimport { $generateHtmlFromNodes,$generateNodesFromDOM } from '@lexical/html'\r\nimport ContentEditable from \"./ContentEditable.vue\"\r\nimport DecoratedTeleports from \"./DecoratedTeleports\"\r\n\r\n// 事件\r\nconst emit = defineEmits([\"change\"]);\r\n\r\n// 参数\r\nconst props = defineProps({\r\n content:{ type:String,default:`` },\r\n placeholder:{ type:String,default:`` }\r\n})\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nconst canShowPlaceholder = useCanShowPlaceholder(editor)\r\n\r\nconst parser = new DOMParser();\r\n\r\n// html 内容\r\nconst htmlContent = ref(\"\");\r\n\r\n// 空内容\r\nconst contentIsEmpty = computed(()=>htmlContent.value == `<p class=\"mk-doc__paragraph\"><br></p>` \|\| !htmlContent.value);\r\n\r\n// 设置 HTML\r\nconst setHtml = (html : any)=>{\r\n\r\n // 内容不同则重置 \r\n if(htmlContent.value != html){\r\n\r\n let nodes : Array<any> = [];\r\n\r\n htmlContent.value = html;\r\n\r\n editor.update(()=>{\r\n\r\n if(html.trim()){\r\n // Once you have the DOM instance it's easy to generate LexicalNodes.\r\n nodes = $generateNodesFromDOM(editor,parser.parseFromString(html.trim(),\"text/html\"));\r\n // console.log($generateNodesFromDOM,parser.parseFromString(html.trim(),\"text/html\"));\r\n }\r\n\r\n // 设置权限替换\r\n $selectAll();\r\n $getSelection()?.insertText(\"\")\r\n if(nodes.length > 0){\r\n $getSelection()?.insertNodes(nodes); \r\n }\r\n })\r\n }\r\n}\r\n\r\nuseMounted(()=>{\r\n return editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => {\r\n htmlContent.value = $generateHtmlFromNodes(editor);\r\n })\r\n })\r\n})\r\n\r\n\r\n// 初始化\r\nwatch(()=>props.content,setHtml,{ immediate:true });\r\n\r\n// 监听内容变化\r\nwatch(htmlContent,(value:any)=>emit('change',value));\r\n\r\n// 使用富文本\r\nuseRichTextSetup(editor)\r\n\r\n</script>\r\n\r\n<template>\r\n <div class=\"mk-doc-editor__stage__editable\" :class=\"{placeholder:canShowPlaceholder && contentIsEmpty}\">\r\n <ContentEditable />\r\n <template v-if=\"canShowPlaceholder && contentIsEmpty\">\r\n <div class=\"mk-doc-editor__stage__placeholder mk-doc__paragraph\" style=\"user-select: text;white-space: pre-wrap;word-break: break-word;\">\r\n {{placeholder}}\r\n </div>\r\n </template>\r\n <DecoratedTeleports />\r\n </div>\r\n\r\n</template>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,UAAM,OAAO;AAGb,UAAM,QAAQ;AAKd,UAAM,SAAS;AAET,UAAA,qBAAqB,sBAAsB,MAAM;AAEjD,UAAA,SAAS,IAAI;AAGb,UAAA,cAAc,IAAI,EAAE;AAGpB,UAAA,iBAAiB,SAAS,MAAI,YAAY,SAAS,2CAA2C,CAAC,YAAY,KAAK;AAGhH,UAAA,UAAU,CAAC,SAAa;AAGvB,UAAA,YAAY,SAAS,MAAK;AAE3B,YAAI,QAAqB,CAAA;AAEzB,oBAAY,QAAQ;AAEpB,eAAO,OAAO,MAAI;;AAEb,cAAA,KAAK,QAAO;AAEL,oBAAA,sBAAsB,QAAO,OAAO,gBAAgB,KAAK,KAAK,GAAE,WAAW,CAAC;AAAA,UAEtF;AAGW;AACG,8BAAA,MAAA,mBAAG,WAAW;AACzB,cAAA,MAAM,SAAS,GAAE;AACJ,gCAAA,MAAA,mBAAG,YAAY;AAAA,UAC/B;AAAA,QAAA,CACD;AAAA,MACH;AAAA,IAAA;AAGJ,eAAW,MAAI;~~AACb~~,~~aAAO~~,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;~~AACxD~~,~~oBAAY~~,KAAK,MAAM;AACT,~~sBAAA~~,QAAQ,uBAAuB,MAAM;AAAA,~~QAAA~~,CAClD;AAAA,~~MAAA~~,CACF;AAAA,~~IAAA~~,~~CACF~~;AAID,UAAM,MAAI,MAAM,SAAQ,SAAQ,EAAE,WAAU,MAAM;AAGlD,UAAM,aAAY,CAAC,UAAY,KAAK,UAAS,KAAK,CAAC;AAGnD,qBAAiB,MAAM;;;;;;;;;;;;"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../../src/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { ref,defineProps,computed,defineEmits,watch } from \"vue\"\r\nimport { useCanShowPlaceholder, useLexicalComposer, useRichTextSetup,useMounted } from '../../composables'\r\nimport { $getSelection ,$selectAll,KEY_BACKSPACE_COMMAND, ElementNode, $isRangeSelection } from 'lexical'\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { $generateHtmlFromNodes,$generateNodesFromDOM } from '@lexical/html'\r\nimport ContentEditable from \"./ContentEditable.vue\"\r\nimport DecoratedTeleports from \"./DecoratedTeleports\"\r\n\r\n// 事件\r\nconst emit = defineEmits([\"change\"]);\r\n\r\n// 参数\r\nconst props = defineProps({\r\n content:{ type:String,default:`` },\r\n placeholder:{ type:String,default:`` }\r\n})\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nconst canShowPlaceholder = useCanShowPlaceholder(editor)\r\n\r\nconst parser = new DOMParser();\r\n\r\n// html 内容\r\nconst htmlContent = ref(\"\");\r\n\r\n// 空内容\r\nconst contentIsEmpty = computed(()=>htmlContent.value == `<p class=\"mk-doc__paragraph\"><br></p>` \|\| !htmlContent.value);\r\n\r\n// 设置 HTML\r\nconst setHtml = (html : any)=>{\r\n\r\n // 内容不同则重置 \r\n if(htmlContent.value != html){\r\n\r\n let nodes : Array<any> = [];\r\n\r\n htmlContent.value = html;\r\n\r\n editor.update(()=>{\r\n\r\n if(html.trim()){\r\n // Once you have the DOM instance it's easy to generate LexicalNodes.\r\n nodes = $generateNodesFromDOM(editor,parser.parseFromString(html.trim(),\"text/html\"));\r\n // console.log($generateNodesFromDOM,parser.parseFromString(html.trim(),\"text/html\"));\r\n }\r\n\r\n // 设置权限替换\r\n $selectAll();\r\n $getSelection()?.insertText(\"\")\r\n if(nodes.length > 0){\r\n $getSelection()?.insertNodes(nodes); \r\n }\r\n })\r\n }\r\n}\r\n\r\nuseMounted(()=>{\r\n return mergeRegister(\r\n editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => {\r\n htmlContent.value = $generateHtmlFromNodes(editor);\r\n })\r\n }),\r\n // 删除空容器\r\n editor.registerCommand(KEY_BACKSPACE_COMMAND,()=>{\r\n\r\n const selection = $getSelection()\r\n\r\n if( $isRangeSelection(selection) ){ \r\n\r\n var node = selection.anchor.getNode()\r\n\r\n if(node instanceof ElementNode){\r\n if(node.isEmpty()){\r\n editor.update(()=> node.remove())\r\n return true;\r\n }\r\n }\r\n }\r\n return false;\r\n },1)\r\n )\r\n})\r\n\r\n\r\n// 初始化\r\nwatch(()=>props.content,setHtml,{ immediate:true });\r\n\r\n// 监听内容变化\r\nwatch(htmlContent,(value:any)=>emit('change',value));\r\n\r\n// 使用富文本\r\nuseRichTextSetup(editor)\r\n\r\n</script>\r\n\r\n<template>\r\n <div class=\"mk-doc-editor__stage__editable\" :class=\"{placeholder:canShowPlaceholder && contentIsEmpty}\">\r\n <ContentEditable />\r\n <template v-if=\"canShowPlaceholder && contentIsEmpty\">\r\n <div class=\"mk-doc-editor__stage__placeholder mk-doc__paragraph\" style=\"user-select: text;white-space: pre-wrap;word-break: break-word;\">\r\n {{placeholder}}\r\n </div>\r\n </template>\r\n <DecoratedTeleports />\r\n </div>\r\n\r\n</template>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,UAAM,OAAO;AAGb,UAAM,QAAQ;AAKd,UAAM,SAAS;AAET,UAAA,qBAAqB,sBAAsB,MAAM;AAEjD,UAAA,SAAS,IAAI;AAGb,UAAA,cAAc,IAAI,EAAE;AAGpB,UAAA,iBAAiB,SAAS,MAAI,YAAY,SAAS,2CAA2C,CAAC,YAAY,KAAK;AAGhH,UAAA,UAAU,CAAC,SAAa;AAGvB,UAAA,YAAY,SAAS,MAAK;AAE3B,YAAI,QAAqB,CAAA;AAEzB,oBAAY,QAAQ;AAEpB,eAAO,OAAO,MAAI;;AAEb,cAAA,KAAK,QAAO;AAEL,oBAAA,sBAAsB,QAAO,OAAO,gBAAgB,KAAK,KAAK,GAAE,WAAW,CAAC;AAAA,UAEtF;AAGW;AACG,8BAAA,MAAA,mBAAG,WAAW;AACzB,cAAA,MAAM,SAAS,GAAE;AACJ,gCAAA,MAAA,mBAAG,YAAY;AAAA,UAC/B;AAAA,QAAA,CACD;AAAA,MACH;AAAA,IAAA;AAGJ,eAAW,MAAI;AACN,aAAA;AAAA,QACL,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACjD,sBAAY,KAAK,MAAM;AACT,wBAAA,QAAQ,uBAAuB,MAAM;AAAA,UAAA,CAClD;AAAA,QAAA,CACF;AAAA;AAAA,QAED,OAAO,gBAAgB,uBAAsB,MAAI;AAE/C,gBAAM,YAAY;AAEd,cAAA,kBAAkB,SAAS,GAAG;AAE5B,gBAAA,OAAO,UAAU,OAAO,QAAQ;AAEpC,gBAAG,gBAAgB,aAAY;AAC1B,kBAAA,KAAK,WAAU;AAChB,uBAAO,OAAO,MAAK,KAAK,OAAQ,CAAA;AACzB,uBAAA;AAAA,cACT;AAAA,YACF;AAAA,UACF;AACO,iBAAA;AAAA,WACP,CAAC;AAAA,MAAA;AAAA,IACL,CACD;AAID,UAAM,MAAI,MAAM,SAAQ,SAAQ,EAAE,WAAU,MAAM;AAGlD,UAAM,aAAY,CAAC,UAAY,KAAK,UAAS,KAAK,CAAC;AAGnD,qBAAiB,MAAM;;;;;;;;;;;;"}