Provide markdown plugin node dependencies

packages/lexical-markdown/flow/LexicalMarkdown.js.flow

@@ -21,6 +21,7 @@ export type Transformer =
   | TextMatchTransformer;
 
 export type ElementTransformer = {
+  dependencies: Array<Class<LexicalNode>>,
   export: (
     node: LexicalNode,
     traverseChildren: (node: ElementNode) => string,
@@ -43,6 +44,7 @@ export type TextFormatTransformer = $ReadOnly<{
 }>;
 
 export type TextMatchTransformer = $ReadOnly<{
+  dependencies: Array<Class<LexicalNode>>,
   export: (
     node: LexicalNode,
     exportChildren: (node: ElementNode) => string,

packages/lexical-markdown/src/MarkdownShortcuts.ts

@@ -24,6 +24,7 @@ import {
   $isTextNode,
   $setSelection,
 } from 'lexical';
+import invariant from 'shared/invariant';
 
 import {TRANSFORMERS} from '.';
 import {indexBy, PUNCTUATION_OR_SPACE, transformersByType} from './utils';
@@ -333,6 +334,19 @@ export function registerMarkdownShortcuts(
     ({trigger}) => trigger,
   );
 
+  for (const transformer of transformers) {
+    const type = transformer.type;
+    if (type === 'element' || type === 'text-match') {
+      const dependencies = transformer.dependencies;
+      if (!editor.hasNodes(dependencies)) {
+        invariant(
+          false,
+          'MarkdownShortcuts: missing dependency for transformer. Ensure node dependency is included in editor initial config.',
+        );
+      }
+    }
+  }
+
   const transform = (
     parentNode: ElementNode,
     anchorNode: TextNode,

packages/lexical-markdown/src/MarkdownTransformers.ts

@@ -6,23 +6,33 @@
  *
  */
 
-import type {ListNode, ListType} from '@lexical/list';
+import type {ListType} from '@lexical/list';
 import type {HeadingTagType} from '@lexical/rich-text';
-import type {ElementNode, LexicalNode, TextFormatType, TextNode} from 'lexical';
+import type {
+  ElementNode,
+  Klass,
+  LexicalNode,
+  TextFormatType,
+  TextNode,
+} from 'lexical';
 
-import {$createCodeNode, $isCodeNode} from '@lexical/code';
-import {$createLinkNode, $isLinkNode} from '@lexical/link';
+import {$createCodeNode, $isCodeNode, CodeNode} from '@lexical/code';
+import {$createLinkNode, $isLinkNode, LinkNode} from '@lexical/link';
 import {
   $createListItemNode,
   $createListNode,
   $isListItemNode,
   $isListNode,
+  ListItemNode,
+  ListNode,
 } from '@lexical/list';
 import {
   $createHeadingNode,
   $createQuoteNode,
   $isHeadingNode,
   $isQuoteNode,
+  HeadingNode,
+  QuoteNode,
 } from '@lexical/rich-text';
 import {$createLineBreakNode, $createTextNode, $isTextNode} from 'lexical';
 
@@ -32,6 +42,7 @@ export type Transformer =
   | TextMatchTransformer;
 
 export type ElementTransformer = {
+  dependencies: Array<Klass<LexicalNode>>;
   export: (
     node: LexicalNode,
     // eslint-disable-next-line no-shadow
@@ -55,6 +66,7 @@ export type TextFormatTransformer = Readonly<{
 }>;
 
 export type TextMatchTransformer = Readonly<{
+  dependencies: Array<Klass<LexicalNode>>;
   export: (
     node: LexicalNode,
     // eslint-disable-next-line no-shadow
@@ -144,6 +156,7 @@ const listExport = (
 };
 
 export const HEADING: ElementTransformer = {
+  dependencies: [HeadingNode],
   export: (node, exportChildren) => {
     if (!$isHeadingNode(node)) {
       return null;
@@ -160,6 +173,7 @@ export const HEADING: ElementTransformer = {
 };
 
 export const QUOTE: ElementTransformer = {
+  dependencies: [QuoteNode],
   export: (node, exportChildren) => {
     if (!$isQuoteNode(node)) {
       return null;
@@ -196,6 +210,7 @@ export const QUOTE: ElementTransformer = {
 };
 
 export const CODE: ElementTransformer = {
+  dependencies: [CodeNode],
   export: (node: LexicalNode) => {
     if (!$isCodeNode(node)) {
       return null;
@@ -217,6 +232,7 @@ export const CODE: ElementTransformer = {
 };
 
 export const UNORDERED_LIST: ElementTransformer = {
+  dependencies: [ListNode, ListItemNode],
   export: (node, exportChildren) => {
     return $isListNode(node) ? listExport(node, exportChildren, 0) : null;
   },
@@ -226,6 +242,7 @@ export const UNORDERED_LIST: ElementTransformer = {
 };
 
 export const CHECK_LIST: ElementTransformer = {
+  dependencies: [ListNode, ListItemNode],
   export: (node, exportChildren) => {
     return $isListNode(node) ? listExport(node, exportChildren, 0) : null;
   },
@@ -235,6 +252,7 @@ export const CHECK_LIST: ElementTransformer = {
 };
 
 export const ORDERED_LIST: ElementTransformer = {
+  dependencies: [ListNode, ListItemNode],
   export: (node, exportChildren) => {
     return $isListNode(node) ? listExport(node, exportChildren, 0) : null;
   },
@@ -299,6 +317,7 @@ export const ITALIC_UNDERSCORE: TextFormatTransformer = {
 // - code should go first as it prevents any transformations inside
 // - then longer tags match (e.g. ** or __ should go before * or _)
 export const LINK: TextMatchTransformer = {
+  dependencies: [LinkNode],
   export: (node, exportChildren, exportFormat) => {
     if (!$isLinkNode(node)) {
       return null;

packages/lexical-playground/src/plugins/MarkdownTransformers/index.ts

@@ -22,6 +22,7 @@ import {
 import {
   $createHorizontalRuleNode,
   $isHorizontalRuleNode,
+  HorizontalRuleNode,
 } from '@lexical/react/LexicalHorizontalRuleNode';
 import {
   $createTableCellNode,
@@ -32,6 +33,7 @@ import {
   TableCellHeaderStates,
   TableCellNode,
   TableNode,
+  TableRowNode,
 } from '@lexical/table';
 import {
   $createParagraphNode,
@@ -41,11 +43,16 @@ import {
   $isTextNode,
 } from 'lexical';
 
-import {$createEquationNode, $isEquationNode} from '../../nodes/EquationNode';
-import {$createImageNode, $isImageNode} from '../../nodes/ImageNode';
-import {$createTweetNode, $isTweetNode} from '../../nodes/TweetNode';
+import {
+  $createEquationNode,
+  $isEquationNode,
+  EquationNode,
+} from '../../nodes/EquationNode';
+import {$createImageNode, $isImageNode, ImageNode} from '../../nodes/ImageNode';
+import {$createTweetNode, $isTweetNode, TweetNode} from '../../nodes/TweetNode';
 
 export const HR: ElementTransformer = {
+  dependencies: [HorizontalRuleNode],
   export: (node: LexicalNode) => {
     return $isHorizontalRuleNode(node) ? '***' : null;
   },
@@ -66,6 +73,7 @@ export const HR: ElementTransformer = {
 };
 
 export const IMAGE: TextMatchTransformer = {
+  dependencies: [ImageNode],
   export: (node, exportChildren, exportFormat) => {
     if (!$isImageNode(node)) {
       return null;
@@ -89,6 +97,7 @@ export const IMAGE: TextMatchTransformer = {
 };
 
 export const EQUATION: TextMatchTransformer = {
+  dependencies: [EquationNode],
   export: (node, exportChildren, exportFormat) => {
     if (!$isEquationNode(node)) {
       return null;
@@ -108,6 +117,7 @@ export const EQUATION: TextMatchTransformer = {
 };
 
 export const TWEET: ElementTransformer = {
+  dependencies: [TweetNode],
   export: (node) => {
     if (!$isTweetNode(node)) {
       return null;
@@ -128,6 +138,7 @@ export const TWEET: ElementTransformer = {
 const TABLE_ROW_REG_EXP = /^(?:\|)(.+)(?:\|)\s?$/;
 
 export const TABLE: ElementTransformer = {
+  dependencies: [TableNode, TableRowNode, TableCellNode],
   export: (
     node: LexicalNode,
     exportChildren: (elementNode: ElementNode) => string,

packages/lexical-react/src/LexicalMarkdownShortcutPlugin.tsx

@@ -14,10 +14,12 @@ import {useLexicalComposerContext} from '@lexical/react/LexicalComposerContext';
 import {
   $createHorizontalRuleNode,
   $isHorizontalRuleNode,
+  HorizontalRuleNode,
 } from '@lexical/react/LexicalHorizontalRuleNode';
 import {useEffect} from 'react';
 
 const HR: ElementTransformer = {
+  dependencies: [HorizontalRuleNode],
   export: (node: LexicalNode) => {
     return $isHorizontalRuleNode(node) ? '***' : null;
   },

packages/lexical/flow/Lexical.js.flow

@@ -835,6 +835,8 @@ type InternalSerializedNode = {
   version: number,
 };
 
+declare export function $getEditor(): LexicalEditor;
+
 declare export function $parseSerializedNode(
   serializedNode: InternalSerializedNode,
 ): LexicalNode;

packages/lexical/src/index.ts

@@ -121,7 +121,10 @@ export {
   $isNodeSelection,
   $isRangeSelection,
 } from './LexicalSelection';
-export {$parseSerializedNode} from './LexicalUpdates';
+export {
+  getActiveEditor as $getEditor,
+  $parseSerializedNode,
+} from './LexicalUpdates';
 export {
   $getDecoratorNode,
   $getNearestNodeFromDOMNode,