@lexical/react 0.1.7 → 0.1.8

package/DEPRECATED_useLexicalRichText.dev.js

@@ -0,0 +1,1326 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var withSubscriptions = require('@lexical/react/withSubscriptions');
+var lexical = require('lexical');
+var react = require('react');
+var list = require('@lexical/list');
+var CodeNode = require('lexical/CodeNode');
+var HeadingNode = require('lexical/HeadingNode');
+var LinkNode = require('lexical/LinkNode');
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+const MERGE = 0;
+const NO_MERGE = 1;
+const DISCARD = 2;
+const OTHER = 0;
+const COMPOSING_CHARACTER = 1;
+const INSERT_CHARACTER_AFTER_SELECTION = 2;
+const DELETE_CHARACTER_BEFORE_SELECTION = 3;
+const DELETE_CHARACTER_AFTER_SELECTION = 4;
+const EditorPriority$1 = 0;
+
+function getDirtyNodes(editorState, dirtyLeavesSet, dirtyElementsSet) {
+  const dirtyLeaves = Array.from(dirtyLeavesSet);
+  const dirtyElements = Array.from(dirtyElementsSet);
+  const nodeMap = editorState._nodeMap;
+  const nodes = [];
+
+  for (let i = 0; i < dirtyLeaves.length; i++) {
+    const dirtyLeafKey = dirtyLeaves[i];
+    const dirtyLeaf = nodeMap.get(dirtyLeafKey);
+
+    if (dirtyLeaf !== undefined) {
+      nodes.push(dirtyLeaf);
+    }
+  }
+
+  for (let i = 0; i < dirtyElements.length; i++) {
+    const intentionallyMarkedAsDirty = dirtyElements[i][1];
+
+    if (!intentionallyMarkedAsDirty) {
+      continue;
+    }
+
+    const dirtyElementKey = dirtyElements[i][0];
+    const dirtyElement = nodeMap.get(dirtyElementKey);
+
+    if (dirtyElement !== undefined && !lexical.$isRootNode(dirtyElement)) {
+      nodes.push(dirtyElement);
+    }
+  }
+
+  return nodes;
+}
+
+function getChangeType(prevEditorState, nextEditorState, dirtyLeavesSet, dirtyElementsSet, isComposing) {
+  if (prevEditorState === null || dirtyLeavesSet.size === 0 && dirtyElementsSet.size === 0) {
+    return OTHER;
+  }
+
+  const nextSelection = nextEditorState._selection;
+  const prevSelection = prevEditorState._selection;
+
+  if (isComposing) {
+    return COMPOSING_CHARACTER;
+  }
+
+  if (nextSelection === null || prevSelection === null || !prevSelection.isCollapsed() || !nextSelection.isCollapsed()) {
+    return OTHER;
+  }
+
+  const dirtyNodes = getDirtyNodes(nextEditorState, dirtyLeavesSet, dirtyElementsSet);
+
+  if (dirtyNodes.length === 0) {
+    return OTHER;
+  } // Catching the case when inserting new text node into an element (e.g. first char in paragraph/list),
+  // or after existing node.
+
+
+  if (dirtyNodes.length > 1) {
+    const nextNodeMap = nextEditorState._nodeMap;
+    const nextAnchorNode = nextNodeMap.get(nextSelection.anchor.key);
+    const prevAnchorNode = nextNodeMap.get(prevSelection.anchor.key);
+
+    if (nextAnchorNode && prevAnchorNode && !prevEditorState._nodeMap.has(nextAnchorNode.__key) && lexical.$isTextNode(nextAnchorNode) && nextAnchorNode.__text.length === 1 && nextSelection.anchor.offset === 1) {
+      return INSERT_CHARACTER_AFTER_SELECTION;
+    }
+
+    return OTHER;
+  }
+
+  const nextDirtyNode = dirtyNodes[0];
+
+  const prevDirtyNode = prevEditorState._nodeMap.get(nextDirtyNode.__key);
+
+  if (!lexical.$isTextNode(prevDirtyNode) || !lexical.$isTextNode(nextDirtyNode) || prevDirtyNode.__mode !== nextDirtyNode.__mode) {
+    return OTHER;
+  }
+
+  const prevText = prevDirtyNode.__text;
+  const nextText = nextDirtyNode.__text;
+
+  if (prevText === nextText) {
+    return OTHER;
+  }
+
+  const nextAnchor = nextSelection.anchor;
+  const prevAnchor = prevSelection.anchor;
+
+  if (nextAnchor.key !== prevAnchor.key || nextAnchor.type !== 'text') {
+    return OTHER;
+  }
+
+  const nextAnchorOffset = nextAnchor.offset;
+  const prevAnchorOffset = prevAnchor.offset;
+  const textDiff = nextText.length - prevText.length;
+
+  if (textDiff === 1 && prevAnchorOffset === nextAnchorOffset - 1) {
+    return INSERT_CHARACTER_AFTER_SELECTION;
+  }
+
+  if (textDiff === -1 && prevAnchorOffset === nextAnchorOffset + 1) {
+    return DELETE_CHARACTER_BEFORE_SELECTION;
+  }
+
+  if (textDiff === -1 && prevAnchorOffset === nextAnchorOffset) {
+    return DELETE_CHARACTER_AFTER_SELECTION;
+  }
+
+  return OTHER;
+}
+
+function createMergeActionGetter(editor, delay) {
+  let prevChangeTime = Date.now();
+  let prevChangeType = OTHER;
+  return (prevEditorState, nextEditorState, currentHistoryEntry, dirtyLeaves, dirtyElements, tags) => {
+    const changeTime = Date.now(); // If applying changes from history stack there's no need
+    // to run history logic again, as history entries already calculated
+
+    if (tags.has('historic')) {
+      prevChangeType = OTHER;
+      prevChangeTime = changeTime;
+      return DISCARD;
+    }
+
+    const changeType = getChangeType(prevEditorState, nextEditorState, dirtyLeaves, dirtyElements, editor.isComposing());
+
+    const mergeAction = (() => {
+      if (tags.has('without-history')) {
+        return MERGE;
+      }
+
+      if (prevEditorState === null) {
+        return NO_MERGE;
+      }
+
+      const selection = nextEditorState._selection;
+      const prevSelection = prevEditorState._selection;
+      const hasDirtyNodes = dirtyLeaves.size > 0 || dirtyElements.size > 0;
+
+      if (!hasDirtyNodes) {
+        if (prevSelection === null && selection !== null) {
+          return MERGE;
+        }
+
+        return DISCARD;
+      }
+
+      const isSameEditor = currentHistoryEntry === null || currentHistoryEntry.editor === editor;
+
+      if (changeType !== OTHER && changeType === prevChangeType && changeTime < prevChangeTime + delay && isSameEditor) {
+        return MERGE;
+      }
+
+      return NO_MERGE;
+    })();
+
+    prevChangeTime = changeTime;
+    prevChangeType = changeType;
+    return mergeAction;
+  };
+}
+
+function useHistory(editor, externalHistoryState, delay = 1000) {
+  const historyState = react.useMemo(() => externalHistoryState || createEmptyHistoryState(), [externalHistoryState]);
+  const clearHistory = react.useCallback(() => {
+    historyState.undoStack = [];
+    historyState.redoStack = [];
+    historyState.current = null;
+  }, [historyState]);
+  react.useEffect(() => {
+    const getMergeAction = createMergeActionGetter(editor, delay);
+
+    const applyChange = ({
+      editorState,
+      prevEditorState,
+      dirtyLeaves,
+      dirtyElements,
+      tags
+    }) => {
+      const current = historyState.current;
+      const redoStack = historyState.redoStack;
+      const undoStack = historyState.undoStack;
+      const currentEditorState = current === null ? null : current.editorState;
+
+      if (current !== null && editorState === currentEditorState) {
+        return;
+      }
+
+      const mergeAction = getMergeAction(prevEditorState, editorState, current, dirtyLeaves, dirtyElements, tags);
+
+      if (mergeAction === NO_MERGE) {
+        if (redoStack.length !== 0) {
+          historyState.redoStack = [];
+        }
+
+        if (current !== null) {
+          undoStack.push({ ...current,
+            undoSelection: prevEditorState.read(lexical.$getSelection)
+          });
+          editor.execCommand('canUndo', true);
+        }
+      } else if (mergeAction === DISCARD) {
+        return;
+      } // Else we merge
+
+
+      historyState.current = {
+        editor,
+        editorState
+      };
+    };
+
+    const undo = () => {
+      const redoStack = historyState.redoStack;
+      const undoStack = historyState.undoStack;
+      const undoStackLength = undoStack.length;
+
+      if (undoStackLength !== 0) {
+        const current = historyState.current;
+        const historyStateEntry = undoStack.pop();
+
+        if (current !== null) {
+          redoStack.push(current);
+          editor.execCommand('canRedo', true);
+        }
+
+        if (undoStack.length === 0) {
+          editor.execCommand('canUndo', false);
+        }
+
+        historyState.current = historyStateEntry;
+        historyStateEntry.editor.setEditorState(historyStateEntry.editorState.clone(historyStateEntry.undoSelection), {
+          tag: 'historic'
+        });
+      }
+    };
+
+    const redo = () => {
+      const redoStack = historyState.redoStack;
+      const undoStack = historyState.undoStack;
+
+      if (redoStack.length !== 0) {
+        const current = historyState.current;
+
+        if (current !== null) {
+          undoStack.push(current);
+          editor.execCommand('canUndo', true);
+        }
+
+        const historyStateEntry = redoStack.pop();
+
+        if (redoStack.length === 0) {
+          editor.execCommand('canRedo', false);
+        }
+
+        historyState.current = historyStateEntry;
+        historyStateEntry.editor.setEditorState(historyStateEntry.editorState, {
+          tag: 'historic'
+        });
+      }
+    };
+
+    const applyCommand = type => {
+      switch (type) {
+        case 'undo':
+          undo();
+          return true;
+
+        case 'redo':
+          redo();
+          return true;
+
+        case 'clearEditor':
+          clearHistory();
+          return false;
+
+        case 'clearHistory':
+          clearHistory();
+          return true;
+
+        default:
+          return false;
+      }
+    };
+
+    return withSubscriptions(editor.addListener('command', applyCommand, EditorPriority$1), editor.addListener('update', applyChange));
+  }, [clearHistory, delay, editor, historyState]);
+}
+function createEmptyHistoryState() {
+  return {
+    current: null,
+    redoStack: [],
+    undoStack: []
+  };
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+function useLexicalHistory(editor, externalHistoryState, delay = 1000) {
+  return useHistory(editor, externalHistoryState, delay);
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+
+function $cloneWithProperties(node) {
+  const latest = node.getLatest();
+  const constructor = latest.constructor;
+  const clone = constructor.clone(latest);
+  clone.__parent = latest.__parent;
+
+  if (lexical.$isElementNode(latest) && lexical.$isElementNode(clone)) {
+    clone.__children = Array.from(latest.__children);
+    clone.__format = latest.__format;
+    clone.__indent = latest.__indent;
+    clone.__dir = latest.__dir;
+  } else if (lexical.$isTextNode(latest) && lexical.$isTextNode(clone)) {
+    clone.__format = latest.__format;
+    clone.__style = latest.__style;
+    clone.__mode = latest.__mode;
+    clone.__detail = latest.__detail;
+  } else if (lexical.$isDecoratorNode(latest) && lexical.$isDecoratorNode(clone)) {
+    clone.__state = latest.__state;
+  } // $FlowFixMe
+
+
+  return clone;
+}
+
+function $getIndexFromPossibleClone(node, parent, nodeMap) {
+  const parentClone = nodeMap.get(parent.getKey());
+
+  if (lexical.$isElementNode(parentClone)) {
+    return parentClone.__children.indexOf(node.getKey());
+  }
+
+  return node.getIndexWithinParent();
+}
+
+function $getParentAvoidingExcludedElements(node) {
+  let parent = node.getParent();
+
+  while (parent !== null && parent.excludeFromCopy()) {
+    parent = parent.getParent();
+  }
+
+  return parent;
+}
+
+function $copyLeafNodeBranchToRoot(leaf, startingOffset, isLeftSide, range, nodeMap) {
+  let node = leaf;
+  let offset = startingOffset;
+
+  while (node !== null) {
+    const parent = $getParentAvoidingExcludedElements(node);
+
+    if (parent === null) {
+      break;
+    }
+
+    if (!lexical.$isElementNode(node) || !node.excludeFromCopy()) {
+      const key = node.getKey();
+      let clone = nodeMap.get(key);
+      const needsClone = clone === undefined;
+
+      if (needsClone) {
+        clone = $cloneWithProperties(node);
+        nodeMap.set(key, clone);
+      }
+
+      if (lexical.$isTextNode(clone) && !clone.isSegmented() && !clone.isToken()) {
+        clone.__text = clone.__text.slice(isLeftSide ? offset : 0, isLeftSide ? undefined : offset);
+      } else if (lexical.$isElementNode(clone)) {
+        clone.__children = clone.__children.slice(isLeftSide ? offset : 0, isLeftSide ? undefined : offset + 1);
+      }
+
+      if (lexical.$isRootNode(parent)) {
+        if (needsClone) {
+          // We only want to collect a range of top level nodes.
+          // So if the parent is the root, we know this is a top level.
+          range.push(key);
+        }
+
+        break;
+      }
+    }
+
+    offset = $getIndexFromPossibleClone(node, parent, nodeMap);
+    node = parent;
+  }
+}
+
+function $cloneContents(selection) {
+  const anchor = selection.anchor;
+  const focus = selection.focus;
+  const anchorOffset = anchor.getCharacterOffset();
+  const focusOffset = focus.getCharacterOffset();
+  const anchorNode = anchor.getNode();
+  const focusNode = focus.getNode();
+  const anchorNodeParent = anchorNode.getParentOrThrow(); // Handle a single text node extraction
+
+  if (anchorNode === focusNode && lexical.$isTextNode(anchorNode) && (anchorNodeParent.canBeEmpty() || anchorNodeParent.getChildrenSize() > 1)) {
+    const clonedFirstNode = $cloneWithProperties(anchorNode);
+    const isBefore = focusOffset > anchorOffset;
+    const startOffset = isBefore ? anchorOffset : focusOffset;
+    const endOffset = isBefore ? focusOffset : anchorOffset;
+    clonedFirstNode.__text = clonedFirstNode.__text.slice(startOffset, endOffset);
+    const key = clonedFirstNode.getKey();
+    return {
+      nodeMap: [[key, clonedFirstNode]],
+      range: [key]
+    };
+  }
+
+  const nodes = selection.getNodes();
+
+  if (nodes.length === 0) {
+    return {
+      nodeMap: [],
+      range: []
+    };
+  } // Check if we can use the parent of the nodes, if the
+  // parent can't be empty, then it's important that we
+  // also copy that element node along with its children.
+
+
+  let nodesLength = nodes.length;
+  const firstNode = nodes[0];
+  const firstNodeParent = firstNode.getParent();
+
+  if (firstNodeParent !== null && !firstNodeParent.canBeEmpty()) {
+    const parentChildren = firstNodeParent.__children;
+    const parentChildrenLength = parentChildren.length;
+
+    if (parentChildrenLength === nodesLength) {
+      let areTheSame = true;
+
+      for (let i = 0; i < parentChildren.length; i++) {
+        if (parentChildren[i] !== nodes[i].__key) {
+          areTheSame = false;
+          break;
+        }
+      }
+
+      if (areTheSame) {
+        nodesLength++;
+        nodes.push(firstNodeParent);
+      }
+    }
+  }
+
+  const lastNode = nodes[nodesLength - 1];
+  const isBefore = anchor.isBefore(focus);
+  const nodeMap = new Map();
+  const range = []; // Do first node to root
+
+  $copyLeafNodeBranchToRoot(firstNode, isBefore ? anchorOffset : focusOffset, true, range, nodeMap); // Copy all nodes between
+
+  for (let i = 0; i < nodesLength; i++) {
+    const node = nodes[i];
+    const key = node.getKey();
+
+    if (!nodeMap.has(key) && (!lexical.$isElementNode(node) || !node.excludeFromCopy())) {
+      const clone = $cloneWithProperties(node);
+
+      if (lexical.$isRootNode(node.getParent())) {
+        range.push(node.getKey());
+      }
+
+      nodeMap.set(key, clone);
+    }
+  } // Do last node to root
+
+
+  $copyLeafNodeBranchToRoot(lastNode, isBefore ? focusOffset : anchorOffset, false, range, nodeMap);
+  return {
+    nodeMap: Array.from(nodeMap.entries()),
+    range
+  };
+}
+
+function $moveCaretSelection(selection, isHoldingShift, isBackward, granularity) {
+  selection.modify(isHoldingShift ? 'extend' : 'move', isBackward, granularity);
+}
+function $isParentElementRTL(selection) {
+  const anchorNode = selection.anchor.getNode();
+  const parent = anchorNode.getParentOrThrow();
+  return parent.getDirection() === 'rtl';
+}
+function $moveCharacter(selection, isHoldingShift, isBackward) {
+  const isRTL = $isParentElementRTL(selection);
+  $moveCaretSelection(selection, isHoldingShift, isBackward ? !isRTL : isRTL, 'character');
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+function getPossibleDecoratorNode(focus, isBackward) {
+  const focusOffset = focus.offset;
+
+  if (focus.type === 'element') {
+    const block = focus.getNode();
+    return block.getChildAtIndex(isBackward ? focusOffset - 1 : focusOffset);
+  } else {
+    const focusNode = focus.getNode();
+
+    if (isBackward && focusOffset === 0 || !isBackward && focusOffset === focusNode.getTextContentSize()) {
+      return isBackward ? focusNode.getPreviousSibling() : focusNode.getNextSibling();
+    }
+  }
+
+  return null;
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+
+const isCodeElement = div => {
+  return div.style.fontFamily.match('monospace') !== null;
+};
+
+const DOM_NODE_NAME_TO_LEXICAL_NODE = {
+  '#text': domNode => ({
+    node: lexical.$createTextNode(domNode.textContent)
+  }),
+  a: domNode => {
+    let node;
+
+    if (domNode instanceof HTMLAnchorElement) {
+      node = LinkNode.$createLinkNode(domNode.href);
+    } else {
+      node = lexical.$createTextNode(domNode.textContent);
+    }
+
+    return {
+      node
+    };
+  },
+  b: domNode => {
+    // $FlowFixMe[incompatible-type] domNode is a <b> since we matched it by nodeName
+    const b = domNode; // Google Docs wraps all copied HTML in a <b> with font-weight normal
+
+    const hasNormalFontWeight = b.style.fontWeight === 'normal';
+    return {
+      forChild: lexicalNode => {
+        if (lexical.$isTextNode(lexicalNode) && !hasNormalFontWeight) {
+          lexicalNode.toggleFormat('bold');
+        }
+      },
+      node: null
+    };
+  },
+  br: () => ({
+    node: lexical.$createLineBreakNode()
+  }),
+  div: domNode => {
+    // $FlowFixMe[incompatible-type] domNode is a <div> since we matched it by nodeName
+    const div = domNode;
+    return {
+      after: childLexicalNodes => {
+        const domParent = domNode.parentNode;
+
+        if (domParent != null && domNode !== domParent.lastChild) {
+          childLexicalNodes.push(lexical.$createLineBreakNode());
+        }
+
+        return childLexicalNodes;
+      },
+      node: isCodeElement(div) ? CodeNode.$createCodeNode() : null
+    };
+  },
+  em: domNode => {
+    return {
+      forChild: lexicalNode => {
+        if (lexical.$isTextNode(lexicalNode)) {
+          lexicalNode.toggleFormat('italic');
+        }
+      },
+      node: null
+    };
+  },
+  h1: () => ({
+    node: HeadingNode.$createHeadingNode('h1')
+  }),
+  h2: () => ({
+    node: HeadingNode.$createHeadingNode('h2')
+  }),
+  h3: () => ({
+    node: HeadingNode.$createHeadingNode('h3')
+  }),
+  h4: () => ({
+    node: HeadingNode.$createHeadingNode('h4')
+  }),
+  h5: () => ({
+    node: HeadingNode.$createHeadingNode('h5')
+  }),
+  i: domNode => {
+    return {
+      forChild: lexicalNode => {
+        if (lexical.$isTextNode(lexicalNode)) {
+          lexicalNode.toggleFormat('italic');
+        }
+      },
+      node: null
+    };
+  },
+  li: () => ({
+    node: list.$createListItemNode()
+  }),
+  ol: () => ({
+    node: list.$createListNode('ol')
+  }),
+  p: () => ({
+    node: lexical.$createParagraphNode()
+  }),
+  pre: domNode => ({
+    node: CodeNode.$createCodeNode()
+  }),
+  span: domNode => {
+    // $FlowFixMe[incompatible-type] domNode is a <span> since we matched it by nodeName
+    const span = domNode; // Google Docs uses span tags + font-weight for bold text
+
+    const hasBoldFontWeight = span.style.fontWeight === '700';
+    return {
+      forChild: lexicalNode => {
+        if (lexical.$isTextNode(lexicalNode) && hasBoldFontWeight) {
+          lexicalNode.toggleFormat('bold');
+        }
+      },
+      node: null
+    };
+  },
+  strong: domNode => {
+    return {
+      forChild: lexicalNode => {
+        if (lexical.$isTextNode(lexicalNode)) {
+          lexicalNode.toggleFormat('bold');
+        }
+      },
+      node: null
+    };
+  },
+  table: domNode => {
+    // $FlowFixMe[incompatible-type] domNode is a <table> since we matched it by nodeName
+    const table = domNode;
+    const isGitHubCodeTable = table.classList.contains('js-file-line-container');
+    return {
+      node: isGitHubCodeTable ? CodeNode.$createCodeNode() : null
+    };
+  },
+  td: domNode => {
+    // $FlowFixMe[incompatible-type] domNode is a <table> since we matched it by nodeName
+    const cell = domNode;
+    const isGitHubCodeCell = cell.classList.contains('js-file-line');
+    return {
+      after: childLexicalNodes => {
+        if (isGitHubCodeCell && cell.parentNode && cell.parentNode.nextSibling) {
+          // Append newline between code lines
+          childLexicalNodes.push(lexical.$createLineBreakNode());
+        }
+
+        return childLexicalNodes;
+      },
+      node: null
+    };
+  },
+  u: domNode => {
+    return {
+      forChild: lexicalNode => {
+        if (lexical.$isTextNode(lexicalNode)) {
+          lexicalNode.toggleFormat('underline');
+        }
+      },
+      node: null
+    };
+  },
+  ul: () => ({
+    node: list.$createListNode('ul')
+  })
+};
+
+function $generateNodes(nodeRange) {
+  const {
+    range,
+    nodeMap
+  } = nodeRange;
+  const parsedNodeMap = new Map(nodeMap);
+  const nodes = [];
+
+  for (let i = 0; i < range.length; i++) {
+    const key = range[i];
+    const parsedNode = parsedNodeMap.get(key);
+
+    if (parsedNode !== undefined) {
+      const node = lexical.$createNodeFromParse(parsedNode, parsedNodeMap);
+      nodes.push(node);
+    }
+  }
+
+  return nodes;
+}
+
+function $createNodesFromDOM(node, conversionMap, editor, forChildMap = new Map()) {
+  let lexicalNodes = [];
+  let currentLexicalNode = null;
+  const nodeName = node.nodeName.toLowerCase();
+  const customHtmlTransforms = editor._config.htmlTransforms || {};
+  const transformFunction = customHtmlTransforms[nodeName] || conversionMap[nodeName];
+  const transformOutput = transformFunction ? transformFunction(node) : null;
+  let postTransform = null;
+
+  if (transformOutput !== null) {
+    postTransform = transformOutput.after;
+    currentLexicalNode = transformOutput.node;
+
+    if (currentLexicalNode !== null) {
+      lexicalNodes.push(currentLexicalNode);
+      const forChildFunctions = Array.from(forChildMap.values());
+
+      for (let i = 0; i < forChildFunctions.length; i++) {
+        forChildFunctions[i](currentLexicalNode);
+      }
+    }
+
+    if (transformOutput.forChild != null) {
+      forChildMap.set(nodeName, transformOutput.forChild);
+    }
+  } // If the DOM node doesn't have a transformer, we don't know what
+  // to do with it but we still need to process any childNodes.
+
+
+  const children = node.childNodes;
+  let childLexicalNodes = [];
+
+  for (let i = 0; i < children.length; i++) {
+    childLexicalNodes.push(...$createNodesFromDOM(children[i], conversionMap, editor, forChildMap));
+  }
+
+  if (postTransform != null) {
+    childLexicalNodes = postTransform(childLexicalNodes);
+  }
+
+  if (currentLexicalNode == null) {
+    // If it hasn't been converted to a LexicalNode, we hoist its children
+    // up to the same level as it.
+    lexicalNodes = lexicalNodes.concat(childLexicalNodes);
+  } else {
+    if (lexical.$isElementNode(currentLexicalNode)) {
+      // If the current node is a ElementNode after conversion,
+      // we can append all the children to it.
+      currentLexicalNode.append(...childLexicalNodes);
+    }
+  }
+
+  return lexicalNodes;
+}
+
+function $generateNodesFromDOM(dom, conversionMap, editor) {
+  let lexicalNodes = [];
+  const elements = dom.body ? Array.from(dom.body.childNodes) : [];
+  const elementsLength = elements.length;
+
+  for (let i = 0; i < elementsLength; i++) {
+    const lexicalNode = $createNodesFromDOM(elements[i], conversionMap, editor);
+
+    if (lexicalNode !== null) {
+      lexicalNodes = lexicalNodes.concat(lexicalNode);
+    }
+  }
+
+  return lexicalNodes;
+}
+
+function $insertDataTransferForRichText(dataTransfer, selection, editor) {
+  const lexicalNodesString = dataTransfer.getData('application/x-lexical-editor');
+
+  if (lexicalNodesString) {
+    const namespace = editor._config.namespace;
+
+    try {
+      const lexicalClipboardData = JSON.parse(lexicalNodesString);
+
+      if (lexicalClipboardData.namespace === namespace) {
+        const nodeRange = lexicalClipboardData.state;
+        const nodes = $generateNodes(nodeRange);
+        selection.insertNodes(nodes);
+        return;
+      }
+    } catch (e) {// Malformed, missing nodes..
+    }
+  }
+
+  const textHtmlMimeType = 'text/html';
+  const htmlString = dataTransfer.getData(textHtmlMimeType);
+
+  if (htmlString) {
+    const parser = new DOMParser();
+    const dom = parser.parseFromString(htmlString, textHtmlMimeType);
+    const nodes = $generateNodesFromDOM(dom, DOM_NODE_NAME_TO_LEXICAL_NODE, editor); // Wrap text and inline nodes in paragraph nodes so we have all blocks at the top-level
+
+    const topLevelBlocks = [];
+    let currentBlock = null;
+
+    for (let i = 0; i < nodes.length; i++) {
+      const node = nodes[i];
+
+      if (!lexical.$isElementNode(node) || node.isInline()) {
+        if (currentBlock === null) {
+          currentBlock = lexical.$createParagraphNode();
+          topLevelBlocks.push(currentBlock);
+        }
+
+        if (currentBlock !== null) {
+          currentBlock.append(node);
+        }
+      } else {
+        topLevelBlocks.push(node);
+        currentBlock = null;
+      }
+    }
+
+    selection.insertNodes(topLevelBlocks);
+    return;
+  }
+
+  $insertDataTransferForPlainText(dataTransfer, selection);
+}
+function $insertDataTransferForPlainText(dataTransfer, selection) {
+  const text = dataTransfer.getData('text/plain');
+
+  if (text != null) {
+    selection.insertRawText(text);
+  }
+}
+function $shouldOverrideDefaultCharacterSelection(selection, isBackward) {
+  const possibleDecoratorNode = getPossibleDecoratorNode(selection.focus, isBackward);
+  return lexical.$isDecoratorNode(possibleDecoratorNode);
+}
+function onPasteForRichText(event, editor) {
+  event.preventDefault();
+  editor.update(() => {
+    lexical.$log('onPasteForRichText');
+    const selection = lexical.$getSelection();
+    const clipboardData = event.clipboardData;
+
+    if (clipboardData != null && selection !== null) {
+      $insertDataTransferForRichText(clipboardData, selection, editor);
+    }
+  });
+}
+function onCutForRichText(event, editor) {
+  onCopyForRichText(event, editor);
+  editor.update(() => {
+    lexical.$log('onCutForRichText');
+    const selection = lexical.$getSelection();
+
+    if (selection !== null) {
+      selection.removeText();
+    }
+  });
+}
+function onCopyForRichText(event, editor) {
+  event.preventDefault();
+  editor.update(() => {
+    lexical.$log('onCopyForRichText');
+    const clipboardData = event.clipboardData;
+    const selection = lexical.$getSelection();
+
+    if (selection !== null) {
+      if (clipboardData != null) {
+        const domSelection = window.getSelection(); // If we haven't selected a range, then don't copy anything
+
+        if (domSelection.isCollapsed) {
+          return;
+        }
+
+        const range = domSelection.getRangeAt(0);
+
+        if (range) {
+          const container = document.createElement('div');
+          const frag = range.cloneContents();
+          container.appendChild(frag);
+          clipboardData.setData('text/html', container.innerHTML);
+        }
+
+        clipboardData.setData('text/plain', selection.getTextContent());
+        const namespace = editor._config.namespace;
+        clipboardData.setData('application/x-lexical-editor', JSON.stringify({
+          namespace,
+          state: $cloneContents(selection)
+        }));
+      }
+    }
+  });
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+const useLayoutEffectImpl = CAN_USE_DOM ? react.useLayoutEffect : react.useEffect;
+var useLayoutEffect = useLayoutEffectImpl;
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+function useLexicalDragonSupport(editor) {
+  react.useEffect(() => {
+    const handler = event => {
+      const rootElement = editor.getRootElement();
+
+      if (document.activeElement !== rootElement) {
+        return;
+      }
+
+      const data = event.data;
+
+      if (typeof data === 'string') {
+        let parsedData;
+
+        try {
+          parsedData = JSON.parse(data);
+        } catch (e) {
+          return;
+        }
+
+        if (parsedData && parsedData.protocol === 'nuanria_messaging' && parsedData.type === 'request') {
+          const payload = parsedData.payload;
+
+          if (payload && payload.functionId === 'makeChanges') {
+            const args = payload.args;
+
+            if (args) {
+              const [elementStart, elementLength, text, selStart, selLength, formatCommand] = args; // TODO: we should probably handle formatCommand somehow?
+              editor.update(() => {
+                lexical.$log('useLexicalDragonSupport');
+                const selection = lexical.$getSelection();
+
+                if (selection !== null) {
+                  const anchor = selection.anchor;
+                  let anchorNode = anchor.getNode();
+                  let setSelStart = 0;
+                  let setSelEnd = 0;
+
+                  if (lexical.$isTextNode(anchorNode)) {
+                    // set initial selection
+                    if (elementStart >= 0 && elementLength >= 0) {
+                      setSelStart = elementStart;
+                      setSelEnd = elementStart + elementLength; // If the offset is more than the end, make it the end
+
+                      selection.setTextNodeRange(anchorNode, setSelStart, anchorNode, setSelEnd);
+                    }
+                  }
+
+                  if (setSelStart !== setSelEnd || text !== '') {
+                    selection.insertRawText(text);
+                    anchorNode = anchor.getNode();
+                  }
+
+                  if (lexical.$isTextNode(anchorNode)) {
+                    // set final selection
+                    setSelStart = selStart;
+                    setSelEnd = selStart + selLength;
+                    const anchorNodeTextLength = anchorNode.getTextContentSize(); // If the offset is more than the end, make it the end
+
+                    setSelStart = setSelStart > anchorNodeTextLength ? anchorNodeTextLength : setSelStart;
+                    setSelEnd = setSelEnd > anchorNodeTextLength ? anchorNodeTextLength : setSelEnd;
+                    selection.setTextNodeRange(anchorNode, setSelStart, anchorNode, setSelEnd);
+                  } // block the chrome extension from handling this event
+
+
+                  event.stopImmediatePropagation();
+                }
+              });
+            }
+          }
+        }
+      }
+    };
+
+    window.addEventListener('message', handler, true);
+    return () => {
+      window.removeEventListener('message', handler, true);
+    };
+  }, [editor]);
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+const EditorPriority = 0;
+function useRichTextSetup(editor) {
+  useLayoutEffect(() => {
+    const removeListener = editor.addListener('command', (type, payload) => {
+      const selection = lexical.$getSelection();
+
+      if (selection === null) {
+        return false;
+      }
+
+      switch (type) {
+        case 'deleteCharacter':
+          {
+            const isBackward = payload;
+            selection.deleteCharacter(isBackward);
+            return true;
+          }
+
+        case 'deleteWord':
+          {
+            const isBackward = payload;
+            selection.deleteWord(isBackward);
+            return true;
+          }
+
+        case 'deleteLine':
+          {
+            const isBackward = payload;
+            selection.deleteLine(isBackward);
+            return true;
+          }
+
+        case 'insertText':
+          {
+            const eventOrText = payload;
+
+            if (typeof eventOrText === 'string') {
+              selection.insertText(eventOrText);
+            } else {
+              const dataTransfer = eventOrText.dataTransfer;
+
+              if (dataTransfer != null) {
+                $insertDataTransferForRichText(dataTransfer, selection, editor);
+              } else {
+                const data = eventOrText.data;
+
+                if (data) {
+                  selection.insertText(data);
+                }
+              }
+            }
+
+            return true;
+          }
+
+        case 'removeText':
+          selection.removeText();
+          return true;
+
+        case 'formatText':
+          {
+            const format = payload;
+            selection.formatText(format);
+            return true;
+          }
+
+        case 'formatElement':
+          {
+            const format = payload;
+            const node = selection.anchor.getNode();
+            const element = lexical.$isElementNode(node) ? node : node.getParentOrThrow();
+            element.setFormat(format);
+            return true;
+          }
+
+        case 'insertLineBreak':
+          const selectStart = payload;
+          selection.insertLineBreak(selectStart);
+          return true;
+
+        case 'insertParagraph':
+          selection.insertParagraph();
+          return true;
+
+        case 'indentContent':
+          {
+            // Handle code blocks
+            const anchor = selection.anchor;
+            const parentBlock = anchor.type === 'element' ? anchor.getNode() : anchor.getNode().getParentOrThrow();
+
+            if (parentBlock.canInsertTab()) {
+              editor.execCommand('insertText', '\t');
+            } else {
+              if (parentBlock.getIndent() !== 10) {
+                parentBlock.setIndent(parentBlock.getIndent() + 1);
+              }
+            }
+
+            return true;
+          }
+
+        case 'outdentContent':
+          {
+            // Handle code blocks
+            const anchor = selection.anchor;
+            const anchorNode = anchor.getNode();
+            const parentBlock = anchor.type === 'element' ? anchor.getNode() : anchor.getNode().getParentOrThrow();
+
+            if (parentBlock.canInsertTab()) {
+              const textContent = anchorNode.getTextContent();
+              const character = textContent[anchor.offset - 1];
+
+              if (character === '\t') {
+                editor.execCommand('deleteCharacter', true);
+              }
+            } else {
+              if (parentBlock.getIndent() !== 0) {
+                parentBlock.setIndent(parentBlock.getIndent() - 1);
+              }
+            }
+
+            return true;
+          }
+
+        case 'keyArrowLeft':
+          {
+            const event = payload;
+            const isHoldingShift = event.shiftKey;
+
+            if ($shouldOverrideDefaultCharacterSelection(selection, true)) {
+              event.preventDefault();
+              $moveCharacter(selection, isHoldingShift, true);
+              return true;
+            }
+
+            return false;
+          }
+
+        case 'keyArrowRight':
+          {
+            const event = payload;
+            const isHoldingShift = event.shiftKey;
+
+            if ($shouldOverrideDefaultCharacterSelection(selection, false)) {
+              event.preventDefault();
+              $moveCharacter(selection, isHoldingShift, false);
+              return true;
+            }
+
+            return false;
+          }
+
+        case 'keyBackspace':
+          {
+            const event = payload;
+            event.preventDefault();
+            const {
+              anchor
+            } = selection;
+
+            if (selection.isCollapsed() && anchor.offset === 0) {
+              const element = anchor.type === 'element' ? anchor.getNode() : anchor.getNode().getParentOrThrow();
+
+              if (element.getIndent() > 0) {
+                return editor.execCommand('outdentContent');
+              }
+            }
+
+            return editor.execCommand('deleteCharacter', true);
+          }
+
+        case 'keyDelete':
+          {
+            const event = payload;
+            event.preventDefault();
+            return editor.execCommand('deleteCharacter', false);
+          }
+
+        case 'keyEnter':
+          {
+            const event = payload;
+            event.preventDefault();
+
+            if (event.shiftKey) {
+              return editor.execCommand('insertLineBreak');
+            }
+
+            return editor.execCommand('insertParagraph');
+          }
+
+        case 'keyTab':
+          {
+            const event = payload;
+            event.preventDefault();
+            return editor.execCommand(event.shiftKey ? 'outdentContent' : 'indentContent');
+          }
+
+        case 'keyEscape':
+          {
+            editor.blur();
+            return true;
+          }
+
+        case 'copy':
+          {
+            const event = payload;
+            onCopyForRichText(event, editor);
+            return true;
+          }
+
+        case 'cut':
+          {
+            const event = payload;
+            onCutForRichText(event, editor);
+            return true;
+          }
+
+        case 'paste':
+          {
+            const event = payload;
+            onPasteForRichText(event, editor);
+            return true;
+          }
+
+        case 'drop':
+        case 'dragstart':
+          {
+            // TODO: Make drag and drop work at some point.
+            const event = payload;
+            event.preventDefault();
+            return true;
+          }
+      }
+
+      return false;
+    }, EditorPriority);
+    editor.execCommand('bootstrapEditor');
+    return removeListener;
+  }, [editor]);
+  useLexicalDragonSupport(editor);
+}
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+function useLexicalRichText(editor, externalHistoryState) {
+  useRichTextSetup(editor);
+  useLexicalHistory(editor, externalHistoryState);
+}
+
+module.exports = useLexicalRichText;