@maketribe/ms-app 3.2.22 → 3.2.23

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

@@ -5,124 +5,100 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const lexical = require("lexical");
 const vue = require("vue");
-require("@lexical/text");
-require("@lexical/utils");
-require("@lexical/overflow");
-require("tiny-invariant");
-require("@lexical/history");
-require("@lexical/list");
-require("@lexical/dragon");
-require("@lexical/plain-text");
-require("@lexical/rich-text");
-require("@lexical/yjs");
-require("yjs");
-require("../../lexical-vue/components/LexicalDecoratedTeleports.js");
-require("@lexical/html");
-require("@lexical/link");
-require("@lexical/mark");
-require("@lexical/table");
-require("@lexical/hashtag");
-const LexicalDecoratorBlockNode = require("../../lexical-vue/components/LexicalDecoratorBlockNode.js");
-require("@lexical/markdown");
-require("../../lexical-vue/composables/useCollaborationContext.js");
-require("../../lexical-vue/components/LexicalMenu/shared.js");
-require("../../lexical-vue/components/LexicalAutoEmbedPlugin/shared.js");
-require("../../lexical-vue/components/LexicalTypeaheadMenuPlugin/shared.js");
 const DocHtmlBlockComponent = require("./DocHtmlBlockComponent.js");
-lexical.createCommand("HTML_BLOCK_CHANGE");
-lexical.createCommand("REMOVE_HTML_BLOCK_COMMAND");
+const HTML_BLOCK_CHANGE = lexical.createCommand("HTML_BLOCK_CHANGE");
+const REMOVE_HTML_BLOCK_COMMAND = lexical.createCommand("REMOVE_HTML_BLOCK_COMMAND");
 const INSERT_HTML_BLOCK_COMMAND = lexical.createCommand("INSERT_HTML_BLOCK_COMMAND");
