lexical 0.11.0 → 0.11.2

package/Lexical.dev.js

@@ -428,6 +428,102 @@ function initMutationObserver(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 $canSimpleTextNodesBeMerged(node1, node2) {
+  const node1Mode = node1.__mode;
+  const node1Format = node1.__format;
+  const node1Style = node1.__style;
+  const node2Mode = node2.__mode;
+  const node2Format = node2.__format;
+  const node2Style = node2.__style;
+  return (node1Mode === null || node1Mode === node2Mode) && (node1Format === null || node1Format === node2Format) && (node1Style === null || node1Style === node2Style);
+}
+
+function $mergeTextNodes(node1, node2) {
+  const writableNode1 = node1.mergeWithSibling(node2);
+
+  const normalizedNodes = getActiveEditor()._normalizedNodes;
+
+  normalizedNodes.add(node1.__key);
+  normalizedNodes.add(node2.__key);
+  return writableNode1;
+}
+
+function $normalizeTextNode(textNode) {
+  let node = textNode;
+
+  if (node.__text === '' && node.isSimpleText() && !node.isUnmergeable()) {
+    node.remove();
+    return;
+  } // Backward
+
+
+  let previousNode;
+
+  while ((previousNode = node.getPreviousSibling()) !== null && $isTextNode(previousNode) && previousNode.isSimpleText() && !previousNode.isUnmergeable()) {
+    if (previousNode.__text === '') {
+      previousNode.remove();
+    } else if ($canSimpleTextNodesBeMerged(previousNode, node)) {
+      node = $mergeTextNodes(previousNode, node);
+      break;
+    } else {
+      break;
+    }
+  } // Forward
+
+
+  let nextNode;
+
+  while ((nextNode = node.getNextSibling()) !== null && $isTextNode(nextNode) && nextNode.isSimpleText() && !nextNode.isUnmergeable()) {
+    if (nextNode.__text === '') {
+      nextNode.remove();
+    } else if ($canSimpleTextNodesBeMerged(node, nextNode)) {
+      node = $mergeTextNodes(node, nextNode);
+      break;
+    } else {
+      break;
+    }
+  }
+}
+function $normalizeSelection(selection) {
+  $normalizePoint(selection.anchor);
+  $normalizePoint(selection.focus);
+  return selection;
+}
+
+function $normalizePoint(point) {
+  while (point.type === 'element') {
+    const node = point.getNode();
+    const offset = point.offset;
+    let nextNode;
+    let nextOffsetAtEnd;
+
+    if (offset === node.getChildrenSize()) {
+      nextNode = node.getChildAtIndex(offset - 1);
+      nextOffsetAtEnd = true;
+    } else {
+      nextNode = node.getChildAtIndex(offset);
+      nextOffsetAtEnd = false;
+    }
+
+    if ($isTextNode(nextNode)) {
+      point.set(nextNode.__key, nextOffsetAtEnd ? nextNode.getTextContentSize() : 0, 'text');
+      break;
+    } else if (!$isElementNode(nextNode)) {
+      break;
+    }
+
+    point.set(nextNode.__key, nextOffsetAtEnd ? nextNode.getChildrenSize() : 0, 'element');
+  }
+}
+
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
@@ -948,13 +1044,13 @@ function $updateTextNodeFromDOMContent(textNode, textContent, anchorOffset, focu
 
       const parent = node.getParent();
       const prevSelection = $getPreviousSelection();
+      const prevTextContentSize = node.getTextContentSize();
       const compositionKey = $getCompositionKey();
       const nodeKey = node.getKey();
 
-      if (node.isToken() || compositionKey !== null && nodeKey === compositionKey && !isComposing || // Check if character was added at the start, and we need
-      // to clear this input from occurring as that action wasn't
-      // permitted.
-      parent !== null && $isRangeSelection(prevSelection) && !parent.canInsertTextBefore() && prevSelection.anchor.offset === 0) {
+      if (node.isToken() || compositionKey !== null && nodeKey === compositionKey && !isComposing || // Check if character was added at the start or boundaries when not insertable, and we need
+      // to clear this input from occurring as that action wasn't permitted.
+      $isRangeSelection(prevSelection) && (parent !== null && !parent.canInsertTextBefore() && prevSelection.anchor.offset === 0 || prevSelection.anchor.key === textNode.__key && prevSelection.anchor.offset === 0 && !node.canInsertTextBefore() || prevSelection.focus.key === textNode.__key && prevSelection.focus.offset === prevTextContentSize && !node.canInsertTextAfter())) {
         node.markDirty();
         return;
       }
@@ -1169,7 +1265,23 @@ function isDelete(keyCode) {
 function isSelectAll(keyCode, metaKey, ctrlKey) {
   return keyCode === 65 && controlOrMeta(metaKey, ctrlKey);
 }
+function $selectAll() {
+  const root = $getRoot();
+  const selection = root.select(0, root.getChildrenSize());
+  $setSelection($normalizeSelection(selection));
+}
 function getCachedClassNameArray(classNamesTheme, classNameThemeType) {
+  if (classNamesTheme.__lexicalClassNameCache === undefined) {
+    classNamesTheme.__lexicalClassNameCache = {};
+  }
+
+  const classNamesCache = classNamesTheme.__lexicalClassNameCache;
+  const cachedClassNames = classNamesCache[classNameThemeType];
+
+  if (cachedClassNames !== undefined) {
+    return cachedClassNames;
+  }
+
   const classNames = classNamesTheme[classNameThemeType]; // As we're using classList, we need
   // to handle className tokens that have spaces.
   // The easiest way to do this to convert the
@@ -1178,7 +1290,7 @@ function getCachedClassNameArray(classNamesTheme, classNameThemeType) {
 
   if (typeof classNames === 'string') {
     const classNamesArr = classNames.split(' ');
-    classNamesTheme[classNameThemeType] = classNamesArr;
+    classNamesCache[classNameThemeType] = classNamesArr;
     return classNamesArr;
   }
 
@@ -1366,13 +1478,7 @@ function $addUpdateTag(tag) {
 
   editor._updateTags.add(tag);
 }
-function $maybeMoveChildrenSelectionToParent(parentNode, offset = 0) {
-  if (offset !== 0) {
-    {
-      throw Error(`TODO`);
-    }
-  }
-
+function $maybeMoveChildrenSelectionToParent(parentNode) {
   const selection = $getSelection();
 
   if (!$isRangeSelection(selection) || !$isElementNode(parentNode)) {
@@ -1741,102 +1847,6 @@ function $garbageCollectDetachedNodes(prevEditorState, editorState, dirtyLeaves,
   }
 }
 
-/**
- * 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 $canSimpleTextNodesBeMerged(node1, node2) {
-  const node1Mode = node1.__mode;
-  const node1Format = node1.__format;
-  const node1Style = node1.__style;
-  const node2Mode = node2.__mode;
-  const node2Format = node2.__format;
-  const node2Style = node2.__style;
-  return (node1Mode === null || node1Mode === node2Mode) && (node1Format === null || node1Format === node2Format) && (node1Style === null || node1Style === node2Style);
-}
-
-function $mergeTextNodes(node1, node2) {
-  const writableNode1 = node1.mergeWithSibling(node2);
-
-  const normalizedNodes = getActiveEditor()._normalizedNodes;
-
-  normalizedNodes.add(node1.__key);
-  normalizedNodes.add(node2.__key);
-  return writableNode1;
-}
-
-function $normalizeTextNode(textNode) {
-  let node = textNode;
-
-  if (node.__text === '' && node.isSimpleText() && !node.isUnmergeable()) {
-    node.remove();
-    return;
-  } // Backward
-
-
-  let previousNode;
-
-  while ((previousNode = node.getPreviousSibling()) !== null && $isTextNode(previousNode) && previousNode.isSimpleText() && !previousNode.isUnmergeable()) {
-    if (previousNode.__text === '') {
-      previousNode.remove();
-    } else if ($canSimpleTextNodesBeMerged(previousNode, node)) {
-      node = $mergeTextNodes(previousNode, node);
-      break;
-    } else {
-      break;
-    }
-  } // Forward
-
-
-  let nextNode;
-
-  while ((nextNode = node.getNextSibling()) !== null && $isTextNode(nextNode) && nextNode.isSimpleText() && !nextNode.isUnmergeable()) {
-    if (nextNode.__text === '') {
-      nextNode.remove();
-    } else if ($canSimpleTextNodesBeMerged(node, nextNode)) {
-      node = $mergeTextNodes(node, nextNode);
-      break;
-    } else {
-      break;
-    }
-  }
-}
-function $normalizeSelection(selection) {
-  $normalizePoint(selection.anchor);
-  $normalizePoint(selection.focus);
-  return selection;
-}
-
-function $normalizePoint(point) {
-  while (point.type === 'element') {
-    const node = point.getNode();
-    const offset = point.offset;
-    let nextNode;
-    let nextOffsetAtEnd;
-
-    if (offset === node.getChildrenSize()) {
-      nextNode = node.getChildAtIndex(offset - 1);
-      nextOffsetAtEnd = true;
-    } else {
-      nextNode = node.getChildAtIndex(offset);
-      nextOffsetAtEnd = false;
-    }
-
-    if ($isTextNode(nextNode)) {
-      point.set(nextNode.__key, nextOffsetAtEnd ? nextNode.getTextContentSize() : 0, 'text');
-      break;
-    } else if (!$isElementNode(nextNode)) {
-      break;
-    }
-
-    point.set(nextNode.__key, nextOffsetAtEnd ? nextNode.getChildrenSize() : 0, 'element');
-  }
-}
-
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
@@ -2919,10 +2929,12 @@ function onBeforeInput(event, editor) {
       case 'insertParagraph':
         {
           // Used for Android
-          $setCompositionKey(null); // Some browsers do not provide the type "insertLineBreak".
+          $setCompositionKey(null); // Safari does not provide the type "insertLineBreak".
           // So instead, we need to infer it from the keyboard event.
+          // We do not apply this logic to iOS to allow newline auto-capitalization
+          // work without creating linebreaks when pressing Enter
 
-          if (isInsertLineBreak) {
+          if (isInsertLineBreak && !IS_IOS) {
             isInsertLineBreak = false;
             dispatchCommand(editor, INSERT_LINE_BREAK_COMMAND, false);
           } else {
@@ -2942,7 +2954,7 @@ function onBeforeInput(event, editor) {
       case 'deleteByComposition':
         {
           if ($canRemoveText(anchorNode, focusNode)) {
-            dispatchCommand(editor, REMOVE_TEXT_COMMAND, undefined);
+            dispatchCommand(editor, REMOVE_TEXT_COMMAND, event);
           }
 
           break;
@@ -2951,7 +2963,7 @@ function onBeforeInput(event, editor) {
       case 'deleteByDrag':
       case 'deleteByCut':
         {
-          dispatchCommand(editor, REMOVE_TEXT_COMMAND, undefined);
+          dispatchCommand(editor, REMOVE_TEXT_COMMAND, event);
           break;
         }
 
@@ -3269,10 +3281,15 @@ function onKeyDown(event, editor) {
       } else if (isSelectAll(keyCode, metaKey, ctrlKey)) {
         event.preventDefault();
         editor.update(() => {
-          const root = $getRoot();
-          root.select(0, root.getChildrenSize());
+          $selectAll();
         });
-      }
+      } // FF does it well (no need to override behavior)
+
+    } else if (!IS_FIREFOX && isSelectAll(keyCode, metaKey, ctrlKey)) {
+      event.preventDefault();
+      editor.update(() => {
+        $selectAll();
+      });
     }
   }
 
@@ -3528,6 +3545,8 @@ function removeNode(nodeToRemove, restoreSelection, preserveEmptyParent) {
       moveSelectionPointToSibling(focus, nodeToRemove, parent, nodeToRemove.getPreviousSibling(), nodeToRemove.getNextSibling());
       selectionMoved = true;
     }
+  } else if ($isNodeSelection(selection) && restoreSelection && nodeToRemove.isSelected()) {
+    nodeToRemove.selectPrevious();
   }
 
   if ($isRangeSelection(selection) && restoreSelection && !selectionMoved) {
@@ -4854,64 +4873,152 @@ class TextNode extends LexicalNode {
     this.__mode = 0;
     this.__detail = 0;
   }
+  /**
+   * Returns a 32-bit integer that represents the TextFormatTypes currently applied to the
+   * TextNode. You probably don't want to use this method directly - consider using TextNode.hasFormat instead.
+   *
+   * @returns a number representing the format of the text node.
+   */
+
 
   getFormat() {
     const self = this.getLatest();
     return self.__format;
   }
+  /**
+   * Returns a 32-bit integer that represents the TextDetailTypes currently applied to the
+   * TextNode. You probably don't want to use this method directly - consider using TextNode.isDirectionless
+   * or TextNode.isUnmergeable instead.
+   *
+   * @returns a number representing the detail of the text node.
+   */
+
 
   getDetail() {
     const self = this.getLatest();
     return self.__detail;
   }
+  /**
+   * Returns the mode (TextModeType) of the TextNode, which may be "normal", "token", or "segmented"
+   *
+   * @returns TextModeType.
+   */
+
 
   getMode() {
     const self = this.getLatest();
     return TEXT_TYPE_TO_MODE[self.__mode];
   }
+  /**
+   * Returns the styles currently applied to the node. This is analogous to CSSText in the DOM.
+   *
+   * @returns CSSText-like string of styles applied to the underlying DOM node.
+   */
+
 
   getStyle() {
     const self = this.getLatest();
     return self.__style;
   }
+  /**
+   * Returns whether or not the node is in "token" mode. TextNodes in token mode can be navigated through character-by-character
+   * with a RangeSelection, but are deleted as a single entity (not invdividually by character).
+   *
+   * @returns true if the node is in token mode, false otherwise.
+   */
+
 
   isToken() {
     const self = this.getLatest();
     return self.__mode === IS_TOKEN;
   }
+  /**
+   *
+   * @returns true if Lexical detects that an IME or other 3rd-party script is attempting to
+   * mutate the TextNode, false otherwise.
+   */
+
 
   isComposing() {
     return this.__key === $getCompositionKey();
   }
+  /**
+   * Returns whether or not the node is in "segemented" mode. TextNodes in segemented mode can be navigated through character-by-character
+   * with a RangeSelection, but are deleted in space-delimited "segments".
+   *
+   * @returns true if the node is in segmented mode, false otherwise.
+   */
+
 
   isSegmented() {
     const self = this.getLatest();
     return self.__mode === IS_SEGMENTED;
   }
+  /**
+   * Returns whether or not the node is "directionless". Directionless nodes don't respect changes between RTL and LTR modes.
+   *
+   * @returns true if the node is directionless, false otherwise.
+   */
+
 
   isDirectionless() {
     const self = this.getLatest();
     return (self.__detail & IS_DIRECTIONLESS) !== 0;
   }
+  /**
+   * Returns whether or not the node is unmergeable. In some scenarios, Lexical tries to merge
+   * adjacent TextNodes into a single TextNode. If a TextNode is unmergeable, this won't happen.
+   *
+   * @returns true if the node is unmergeable, false otherwise.
+   */
+
 
   isUnmergeable() {
     const self = this.getLatest();
     return (self.__detail & IS_UNMERGEABLE) !== 0;
   }
+  /**
+   * Returns whether or not the node has the provided format applied. Use this with the human-readable TextFormatType
+   * string values to get the format of a TextNode.
+   *
+   * @param type - the TextFormatType to check for.
+   *
+   * @returns true if the node has the provided format, false otherwise.
+   */
+
 
   hasFormat(type) {
     const formatFlag = TEXT_TYPE_TO_FORMAT[type];
     return (this.getFormat() & formatFlag) !== 0;
   }
+  /**
+   * Returns whether or not the node is simple text. Simple text is defined as a TextNode that has the string type "text"
+   * (i.e., not a subclass) and has no mode applied to it (i.e., not segmented or token).
+   *
+   * @returns true if the node is simple text, false otherwise.
+   */
+
 
   isSimpleText() {
     return this.__type === 'text' && this.__mode === 0;
   }
+  /**
+   * Returns the text content of the node as a string.
+   *
+   * @returns a string representing the text content of the node.
+   */
+
 
   getTextContent() {
     const self = this.getLatest();
     return self.__text;
   }
+  /**
+   * Returns the format flags applied to the node as a 32-bit integer.
+   *
+   * @returns a number representing the TextFormatTypes applied to the node.
+   */
+
 
   getFormatFlags(type, alignWithFormat) {
     const self = this.getLatest();
@@ -5114,14 +5221,35 @@ class TextNode extends LexicalNode {
 
   selectionTransform(prevSelection, nextSelection) {
     return;
-  } // TODO 0.5 This should just be a `string`.
+  }
+  /**
+   * Sets the node format to the provided TextFormatType or 32-bit integer. Note that the TextFormatType
+   * version of the argument can only specify one format and doing so will remove all other formats that
+   * may be applied to the node. For toggling behavior, consider using {@link TextNode.toggleFormat}
+   *
+   * @param format - TextFormatType or 32-bit integer representing the node format.
+   *
+   * @returns this TextNode.
+   * // TODO 0.12 This should just be a `string`.
+   */
 
 
   setFormat(format) {
     const self = this.getWritable();
     self.__format = typeof format === 'string' ? TEXT_TYPE_TO_FORMAT[format] : format;
     return self;
-  } // TODO 0.5 This should just be a `string`.
+  }
+  /**
+   * Sets the node detail to the provided TextDetailType or 32-bit integer. Note that the TextDetailType
+   * version of the argument can only specify one detail value and doing so will remove all other detail values that
+   * may be applied to the node. For toggling behavior, consider using {@link TextNode.toggleDirectionless}
+   * or {@link TextNode.togglerUnmergeable}
+   *
+   * @param detail - TextDetailType or 32-bit integer representing the node detail.
+   *
+   * @returns this TextNode.
+   * // TODO 0.12 This should just be a `string`.
+   */
 
 
   setDetail(detail) {
@@ -5129,29 +5257,65 @@ class TextNode extends LexicalNode {
     self.__detail = typeof detail === 'string' ? DETAIL_TYPE_TO_DETAIL[detail] : detail;
     return self;
   }
+  /**
+   * Sets the node style to the provided CSSText-like string. Set this property as you
+   * would an HTMLElement style attribute to apply inline styles to the underlying DOM Element.
+   *
+   * @param style - CSSText to be applied to the underlying HTMLElement.
+   *
+   * @returns this TextNode.
+   */
+
 
   setStyle(style) {
     const self = this.getWritable();
     self.__style = style;
     return self;
   }
+  /**
+   * Applies the provided format to this TextNode if it's not present. Removes it if it is present.
+   * Prefer using this method to turn specific formats on and off.
+   *
+   * @param type - TextFormatType to toggle.
+   *
+   * @returns this TextNode.
+   */
+
 
   toggleFormat(type) {
     const formatFlag = TEXT_TYPE_TO_FORMAT[type];
     return this.setFormat(this.getFormat() ^ formatFlag);
   }
+  /**
+   * Toggles the directionless detail value of the node. Prefer using this method over setDetail.
+   *
+   * @returns this TextNode.
+   */
+
 
   toggleDirectionless() {
     const self = this.getWritable();
     self.__detail ^= IS_DIRECTIONLESS;
     return self;
   }
+  /**
+   * Toggles the unmergeable detail value of the node. Prefer using this method over setDetail.
+   *
+   * @returns this TextNode.
+   */
+
 
   toggleUnmergeable() {
     const self = this.getWritable();
     self.__detail ^= IS_UNMERGEABLE;
     return self;
   }
+  /**
+   * Sets the mode of the node.
+   *
+   * @returns this TextNode.
+   */
+
 
   setMode(type) {
     const mode = TEXT_MODE_TO_TYPE[type];
@@ -5164,6 +5328,14 @@ class TextNode extends LexicalNode {
     self.__mode = mode;
     return self;
   }
+  /**
+   * Sets the text content of the node.
+   *
+   * @param text - the string to set as the text value of the node.
+   *
+   * @returns this TextNode.
+   */
+
 
   setTextContent(text) {
     if (this.__text === text) {
@@ -5174,6 +5346,15 @@ class TextNode extends LexicalNode {
     self.__text = text;
     return self;
   }
+  /**
+   * Sets the current Lexical selection to be a RangeSelection with anchor and focus on this TextNode at the provided offsets.
+   *
+   * @param _anchorOffset - the offset at which the Selection anchor will be placed.
+   * @param _focusOffset - the offset at which the Selection focus will be placed.
+   *
+   * @returns the new RangeSelection.
+   */
+
 
   select(_anchorOffset, _focusOffset) {
     errorOnReadOnly();
@@ -5212,6 +5393,18 @@ class TextNode extends LexicalNode {
 
     return selection;
   }
+  /**
+   * Inserts the provided text into this TextNode at the provided offset, deleting the number of characters
+   * specified. Can optionally calculate a new selection after the operation is complete.
+   *
+   * @param offset - the offset at which the splice operation should begin.
+   * @param delCount - the number of characters to delete, starting from the offset.
+   * @param newText - the text to insert into the TextNode at the offset.
+   * @param moveSelection - optional, whether or not to move selection to the end of the inserted substring.
+   *
+   * @returns this TextNode.
+   */
+
 
   spliceText(offset, delCount, newText, moveSelection) {
     const writableSelf = this.getWritable();
@@ -5238,14 +5431,39 @@ class TextNode extends LexicalNode {
     writableSelf.__text = updatedText;
     return writableSelf;
   }
+  /**
+   * This method is meant to be overriden by TextNode subclasses to control the behavior of those nodes
+   * when a user event would cause text to be inserted before them in the editor. If true, Lexical will attempt
+   * to insert text into this node. If false, it will insert the text in a new sibling node.
+   *
+   * @returns true if text can be inserted before the node, false otherwise.
+   */
+
 
   canInsertTextBefore() {
     return true;
   }
+  /**
+   * This method is meant to be overriden by TextNode subclasses to control the behavior of those nodes
+   * when a user event would cause text to be inserted after them in the editor. If true, Lexical will attempt
+   * to insert text into this node. If false, it will insert the text in a new sibling node.
+   *
+   * @returns true if text can be inserted after the node, false otherwise.
+   */
+
 
   canInsertTextAfter() {
     return true;
   }
+  /**
+   * Splits this TextNode at the provided character offsets, forming new TextNodes from the substrings
+   * formed by the split, and inserting those new TextNodes into the editor, replacing the one that was split.
+   *
+   * @param splitOffsets - rest param of the text content character offsets at which this node should be split.
+   *
+   * @returns an Array containing the newly-created TextNodes.
+   */
+
 
   splitText(...splitOffsets) {
     errorOnReadOnly();
@@ -5359,6 +5577,14 @@ class TextNode extends LexicalNode {
 
     return splitNodes;
   }
+  /**
+   * Merges the target TextNode into this TextNode, removing the target node.
+   *
+   * @param target - the TextNode to merge into this one.
+   *
+   * @returns this TextNode.
+   */
+
 
   mergeWithSibling(target) {
     const isBefore = target === this.getPreviousSibling();
@@ -5403,6 +5629,14 @@ class TextNode extends LexicalNode {
     target.remove();
     return writableSelf;
   }
+  /**
+   * This method is meant to be overriden by TextNode subclasses to control the behavior of those nodes
+   * when used with the registerLexicalTextEntity function. If you're using registerLexicalTextEntity, the
+   * node class that you create and replace matched text with should return true from this method.
+   *
+   * @returns true if the node is to be treated as a "text entity", false otherwise.
+   */
+
 
   isTextEntity() {
     return false;
@@ -5895,7 +6129,14 @@ function $transferStartingElementPointToTextPoint(start, end, format, style) {
   if (placementNode === null) {
     element.append(target);
   } else {
-    placementNode.insertBefore(target);
+    placementNode.insertBefore(target); // Fix the end point offset if it refers to the same element as start,
+    // as we've now inserted another element before it. Note that we only
+    // do it if selection is not collapsed as otherwise it'll transfer
+    // both focus and anchor to the text node below
+
+    if (end.type === 'element' && end.key === start.key && end.offset !== start.offset) {
+      end.set(end.key, end.offset + 1, 'element');
+    }
   } // Transfer the element point to a text point.
 
 
@@ -6287,6 +6528,13 @@ class RangeSelection {
     anchor._selection = this;
     focus._selection = this;
   }
+  /**
+   * Used to check if the provided selections is equal to this one by value,
+   * inluding anchor, focus, format, and style properties.
+   * @param selection - the Selection to compare this one to.
+   * @returns true if the Selections are equal, false otherwise.
+   */
+
 
   is(selection) {
     if (!$isRangeSelection(selection)) {
@@ -6295,14 +6543,34 @@ class RangeSelection {
 
     return this.anchor.is(selection.anchor) && this.focus.is(selection.focus) && this.format === selection.format && this.style === selection.style;
   }
+  /**
+   * Returns whether the Selection is "backwards", meaning the focus
+   * logically precedes the anchor in the EditorState.
+   * @returns true if the Selection is backwards, false otherwise.
+   */
+
 
   isBackward() {
     return this.focus.isBefore(this.anchor);
   }
+  /**
+   * Returns whether the Selection is "collapsed", meaning the anchor and focus are
+   * the same node and have the same offset.
+   *
+   * @returns true if the Selection is collapsed, false otherwise.
+   */
+
 
   isCollapsed() {
     return this.anchor.is(this.focus);
   }
+  /**
+   * Gets all the nodes in the Selection. Uses caching to make it generally suitable
+   * for use in hot paths.
+   *
+   * @returns an Array containing all the nodes in the Selection
+   */
+
 
   getNodes() {
     const cachedNodes = this._cachedNodes;
@@ -6355,6 +6623,15 @@ class RangeSelection {
 
     return nodes;
   }
+  /**
+   * Sets this Selection to be of type "text" at the provided anchor and focus values.
+   *
+   * @param anchorNode - the anchor node to set on the Selection
+   * @param anchorOffset - the offset to set on the Selection
+   * @param focusNode - the focus node to set on the Selection
+   * @param focusOffset - the focus offset to set on the Selection
+   */
+
 
   setTextNodeRange(anchorNode, anchorOffset, focusNode, focusOffset) {
     $setPointValues(this.anchor, anchorNode.__key, anchorOffset, 'text');
@@ -6362,6 +6639,12 @@ class RangeSelection {
     this._cachedNodes = null;
     this.dirty = true;
   }
+  /**
+   * Gets the (plain) text content of all the nodes in the selection.
+   *
+   * @returns a string representing the text content of all the nodes in the Selection
+   */
+
 
   getTextContent() {
     const nodes = this.getNodes();
@@ -6419,6 +6702,13 @@ class RangeSelection {
 
     return textContent;
   }
+  /**
+   * Attempts to map a DOM selection range onto this Lexical Selection,
+   * setting the anchor, focus, and type accordingly
+   *
+   * @param range a DOM Selection range conforming to the StaticRange interface.
+   */
+
 
   applyDOMRange(range) {
     const editor = getActiveEditor();
@@ -6435,6 +6725,12 @@ class RangeSelection {
     $setPointValues(this.focus, focusPoint.key, focusPoint.offset, focusPoint.type);
     this._cachedNodes = null;
   }
+  /**
+   * Creates a new RangeSelection, copying over all the property values from this one.
+   *
+   * @returns a new RangeSelection with the same property values as this one.
+   */
+
 
   clone() {
     const anchor = this.anchor;
@@ -6442,21 +6738,48 @@ class RangeSelection {
     const selection = new RangeSelection($createPoint(anchor.key, anchor.offset, anchor.type), $createPoint(focus.key, focus.offset, focus.type), this.format, this.style);
     return selection;
   }
+  /**
+   * Toggles the provided format on all the TextNodes in the Selection.
+   *
+   * @param format a string TextFormatType to toggle on the TextNodes in the selection
+   */
+
 
   toggleFormat(format) {
     this.format = toggleTextFormatType(this.format, format, null);
     this.dirty = true;
   }
+  /**
+   * Sets the value of the style property on the Selection
+   *
+   * @param style - the style to set at the value of the style property.
+   */
+
 
   setStyle(style) {
     this.style = style;
     this.dirty = true;
   }
+  /**
+   * Returns whether the provided TextFormatType is present on the Selection. This will be true if any node in the Selection
+   * has the specified format.
+   *
+   * @param type the TextFormatType to check for.
+   * @returns true if the provided format is currently toggled on on the Selection, false otherwise.
+   */
+
 
   hasFormat(type) {
     const formatFlag = TEXT_TYPE_TO_FORMAT[type];
     return (this.format & formatFlag) !== 0;
   }
+  /**
+   * Attempts to insert the provided text into the EditorState at the current Selection.
+   * converts tabs, newlines, and carriage returns into LexicalNodes.
+   *
+   * @param text the text to insert into the Selection
+   */
+
 
   insertRawText(text) {
     const parts = text.split(/(\r?\n|\t)/);
@@ -6477,6 +6800,13 @@ class RangeSelection {
 
     this.insertNodes(nodes);
   }
+  /**
+   * Attempts to insert the provided text into the EditorState at the current Selection as a new
+   * Lexical TextNode, according to a series of insertion heuristics based on the selection type and position.
+   *
+   * @param text the text to insert into the Selection
+   */
+
 
   insertText(text) {
     const anchor = this.anchor;
@@ -6752,10 +7082,21 @@ class RangeSelection {
       }
     }
   }
+  /**
+   * Removes the text in the Selection, adjusting the EditorState accordingly.
+   */
+
 
   removeText() {
     this.insertText('');
   }
+  /**
+   * Applies the provided format to the TextNodes in the Selection, splitting or
+   * merging nodes as necessary.
+   *
+   * @param formatType the format type to apply to the nodes in the Selection.
+   */
+
 
   formatText(formatType) {
     if (this.isCollapsed()) {
@@ -6876,6 +7217,16 @@ class RangeSelection {
 
     this.format = firstNextFormat | lastNextFormat;
   }
+  /**
+   * Attempts to "intelligently" insert an arbitrary list of Lexical nodes into the EditorState at the
+   * current Selection according to a set of heuristics that determine how surrounding nodes
+   * should be changed, replaced, or moved to accomodate the incoming ones.
+   *
+   * @param nodes - the nodes to insert
+   * @param selectStart - whether or not to select the start after the insertion.
+   * @returns true if the nodes were inserted successfully, false otherwise.
+   */
+
 
   insertNodes(nodes, selectStart) {
     // If there is a range selected remove the text in it
@@ -7238,6 +7589,10 @@ class RangeSelection {
 
     return true;
   }
+  /**
+   * Inserts a new ParagraphNode into the EditorState at the current Selection
+   */
+
 
   insertParagraph() {
     if (!this.isCollapsed()) {
@@ -7359,6 +7714,13 @@ class RangeSelection {
       }
     }
   }
+  /**
+   * Inserts a logical linebreak, which may be a new LineBreakNode or a new ParagraphNode, into the EditorState at the
+   * current Selection.
+   *
+   * @param selectStart whether or not to select the start of the insertion range after the operation completes.
+   */
+
 
   insertLineBreak(selectStart) {
     const lineBreakNode = $createLineBreakNode();
@@ -7380,10 +7742,24 @@ class RangeSelection {
       }
     }
   }
+  /**
+   * Returns the character-based offsets of the Selection, accounting for non-text Points
+   * by using the children size or text content.
+   *
+   * @returns the character offsets for the Selection
+   */
+
 
   getCharacterOffsets() {
     return getCharacterOffsets(this);
   }
+  /**
+   * Extracts the nodes in the Selection, splitting nodes where necessary
+   * to get offset-level precision.
+   *
+   * @returns The nodes in the Selection
+   */
+
 
   extract() {
     const selectedNodes = this.getNodes();
@@ -7437,6 +7813,16 @@ class RangeSelection {
 
     return selectedNodes;
   }
+  /**
+   * Modifies the Selection according to the parameters and a set of heuristics that account for
+   * various node types. Can be used to safely move or extend selection by one logical "unit" without
+   * dealing explicitly with all the possible node types.
+   *
+   * @param alter the type of modification to perform
+   * @param isBackward whether or not selection is backwards
+   * @param granularity the granularity at which to apply the modification
+   */
+
 
   modify(alter, isBackward, granularity) {
     const focus = this.focus;
@@ -7573,6 +7959,13 @@ class RangeSelection {
       }
     }
   }
+  /**
+   * Performs one logical character deletion operation on the EditorState based on the current Selection.
+   * Handles different node types.
+   *
+   * @param isBackward whether or not the selection is backwards.
+   */
+
 
   deleteCharacter(isBackward) {
     const wasCollapsed = this.isCollapsed();
@@ -7605,6 +7998,8 @@ class RangeSelection {
           $setSelection(nodeSelection);
         } else {
           possibleNode.remove();
+          const editor = getActiveEditor();
+          editor.dispatchCommand(SELECTION_CHANGE_COMMAND, undefined);
         }
 
         return;
@@ -7659,6 +8054,13 @@ class RangeSelection {
       }
     }
   }
+  /**
+   * Performs one logical line deletion operation on the EditorState based on the current Selection.
+   * Handles different node types.
+   *
+   * @param isBackward whether or not the selection is backwards.
+   */
+
 
   deleteLine(isBackward) {
     if (this.isCollapsed()) {
@@ -7678,6 +8080,13 @@ class RangeSelection {
 
     this.removeText();
   }
+  /**
+   * Performs one logical word deletion operation on the EditorState based on the current Selection.
+   * Handles different node types.
+   *
+   * @param isBackward whether or not the selection is backwards.
+   */
+
 
   deleteWord(isBackward) {
     if (this.isCollapsed()) {
@@ -7726,7 +8135,7 @@ function $swapPoints(selection) {
 }
 
 function moveNativeSelection(domSelection, alter, direction, granularity) {
-  // @ts-expect-error Selection.modify() method applies a change to the current selection or cursor position,
+  // Selection.modify() method applies a change to the current selection or cursor position,
   // but is still non-standard in some browsers.
   domSelection.modify(alter, direction, granularity);
 }
@@ -8396,7 +8805,7 @@ function updateDOMSelection(prevSelection, nextSelection, editor, domSelection,
   markSelectionChangeFromDOMUpdate();
 }
 function $insertNodes(nodes, selectStart) {
-  let selection = $getSelection();
+  let selection = $getSelection() || $getPreviousSelection();
 
   if (selection === null) {
     selection = $getRoot().selectEnd();
@@ -8825,7 +9234,7 @@ function handleDEVOnlyPendingUpdateGuarantees(pendingEditorState) {
   };
 }
 
-function commitPendingUpdates(editor) {
+function commitPendingUpdates(editor, recoveryEditorState) {
   const pendingEditorState = editor._pendingEditorState;
   const rootElement = editor._rootElement;
   const shouldSkipDOM = editor._headless || rootElement === null;
@@ -8875,7 +9284,7 @@ function commitPendingUpdates(editor) {
         initMutationObserver(editor);
         editor._dirtyType = FULL_RECONCILE;
         isAttemptingToRecoverFromReconcilerError = true;
-        commitPendingUpdates(editor);
+        commitPendingUpdates(editor, currentEditorState);
         isAttemptingToRecoverFromReconcilerError = false;
       } else {
         // To avoid a possible situation of infinite loops, lets throw
@@ -8963,7 +9372,7 @@ function commitPendingUpdates(editor) {
   }
 
   if (mutatedNodes !== null) {
-    triggerMutationListeners(editor, currentEditorState, pendingEditorState, mutatedNodes, tags, dirtyLeaves);
+    triggerMutationListeners(editor, mutatedNodes, tags, dirtyLeaves);
   }
 
   if (!$isRangeSelection(pendingSelection) && pendingSelection !== null && (currentSelection === null || !currentSelection.is(pendingSelection))) {
@@ -8980,15 +9389,20 @@ function commitPendingUpdates(editor) {
     editor._decorators = pendingDecorators;
     editor._pendingDecorators = null;
     triggerListeners('decorator', editor, true, pendingDecorators);
-  }
+  } // If reconciler fails, we reset whole editor (so current editor state becomes empty)
+  // and attempt to re-render pendingEditorState. If that goes through we trigger
+  // listeners, but instead use recoverEditorState which is current editor state before reset
+  // This specifically important for collab that relies on prevEditorState from update
+  // listener to calculate delta of changed nodes/properties
+
 
-  triggerTextContentListeners(editor, currentEditorState, pendingEditorState);
+  triggerTextContentListeners(editor, recoveryEditorState || currentEditorState, pendingEditorState);
   triggerListeners('update', editor, true, {
     dirtyElements,
     dirtyLeaves,
     editorState: pendingEditorState,
     normalizedNodes,
-    prevEditorState: currentEditorState,
+    prevEditorState: recoveryEditorState || currentEditorState,
     tags
   });
   triggerDeferredUpdateCallbacks(editor, deferred);
@@ -9004,7 +9418,7 @@ function triggerTextContentListeners(editor, currentEditorState, pendingEditorSt
   }
 }
 
-function triggerMutationListeners(editor, currentEditorState, pendingEditorState, mutatedNodes, updateTags, dirtyLeaves) {
+function triggerMutationListeners(editor, mutatedNodes, updateTags, dirtyLeaves) {
   const listeners = Array.from(editor._listeners.mutation);
   const listenersLength = listeners.length;
 
@@ -10101,7 +10515,7 @@ function exportNodeToJSON(node) {
 
   if (serializedNode.type !== nodeClass.getType()) {
     {
-      throw Error(`LexicalNode: Node ${nodeClass.name} does not implement .exportJSON().`);
+      throw Error(`LexicalNode: Node ${nodeClass.name} does not match the serialized type. Check if .exportJSON() is implemented and it is returning the correct type.`);
     }
   } // @ts-expect-error TODO Replace Class utility type with InstanceType
 
@@ -10825,6 +11239,16 @@ class LexicalEditor {
       registeredNodes.forEach(node => node.transforms.delete(listener));
     };
   }
+  /**
+   * Used to assert that a certain node is registered, usually by plugins to ensure nodes that they
+   * depend on have been registered.
+   * @returns True if the editor has registered the provided node type, false otherwise.
+   */
+
+
+  hasNode(node) {
+    return this._nodes.has(node.getType());
+  }
   /**
    * Used to assert that certain nodes are registered, usually by plugins to ensure nodes that they
    * depend on have been registered.
@@ -10833,16 +11257,7 @@ class LexicalEditor {
 
 
   hasNodes(nodes) {
-    for (let i = 0; i < nodes.length; i++) {
-      const klass = nodes[i];
-      const type = klass.getType();
-
-      if (!this._nodes.has(type)) {
-        return false;
-      }
-    }
-
-    return true;
+    return nodes.every(this.hasNode.bind(this));
   }
   /**
    * Dispatches a command of the specified type with the specified payload.
@@ -10934,6 +11349,10 @@ class LexicalEditor {
           nextRootElement.classList.add(...classNames);
         }
       } else {
+        // If content editable is unmounted we'll reset editor state back to original
+        // (or pending) editor state since there will be no reconciliation
+        this._editorState = pendingEditorState;
+        this._pendingEditorState = null;
         this._window = null;
       }