Bug: Issue with styling consistency with theming and using exported content in email templates, due to ParagarhNode limitations about lexical HOT 10 OPEN

    html: {
      export: new Map([[TextNode, () => ({ element: document.createElement('figure') })]]),
      import: { 'figure': () => ({ conversion: () => ({ node: $createTextNode('yolo') }), priority: 4 }) }
    },

export const htmlConfig: HTMLConfig = {
  export: new Map([
    [
      ParagraphNode,
      (editor, node) => {
        const targetNode = node as ParagraphNode;
        const element = document.createElement('p');

        if (element && isHTMLElement(element)) {
          if (targetNode.isEmpty()) {
            element.append(document.createElement('br'));
          }

          const formatType = targetNode.getFormatType();
          element.style.textAlign = formatType;

          const direction = targetNode.getDirection();
          if (direction) {
            element.dir = direction;
          }
          const indent = targetNode.getIndent();
          setElementIndent(element, indent, editor._config.theme.indent);
        }

        return {
          element,
        };
      },
    ],
  ]),
};

const DEFAULT_INDENT_VALUE = '40px';

function setElementIndent(dom: HTMLElement, indent: number, indentClassName?: string): void {
  if (indent < 1) {
    return;
  }

  if (typeof indentClassName === 'string') {
    dom.classList.add(indentClassName);
  }

  const indentationBaseValue =
    window.getComputedStyle(dom).getPropertyValue('--lexical-indent-base-value') ||
    DEFAULT_INDENT_VALUE;

  dom.style.setProperty(
    // padding-inline-start is not widely supported in email HTML, but
    // Lexical Reconciler uses padding-inline-start. Using text-indent instead.
    'text-indent',
    `${indent * parseInt(indentationBaseValue, 10)}px`
  );
}

const editorConfig = {
    ...
    nodes=[
        // Don't forget to register your custom node separately!
        CustomParagraphNode,
        {
            replace: ParagraphNode,
            with: (node: ParagraphNode) => {
                return new CustomParagraphNode();
            }
        }
    ]
}

const htmlConfig: HTMLConfig = {
  export: new Map([
    [
      ParagraphNode,
      (editor, node) => {
        const {element} = node.exportDOM(editor);

        if (element && isHTMLElement(element)) {
          element.style.margin = '0px';
        }

        return {
          element,
        };
      },
    ],
  ]),
};