-class HtmlBlockNode extends LexicalDecoratorBlockNode.DecoratorBlockNode {
-  constructor(attrs, format, key) {
-    super(format, key);
-    __publicField(this, "__attrs");
-    this.__attrs = attrs;
+const ClassMake = "mk-doc-html-block";
+class HtmlBlockNode extends lexical.DecoratorNode {
+  constructor(html, key) {
+    super(key);
+    __publicField(this, "__html");
+    __publicField(this, "__indent");
+    this.__html = html;
+    this.__indent = 0;
   }
   static getType() {
     return "HtmlBlock";
   }
   static clone(node) {
-    return new HtmlBlockNode(node.__attrs, node.__format, node.__key);
+    return new HtmlBlockNode(node.__html, node.__key);
   }
   static importJSON(serializedNode) {
-    const node = $createHtmlBlockNode(serializedNode.attrs);
-    node.setFormat(serializedNode.format);
+    const node = $createHtmlBlockNode(serializedNode.html);
     return node;
   }
+  setHtml(html) {
+    this.getWritable().__html = html;
+  }
   exportJSON() {
     return {
       ...super.exportJSON(),
       type: this.getType(),
       version: 1,
-      attrs: this.__attrs
+      indent: this.__indent,
+      html: this.__html
     };
   }
   exportDOM() {
     const element = document.createElement("div");
-    element.innerHTML = this.__attrs.content;
-    if (this.__attrs.js) {
-      const script = document.createElement("script");
-      script.innerHTML = this.__attrs.js;
-      element.append(script);
-    }
-    if (this.__attrs.css) {
-      const style = document.createElement("style");
-      style.innerHTML = this.__attrs.css;
-      element.append(style);
-    }
-    element.setAttribute("class", "mk-doc-html-block");
+    element.innerHTML = this.__html;
+    element.setAttribute("class", ClassMake);
     return { element };
   }
   static importDOM() {
     return {
-      img: (dn) => {
+      div: (dn) => {
         return {
-          conversion: (domNode) => {
-            let css = "";
-            let js = "";
-            domNode.childNodes.forEach((node) => {
-              if (node.nodeName.toLowerCase() == "style") {
-                css += "\r\n" + node.textContent;
-                node.remove();
-              } else if (node.nodeName.toLowerCase() == "script") {
-                js += "\r\n" + node.textContent;
-                node.remove();
-              }
-            });
-            return domNode.classList.contains("mk-doc-html-block") ? {
-              node: $createHtmlBlockNode({
-                content: domNode.innerHTML,
-                css,
-                js
-              })
-            } : null;
-          },
-          priority: 0
+          conversion: dn.classList.contains(ClassMake) ? (domNode) => {
+            return {
+              node: $createHtmlBlockNode(domNode.innerHTML)
+            };
+          } : null,
+          priority: 10
         };
       }
     };
   }
+  createDOM() {
+    return document.createElement("div");
+  }
   updateDOM() {
     return false;
   }
   getTextContent(_includeInert, _includeDirectionless) {
-    return this.__attrs.content;
+    const element = document.createElement("div");
+    element.innerHTML = this.__html;
+    return element.textContent;
   }
   decorate(_editor, config) {
     const embedBlockTheme = config.theme.embedBlock || {};
     return vue.h(DocHtmlBlockComponent, {
       baseClass: embedBlockTheme.base || "",
       focusClass: embedBlockTheme.focus || "",
-      format: this.__format,
+      class: ClassMake,
       nodeKey: this.getKey(),
-      attrs: this.__attrs
+      html: this.__html
     });
   }
+  setIndent(indentLevel) {
+    const self = this.getWritable();
+    self.__indent = indentLevel;
+    return this;
+  }
+  getIndent() {
+    return this.getLatest().__indent;
+  }
+  isInline() {
+    return false;
+  }
 }
-function $createHtmlBlockNode(attrs) {
-  return new HtmlBlockNode(attrs);
+function $createHtmlBlockNode(html) {
+  return new HtmlBlockNode(html);
 }
 exports.$createHtmlBlockNode = $createHtmlBlockNode;
+exports.HTML_BLOCK_CHANGE = HTML_BLOCK_CHANGE;
 exports.HtmlBlockNode = HtmlBlockNode;
 exports.INSERT_HTML_BLOCK_COMMAND = INSERT_HTML_BLOCK_COMMAND;
+exports.REMOVE_HTML_BLOCK_COMMAND = REMOVE_HTML_BLOCK_COMMAND;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/HtmlBlockPlugin/index.ts"],"sourcesContent":["\r\nimport type {\r\n  DOMConversionMap,\r\n  DOMConversionOutput,\r\n  DOMExportOutput,\r\n  EditorConfig,\r\n  ElementFormatType,\r\n  LexicalEditor,\r\n  LexicalNode,\r\n  NodeKey,\r\n  Spread,\r\n  LexicalCommand\r\n} from 'lexical'\r\nimport { createCommand } from 'lexical'\r\nimport { DecoratorBlockNode,type SerializedDecoratorBlockNode  } from '../../lexical-vue'\r\nimport { h ,type Component} from 'vue'\r\nimport DocHtmlBlockComponent from \"./DocHtmlBlockComponent\"\r\n\r\n/**\r\n * html块类型\r\n */\r\nexport type HtmlBlockAttrs = { content:string, css?:string, js?:string };\r\n\r\n/**\r\n * html块改变\r\n */\r\nexport const HTML_BLOCK_CHANGE: LexicalCommand<HtmlBlockAttrs> = createCommand('HTML_BLOCK_CHANGE')\r\n\r\n/**\r\n * 删除html块\r\n */\r\nexport const REMOVE_HTML_BLOCK_COMMAND: LexicalCommand<undefined|null> = createCommand('REMOVE_HTML_BLOCK_COMMAND')\r\n\r\n\r\n/**\r\n * 插入html块指令\r\n */\r\nexport const INSERT_HTML_BLOCK_COMMAND: LexicalCommand<HtmlBlockAttrs> = createCommand('INSERT_HTML_BLOCK_COMMAND')\r\n\r\n/**\r\n * 图片节点序列化\r\n */\r\nexport type SerializedHtmlBlockNode = Spread<\r\n  {\r\n    attrs: HtmlBlockAttrs\r\n  },\r\n  SerializedDecoratorBlockNode\r\n>\r\n\r\n/**\r\n * 定义图片节点\r\n */\r\nexport class HtmlBlockNode extends DecoratorBlockNode {\r\n  __attrs: HtmlBlockAttrs\r\n\r\n  static getType(): string {\r\n    return 'HtmlBlock'\r\n  }\r\n\r\n  static clone(node: HtmlBlockNode): HtmlBlockNode {\r\n    return new HtmlBlockNode(node.__attrs, node.__format, node.__key)\r\n  }\r\n\r\n  static importJSON(serializedNode: SerializedHtmlBlockNode): HtmlBlockNode {\r\n    const node = $createHtmlBlockNode(serializedNode.attrs)\r\n    node.setFormat(serializedNode.format)\r\n    return node\r\n  }\r\n\r\n  constructor(attrs: HtmlBlockAttrs, format?: ElementFormatType, key?: NodeKey) {\r\n    super(format, key)\r\n    this.__attrs = attrs\r\n  }\r\n\r\n  exportJSON(): SerializedHtmlBlockNode {\r\n\r\n    return {\r\n      ...super.exportJSON(),\r\n      type: this.getType(),\r\n      version: 1,\r\n      attrs: this.__attrs,\r\n    }\r\n  }\r\n\r\n  exportDOM(): DOMExportOutput {\r\n\r\n    const element = document.createElement('div')  \r\n\r\n    // 内容\r\n    element.innerHTML = this.__attrs.content;\r\n\r\n    if(this.__attrs.js){\r\n      const script = document.createElement('script') \r\n      script.innerHTML = this.__attrs.js;\r\n      element.append(script);\r\n    }\r\n\r\n    if(this.__attrs.css){\r\n      const style = document.createElement('style')\r\n      style.innerHTML = this.__attrs.css;\r\n      element.append(style);\r\n    }\r\n\r\n\r\n    element.setAttribute(\"class\",\"mk-doc-html-block\")\r\n    \r\n    return { element }\r\n  }\r\n\r\n  static importDOM(): DOMConversionMap | null {\r\n    return {\r\n      img: (dn: HTMLElement) => {\r\n        return  {\r\n          conversion: (domNode: HTMLElement) => {\r\n\r\n            let css = \"\";\r\n            let js = \"\";\r\n\r\n            domNode.childNodes.forEach((node:ChildNode)=>{\r\n\r\n              if(node.nodeName.toLowerCase() == \"style\"){\r\n                css+=\"\\r\\n\"+node.textContent;\r\n                node.remove()\r\n              }\r\n              else if(node.nodeName.toLowerCase() == \"script\"){\r\n                js+=\"\\r\\n\"+node.textContent;\r\n                node.remove()\r\n              }\r\n            });\r\n        \r\n            return domNode.classList.contains(\"mk-doc-html-block\") ?  { \r\n              node:$createHtmlBlockNode({\r\n                content:domNode.innerHTML, css, js\r\n              } as HtmlBlockAttrs) \r\n            } : null;\r\n          },\r\n          priority: 0\r\n        }\r\n      },\r\n    }\r\n  }\r\n\r\n  updateDOM(): false {\r\n    return false\r\n  }\r\n\r\n  getTextContent(\r\n    _includeInert?: boolean | undefined,\r\n    _includeDirectionless?: false | undefined,\r\n  ): string {\r\n    return this.__attrs.content\r\n  }\r\n\r\n  decorate(_editor: LexicalEditor, config: EditorConfig): Component {\r\n    const embedBlockTheme = config.theme.embedBlock || {}\r\n    return h(DocHtmlBlockComponent, {\r\n      baseClass: embedBlockTheme.base || '',\r\n      focusClass: embedBlockTheme.focus || '',\r\n      format: this.__format,\r\n      nodeKey: this.getKey(),\r\n      attrs: this.__attrs\r\n    })\r\n  }\r\n}\r\n\r\n/**\r\n * 创建图片节点\r\n * @param src \r\n * @returns \r\n */\r\nexport function $createHtmlBlockNode(attrs: HtmlBlockAttrs): HtmlBlockNode {\r\n  return new HtmlBlockNode(attrs)\r\n}\r\n\r\n/**\r\n * 判断是否是图片节点\r\n * @param node \r\n * @returns \r\n */\r\nexport function $isHtmlBlockNode(\r\n  node: HtmlBlockNode | LexicalNode | null | undefined,\r\n): node is HtmlBlockNode {\r\n  return node instanceof HtmlBlockNode\r\n}\r\n"],"names":["createCommand","DecoratorBlockNode","h"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BiEA,sBAAc,mBAAmB;AAKzBA,sBAAc,2BAA2B;AAMrG,MAAA,4BAA4DA,sBAAc,2BAA2B;AAe3G,MAAM,sBAAsBC,0BAAAA,mBAAmB;AAAA,EAiBpD,YAAY,OAAuB,QAA4B,KAAe;AAC5E,UAAM,QAAQ,GAAG;AAjBnB;AAkBE,SAAK,UAAU;AAAA,EACjB;AAAA,EAjBA,OAAO,UAAkB;AAChB,WAAA;AAAA,EACT;AAAA,EAEA,OAAO,MAAM,MAAoC;AAC/C,WAAO,IAAI,cAAc,KAAK,SAAS,KAAK,UAAU,KAAK,KAAK;AAAA,EAClE;AAAA,EAEA,OAAO,WAAW,gBAAwD;AAClE,UAAA,OAAO,qBAAqB,eAAe,KAAK;AACjD,SAAA,UAAU,eAAe,MAAM;AAC7B,WAAA;AAAA,EACT;AAAA,EAOA,aAAsC;AAE7B,WAAA;AAAA,MACL,GAAG,MAAM,WAAW;AAAA,MACpB,MAAM,KAAK,QAAQ;AAAA,MACnB,SAAS;AAAA,MACT,OAAO,KAAK;AAAA,IAAA;AAAA,EAEhB;AAAA,EAEA,YAA6B;AAErB,UAAA,UAAU,SAAS,cAAc,KAAK;AAGpC,YAAA,YAAY,KAAK,QAAQ;AAE9B,QAAA,KAAK,QAAQ,IAAG;AACX,YAAA,SAAS,SAAS,cAAc,QAAQ;AACvC,aAAA,YAAY,KAAK,QAAQ;AAChC,cAAQ,OAAO,MAAM;AAAA,IACvB;AAEG,QAAA,KAAK,QAAQ,KAAI;AACZ,YAAA,QAAQ,SAAS,cAAc,OAAO;AACtC,YAAA,YAAY,KAAK,QAAQ;AAC/B,cAAQ,OAAO,KAAK;AAAA,IACtB;AAGQ,YAAA,aAAa,SAAQ,mBAAmB;AAEhD,WAAO,EAAE,QAAQ;AAAA,EACnB;AAAA,EAEA,OAAO,YAAqC;AACnC,WAAA;AAAA,MACL,KAAK,CAAC,OAAoB;AAChB,eAAA;AAAA,UACN,YAAY,CAAC,YAAyB;AAEpC,gBAAI,MAAM;AACV,gBAAI,KAAK;AAED,oBAAA,WAAW,QAAQ,CAAC,SAAiB;AAE3C,kBAAG,KAAK,SAAS,YAAY,KAAK,SAAQ;AACxC,uBAAK,SAAO,KAAK;AACjB,qBAAK,OAAO;AAAA,cAEN,WAAA,KAAK,SAAS,YAAA,KAAiB,UAAS;AAC9C,sBAAI,SAAO,KAAK;AAChB,qBAAK,OAAO;AAAA,cACd;AAAA,YAAA,CACD;AAED,mBAAO,QAAQ,UAAU,SAAS,mBAAmB,IAAK;AAAA,cACxD,MAAK,qBAAqB;AAAA,gBACxB,SAAQ,QAAQ;AAAA,gBAAW;AAAA,gBAAK;AAAA,cAAA,CACf;AAAA,YACjB,IAAA;AAAA,UACN;AAAA,UACA,UAAU;AAAA,QAAA;AAAA,MAEd;AAAA,IAAA;AAAA,EAEJ;AAAA,EAEA,YAAmB;AACV,WAAA;AAAA,EACT;AAAA,EAEA,eACE,eACA,uBACQ;AACR,WAAO,KAAK,QAAQ;AAAA,EACtB;AAAA,EAEA,SAAS,SAAwB,QAAiC;AAChE,UAAM,kBAAkB,OAAO,MAAM,cAAc,CAAA;AACnD,WAAOC,IAAAA,EAAE,uBAAuB;AAAA,MAC9B,WAAW,gBAAgB,QAAQ;AAAA,MACnC,YAAY,gBAAgB,SAAS;AAAA,MACrC,QAAQ,KAAK;AAAA,MACb,SAAS,KAAK,OAAO;AAAA,MACrB,OAAO,KAAK;AAAA,IAAA,CACb;AAAA,EACH;AACF;AAOO,SAAS,qBAAqB,OAAsC;AAClE,SAAA,IAAI,cAAc,KAAK;AAChC;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/HtmlBlockPlugin/index.ts"],"sourcesContent":["\r\nimport type {\r\n  DOMConversionMap,\r\n  DOMExportOutput,\r\n  EditorConfig,\r\n  LexicalEditor,\r\n  LexicalNode,\r\n  NodeKey,\r\n  Spread,\r\n  LexicalCommand,\r\n  SerializedLexicalNode\r\n} from 'lexical'\r\nimport { createCommand,DecoratorNode } from 'lexical'\r\nimport { h ,type Component } from 'vue'\r\nimport DocHtmlBlockComponent from \"./DocHtmlBlockComponent\"\r\n\r\n\r\n/**\r\n * html块改变\r\n */\r\nexport const HTML_BLOCK_CHANGE: LexicalCommand<string> = createCommand('HTML_BLOCK_CHANGE')\r\n\r\n/**\r\n * 删除html块\r\n */\r\nexport const REMOVE_HTML_BLOCK_COMMAND: LexicalCommand<undefined|null> = createCommand('REMOVE_HTML_BLOCK_COMMAND')\r\n\r\n/**\r\n * 插入html块指令\r\n */\r\nexport const INSERT_HTML_BLOCK_COMMAND: LexicalCommand<string> = createCommand('INSERT_HTML_BLOCK_COMMAND')\r\n\r\n/**\r\n * 图片节点序列化\r\n */\r\nexport type SerializedHtmlBlockNode = Spread<\r\n  {\r\n    html: string,\r\n    indent:number\r\n  },\r\n  SerializedLexicalNode\r\n>\r\n\r\n// 类标识\r\nconst ClassMake = \"mk-doc-html-block\";\r\n\r\n/**\r\n * 定义html节点\r\n */\r\nexport class HtmlBlockNode extends DecoratorNode<Component> {\r\n  __html: string\r\n  __indent:number\r\n\r\n  static getType(): string {\r\n    return 'HtmlBlock'\r\n  }\r\n\r\n  static clone(node: HtmlBlockNode): HtmlBlockNode {\r\n    return new HtmlBlockNode(node.__html,node.__key)\r\n  }\r\n\r\n  static importJSON(serializedNode: SerializedHtmlBlockNode): HtmlBlockNode {\r\n    const node = $createHtmlBlockNode(serializedNode.html)\r\n    return node\r\n  }\r\n\r\n  constructor(html: string,  key?: NodeKey) {\r\n    super(key)\r\n    this.__html = html\r\n    this.__indent = 0;\r\n  }\r\n\r\n  setHtml(html:string){\r\n    this.getWritable().__html = html\r\n  }\r\n\r\n  exportJSON(): SerializedHtmlBlockNode {\r\n\r\n    return {\r\n      ...super.exportJSON(),\r\n      type: this.getType(),\r\n      version: 1,\r\n      indent:this.__indent,\r\n      html: this.__html\r\n    }\r\n  }\r\n\r\n  exportDOM(): DOMExportOutput {\r\n\r\n    const element = document.createElement('div')  \r\n\r\n    // 内容\r\n    element.innerHTML = this.__html;\r\n\r\n    element.setAttribute(\"class\",ClassMake)\r\n    \r\n    return { element }\r\n  }\r\n\r\n  static importDOM(): DOMConversionMap | null {\r\n    return {\r\n      div:  (dn: HTMLElement):any => {\r\n        return  {\r\n          conversion: dn.classList.contains(ClassMake) ? (domNode: HTMLElement) => {\r\n            return { \r\n              node:$createHtmlBlockNode(domNode.innerHTML as string) \r\n            };\r\n          } : null,\r\n          priority: 10\r\n        }\r\n      },\r\n    }\r\n  }\r\n  createDOM() {\r\n    return document.createElement('div')\r\n  }\r\n  updateDOM(): false {\r\n    return false\r\n  }\r\n\r\n  getTextContent(\r\n    _includeInert?: boolean | undefined,\r\n    _includeDirectionless?: false | undefined,\r\n  ): string {\r\n\r\n    const element = document.createElement('div')  \r\n    element.innerHTML = this.__html;\r\n    return element.textContent as string;\r\n  }\r\n\r\n  decorate(_editor: LexicalEditor, config: EditorConfig): Component {\r\n    const embedBlockTheme = config.theme.embedBlock || {}\r\n    return h(DocHtmlBlockComponent, {\r\n      baseClass: embedBlockTheme.base || '',\r\n      focusClass: embedBlockTheme.focus || '',\r\n      class:ClassMake,\r\n      nodeKey: this.getKey(),\r\n      html: this.__html\r\n    })\r\n  }\r\n  setIndent(indentLevel:number) {\r\n    const self = this.getWritable();\r\n    self.__indent = indentLevel;\r\n    return this;\r\n  }\r\n  getIndent() {\r\n    return this.getLatest().__indent;\r\n  }\r\n  isInline() {\r\n    return false;\r\n  }\r\n}\r\n\r\n/**\r\n * 创建图片节点\r\n * @param src \r\n * @returns \r\n */\r\nexport function $createHtmlBlockNode(html: string): HtmlBlockNode {\r\n  return new HtmlBlockNode(html)\r\n}\r\n\r\n/**\r\n * 判断是否是图片节点\r\n * @param node \r\n * @returns \r\n */\r\nexport function $isHtmlBlockNode(\r\n  node: HtmlBlockNode | LexicalNode | null | undefined,\r\n): node is HtmlBlockNode {\r\n  return node instanceof HtmlBlockNode\r\n}\r\n"],"names":["createCommand","DecoratorNode","h"],"mappings":";;;;;;;;AAoBa,MAAA,oBAA4CA,sBAAc,mBAAmB;AAK7E,MAAA,4BAA4DA,sBAAc,2BAA2B;AAKrG,MAAA,4BAAoDA,sBAAc,2BAA2B;AAc1G,MAAM,YAAY;AAKX,MAAM,sBAAsBC,QAAAA,cAAyB;AAAA,EAiB1D,YAAY,MAAe,KAAe;AACxC,UAAM,GAAG;AAjBX;AACA;AAiBE,SAAK,SAAS;AACd,SAAK,WAAW;AAAA,EAClB;AAAA,EAjBA,OAAO,UAAkB;AAChB,WAAA;AAAA,EACT;AAAA,EAEA,OAAO,MAAM,MAAoC;AAC/C,WAAO,IAAI,cAAc,KAAK,QAAO,KAAK,KAAK;AAAA,EACjD;AAAA,EAEA,OAAO,WAAW,gBAAwD;AAClE,UAAA,OAAO,qBAAqB,eAAe,IAAI;AAC9C,WAAA;AAAA,EACT;AAAA,EAQA,QAAQ,MAAY;AACb,SAAA,YAAA,EAAc,SAAS;AAAA,EAC9B;AAAA,EAEA,aAAsC;AAE7B,WAAA;AAAA,MACL,GAAG,MAAM,WAAW;AAAA,MACpB,MAAM,KAAK,QAAQ;AAAA,MACnB,SAAS;AAAA,MACT,QAAO,KAAK;AAAA,MACZ,MAAM,KAAK;AAAA,IAAA;AAAA,EAEf;AAAA,EAEA,YAA6B;AAErB,UAAA,UAAU,SAAS,cAAc,KAAK;AAG5C,YAAQ,YAAY,KAAK;AAEjB,YAAA,aAAa,SAAQ,SAAS;AAEtC,WAAO,EAAE,QAAQ;AAAA,EACnB;AAAA,EAEA,OAAO,YAAqC;AACnC,WAAA;AAAA,MACL,KAAM,CAAC,OAAwB;AACrB,eAAA;AAAA,UACN,YAAY,GAAG,UAAU,SAAS,SAAS,IAAI,CAAC,YAAyB;AAChE,mBAAA;AAAA,cACL,MAAK,qBAAqB,QAAQ,SAAmB;AAAA,YAAA;AAAA,UACvD,IACE;AAAA,UACJ,UAAU;AAAA,QAAA;AAAA,MAEd;AAAA,IAAA;AAAA,EAEJ;AAAA,EACA,YAAY;AACH,WAAA,SAAS,cAAc,KAAK;AAAA,EACrC;AAAA,EACA,YAAmB;AACV,WAAA;AAAA,EACT;AAAA,EAEA,eACE,eACA,uBACQ;AAEF,UAAA,UAAU,SAAS,cAAc,KAAK;AAC5C,YAAQ,YAAY,KAAK;AACzB,WAAO,QAAQ;AAAA,EACjB;AAAA,EAEA,SAAS,SAAwB,QAAiC;AAChE,UAAM,kBAAkB,OAAO,MAAM,cAAc,CAAA;AACnD,WAAOC,IAAAA,EAAE,uBAAuB;AAAA,MAC9B,WAAW,gBAAgB,QAAQ;AAAA,MACnC,YAAY,gBAAgB,SAAS;AAAA,MACrC,OAAM;AAAA,MACN,SAAS,KAAK,OAAO;AAAA,MACrB,MAAM,KAAK;AAAA,IAAA,CACZ;AAAA,EACH;AAAA,EACA,UAAU,aAAoB;AACtB,UAAA,OAAO,KAAK;AAClB,SAAK,WAAW;AACT,WAAA;AAAA,EACT;AAAA,EACA,YAAY;AACH,WAAA,KAAK,UAAY,EAAA;AAAA,EAC1B;AAAA,EACA,WAAW;AACF,WAAA;AAAA,EACT;AACF;AAOO,SAAS,qBAAqB,MAA6B;AACzD,SAAA,IAAI,cAAc,IAAI;AAC/B;;;;;;"}

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

@@ -1,38 +1,28 @@
 "use strict";
 const vue = require("vue");
-require("@lexical/text");
+const lexicalVue = require("lexical-vue");
 const utils = require("@lexical/utils");
-require("@lexical/overflow");
 const lexical = require("lexical");
-require("tiny-invariant");
-require("@lexical/history");
-const useLexicalComposer = require("../../lexical-vue/composables/useLexicalComposer.js");
-require("@lexical/list");
-require("@lexical/dragon");
-require("@lexical/plain-text");
-require("@lexical/rich-text");
-require("@lexical/yjs");
-require("yjs");
-require("../../lexical-vue/components/LexicalDecoratedTeleports.js");
-require("@lexical/html");
-require("@lexical/link");
-require("@lexical/mark");
-require("@lexical/table");
-require("@lexical/hashtag");
-require("@lexical/markdown");
-require("../../lexical-vue/composables/useCollaborationContext.js");
-require("../../lexical-vue/components/LexicalMenu/shared.js");
-require("../../lexical-vue/components/LexicalAutoEmbedPlugin/shared.js");
-require("../../lexical-vue/components/LexicalTypeaheadMenuPlugin/shared.js");
 const index = require("./index.js");
+const defines = require("../ToolbarPlugin/defines.js");
+const HtmlEditDialog = require("./HtmlEditDialog.js");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "index",
   setup(__props) {
-    const editor = useLexicalComposer.useLexicalComposer();
+    const editor = lexicalVue.useLexicalComposer();
     vue.onMounted(() => {
       if (!editor.hasNodes([index.HtmlBlockNode])) {
         throw new Error("HtmlBlockPlugin: 自定义HTML代码块节点未注册！");
       }
+      defines.RegisterToolbarExtend({
+        icon: "html-code",
+        text: "自定义代码块",
+        action: async () => {
+          var result = await HtmlEditDialog.ShowHtmlEditPanel("");
+          editor.dispatchCommand(index.INSERT_HTML_BLOCK_COMMAND, result);
+        },
+        sort: 9
+      });
       const unregister = utils.mergeRegister(
         // 插入
         editor.registerCommand(index.INSERT_HTML_BLOCK_COMMAND, (payload) => {

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

@@ -1 +1 @@
-{"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/HtmlBlockPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useLexicalComposer } from '../../lexical-vue'\nimport { $insertNodeToNearestRoot,mergeRegister } from '@lexical/utils'\nimport { COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,$getSelection,CLICK_COMMAND } from 'lexical'\n\nimport { onMounted, onUnmounted } from 'vue'\nimport { INSERT_HTML_BLOCK_COMMAND,HtmlBlockNode,$createHtmlBlockNode,HtmlBlockAttrs } from './index'\nimport { RegisterToolbarExtend,type ToolbarExtendPlugin } from \"../ToolbarPlugin/defines\"\n\n\nconst editor = useLexicalComposer()\n\nonMounted(() => {\n\n  if (!editor.hasNodes([HtmlBlockNode])){\n    throw new Error('HtmlBlockPlugin: 自定义HTML代码块节点未注册！')\n  }\n \n  // 注册到工具条\n  // RegisterToolbarExtend({\n  //   icon:\"html-code\",\n  //   text:\"自定义代码块\",\n  //   action:async ()=>{\n  //     editor.dispatchCommand(INSERT_HTML_BLOCK_COMMAND,{\n  //       content:`<div class=\"aa\">我是自定义代码块</div>`,\n  //       css:\"div.aa{ width:100%;height:300px }\"\n  //     })\n  //   },\n  //   sort:9\n  // } as ToolbarExtendPlugin)\n\n  // 注册指令\n  const unregister = mergeRegister(\n\n    // 插入\n    editor.registerCommand<HtmlBlockAttrs>(INSERT_HTML_BLOCK_COMMAND,(payload) => {\n      $insertNodeToNearestRoot($createHtmlBlockNode(payload))\n      return true\n    },COMMAND_PRIORITY_EDITOR),\n  );\n\n  onUnmounted(() => unregister())\n})\n</script>\n\n<template />\n"],"names":["useLexicalComposer","onMounted","HtmlBlockNode","mergeRegister","INSERT_HTML_BLOCK_COMMAND","$insertNodeToNearestRoot","$createHtmlBlockNode","COMMAND_PRIORITY_EDITOR","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,UAAM,SAASA,mBAAAA;AAEfC,QAAAA,UAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAACC,MAAAA,aAAa,CAAC,GAAE;AAC9B,cAAA,IAAI,MAAM,mCAAmC;AAAA,MACrD;AAgBA,YAAM,aAAaC,MAAA;AAAA;AAAA,QAGjB,OAAO,gBAAgCC,iCAA0B,CAAC,YAAY;AACnDC,yCAAAC,MAAAA,qBAAqB,OAAO,CAAC;AAC/C,iBAAA;AAAA,WACPC,+BAAuB;AAAA,MAAA;AAGfC,sBAAA,MAAM,YAAY;AAAA,IAAA,CAC/B;;;;;;;"}
+{"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/HtmlBlockPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { $insertNodeToNearestRoot,mergeRegister } from '@lexical/utils'\r\nimport { \r\n  $isNodeSelection, COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,$getSelection,CLICK_COMMAND \r\n} from 'lexical'\r\n\r\nimport { onMounted, onUnmounted } from 'vue'\r\nimport { REMOVE_HTML_BLOCK_COMMAND,HTML_BLOCK_CHANGE,INSERT_HTML_BLOCK_COMMAND,HtmlBlockNode,$createHtmlBlockNode } from './index'\r\nimport { RegisterToolbarExtend,type ToolbarExtendPlugin } from \"../ToolbarPlugin/defines\"\r\nimport { ShowHtmlEditPanel } from \"./HtmlEditDialog\"\r\nimport { SELECTED_COMPONENT_COMMAND,ComponentSelectEvent } from \"../commands\"\r\n\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nonMounted(() => {\r\n\r\n  if (!editor.hasNodes([HtmlBlockNode])){\r\n    throw new Error('HtmlBlockPlugin: 自定义HTML代码块节点未注册！')\r\n  }\r\n \r\n  // 注册到工具条\r\n  RegisterToolbarExtend({\r\n    icon:\"html-code\",\r\n    text:\"自定义代码块\",\r\n    action:async ()=>{\r\n\r\n      var result = await ShowHtmlEditPanel(\"\");\r\n\r\n      editor.dispatchCommand(INSERT_HTML_BLOCK_COMMAND,result as string)\r\n    },\r\n    sort:9\r\n  } as ToolbarExtendPlugin)\r\n\r\n  // 注册指令\r\n  const unregister = mergeRegister(\r\n    // 插入\r\n    editor.registerCommand<string>(INSERT_HTML_BLOCK_COMMAND,(payload) => {\r\n      $insertNodeToNearestRoot($createHtmlBlockNode(payload))\r\n      return true\r\n    },COMMAND_PRIORITY_EDITOR)\r\n  );\r\n\r\n  onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template />\r\n"],"names":["useLexicalComposer","onMounted","HtmlBlockNode","RegisterToolbarExtend","ShowHtmlEditPanel","INSERT_HTML_BLOCK_COMMAND","mergeRegister","$insertNodeToNearestRoot","$createHtmlBlockNode","COMMAND_PRIORITY_EDITOR","onUnmounted"],"mappings":";;;;;;;;;;;AAeA,UAAM,SAASA,WAAAA;AAEfC,QAAAA,UAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAACC,MAAAA,aAAa,CAAC,GAAE;AAC9B,cAAA,IAAI,MAAM,mCAAmC;AAAA,MACrD;AAGsBC,oCAAA;AAAA,QACpB,MAAK;AAAA,QACL,MAAK;AAAA,QACL,QAAO,YAAU;AAEX,cAAA,SAAS,MAAMC,iCAAkB,EAAE;AAEhC,iBAAA,gBAAgBC,iCAA0B,MAAgB;AAAA,QACnE;AAAA,QACA,MAAK;AAAA,MAAA,CACiB;AAGxB,YAAM,aAAaC,MAAA;AAAA;AAAA,QAEjB,OAAO,gBAAwBD,iCAA0B,CAAC,YAAY;AAC3CE,yCAAAC,MAAAA,qBAAqB,OAAO,CAAC;AAC/C,iBAAA;AAAA,WACPC,+BAAuB;AAAA,MAAA;AAGfC,sBAAA,MAAM,YAAY;AAAA,IAAA,CAC/B;;;;;;;"}

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/DocImageComponent.js

@@ -2,30 +2,7 @@
 const vue = require("vue");
 const lexical = require("lexical");
 const utils$1 = require("@lexical/utils");
-require("@lexical/text");
-const useMounted = require("../../lexical-vue/composables/useMounted.js");
-require("@lexical/overflow");
-require("tiny-invariant");
-require("@lexical/history");
-const useLexicalComposer = require("../../lexical-vue/composables/useLexicalComposer.js");
-const useLexicalNodeSelection = require("../../lexical-vue/composables/useLexicalNodeSelection.js");
-require("@lexical/list");
-require("@lexical/dragon");
-require("@lexical/plain-text");
-require("@lexical/rich-text");
-require("@lexical/yjs");
-require("yjs");
-require("../../lexical-vue/components/LexicalDecoratedTeleports.js");
-require("@lexical/html");
-require("@lexical/link");
-require("@lexical/mark");
-require("@lexical/table");
-require("@lexical/hashtag");
-require("@lexical/markdown");
-require("../../lexical-vue/composables/useCollaborationContext.js");
-require("../../lexical-vue/components/LexicalMenu/shared.js");
-require("../../lexical-vue/components/LexicalAutoEmbedPlugin/shared.js");
-require("../../lexical-vue/components/LexicalTypeaheadMenuPlugin/shared.js");
+const lexicalVue = require("lexical-vue");
 const dm = require("@maketribe/dm");
 const commands = require("../commands.js");
 const request = require("@maketribe/request");
@@ -38,12 +15,12 @@ const DocImageComponent = /* @__PURE__ */ vue.defineComponent({
   name: "DocImageComponent",
   props: ["format", "baseClass", "focusClass", "nodeKey", "attrs"],
   setup(props) {
-    const editor = useLexicalComposer.useLexicalComposer();
+    const editor = lexicalVue.useLexicalComposer();
     const {
       isSelected,
       setSelected,
       clearSelection
-    } = useLexicalNodeSelection.useLexicalNodeSelection(props.nodeKey);
+    } = lexicalVue.useLexicalNodeSelection(props.nodeKey);
     const selfElRef = vue.ref(null);
     const imageActiveBoxStyle = vue.reactive({
       width: "",
@@ -114,7 +91,7 @@ const DocImageComponent = /* @__PURE__ */ vue.defineComponent({
     }, {
       immediate: true
     });
-    useMounted.useMounted(() => {
+    lexicalVue.useMounted(() => {
       return utils$1.mergeRegister(
         // 选中图
         editor.registerCommand(lexical.CLICK_COMMAND, (event) => {

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/DocImageComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocImageComponent.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/DocImageComponent.tsx"],"sourcesContent":["import type { ElementFormatType } from 'lexical'\r\nimport {  $getSelection,$isNodeSelection,  CLICK_COMMAND,COMMAND_PRIORITY_LOW } from 'lexical'\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer,useLexicalNodeSelection,useMounted } from '../../lexical-vue'\r\nimport { defineComponent, ref,reactive,computed,onMounted,watch } from 'vue'\r\nimport { Messager } from \"@maketribe/dm\";\r\nimport { DEVICE_VIEW_MODE,SELECTED_COMPONENT_COMMAND,ComponentSelectEvent } from \"../commands\"\r\nimport {  WebFileUpload } from \"@maketribe/request\";\r\nimport { REMOVE_IMAGE_COMMAND,ImageAttrData,IMAGE_ATTRS_CHANGE,ImageNode } from './index'\r\nimport { base64ToBlob,md5 } from \"@maketribe/utils\";\r\nimport { ShowImageEditPanel } from \"./ImageEditPanel\"\r\nimport ImageTools from './ImageTools.vue'\r\n\r\n// 默认图片\r\nconst ImageDefaultSrc = \"data:image/png;base64,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\";\r\n\r\n/**\r\n * 图片渲染组件\r\n */\r\nexport default defineComponent({\r\n  name: 'DocImageComponent',\r\n  props: ['format','baseClass','focusClass', 'nodeKey', 'attrs'],\r\n  setup(props) {\r\n\r\n    const editor = useLexicalComposer()\r\n    const { isSelected, setSelected, clearSelection } = useLexicalNodeSelection(props.nodeKey)\r\n    const selfElRef = ref<any>(null);\r\n    const imageActiveBoxStyle = reactive({ width:\"\", height:\"\",  top:\"\", left:\"\" });\r\n    const updateImageActiveBox = ()=>{\r\n      let stageRect = selfElRef.value.parentElement.getBoundingClientRect();\r\n      let rect = selfElRef.value.getBoundingClientRect();\r\n      imageActiveBoxStyle.width = rect.width+ \"px\";\r\n      imageActiveBoxStyle.height = rect.height+ \"px\";\r\n      imageActiveBoxStyle.left = rect.x - stageRect.x + \"px\";\r\n      imageActiveBoxStyle.top = \"0px\";\r\n    }\r\n\r\n    const styles = computed<string[]>(()=>{\r\n      return Object.keys(attrs).filter(k=>attrs[k] && k != \"float\" && k!=\"margin\" && k!=\"src\" && k!=\"alt\").map(k=>{\r\n        return k.replace(/([A-Z])/g,\"-$1\").toLowerCase()+\":\"+attrs[k]\r\n      });\r\n    })\r\n\r\n    // 显示的图\r\n    const viewSrc = ref<string>(ImageDefaultSrc)\r\n    const loading = ref(true);\r\n    const loadingText = ref(\"\");\r\n    const attrs = reactive(props.attrs)\r\n    const webFileUpload = new WebFileUpload();\r\n    // 图片加载\r\n    const imageLoad = (src:string)=>{\r\n      // 加载文案\r\n      loadingText.value = \"加载中...\";\r\n      loading.value = true;\r\n      return new Promise((resolve,reject)=>{\r\n        // 加载一下\r\n        const image = new Image();\r\n        const loadComplete = ()=>{\r\n          viewSrc.value = image.src;\r\n          attrs.src = src;\r\n          loadingText.value = \"\";\r\n          loading.value = false;\r\n          resolve(image.src);\r\n        }\r\n        image.onload = ()=>loadComplete()\r\n        image.onerror = reject\r\n        image.src = src;\r\n        if(image.complete){\r\n          loadComplete();\r\n        }\r\n      })\r\n      // .finally(()=>{\r\n      //   loading.value = false;\r\n      // });\r\n    }\r\n\r\n    // 图片路径变更的时候\r\n    watch(()=>attrs.src,(src:string)=>{\r\n      // 初始化\r\n      loadingText.value = \"\";\r\n      // 多半 base64\r\n      if(src && src.indexOf(\"data:image/\") == 0){\r\n\r\n        // 文件上传 \r\n        loadingText.value = \"上传中...\";\r\n\r\n        // 开始上传\r\n        const blob = base64ToBlob(src); \r\n\r\n        // 上传\r\n        webFileUpload.upload(\r\n          new File([blob], `${md5(Math.random().toString())}.${blob.type.toString().replace(\"image/\",\"\") || \"png\"}`, { type: blob.type })\r\n        ).then(result=>{\r\n\r\n          if (result.data.code !== 200) {\r\n            Messager.error({ message: result.data.msg });\r\n            return;\r\n          }\r\n          // 加载一下\r\n          imageLoad(result.data.data.path);\r\n        });\r\n      }\r\n      else if(src){\r\n        // 加载一下\r\n        imageLoad(src);\r\n      }\r\n      else{\r\n        // 文件上传\r\n        loading.value = true;\r\n        loadingText.value = \"无图片内容\";\r\n      }\r\n    },{ immediate:true })\r\n \r\n    // 编辑器挂载的时候\r\n    useMounted(() => {\r\n      return mergeRegister(\r\n        // 选中图\r\n        editor.registerCommand<MouseEvent>(CLICK_COMMAND,(event) => {\r\n\r\n            if (event.target === selfElRef.value) {\r\n\r\n              event.preventDefault();\r\n\r\n              if (!event.shiftKey){ clearSelection() }\r\n              \r\n              setSelected(true)\r\n              updateImageActiveBox();\r\n              \r\n              editor.dispatchCommand(SELECTED_COMPONENT_COMMAND,{ \r\n                el:selfElRef.value,\r\n                component:ImageTools\r\n              } as ComponentSelectEvent);\r\n              return true\r\n            }\r\n\r\n            // 没选中\r\n            editor.dispatchCommand(SELECTED_COMPONENT_COMMAND,null);\r\n            return false\r\n          },\r\n          COMMAND_PRIORITY_LOW,\r\n        ),\r\n        // 删除\r\n        editor.registerCommand(REMOVE_IMAGE_COMMAND, () => {\r\n            \r\n          const selection = $getSelection();\r\n    \r\n          if($isNodeSelection(selection)){\r\n    \r\n            selection.getNodes().forEach(node=>node.remove());\r\n            // 没选中\r\n            editor.dispatchCommand(SELECTED_COMPONENT_COMMAND,null);\r\n          }\r\n          return false;\r\n        },COMMAND_PRIORITY_LOW),\r\n        // 修改图片属性\r\n        editor.registerCommand(IMAGE_ATTRS_CHANGE,(payload:ImageAttrData) => {\r\n\r\n          const selection = $getSelection();\r\n\r\n          if($isNodeSelection(selection)){\r\n    \r\n            const node = selection.getNodes()[0] as ImageNode;\r\n    \r\n            // 是图片\r\n            if(node.__key == props.nodeKey){\r\n\r\n              // 对齐方式的改变\r\n              if(payload.name == \"align\"){\r\n\r\n                // 有浮动走浮动的逻辑\r\n                if(attrs.float != null && attrs.float != \"\"){ attrs.float = payload.value }\r\n                else{\r\n                  // 否则走文本对齐\r\n                  node?.getParent()?.setFormat(payload.value as ElementFormatType)\r\n                }\r\n              }\r\n              // 属性编辑\r\n              else if(payload.name == \"edit\"){\r\n                // 更新属性\r\n                ShowImageEditPanel({...attrs}).then((data:any)=>{\r\n                  Object.assign(attrs,data||{});\r\n                  setTimeout(()=>updateImageActiveBox(),10)\r\n                }).catch(err=>{\r\n                  console.log(err);\r\n                });\r\n               \r\n              }\r\n              else{\r\n                // 单个其他属性的改变\r\n                attrs[payload.name] = payload.value\r\n              }\r\n            }\r\n          }\r\n          setTimeout(()=>updateImageActiveBox(),10)\r\n          return false\r\n        },COMMAND_PRIORITY_LOW),\r\n        editor.registerCommand(DEVICE_VIEW_MODE,(payload: string) => {\r\n          setTimeout(()=>updateImageActiveBox(),10)\r\n          return false\r\n        },COMMAND_PRIORITY_LOW)\r\n      )\r\n    })\r\n\r\n    return () =>{\r\n      return <div class={`${props.baseClass} ${isSelected.value ? props.focusClass : ''}`}\r\n      style={`text-align: ${props.format};float:${ attrs.float };margin:${attrs.margin}`}>\r\n        <img ref={el=>selfElRef.value=el} src={viewSrc.value} style={styles.value.join(\";\")} class={attrs.className} />\r\n        {isSelected.value ? <div style={imageActiveBoxStyle} class=\"mk-doc-active-mark\"></div> : null}\r\n        {loading.value ? <div class=\"mk-doc-loading-mark\">\r\n          {loadingText.value}\r\n        </div> : null}\r\n      </div>\r\n    }\r\n  },\r\n})\r\n"],"names":["ImageDefaultSrc","defineComponent","name","props","setup","editor","useLexicalComposer","isSelected","setSelected","clearSelection","useLexicalNodeSelection","nodeKey","selfElRef","ref","imageActiveBoxStyle","reactive","width","height","top","left","updateImageActiveBox","stageRect","value","parentElement","getBoundingClientRect","rect","x","styles","computed","Object","keys","attrs","filter","k","map","replace","toLowerCase","viewSrc","loading","loadingText","webFileUpload","WebFileUpload","imageLoad","src","Promise","resolve","reject","image","Image","loadComplete","onload","onerror","complete","watch","indexOf","blob","base64ToBlob","upload","File","md5","Math","random","toString","type","then","result","data","code","Messager","error","message","msg","path","immediate","useMounted","mergeRegister","registerCommand","CLICK_COMMAND","event","target","preventDefault","shiftKey","dispatchCommand","SELECTED_COMPONENT_COMMAND","el","component","ImageTools","COMMAND_PRIORITY_LOW","REMOVE_IMAGE_COMMAND","selection","$getSelection","$isNodeSelection","getNodes","forEach","node","remove","IMAGE_ATTRS_CHANGE","payload","__key","float","getParent","setFormat","ShowImageEditPanel","assign","setTimeout","catch","err","console","log","DEVICE_VIEW_MODE","_createVNode","baseClass","focusClass","format","margin","join","className"],"mappings":"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"}
+{"version":3,"file":"DocImageComponent.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/DocImageComponent.tsx"],"sourcesContent":["import type { ElementFormatType } from 'lexical'\r\nimport {  $getSelection,$isNodeSelection,  CLICK_COMMAND,COMMAND_PRIORITY_LOW } from 'lexical'\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer,useLexicalNodeSelection,useMounted } from 'lexical-vue'\r\nimport { defineComponent, ref,reactive,computed,onMounted,watch } from 'vue'\r\nimport { Messager } from \"@maketribe/dm\";\r\nimport { DEVICE_VIEW_MODE,SELECTED_COMPONENT_COMMAND,ComponentSelectEvent } from \"../commands\"\r\nimport {  WebFileUpload } from \"@maketribe/request\";\r\nimport { REMOVE_IMAGE_COMMAND,ImageAttrData,IMAGE_ATTRS_CHANGE,ImageNode } from './index'\r\nimport { base64ToBlob,md5 } from \"@maketribe/utils\";\r\nimport { ShowImageEditPanel } from \"./ImageEditPanel\"\r\nimport ImageTools from './ImageTools.vue'\r\n\r\n// 默认图片\r\nconst ImageDefaultSrc = \"data:image/png;base64,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\";\r\n\r\n/**\r\n * 图片渲染组件\r\n */\r\nexport default defineComponent({\r\n  name: 'DocImageComponent',\r\n  props: ['format','baseClass','focusClass', 'nodeKey', 'attrs'],\r\n  setup(props) {\r\n\r\n    const editor = useLexicalComposer()\r\n    const { isSelected, setSelected, clearSelection } = useLexicalNodeSelection(props.nodeKey)\r\n    const selfElRef = ref<any>(null);\r\n    const imageActiveBoxStyle = reactive({ width:\"\", height:\"\",  top:\"\", left:\"\" });\r\n    const updateImageActiveBox = ()=>{\r\n      let stageRect = selfElRef.value.parentElement.getBoundingClientRect();\r\n      let rect = selfElRef.value.getBoundingClientRect();\r\n      imageActiveBoxStyle.width = rect.width+ \"px\";\r\n      imageActiveBoxStyle.height = rect.height+ \"px\";\r\n      imageActiveBoxStyle.left = rect.x - stageRect.x + \"px\";\r\n      imageActiveBoxStyle.top = \"0px\";\r\n    }\r\n\r\n    const styles = computed<string[]>(()=>{\r\n      return Object.keys(attrs).filter(k=>attrs[k] && k != \"float\" && k!=\"margin\" && k!=\"src\" && k!=\"alt\").map(k=>{\r\n        return k.replace(/([A-Z])/g,\"-$1\").toLowerCase()+\":\"+attrs[k]\r\n      });\r\n    })\r\n\r\n    // 显示的图\r\n    const viewSrc = ref<string>(ImageDefaultSrc)\r\n    const loading = ref(true);\r\n    const loadingText = ref(\"\");\r\n    const attrs = reactive(props.attrs)\r\n    const webFileUpload = new WebFileUpload();\r\n    // 图片加载\r\n    const imageLoad = (src:string)=>{\r\n      // 加载文案\r\n      loadingText.value = \"加载中...\";\r\n      loading.value = true;\r\n      return new Promise((resolve,reject)=>{\r\n        // 加载一下\r\n        const image = new Image();\r\n        const loadComplete = ()=>{\r\n          viewSrc.value = image.src;\r\n          attrs.src = src;\r\n          loadingText.value = \"\";\r\n          loading.value = false;\r\n          resolve(image.src);\r\n        }\r\n        image.onload = ()=>loadComplete()\r\n        image.onerror = reject\r\n        image.src = src;\r\n        if(image.complete){\r\n          loadComplete();\r\n        }\r\n      })\r\n      // .finally(()=>{\r\n      //   loading.value = false;\r\n      // });\r\n    }\r\n\r\n    // 图片路径变更的时候\r\n    watch(()=>attrs.src,(src:string)=>{\r\n      // 初始化\r\n      loadingText.value = \"\";\r\n      // 多半 base64\r\n      if(src && src.indexOf(\"data:image/\") == 0){\r\n\r\n        // 文件上传 \r\n        loadingText.value = \"上传中...\";\r\n\r\n        // 开始上传\r\n        const blob = base64ToBlob(src); \r\n\r\n        // 上传\r\n        webFileUpload.upload(\r\n          new File([blob], `${md5(Math.random().toString())}.${blob.type.toString().replace(\"image/\",\"\") || \"png\"}`, { type: blob.type })\r\n        ).then(result=>{\r\n\r\n          if (result.data.code !== 200) {\r\n            Messager.error({ message: result.data.msg });\r\n            return;\r\n          }\r\n          // 加载一下\r\n          imageLoad(result.data.data.path);\r\n        });\r\n      }\r\n      else if(src){\r\n        // 加载一下\r\n        imageLoad(src);\r\n      }\r\n      else{\r\n        // 文件上传\r\n        loading.value = true;\r\n        loadingText.value = \"无图片内容\";\r\n      }\r\n    },{ immediate:true })\r\n \r\n    // 编辑器挂载的时候\r\n    useMounted(() => {\r\n      return mergeRegister(\r\n        // 选中图\r\n        editor.registerCommand<MouseEvent>(CLICK_COMMAND,(event) => {\r\n\r\n            if (event.target === selfElRef.value) {\r\n\r\n              event.preventDefault();\r\n\r\n              if (!event.shiftKey){ clearSelection() }\r\n              \r\n              setSelected(true)\r\n              updateImageActiveBox();\r\n              \r\n              editor.dispatchCommand(SELECTED_COMPONENT_COMMAND,{ \r\n                el:selfElRef.value,\r\n                component:ImageTools\r\n              } as ComponentSelectEvent);\r\n              return true\r\n            }\r\n\r\n            // 没选中\r\n            editor.dispatchCommand(SELECTED_COMPONENT_COMMAND,null);\r\n            return false\r\n          },\r\n          COMMAND_PRIORITY_LOW,\r\n        ),\r\n        // 删除\r\n        editor.registerCommand(REMOVE_IMAGE_COMMAND, () => {\r\n            \r\n          const selection = $getSelection();\r\n    \r\n          if($isNodeSelection(selection)){\r\n    \r\n            selection.getNodes().forEach(node=>node.remove());\r\n            // 没选中\r\n            editor.dispatchCommand(SELECTED_COMPONENT_COMMAND,null);\r\n          }\r\n          return false;\r\n        },COMMAND_PRIORITY_LOW),\r\n        // 修改图片属性\r\n        editor.registerCommand(IMAGE_ATTRS_CHANGE,(payload:ImageAttrData) => {\r\n\r\n          const selection = $getSelection();\r\n\r\n          if($isNodeSelection(selection)){\r\n    \r\n            const node = selection.getNodes()[0] as ImageNode;\r\n    \r\n            // 是图片\r\n            if(node.__key == props.nodeKey){\r\n\r\n              // 对齐方式的改变\r\n              if(payload.name == \"align\"){\r\n\r\n                // 有浮动走浮动的逻辑\r\n                if(attrs.float != null && attrs.float != \"\"){ attrs.float = payload.value }\r\n                else{\r\n                  // 否则走文本对齐\r\n                  node?.getParent()?.setFormat(payload.value as ElementFormatType)\r\n                }\r\n              }\r\n              // 属性编辑\r\n              else if(payload.name == \"edit\"){\r\n                // 更新属性\r\n                ShowImageEditPanel({...attrs}).then((data:any)=>{\r\n                  Object.assign(attrs,data||{});\r\n                  setTimeout(()=>updateImageActiveBox(),10)\r\n                }).catch(err=>{\r\n                  console.log(err);\r\n                });\r\n               \r\n              }\r\n              else{\r\n                // 单个其他属性的改变\r\n                attrs[payload.name] = payload.value\r\n              }\r\n            }\r\n          }\r\n          setTimeout(()=>updateImageActiveBox(),10)\r\n          return false\r\n        },COMMAND_PRIORITY_LOW),\r\n        editor.registerCommand(DEVICE_VIEW_MODE,(payload: string) => {\r\n          setTimeout(()=>updateImageActiveBox(),10)\r\n          return false\r\n        },COMMAND_PRIORITY_LOW)\r\n      )\r\n    })\r\n\r\n    return () =>{\r\n      return <div class={`${props.baseClass} ${isSelected.value ? props.focusClass : ''}`}\r\n      style={`text-align: ${props.format};float:${ attrs.float };margin:${attrs.margin}`}>\r\n        <img ref={el=>selfElRef.value=el} src={viewSrc.value} style={styles.value.join(\";\")} class={attrs.className} />\r\n        {isSelected.value ? <div style={imageActiveBoxStyle} class=\"mk-doc-active-mark\"></div> : null}\r\n        {loading.value ? <div class=\"mk-doc-loading-mark\">\r\n          {loadingText.value}\r\n        </div> : null}\r\n      </div>\r\n    }\r\n  },\r\n})\r\n"],"names":["ImageDefaultSrc","defineComponent","name","props","setup","editor","useLexicalComposer","isSelected","setSelected","clearSelection","useLexicalNodeSelection","nodeKey","selfElRef","ref","imageActiveBoxStyle","reactive","width","height","top","left","updateImageActiveBox","stageRect","value","parentElement","getBoundingClientRect","rect","x","styles","computed","Object","keys","attrs","filter","k","map","replace","toLowerCase","viewSrc","loading","loadingText","webFileUpload","WebFileUpload","imageLoad","src","Promise","resolve","reject","image","Image","loadComplete","onload","onerror","complete","watch","indexOf","blob","base64ToBlob","upload","File","md5","Math","random","toString","type","then","result","data","code","Messager","error","message","msg","path","immediate","useMounted","mergeRegister","registerCommand","CLICK_COMMAND","event","target","preventDefault","shiftKey","dispatchCommand","SELECTED_COMPONENT_COMMAND","el","component","ImageTools","COMMAND_PRIORITY_LOW","REMOVE_IMAGE_COMMAND","selection","$getSelection","$isNodeSelection","getNodes","forEach","node","remove","IMAGE_ATTRS_CHANGE","payload","__key","float","getParent","setFormat","ShowImageEditPanel","assign","setTimeout","catch","err","console","log","DEVICE_VIEW_MODE","_createVNode","baseClass","focusClass","format","margin","join","className"],"mappings":"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"}

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/ImageEditPanel.js

@@ -254,7 +254,6 @@ const ShowImageEditPanel = async (attrs) => {
     };
     const handleCancelClick = () => {
       dialogInstance.destroy();
-      reject();
     };
     const handleConfirmClick = () => {
       dialogInstance.destroy();

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/ImageEditPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageEditPanel.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/ImageEditPanel.tsx"],"sourcesContent":["\r\nimport { Fragment,h,onMounted, onUnmounted,ref,reactive,defineComponent, computed } from 'vue'\r\nimport { Dialoger } from '@maketribe/dm'\r\nimport { \r\n  ElButton,ElTabs,ElTabPane,ElInput,ElImage,ElIcon,\r\n  ElForm,ElFormItem,ElRow,ElCol\r\n} from \"element-plus\";\r\nimport { Crop,Share,UploadFilled,Picture } from \"@element-plus/icons-vue\";\r\nimport { MsMaterial, MsMaterialTable } from \"../../../../../modules/ms/dataviews/ms-material\";\r\nimport { MKMaterialList } from \"../../../../../modules/ms/components/material-list\";\r\nimport { MKImageCropperContent } from \"../../../image-cropper\"\r\nimport { fileSelect } from \"@maketribe/utils\"\r\nimport { ImageCropper } from \"../../../image-cropper\"\r\n\r\n// 选择状态\r\nconst selectState = ref(\"select\");\r\n\r\n/**\r\n * 图片编辑面板\r\n */\r\nconst ImageEditPanelComponent = defineComponent({\r\n  name: 'ImageEditPanelComponent',\r\n  props: ['attrs'],\r\n  setup(props,{ expose }){\r\n\r\n    const attrs = reactive(props.attrs)\r\n    const materialTable = reactive(new MsMaterialTable()) as MsMaterialTable;\r\n    const margin = computed<any>({\r\n      set(v){\r\n        attrs.margin = `${v.t} ${v.r} ${v.b} ${v.l}`\r\n      },\r\n      get(){\r\n        var vals = attrs.margin.split(/[\\s]+/g);\r\n        if(vals.length == 1){\r\n          return {t:vals[0],r:vals[0],b:vals[0],l:vals[0]}\r\n        }\r\n        else if(vals.length == 2){\r\n          return {t:vals[0],r:vals[1],b:vals[0],l:vals[1]}\r\n        }\r\n        else if(vals.length == 3){\r\n          return {t:vals[0],r:vals[1],b:vals[2],l:vals[1]}\r\n        }\r\n        else if(vals.length <= 0){\r\n          vals = [\"\",\"\",\"\",\"\"];\r\n        }\r\n        return {t:vals[0],r:vals[1],b:vals[2],l:vals[3]}\r\n      }\r\n    })\r\n\r\n    // 选择素材\r\n    materialTable.selectionChangeEvent.on(()=>{\r\n      let id = materialTable.getSelection()[0];\r\n      if(id){\r\n        attrs.src = materialTable.getList().find(item=>item.id == id)?.path;\r\n      }\r\n      else{\r\n        attrs.src = \"\";\r\n      }\r\n    })\r\n\r\n    //\r\n    const selectImage = async ()=>{\r\n\r\n      const file = await fileSelect({ accept:\"image/*\"});\r\n        \r\n      if (file) {\r\n\r\n        const fileRender = new FileReader();\r\n        fileRender.onload = async (data:any)=>{\r\n          attrs.src = data.target.result;\r\n         \r\n        }\r\n        fileRender.readAsDataURL(file)\r\n      }\r\n    }\r\n\r\n    // 导出可用的方法\r\n    expose({ \r\n      getResult:()=>{ return {...attrs} } ,\r\n      setSrc:(src:string)=>{  attrs.src = src }\r\n    });\r\n\r\n    return ()=>{\r\n\r\n      // 图片预览\r\n      const ImageView = <ElImage style=\"background: #dedede;width: 100%; height: 480px;margin-top:10px\" src={attrs.src} fit=\"contain\" v-slots={{\r\n        error:()=>{\r\n          return <div style=\"\r\n              font-size: 50px;\r\n              display: flex;\r\n              align-content: center;\r\n              justify-content: center;\r\n              align-items: center;\r\n              height: 100%;\r\n          \">\r\n            <ElIcon><Picture /></ElIcon>\r\n          </div>\r\n        }\r\n      }}>\r\n      </ElImage>\r\n     \r\n      // 面板内容\r\n      let panel = <ElTabs style=\"min-height: 520px\">\r\n        <ElTabPane label=\"本地选择\">\r\n          <ElButton icon={UploadFilled} type=\"primary\" style=\"width: 100%\" onClick={selectImage}>\r\n            选择本地文件\r\n          </ElButton>\r\n          {ImageView}\r\n        </ElTabPane>\r\n        <ElTabPane label=\"素材库选择\">\r\n          <MKMaterialList class=\"mk-material-select__list\" selectable materialTable={materialTable} />\r\n        </ElTabPane>\r\n        <ElTabPane label=\"网络图片\">\r\n          <ElInput v-model={attrs.src} prefix-icon={Share} style=\"width: 100%\" placeholder=\"请输入链接地址\">\r\n          </ElInput>\r\n          {ImageView}\r\n        </ElTabPane>\r\n      </ElTabs>\r\n\r\n      if(selectState.value == \"attrs\"){\r\n        panel = <ElRow gutter={20}>\r\n          <ElCol span={14}>\r\n            {ImageView}\r\n          </ElCol>\r\n          <ElCol span={10}>\r\n            <ElForm label-position=\"top\" model={attrs}>\r\n              <ElFormItem label=\"图片描述\">\r\n                <ElInput v-model={attrs.alt} type=\"textarea\" {...{ rows:3 }} style=\"width: 100%\" placeholder=\"请输入\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片显示宽度\">\r\n                <ElInput v-model={attrs.width} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片显示高度\">\r\n                <ElInput v-model={attrs.height} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片最大显示宽度\">\r\n                <ElInput v-model={attrs.maxWidth} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片最大显示高度\">\r\n                <ElInput v-model={attrs.maxHeight} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片显示外边距\">\r\n                <div style=\"display: flex;flex-wrap: nowrap;gap: 10px;justify-content: space-around;\">\r\n                  <div>\r\n                    上:\r\n                    <ElInput v-model={margin.value.t} placeholder=\"\">\r\n                    </ElInput>\r\n                  </div>\r\n                  <div>\r\n                    右:\r\n                    <ElInput v-model={margin.value.r} placeholder=\"\">\r\n                    </ElInput>\r\n                  </div>\r\n                  \r\n                  <div>\r\n                    下:\r\n                    <ElInput v-model={margin.value.b} placeholder=\"\">\r\n                    </ElInput>\r\n                  </div>\r\n                  \r\n                  <div>\r\n                    左:\r\n                    <ElInput v-model={margin.value.l} placeholder=\"\">\r\n                    </ElInput>\r\n                  </div>\r\n                </div>\r\n              </ElFormItem>\r\n            </ElForm>\r\n          </ElCol>\r\n        </ElRow>\r\n      }\r\n\r\n      return panel;\r\n    }\r\n  }\r\n})\r\n\r\n/**\r\n * \r\n * @param attrs 显示图片编辑面板\r\n * @returns \r\n */\r\nexport const ShowImageEditPanel = async  (attrs:any) => {\r\n  return new Promise((resolve,reject) => {\r\n\r\n    // 初始化\r\n    selectState.value = attrs.src ? \"attrs\":\"select\";\r\n\r\n    const imageEditPanelRef = ref<any>(null);\r\n    const editResult = computed<any>(()=>imageEditPanelRef.value?.getResult())\r\n\r\n    // 去裁切\r\n    const toCropImageHandle = async ()=>{\r\n      \r\n      if(editResult.value.src){\r\n        var result = await ImageCropper({ src: editResult.value.src});\r\n        if(result.data){\r\n          imageEditPanelRef.value?.setSrc(result.data);\r\n        }\r\n      }\r\n     \r\n    }\r\n\r\n    // 取消编辑\r\n    const handleCancelClick = () => {\r\n      dialogInstance.destroy();\r\n      reject();\r\n    };\r\n\r\n    // 确认编辑\r\n    const handleConfirmClick = () => {\r\n      dialogInstance.destroy();\r\n      resolve({...editResult.value});\r\n    };\r\n\r\n    const dialogInstance = Dialoger.customRender({\r\n      title: \"素材选择\",\r\n      class: \"mk-material-select\",\r\n      width: \"70%\",\r\n      onClose: () => {\r\n        dialogInstance.destroy();\r\n      },\r\n      body: () => {\r\n        return h(ImageEditPanelComponent,{attrs,ref:r=>imageEditPanelRef.value = r});\r\n      },\r\n      footer: () => {\r\n\r\n        // 下一步按钮\r\n        let nextBtns = [\r\n          <ElButton type=\"primary\" onClick={()=>selectState.value = 'attrs'}>\r\n            下一步\r\n          </ElButton>\r\n        ]\r\n\r\n        if(selectState.value == \"attrs\"){\r\n          nextBtns = [\r\n            <ElButton type=\"primary\" onClick={()=>selectState.value='select'}>\r\n              重新选图\r\n            </ElButton>,\r\n            <ElButton type=\"primary\" onClick={toCropImageHandle}>\r\n              裁切图\r\n            </ElButton>,\r\n            <ElButton type=\"primary\" onClick={handleConfirmClick}>\r\n              确定\r\n            </ElButton>\r\n          ];\r\n        }\r\n\r\n        return (\r\n          <Fragment>\r\n            <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n            {...nextBtns}\r\n          </Fragment>\r\n        );\r\n      },\r\n    });\r\n  });\r\n}\r\n"],"names":["_isSlot","s","Object","prototype","toString","call","_isVNode","selectState","ref","ImageEditPanelComponent","defineComponent","name","props","setup","expose","attrs","reactive","materialTable","MsMaterialTable","margin","computed","set","v","t","r","b","l","get","vals","split","length","selectionChangeEvent","on","id","getSelection","src","getList","find","item","path","selectImage","file","fileSelect","accept","fileRender","FileReader","onload","data","target","result","readAsDataURL","getResult","setSrc","ImageView","_createVNode","ElImage","error","ElIcon","default","Picture","panel","ElTabs","ElTabPane","ElButton","UploadFilled","_createTextVNode","MKMaterialList","ElInput","$event","Share","value","ElRow","ElCol","ElForm","ElFormItem","_mergeProps","alt","rows","width","height","maxWidth","maxHeight","ShowImageEditPanel","Promise","resolve","reject","imageEditPanelRef","editResult","toCropImageHandle","ImageCropper","handleCancelClick","dialogInstance","destroy","handleConfirmClick","Dialoger","customRender","title","class","onClose","body","h","footer","nextBtns","onClick","_Fragment"],"mappings":"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"}
+{"version":3,"file":"ImageEditPanel.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/ImageEditPanel.tsx"],"sourcesContent":["\r\nimport { Fragment,h,onMounted, onUnmounted,ref,reactive,defineComponent, computed } from 'vue'\r\nimport { Dialoger } from '@maketribe/dm'\r\nimport { \r\n  ElButton,ElTabs,ElTabPane,ElInput,ElImage,ElIcon,\r\n  ElForm,ElFormItem,ElRow,ElCol\r\n} from \"element-plus\";\r\nimport { Crop,Share,UploadFilled,Picture } from \"@element-plus/icons-vue\";\r\nimport { MsMaterial, MsMaterialTable } from \"../../../../../modules/ms/dataviews/ms-material\";\r\nimport { MKMaterialList } from \"../../../../../modules/ms/components/material-list\";\r\nimport { MKImageCropperContent } from \"../../../image-cropper\"\r\nimport { fileSelect } from \"@maketribe/utils\"\r\nimport { ImageCropper } from \"../../../image-cropper\"\r\n\r\n// 选择状态\r\nconst selectState = ref(\"select\");\r\n\r\n/**\r\n * 图片编辑面板\r\n */\r\nconst ImageEditPanelComponent = defineComponent({\r\n  name: 'ImageEditPanelComponent',\r\n  props: ['attrs'],\r\n  setup(props,{ expose }){\r\n\r\n    const attrs = reactive(props.attrs)\r\n    const materialTable = reactive(new MsMaterialTable()) as MsMaterialTable;\r\n    const margin = computed<any>({\r\n      set(v){\r\n        attrs.margin = `${v.t} ${v.r} ${v.b} ${v.l}`\r\n      },\r\n      get(){\r\n        var vals = attrs.margin.split(/[\\s]+/g);\r\n        if(vals.length == 1){\r\n          return {t:vals[0],r:vals[0],b:vals[0],l:vals[0]}\r\n        }\r\n        else if(vals.length == 2){\r\n          return {t:vals[0],r:vals[1],b:vals[0],l:vals[1]}\r\n        }\r\n        else if(vals.length == 3){\r\n          return {t:vals[0],r:vals[1],b:vals[2],l:vals[1]}\r\n        }\r\n        else if(vals.length <= 0){\r\n          vals = [\"\",\"\",\"\",\"\"];\r\n        }\r\n        return {t:vals[0],r:vals[1],b:vals[2],l:vals[3]}\r\n      }\r\n    })\r\n\r\n    // 选择素材\r\n    materialTable.selectionChangeEvent.on(()=>{\r\n      let id = materialTable.getSelection()[0];\r\n      if(id){\r\n        attrs.src = materialTable.getList().find(item=>item.id == id)?.path;\r\n      }\r\n      else{\r\n        attrs.src = \"\";\r\n      }\r\n    })\r\n\r\n    //\r\n    const selectImage = async ()=>{\r\n\r\n      const file = await fileSelect({ accept:\"image/*\"});\r\n        \r\n      if (file) {\r\n\r\n        const fileRender = new FileReader();\r\n        fileRender.onload = async (data:any)=>{\r\n          attrs.src = data.target.result;\r\n         \r\n        }\r\n        fileRender.readAsDataURL(file)\r\n      }\r\n    }\r\n\r\n    // 导出可用的方法\r\n    expose({ \r\n      getResult:()=>{ return {...attrs} } ,\r\n      setSrc:(src:string)=>{  attrs.src = src }\r\n    });\r\n\r\n    return ()=>{\r\n\r\n      // 图片预览\r\n      const ImageView = <ElImage style=\"background: #dedede;width: 100%; height: 480px;margin-top:10px\" src={attrs.src} fit=\"contain\" v-slots={{\r\n        error:()=>{\r\n          return <div style=\"\r\n              font-size: 50px;\r\n              display: flex;\r\n              align-content: center;\r\n              justify-content: center;\r\n              align-items: center;\r\n              height: 100%;\r\n          \">\r\n            <ElIcon><Picture /></ElIcon>\r\n          </div>\r\n        }\r\n      }}>\r\n      </ElImage>\r\n     \r\n      // 面板内容\r\n      let panel = <ElTabs style=\"min-height: 520px\">\r\n        <ElTabPane label=\"本地选择\">\r\n          <ElButton icon={UploadFilled} type=\"primary\" style=\"width: 100%\" onClick={selectImage}>\r\n            选择本地文件\r\n          </ElButton>\r\n          {ImageView}\r\n        </ElTabPane>\r\n        <ElTabPane label=\"素材库选择\">\r\n          <MKMaterialList class=\"mk-material-select__list\" selectable materialTable={materialTable} />\r\n        </ElTabPane>\r\n        <ElTabPane label=\"网络图片\">\r\n          <ElInput v-model={attrs.src} prefix-icon={Share} style=\"width: 100%\" placeholder=\"请输入链接地址\">\r\n          </ElInput>\r\n          {ImageView}\r\n        </ElTabPane>\r\n      </ElTabs>\r\n\r\n      if(selectState.value == \"attrs\"){\r\n        panel = <ElRow gutter={20}>\r\n          <ElCol span={14}>\r\n            {ImageView}\r\n          </ElCol>\r\n          <ElCol span={10}>\r\n            <ElForm label-position=\"top\" model={attrs}>\r\n              <ElFormItem label=\"图片描述\">\r\n                <ElInput v-model={attrs.alt} type=\"textarea\" {...{ rows:3 }} style=\"width: 100%\" placeholder=\"请输入\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片显示宽度\">\r\n                <ElInput v-model={attrs.width} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片显示高度\">\r\n                <ElInput v-model={attrs.height} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片最大显示宽度\">\r\n                <ElInput v-model={attrs.maxWidth} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片最大显示高度\">\r\n                <ElInput v-model={attrs.maxHeight} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n                </ElInput>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"图片显示外边距\">\r\n                <div style=\"display: flex;flex-wrap: nowrap;gap: 10px;justify-content: space-around;\">\r\n                  <div>\r\n                    上:\r\n                    <ElInput v-model={margin.value.t} placeholder=\"\">\r\n                    </ElInput>\r\n                  </div>\r\n                  <div>\r\n                    右:\r\n                    <ElInput v-model={margin.value.r} placeholder=\"\">\r\n                    </ElInput>\r\n                  </div>\r\n                  \r\n                  <div>\r\n                    下:\r\n                    <ElInput v-model={margin.value.b} placeholder=\"\">\r\n                    </ElInput>\r\n                  </div>\r\n                  \r\n                  <div>\r\n                    左:\r\n                    <ElInput v-model={margin.value.l} placeholder=\"\">\r\n                    </ElInput>\r\n                  </div>\r\n                </div>\r\n              </ElFormItem>\r\n            </ElForm>\r\n          </ElCol>\r\n        </ElRow>\r\n      }\r\n\r\n      return panel;\r\n    }\r\n  }\r\n})\r\n\r\n/**\r\n * \r\n * @param attrs 显示图片编辑面板\r\n * @returns \r\n */\r\nexport const ShowImageEditPanel = async  (attrs:any) => {\r\n  return new Promise((resolve,reject) => {\r\n\r\n    // 初始化\r\n    selectState.value = attrs.src ? \"attrs\":\"select\";\r\n\r\n    const imageEditPanelRef = ref<any>(null);\r\n    const editResult = computed<any>(()=>imageEditPanelRef.value?.getResult())\r\n\r\n    // 去裁切\r\n    const toCropImageHandle = async ()=>{\r\n      \r\n      if(editResult.value.src){\r\n        var result = await ImageCropper({ src: editResult.value.src});\r\n        if(result.data){\r\n          imageEditPanelRef.value?.setSrc(result.data);\r\n        }\r\n      }\r\n     \r\n    }\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({...editResult.value});\r\n    };\r\n\r\n    const dialogInstance = Dialoger.customRender({\r\n      title: \"素材选择\",\r\n      class: \"mk-material-select\",\r\n      width: \"70%\",\r\n      onClose: () => {\r\n        dialogInstance.destroy();\r\n      },\r\n      body: () => {\r\n        return h(ImageEditPanelComponent,{attrs,ref:r=>imageEditPanelRef.value = r});\r\n      },\r\n      footer: () => {\r\n\r\n        // 下一步按钮\r\n        let nextBtns = [\r\n          <ElButton type=\"primary\" onClick={()=>selectState.value = 'attrs'}>\r\n            下一步\r\n          </ElButton>\r\n        ]\r\n\r\n        if(selectState.value == \"attrs\"){\r\n          nextBtns = [\r\n            <ElButton type=\"primary\" onClick={()=>selectState.value='select'}>\r\n              重新选图\r\n            </ElButton>,\r\n            <ElButton type=\"primary\" onClick={toCropImageHandle}>\r\n              裁切图\r\n            </ElButton>,\r\n            <ElButton type=\"primary\" onClick={handleConfirmClick}>\r\n              确定\r\n            </ElButton>\r\n          ];\r\n        }\r\n\r\n        return (\r\n          <Fragment>\r\n            <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n            {...nextBtns}\r\n          </Fragment>\r\n        );\r\n      },\r\n    });\r\n  });\r\n}\r\n"],"names":["_isSlot","s","Object","prototype","toString","call","_isVNode","selectState","ref","ImageEditPanelComponent","defineComponent","name","props","setup","expose","attrs","reactive","materialTable","MsMaterialTable","margin","computed","set","v","t","r","b","l","get","vals","split","length","selectionChangeEvent","on","id","getSelection","src","getList","find","item","path","selectImage","file","fileSelect","accept","fileRender","FileReader","onload","data","target","result","readAsDataURL","getResult","setSrc","ImageView","_createVNode","ElImage","error","ElIcon","default","Picture","panel","ElTabs","ElTabPane","ElButton","UploadFilled","_createTextVNode","MKMaterialList","ElInput","$event","Share","value","ElRow","ElCol","ElForm","ElFormItem","_mergeProps","alt","rows","width","height","maxWidth","maxHeight","ShowImageEditPanel","Promise","resolve","reject","imageEditPanelRef","editResult","toCropImageHandle","ImageCropper","handleCancelClick","dialogInstance","destroy","handleConfirmClick","Dialoger","customRender","title","class","onClose","body","h","footer","nextBtns","onClick","_Fragment"],"mappings":"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"}

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/ImageTools.vue.js

@@ -2,34 +2,13 @@
 const vue = require("vue");
 const lexical = require("lexical");
 const utils = require("@lexical/utils");
-require("@lexical/text");
-require("@lexical/overflow");
-require("tiny-invariant");
-require("@lexical/history");
-const useLexicalComposer = require("../../lexical-vue/composables/useLexicalComposer.js");
-require("@lexical/list");
-require("@lexical/dragon");
-require("@lexical/plain-text");
-require("@lexical/rich-text");
-require("@lexical/yjs");
-require("yjs");
-require("../../lexical-vue/components/LexicalDecoratedTeleports.js");
-require("@lexical/html");
-require("@lexical/link");
-require("@lexical/mark");
-require("@lexical/table");
-require("@lexical/hashtag");
-require("@lexical/markdown");
-require("../../lexical-vue/composables/useCollaborationContext.js");
-require("../../lexical-vue/components/LexicalMenu/shared.js");
-require("../../lexical-vue/components/LexicalAutoEmbedPlugin/shared.js");
-require("../../lexical-vue/components/LexicalTypeaheadMenuPlugin/shared.js");
+const lexicalVue = require("lexical-vue");
 const index = require("./index.js");
 const lowPriority = 1;
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "ImageTools",
   setup(__props) {
-    const editor = useLexicalComposer.useLexicalComposer();
+    const editor = lexicalVue.useLexicalComposer();
     const alignList = vue.ref(["left", "center", "right"]);
     const alignValue = vue.ref("left");
     const isFloat = vue.ref(false);

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/ImageTools.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageTools.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/ImageTools.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { \r\n  type CommandListenerPriority,\r\n  ElementFormatType,SELECTION_CHANGE_COMMAND,$getSelection,$isNodeSelection } from 'lexical'\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { onMounted, onUnmounted,ref } from 'vue'\r\nimport { useLexicalComposer } from '../../lexical-vue'\r\nimport { ImageAttrData,IMAGE_ATTRS_CHANGE,REMOVE_IMAGE_COMMAND,ImageNode } from './index'\r\n\r\n \r\nconst lowPriority: CommandListenerPriority = 1\r\nconst editor = useLexicalComposer()\r\n// 对齐方式\r\nconst alignList = ref<ElementFormatType[]>([\"left\",\"center\",\"right\"])\r\nconst alignValue = ref<any>(\"left\")\r\nconst isFloat = ref<boolean>(false);\r\n\r\n// 设置图片属性\r\nconst setImageAttr = (name:string,value:string|undefined|null)=>{\r\n  editor.dispatchCommand(IMAGE_ATTRS_CHANGE,{value,name} as ImageAttrData)\r\n}\r\n\r\nonMounted(()=>{\r\n\r\n  const unregisterMergeListener = mergeRegister(\r\n    editor.registerCommand(IMAGE_ATTRS_CHANGE, (payload:ImageAttrData) => {\r\n      if(payload.name == \"align\"){\r\n        alignValue.value = payload.value;\r\n      }\r\n      return false;\r\n    },lowPriority),\r\n    editor.registerCommand(SELECTION_CHANGE_COMMAND, (payload, newEditor) => {\r\n        \r\n      const selection = $getSelection();\r\n\r\n      if($isNodeSelection(selection)){\r\n\r\n        const node = selection.getNodes()[0] as ImageNode;\r\n\r\n        // 是图片\r\n        if(node?.__attrs != null && node.__type == ImageNode.getType()){\r\n          // 判断是否有浮动\r\n          isFloat.value = node.__attrs.float != null && node.__attrs.float != \"\";\r\n          alignValue.value = isFloat.value ? node.__attrs.float : node.getParent()?.getFormatType() ?? \"left\"\r\n        }\r\n        \r\n      }\r\n      return false;\r\n    },lowPriority)\r\n  )\r\n\r\n  // 卸载\r\n  onUnmounted(() => unregisterMergeListener())\r\n\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n   <el-button-group>\r\n    <template v-for=\"item in alignList\" :key=\"item\">\r\n      <el-button text :class=\"{active:alignValue == item}\" v-if=\"isFloat ? item != 'center':true\" @click=\"setImageAttr('align',item)\">\r\n        <MKSvgIcon :iconClass=\"`doc-align-${item}`\" /> \r\n      </el-button>\r\n    </template>\r\n    <el-button text  @click=\"setImageAttr('edit',null)\">\r\n      <MKSvgIcon :iconClass=\"`Edit`\" /> \r\n    </el-button>\r\n    <el-button text type=\"danger\" v-if=\"!isFloat\" @click=\"editor.dispatchCommand(REMOVE_IMAGE_COMMAND,null)\">\r\n      <MKSvgIcon :iconClass=\"`Delete`\" /> \r\n    </el-button>\r\n  </el-button-group>\r\n</template>\r\n"],"names":["useLexicalComposer","ref","IMAGE_ATTRS_CHANGE","onMounted","mergeRegister","SELECTION_CHANGE_COMMAND","$getSelection","$isNodeSelection","ImageNode","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,cAAuC;;;;AAC7C,UAAM,SAASA,mBAAAA;AAEf,UAAM,YAAYC,IAAAA,IAAyB,CAAC,QAAO,UAAS,OAAO,CAAC;AAC9D,UAAA,aAAaA,QAAS,MAAM;AAC5B,UAAA,UAAUA,QAAa,KAAK;AAG5B,UAAA,eAAe,CAAC,MAAY,UAA8B;AAC9D,aAAO,gBAAgBC,MAAA,oBAAmB,EAAC,OAAM,KAAsB,CAAA;AAAA,IAAA;AAGzEC,QAAAA,UAAU,MAAI;AAEZ,YAAM,0BAA0BC,MAAA;AAAA,QAC9B,OAAO,gBAAgBF,0BAAoB,CAAC,YAA0B;AACjE,cAAA,QAAQ,QAAQ,SAAQ;AACzB,uBAAW,QAAQ,QAAQ;AAAA,UAC7B;AACO,iBAAA;AAAA,WACP,WAAW;AAAA,QACb,OAAO,gBAAgBG,QAAAA,0BAA0B,CAAC,SAAS,cAAc;;AAEvE,gBAAM,YAAYC,QAAAA;AAEf,cAAAC,QAAAA,iBAAiB,SAAS,GAAE;AAE7B,kBAAM,OAAO,UAAU,SAAS,EAAE,CAAC;AAGnC,iBAAG,6BAAM,YAAW,QAAQ,KAAK,UAAUC,MAAAA,UAAU,WAAU;AAE7D,sBAAQ,QAAQ,KAAK,QAAQ,SAAS,QAAQ,KAAK,QAAQ,SAAS;AACzD,yBAAA,QAAQ,QAAQ,QAAQ,KAAK,QAAQ,UAAQ,UAAK,UAAA,MAAL,mBAAkB,oBAAmB;AAAA,YAC/F;AAAA,UAEF;AACO,iBAAA;AAAA,WACP,WAAW;AAAA,MAAA;AAIHC,sBAAA,MAAM,yBAAyB;AAAA,IAAA,CAE5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ImageTools.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/ImageTools.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { \r\n  type CommandListenerPriority,\r\n  ElementFormatType,SELECTION_CHANGE_COMMAND,$getSelection,$isNodeSelection } from 'lexical'\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { onMounted, onUnmounted,ref } from 'vue'\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { ImageAttrData,IMAGE_ATTRS_CHANGE,REMOVE_IMAGE_COMMAND,ImageNode } from './index'\r\n\r\n \r\nconst lowPriority: CommandListenerPriority = 1\r\nconst editor = useLexicalComposer()\r\n// 对齐方式\r\nconst alignList = ref<ElementFormatType[]>([\"left\",\"center\",\"right\"])\r\nconst alignValue = ref<any>(\"left\")\r\nconst isFloat = ref<boolean>(false);\r\n\r\n// 设置图片属性\r\nconst setImageAttr = (name:string,value:string|undefined|null)=>{\r\n  editor.dispatchCommand(IMAGE_ATTRS_CHANGE,{value,name} as ImageAttrData)\r\n}\r\n\r\nonMounted(()=>{\r\n\r\n  const unregisterMergeListener = mergeRegister(\r\n    editor.registerCommand(IMAGE_ATTRS_CHANGE, (payload:ImageAttrData) => {\r\n      if(payload.name == \"align\"){\r\n        alignValue.value = payload.value;\r\n      }\r\n      return false;\r\n    },lowPriority),\r\n    editor.registerCommand(SELECTION_CHANGE_COMMAND, (payload, newEditor) => {\r\n        \r\n      const selection = $getSelection();\r\n\r\n      if($isNodeSelection(selection)){\r\n\r\n        const node = selection.getNodes()[0] as ImageNode;\r\n\r\n        // 是图片\r\n        if(node?.__attrs != null && node.__type == ImageNode.getType()){\r\n          // 判断是否有浮动\r\n          isFloat.value = node.__attrs.float != null && node.__attrs.float != \"\";\r\n          alignValue.value = isFloat.value ? node.__attrs.float : node.getParent()?.getFormatType() ?? \"left\"\r\n        }\r\n        \r\n      }\r\n      return false;\r\n    },lowPriority)\r\n  )\r\n\r\n  // 卸载\r\n  onUnmounted(() => unregisterMergeListener())\r\n\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n   <el-button-group>\r\n    <template v-for=\"item in alignList\" :key=\"item\">\r\n      <el-button text :class=\"{active:alignValue == item}\" v-if=\"isFloat ? item != 'center':true\" @click=\"setImageAttr('align',item)\">\r\n        <MKSvgIcon :iconClass=\"`doc-align-${item}`\" /> \r\n      </el-button>\r\n    </template>\r\n    <el-button text  @click=\"setImageAttr('edit',null)\">\r\n      <MKSvgIcon :iconClass=\"`Edit`\" /> \r\n    </el-button>\r\n    <el-button text type=\"danger\" v-if=\"!isFloat\" @click=\"editor.dispatchCommand(REMOVE_IMAGE_COMMAND,null)\">\r\n      <MKSvgIcon :iconClass=\"`Delete`\" /> \r\n    </el-button>\r\n  </el-button-group>\r\n</template>\r\n"],"names":["useLexicalComposer","ref","IMAGE_ATTRS_CHANGE","onMounted","mergeRegister","SELECTION_CHANGE_COMMAND","$getSelection","$isNodeSelection","ImageNode","onUnmounted"],"mappings":";;;;;;AAUA,MAAM,cAAuC;;;;AAC7C,UAAM,SAASA,WAAAA;AAEf,UAAM,YAAYC,IAAAA,IAAyB,CAAC,QAAO,UAAS,OAAO,CAAC;AAC9D,UAAA,aAAaA,QAAS,MAAM;AAC5B,UAAA,UAAUA,QAAa,KAAK;AAG5B,UAAA,eAAe,CAAC,MAAY,UAA8B;AAC9D,aAAO,gBAAgBC,MAAA,oBAAmB,EAAC,OAAM,KAAsB,CAAA;AAAA,IAAA;AAGzEC,QAAAA,UAAU,MAAI;AAEZ,YAAM,0BAA0BC,MAAA;AAAA,QAC9B,OAAO,gBAAgBF,0BAAoB,CAAC,YAA0B;AACjE,cAAA,QAAQ,QAAQ,SAAQ;AACzB,uBAAW,QAAQ,QAAQ;AAAA,UAC7B;AACO,iBAAA;AAAA,WACP,WAAW;AAAA,QACb,OAAO,gBAAgBG,QAAAA,0BAA0B,CAAC,SAAS,cAAc;;AAEvE,gBAAM,YAAYC,QAAAA;AAEf,cAAAC,QAAAA,iBAAiB,SAAS,GAAE;AAE7B,kBAAM,OAAO,UAAU,SAAS,EAAE,CAAC;AAGnC,iBAAG,6BAAM,YAAW,QAAQ,KAAK,UAAUC,MAAAA,UAAU,WAAU;AAE7D,sBAAQ,QAAQ,KAAK,QAAQ,SAAS,QAAQ,KAAK,QAAQ,SAAS;AACzD,yBAAA,QAAQ,QAAQ,QAAQ,KAAK,QAAQ,UAAQ,UAAK,UAAA,MAAL,mBAAkB,oBAAmB;AAAA,YAC/F;AAAA,UAEF;AACO,iBAAA;AAAA,WACP,WAAW;AAAA,MAAA;AAIHC,sBAAA,MAAM,yBAAyB;AAAA,IAAA,CAE5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}