@webiny/lexical-nodes 5.43.3 → 6.0.0-alpha.1

package/ParagraphNode.js

@@ -1,194 +1,156 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.$createParagraphNode = $createParagraphNode;
-exports.$isParagraphNode = $isParagraphNode;
-exports.ParagraphNode = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
-var _superPropGet2 = _interopRequireDefault(require("@babel/runtime/helpers/superPropGet"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _lexical = require("lexical");
-var _lexicalTheme = require("@webiny/lexical-theme");
-var _utils = require("@lexical/utils");
-var ParagraphNode = exports.ParagraphNode = /*#__PURE__*/function (_BaseParagraphNode) {
-  function ParagraphNode(typographyStyleId, key) {
-    var _this;
-    (0, _classCallCheck2.default)(this, ParagraphNode);
-    _this = (0, _callSuper2.default)(this, ParagraphNode, [key]);
-    (0, _defineProperty2.default)(_this, "__styles", []);
-    if (typographyStyleId) {
-      _this.__styles.push({
-        styleId: typographyStyleId,
-        type: "typography"
-      });
-    }
-    return _this;
-  }
-  (0, _inherits2.default)(ParagraphNode, _BaseParagraphNode);
-  return (0, _createClass2.default)(ParagraphNode, [{
-    key: "setDefaultTypography",
-    value: function setDefaultTypography(themeEmotionMap) {
-      var typographyStyle = (0, _lexicalTheme.findTypographyStyleByHtmlTag)("p", themeEmotionMap);
-      if (typographyStyle) {
-        this.__styles.push({
-          styleId: typographyStyle.id,
-          type: "typography"
-        });
-      }
-    }
-  }, {
-    key: "getTypographyStyleId",
-    value: function getTypographyStyleId() {
-      var style = this.__styles.find(function (x) {
-        return x.type === "typography";
-      });
-      return style?.styleId || undefined;
-    }
-  }, {
-    key: "hasTypographyStyle",
-    value: function hasTypographyStyle() {
-      return !!this.getTypographyStyleId();
+import { ParagraphNode as BaseParagraphNode } from "lexical";
+import { findTypographyStyleByHtmlTag } from "@webiny/lexical-theme";
+import { addClassNamesToElement } from "@lexical/utils";
+import { getStyleId } from "./utils/getStyleId";
+function convertParagraphElement(element) {
+  const node = $createParagraphNode();
+  if (element.style) {
+    node.setFormat(element.style.textAlign);
+  }
+  return {
+    node
+  };
+}
+export class ParagraphNode extends BaseParagraphNode {
+  constructor(options = {}) {
+    const {
+      styleId,
+      key,
+      className
+    } = options;
+    super(key);
+    this.__styleId = styleId;
+    this.__className = className;
+  }
+  getStyleId() {
+    return this.__styleId;
+  }
+  setStyleId(styleId) {
+    this.__styleId = styleId;
+  }
+  setClassName(className) {
+    this.__className = className;
+  }
+  getClassName() {
+    return this.__className;
+  }
+  static getType() {
+    return "wby-paragraph";
+  }
+  static clone(node) {
+    return new ParagraphNode({
+      styleId: node.getStyleId(),
+      className: node.getClassName(),
+      key: node.__key
+    });
+  }
+  insertNewAfter(rangeSelection, restoreSelection) {
+    const newElement = $createParagraphNode();
+    newElement.setTextFormat(rangeSelection.format);
+    newElement.setTextStyle(rangeSelection.style);
+    const direction = this.getDirection();
+    newElement.setDirection(direction);
+    newElement.setFormat(this.getFormatType());
+    newElement.setStyle(this.getStyle());
+    this.insertAfter(newElement, restoreSelection);
+    return newElement;
+  }
+  createDOM(config) {
+    const element = super.createDOM(config);
+    return this.updateElementWithThemeClasses(element, config.theme);
+  }
+  exportDOM(editor) {
+    const base = super.exportDOM(editor);
+    const element = base.element;
+    if (element && this.__className) {
+      element.classList.add(this.__className);
     }
-  }, {
-    key: "getThemeStyles",
-    value: function getThemeStyles() {
-      // getLatest() ensures we are getting the most
-      // up-to-date value from the EditorState.
-      var self = (0, _superPropGet2.default)(ParagraphNode, "getLatest", this, 3)([]);
-      return self.__styles;
+    return {
+      ...base,
+      element
+    };
+  }
+  updateDOM(prevNode, dom, config) {
+    const prevTypoStyleId = prevNode.getStyleId();
+    const nextTypoStyleId = this.getStyleId();
+    if (!nextTypoStyleId) {
+      this.updateElementWithThemeClasses(dom, config.theme);
+      return false;
     }
-  }, {
-    key: "setThemeStyles",
-    value: function setThemeStyles(styles) {
-      // getWritable() creates a clone of the node
-      // if needed, to ensure we don't try and mutate
-      // a stale version of this node.
-      var self = (0, _superPropGet2.default)(ParagraphNode, "getWritable", this, 3)([]);
-      self.__styles = (0, _toConsumableArray2.default)(styles);
-      return self;
+    if (prevTypoStyleId !== nextTypoStyleId && nextTypoStyleId) {
+      this.updateElementWithThemeClasses(dom, config.theme);
     }
-  }, {
-    key: "updateElementWithThemeClasses",
-    value: function updateElementWithThemeClasses(element, theme) {
-      if (!theme?.emotionMap) {
-        return element;
-      }
-      if (!this.hasTypographyStyle()) {
-        this.setDefaultTypography(theme.emotionMap);
-      }
-      var typoStyleId = this.getTypographyStyleId();
-      var themeClasses;
+    // Returning false tells Lexical that this node does not need its
+    // DOM element replacing with a new copy from createDOM.
+    return false;
+  }
 
-      // Typography css class
-      if (typoStyleId) {
-        var typographyStyle = theme.emotionMap[typoStyleId];
-        if (typographyStyle) {
-          themeClasses = typographyStyle.className;
-        }
-      }
-      if (themeClasses) {
-        (0, _utils.addClassNamesToElement)(element, themeClasses);
-      }
-      return element;
-    }
-  }, {
-    key: "createDOM",
-    value: function createDOM(config) {
-      var element = (0, _superPropGet2.default)(ParagraphNode, "createDOM", this, 3)([config]);
-      return this.updateElementWithThemeClasses(element, config.theme);
-    }
-  }, {
-    key: "updateDOM",
-    value: function updateDOM(prevNode, dom, config) {
-      var prevTypoStyleId = prevNode.getTypographyStyleId();
-      var nextTypoStyleId = this.getTypographyStyleId();
-      if (!nextTypoStyleId) {
-        this.updateElementWithThemeClasses(dom, config.theme);
-        return false;
-      }
-      if (prevTypoStyleId !== nextTypoStyleId && nextTypoStyleId) {
-        this.updateElementWithThemeClasses(dom, config.theme);
-      }
-      // Returning false tells Lexical that this node does not need its
-      // DOM element replacing with a new copy from createDOM.
-      return false;
-    }
+  /*
+   * On copy/paste event this method will be executed in and create a node
+   * */
+  static importDOM() {
+    return {
+      p: () => ({
+        conversion: convertParagraphElement,
+        priority: 0
+      })
+    };
+  }
 
-    /*
-     * On copy/paste event this method will be executed in and create a node
-     * */
-  }, {
-    key: "exportJSON",
-    value:
-    /*
-     * Serialize the node to JSON data representation.
-     * */
-    function exportJSON() {
-      return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _superPropGet2.default)(ParagraphNode, "exportJSON", this, 3)([])), {}, {
-        styles: this.__styles,
-        type: "paragraph-element",
-        version: 1
-      });
-    }
-  }], [{
-    key: "getType",
-    value: function getType() {
-      return "paragraph-element";
+  /*
+   * Serialize the JSON data back into a node
+   */
+  static importJSON(serializedNode) {
+    const node = $createParagraphNode();
+    node.setFormat(serializedNode.format);
+    node.setIndent(serializedNode.indent);
+    node.setDirection(serializedNode.direction);
+    const styleId = getStyleId({
+      styleId: serializedNode.styleId,
+      styles: serializedNode.styles
+    });
+    node.setStyleId(styleId);
+    node.setClassName(serializedNode.className);
+    return node;
+  }
+
+  /*
+   * Serialize the node to JSON data representation.
+   * */
+  exportJSON() {
+    return {
+      ...super.exportJSON(),
+      styleId: this.__styleId,
+      className: this.__className,
+      type: "wby-paragraph"
+    };
+  }
+  updateElementWithThemeClasses(element, theme) {
+    if (!theme?.emotionMap) {
+      return element;
     }
-  }, {
-    key: "clone",
-    value: function clone(node) {
-      return new ParagraphNode(node.getTypographyStyleId(), node.__key);
+    if (!this.__styleId || !this.__className) {
+      this.setDefaultTypography(theme.emotionMap);
     }
-  }, {
-    key: "importDOM",
-    value: function importDOM() {
-      return {
-        p: function p() {
-          return {
-            conversion: convertParagraphElement,
-            priority: 0
-          };
-        }
-      };
+    if (this.__className) {
+      addClassNamesToElement(element, this.__className);
     }
-
-    /*
-     * Serialize the JSON data back into a node
-     */
-  }, {
-    key: "importJSON",
-    value: function importJSON(serializedNode) {
-      var node = $createParagraphNode();
-      node.setFormat(serializedNode.format);
-      node.setIndent(serializedNode.indent);
-      node.setDirection(serializedNode.direction);
-      node.setThemeStyles(serializedNode.styles);
-      return node;
+    return element;
+  }
+  setDefaultTypography(themeEmotionMap) {
+    const typographyStyle = findTypographyStyleByHtmlTag("p", themeEmotionMap);
+    if (typographyStyle) {
+      this.__styleId = typographyStyle.id;
+      this.__className = typographyStyle.className;
     }
-  }]);
-}(_lexical.ParagraphNode);
-function convertParagraphElement(element) {
-  var node = $createParagraphNode();
-  if (element.style) {
-    node.setFormat(element.style.textAlign);
   }
-  return {
-    node: node
-  };
 }
-function $createParagraphNode(typographyStyleId) {
-  return (0, _lexical.$applyNodeReplacement)(new ParagraphNode(typographyStyleId));
+export function $createParagraphNode(styleId) {
+  return new ParagraphNode({
+    styleId
+  });
 }
-function $isParagraphNode(node) {
+export function $isParagraphNode(node) {
   return node instanceof ParagraphNode;
 }
 

package/ParagraphNode.js.map

@@ -1 +1 @@
-{"version":3,"names":["_lexical","require","_lexicalTheme","_utils","ParagraphNode","exports","_BaseParagraphNode","typographyStyleId","key","_this","_classCallCheck2","default","_callSuper2","_defineProperty2","__styles","push","styleId","type","_inherits2","_createClass2","value","setDefaultTypography","themeEmotionMap","typographyStyle","findTypographyStyleByHtmlTag","id","getTypographyStyleId","style","find","x","undefined","hasTypographyStyle","getThemeStyles","self","_superPropGet2","setThemeStyles","styles","_toConsumableArray2","updateElementWithThemeClasses","element","theme","emotionMap","typoStyleId","themeClasses","className","addClassNamesToElement","createDOM","config","updateDOM","prevNode","dom","prevTypoStyleId","nextTypoStyleId","exportJSON","_objectSpread2","version","getType","clone","node","__key","importDOM","p","conversion","convertParagraphElement","priority","importJSON","serializedNode","$createParagraphNode","setFormat","format","setIndent","indent","setDirection","direction","BaseParagraphNode","textAlign","$applyNodeReplacement","$isParagraphNode"],"sources":["ParagraphNode.ts"],"sourcesContent":["import {\n    $applyNodeReplacement,\n    DOMConversionMap,\n    DOMConversionOutput,\n    ElementFormatType,\n    LexicalNode,\n    NodeKey,\n    ParagraphNode as BaseParagraphNode,\n    SerializedParagraphNode as SerializedBaseParagraphNode,\n    Spread\n} from \"lexical\";\nimport { EditorConfig } from \"lexical\";\nimport { EditorTheme, ThemeEmotionMap, findTypographyStyleByHtmlTag } from \"@webiny/lexical-theme\";\nimport { addClassNamesToElement } from \"@lexical/utils\";\nimport { TypographyStylesNode, ThemeStyleValue, TextNodeThemeStyles } from \"~/types\";\n\nexport type SerializeParagraphNode = Spread<\n    {\n        styles: ThemeStyleValue[];\n        type: \"paragraph-element\";\n    },\n    SerializedBaseParagraphNode\n>;\n\nexport class ParagraphNode\n    extends BaseParagraphNode\n    implements TextNodeThemeStyles, TypographyStylesNode\n{\n    __styles: ThemeStyleValue[] = [];\n\n    constructor(typographyStyleId?: string, key?: NodeKey) {\n        super(key);\n\n        if (typographyStyleId) {\n            this.__styles.push({ styleId: typographyStyleId, type: \"typography\" });\n        }\n    }\n\n    protected setDefaultTypography(themeEmotionMap: ThemeEmotionMap) {\n        const typographyStyle = findTypographyStyleByHtmlTag(\"p\", themeEmotionMap);\n        if (typographyStyle) {\n            this.__styles.push({ styleId: typographyStyle.id, type: \"typography\" });\n        }\n    }\n\n    getTypographyStyleId(): string | undefined {\n        const style = this.__styles.find(x => x.type === \"typography\");\n        return style?.styleId || undefined;\n    }\n\n    private hasTypographyStyle(): boolean {\n        return !!this.getTypographyStyleId();\n    }\n\n    getThemeStyles(): ThemeStyleValue[] {\n        // getLatest() ensures we are getting the most\n        // up-to-date value from the EditorState.\n        const self = super.getLatest();\n        return self.__styles;\n    }\n\n    setThemeStyles(styles: ThemeStyleValue[]) {\n        // getWritable() creates a clone of the node\n        // if needed, to ensure we don't try and mutate\n        // a stale version of this node.\n        const self = super.getWritable();\n        self.__styles = [...styles];\n        return self;\n    }\n\n    static override getType(): string {\n        return \"paragraph-element\";\n    }\n\n    static override clone(node: ParagraphNode): ParagraphNode {\n        return new ParagraphNode(node.getTypographyStyleId(), node.__key);\n    }\n\n    private updateElementWithThemeClasses(element: HTMLElement, theme: EditorTheme): HTMLElement {\n        if (!theme?.emotionMap) {\n            return element;\n        }\n\n        if (!this.hasTypographyStyle()) {\n            this.setDefaultTypography(theme.emotionMap);\n        }\n\n        const typoStyleId = this.getTypographyStyleId();\n\n        let themeClasses;\n\n        // Typography css class\n        if (typoStyleId) {\n            const typographyStyle = theme.emotionMap[typoStyleId];\n            if (typographyStyle) {\n                themeClasses = typographyStyle.className;\n            }\n        }\n\n        if (themeClasses) {\n            addClassNamesToElement(element, themeClasses);\n        }\n\n        return element;\n    }\n\n    override createDOM(config: EditorConfig): HTMLElement {\n        const element = super.createDOM(config);\n        return this.updateElementWithThemeClasses(element, config.theme as EditorTheme);\n    }\n\n    override updateDOM(prevNode: ParagraphNode, dom: HTMLElement, config: EditorConfig): boolean {\n        const prevTypoStyleId = prevNode.getTypographyStyleId();\n        const nextTypoStyleId = this.getTypographyStyleId();\n\n        if (!nextTypoStyleId) {\n            this.updateElementWithThemeClasses(dom, config.theme as EditorTheme);\n            return false;\n        }\n\n        if (prevTypoStyleId !== nextTypoStyleId && nextTypoStyleId) {\n            this.updateElementWithThemeClasses(dom, config.theme as EditorTheme);\n        }\n        // Returning false tells Lexical that this node does not need its\n        // DOM element replacing with a new copy from createDOM.\n        return false;\n    }\n\n    /*\n     * On copy/paste event this method will be executed in and create a node\n     * */\n    static override importDOM(): DOMConversionMap | null {\n        return {\n            p: () => ({\n                conversion: convertParagraphElement,\n                priority: 0\n            })\n        };\n    }\n\n    /*\n     * Serialize the JSON data back into a node\n     */\n    static override importJSON(serializedNode: SerializeParagraphNode): BaseParagraphNode {\n        const node = $createParagraphNode();\n        node.setFormat(serializedNode.format);\n        node.setIndent(serializedNode.indent);\n        node.setDirection(serializedNode.direction);\n        node.setThemeStyles(serializedNode.styles);\n        return node;\n    }\n\n    /*\n     * Serialize the node to JSON data representation.\n     * */\n    override exportJSON(): SerializeParagraphNode {\n        return {\n            ...super.exportJSON(),\n            styles: this.__styles,\n            type: \"paragraph-element\",\n            version: 1\n        };\n    }\n}\n\nfunction convertParagraphElement(element: HTMLElement): DOMConversionOutput {\n    const node = $createParagraphNode();\n    if (element.style) {\n        node.setFormat(element.style.textAlign as ElementFormatType);\n    }\n\n    return { node };\n}\n\nexport function $createParagraphNode(typographyStyleId?: string): ParagraphNode {\n    return $applyNodeReplacement(new ParagraphNode(typographyStyleId));\n}\n\nexport function $isParagraphNode(node: LexicalNode | null | undefined): node is ParagraphNode {\n    return node instanceof ParagraphNode;\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["ParagraphNode","BaseParagraphNode","findTypographyStyleByHtmlTag","addClassNamesToElement","getStyleId","convertParagraphElement","element","node","$createParagraphNode","style","setFormat","textAlign","constructor","options","styleId","key","className","__styleId","__className","setStyleId","setClassName","getClassName","getType","clone","__key","insertNewAfter","rangeSelection","restoreSelection","newElement","setTextFormat","format","setTextStyle","direction","getDirection","setDirection","getFormatType","setStyle","getStyle","insertAfter","createDOM","config","updateElementWithThemeClasses","theme","exportDOM","editor","base","classList","add","updateDOM","prevNode","dom","prevTypoStyleId","nextTypoStyleId","importDOM","p","conversion","priority","importJSON","serializedNode","setIndent","indent","styles","exportJSON","type","emotionMap","setDefaultTypography","themeEmotionMap","typographyStyle","id","$isParagraphNode"],"sources":["ParagraphNode.ts"],"sourcesContent":["import type {\n    DOMConversionMap,\n    DOMConversionOutput,\n    ElementFormatType,\n    LexicalNode,\n    NodeKey,\n    SerializedParagraphNode as SerializedBaseParagraphNode,\n    Spread,\n    LexicalEditor,\n    DOMExportOutput,\n    RangeSelection\n} from \"lexical\";\nimport { ParagraphNode as BaseParagraphNode } from \"lexical\";\nimport type { EditorConfig } from \"lexical\";\nimport type { EditorTheme, ThemeEmotionMap } from \"@webiny/lexical-theme\";\nimport { findTypographyStyleByHtmlTag } from \"@webiny/lexical-theme\";\nimport { addClassNamesToElement } from \"@lexical/utils\";\nimport type { TypographyStylesNode, ThemeStyleValue } from \"~/types\";\nimport { getStyleId } from \"./utils/getStyleId\";\n\nfunction convertParagraphElement(element: HTMLElement): DOMConversionOutput {\n    const node = $createParagraphNode();\n    if (element.style) {\n        node.setFormat(element.style.textAlign as ElementFormatType);\n    }\n\n    return { node };\n}\n\nexport type SerializeParagraphNode = Spread<\n    {\n        styles?: ThemeStyleValue[];\n        styleId?: string;\n        className?: string;\n        type: \"wby-paragraph\";\n    },\n    SerializedBaseParagraphNode\n>;\n\ninterface ParagraphNodeOptions {\n    className?: string;\n    styleId?: string;\n    key?: NodeKey;\n}\n\nexport class ParagraphNode extends BaseParagraphNode implements TypographyStylesNode {\n    private __styleId: string | undefined;\n    private __className: string | undefined;\n\n    constructor(options: ParagraphNodeOptions = {}) {\n        const { styleId, key, className } = options;\n        super(key);\n\n        this.__styleId = styleId;\n        this.__className = className;\n    }\n\n    getStyleId(): string | undefined {\n        return this.__styleId;\n    }\n\n    setStyleId(styleId: string | undefined) {\n        this.__styleId = styleId;\n    }\n\n    setClassName(className: string | undefined) {\n        this.__className = className;\n    }\n\n    getClassName(): string | undefined {\n        return this.__className;\n    }\n\n    static override getType(): string {\n        return \"wby-paragraph\";\n    }\n\n    static override clone(node: ParagraphNode): ParagraphNode {\n        return new ParagraphNode({\n            styleId: node.getStyleId(),\n            className: node.getClassName(),\n            key: node.__key\n        });\n    }\n\n    override insertNewAfter(\n        rangeSelection: RangeSelection,\n        restoreSelection: boolean\n    ): ParagraphNode {\n        const newElement = $createParagraphNode();\n        newElement.setTextFormat(rangeSelection.format);\n        newElement.setTextStyle(rangeSelection.style);\n        const direction = this.getDirection();\n        newElement.setDirection(direction);\n        newElement.setFormat(this.getFormatType());\n        newElement.setStyle(this.getStyle());\n        this.insertAfter(newElement, restoreSelection);\n        return newElement;\n    }\n\n    override createDOM(config: EditorConfig): HTMLElement {\n        const element = super.createDOM(config);\n        return this.updateElementWithThemeClasses(element, config.theme as EditorTheme);\n    }\n\n    override exportDOM(editor: LexicalEditor): DOMExportOutput {\n        const base = super.exportDOM(editor);\n\n        const element = base.element as HTMLElement;\n        if (element && this.__className) {\n            element.classList.add(this.__className);\n        }\n\n        return { ...base, element };\n    }\n\n    override updateDOM(prevNode: ParagraphNode, dom: HTMLElement, config: EditorConfig): boolean {\n        const prevTypoStyleId = prevNode.getStyleId();\n        const nextTypoStyleId = this.getStyleId();\n\n        if (!nextTypoStyleId) {\n            this.updateElementWithThemeClasses(dom, config.theme as EditorTheme);\n            return false;\n        }\n\n        if (prevTypoStyleId !== nextTypoStyleId && nextTypoStyleId) {\n            this.updateElementWithThemeClasses(dom, config.theme as EditorTheme);\n        }\n        // Returning false tells Lexical that this node does not need its\n        // DOM element replacing with a new copy from createDOM.\n        return false;\n    }\n\n    /*\n     * On copy/paste event this method will be executed in and create a node\n     * */\n    static override importDOM(): DOMConversionMap | null {\n        return {\n            p: () => ({\n                conversion: convertParagraphElement,\n                priority: 0\n            })\n        };\n    }\n\n    /*\n     * Serialize the JSON data back into a node\n     */\n    static override importJSON(serializedNode: SerializeParagraphNode): BaseParagraphNode {\n        const node = $createParagraphNode();\n        node.setFormat(serializedNode.format);\n        node.setIndent(serializedNode.indent);\n        node.setDirection(serializedNode.direction);\n\n        const styleId = getStyleId({\n            styleId: serializedNode.styleId,\n            styles: serializedNode.styles\n        });\n\n        node.setStyleId(styleId);\n        node.setClassName(serializedNode.className);\n        return node;\n    }\n\n    /*\n     * Serialize the node to JSON data representation.\n     * */\n    override exportJSON(): SerializeParagraphNode {\n        return {\n            ...super.exportJSON(),\n            styleId: this.__styleId,\n            className: this.__className,\n            type: \"wby-paragraph\"\n        };\n    }\n\n    protected updateElementWithThemeClasses(element: HTMLElement, theme: EditorTheme): HTMLElement {\n        if (!theme?.emotionMap) {\n            return element;\n        }\n\n        if (!this.__styleId || !this.__className) {\n            this.setDefaultTypography(theme.emotionMap);\n        }\n\n        if (this.__className) {\n            addClassNamesToElement(element, this.__className);\n        }\n\n        return element;\n    }\n\n    private setDefaultTypography(themeEmotionMap: ThemeEmotionMap) {\n        const typographyStyle = findTypographyStyleByHtmlTag(\"p\", themeEmotionMap);\n        if (typographyStyle) {\n            this.__styleId = typographyStyle.id;\n            this.__className = typographyStyle.className;\n        }\n    }\n}\n\nexport function $createParagraphNode(styleId?: string): ParagraphNode {\n    return new ParagraphNode({ styleId });\n}\n\nexport function $isParagraphNode(node: LexicalNode | null | undefined): node is ParagraphNode {\n    return node instanceof ParagraphNode;\n}\n"],"mappings":"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","ignoreList":[]}

package/QuoteNode.d.ts

@@ -1,31 +1,38 @@
-import { DOMConversion, DOMConversionMap, EditorConfig, LexicalNode, NodeKey, Spread } from "lexical";
-import { EditorTheme, ThemeEmotionMap } from "@webiny/lexical-theme";
-import { QuoteNode as BaseQuoteNode, SerializedQuoteNode as BaseSerializedQuoteNode } from "@lexical/rich-text";
-import { TextNodeThemeStyles, ThemeStyleValue, TypographyStylesNode } from "./types";
+import type { DOMConversion, DOMConversionMap, DOMExportOutput, EditorConfig, LexicalEditor, LexicalNode, NodeKey, Spread } from "lexical";
+import type { EditorTheme } from "@webiny/lexical-theme";
+import type { SerializedQuoteNode as BaseSerializedQuoteNode } from "@lexical/rich-text";
+import { QuoteNode as BaseQuoteNode } from "@lexical/rich-text";
+import type { ThemeStyleValue, TypographyStylesNode } from "./types";
 export type SerializedQuoteNode = Spread<{
     styleId?: string;
-    styles: ThemeStyleValue[];
-    type: "webiny-quote";
+    styles?: ThemeStyleValue[];
+    className?: string;
+    type: "wby-quote";
 }, BaseSerializedQuoteNode>;
-export declare class QuoteNode extends BaseQuoteNode implements TextNodeThemeStyles, TypographyStylesNode {
-    private __themeStyleId;
-    private __styles;
-    constructor(themeStyleId?: string, key?: NodeKey);
-    getStyleId(): string;
-    protected setDefaultTypography(themeEmotionMap: ThemeEmotionMap): void;
-    protected typographyStyleExist(themeEmotionMap: ThemeEmotionMap): boolean;
-    getTypographyStyleId(): string | undefined;
-    private hasTypographyStyle;
-    getThemeStyles(): ThemeStyleValue[];
-    setThemeStyles(styles: ThemeStyleValue[]): this;
+interface QuoteNodeOptions {
+    className?: string;
+    styleId?: string;
+    key?: NodeKey;
+}
+export declare class QuoteNode extends BaseQuoteNode implements TypographyStylesNode {
+    private __styleId;
+    private __className;
+    constructor(options?: QuoteNodeOptions);
+    getStyleId(): string | undefined;
+    setStyleId(styleId: string | undefined): void;
+    setClassName(className: string | undefined): void;
+    getClassName(): string | undefined;
+    private setDefaultTypography;
     static getType(): string;
     static clone(node: QuoteNode): QuoteNode;
-    addThemeStylesToHTMLElement(element: HTMLElement, theme: EditorTheme): HTMLElement;
     createDOM(config: EditorConfig): HTMLElement;
+    exportDOM(editor: LexicalEditor): DOMExportOutput;
     static importDomConversionMap(): DOMConversion<HTMLElement> | null;
     static importDOM(): DOMConversionMap | null;
     static importJSON(serializedNode: SerializedQuoteNode): QuoteNode;
     exportJSON(): SerializedQuoteNode;
+    protected updateElementWithThemeClasses(element: HTMLElement, theme: EditorTheme): HTMLElement;
 }
-export declare function $createQuoteNode(themeStyleId?: string, key?: NodeKey): QuoteNode;
+export declare function $createQuoteNode(styleId?: string, key?: NodeKey): QuoteNode;
 export declare function $isQuoteNode(node: LexicalNode | null | undefined): node is QuoteNode;
+export {};