lexical 0.6.3 → 0.6.5

package/Lexical.dev.js

@@ -95,8 +95,8 @@ const CAN_USE_BEFORE_INPUT = CAN_USE_DOM && 'InputEvent' in window && !documentM
 const IS_SAFARI = CAN_USE_DOM && /Version\/[\d.]+.*Safari/.test(navigator.userAgent);
 const IS_IOS = CAN_USE_DOM && /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream; // Keep these in case we need to use them in the future.
 // export const IS_WINDOWS: boolean = CAN_USE_DOM && /Win/.test(navigator.platform);
-// export const IS_CHROME: boolean = CAN_USE_DOM && /^(?=.*Chrome).*/i.test(navigator.userAgent);
-// export const canUseTextInputEvent: boolean = CAN_USE_DOM && 'TextEvent' in window && !documentMode;
+
+const IS_CHROME = CAN_USE_DOM && /^(?=.*Chrome).*/i.test(navigator.userAgent); // export const canUseTextInputEvent: boolean = CAN_USE_DOM && 'TextEvent' in window && !documentMode;
 
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
@@ -133,7 +133,9 @@ const IS_UNMERGEABLE = 1 << 1; // Element node formatting
 const IS_ALIGN_LEFT = 1;
 const IS_ALIGN_CENTER = 2;
 const IS_ALIGN_RIGHT = 3;
-const IS_ALIGN_JUSTIFY = 4; // Reconciliation
+const IS_ALIGN_JUSTIFY = 4;
+const IS_ALIGN_START = 5;
+const IS_ALIGN_END = 6; // Reconciliation
 
 const NON_BREAKING_SPACE = '\u00A0';
 const ZERO_WIDTH_SPACE = '\u200b'; // For iOS/Safari we use a non breaking space, otherwise the cursor appears
@@ -165,15 +167,19 @@ const DETAIL_TYPE_TO_DETAIL = {
 };
 const ELEMENT_TYPE_TO_FORMAT = {
   center: IS_ALIGN_CENTER,
+  end: IS_ALIGN_END,
   justify: IS_ALIGN_JUSTIFY,
   left: IS_ALIGN_LEFT,
-  right: IS_ALIGN_RIGHT
+  right: IS_ALIGN_RIGHT,
+  start: IS_ALIGN_START
 };
 const ELEMENT_FORMAT_TO_TYPE = {
   [IS_ALIGN_CENTER]: 'center',
+  [IS_ALIGN_END]: 'end',
   [IS_ALIGN_JUSTIFY]: 'justify',
   [IS_ALIGN_LEFT]: 'left',
-  [IS_ALIGN_RIGHT]: 'right'
+  [IS_ALIGN_RIGHT]: 'right',
+  [IS_ALIGN_START]: 'start'
 };
 const TEXT_MODE_TO_TYPE = {
   normal: IS_NORMAL,
@@ -455,19 +461,18 @@ const scheduleMicroTask = typeof queueMicrotask === 'function' ? queueMicrotask
 };
 function $isSelectionCapturedInDecorator(node) {
   return $isDecoratorNode($getNearestNodeFromDOMNode(node));
-} // TODO change to $ function
-
+}
 function isSelectionCapturedInDecoratorInput(anchorDOM) {
   const activeElement = document.activeElement;
   const nodeName = activeElement !== null ? activeElement.nodeName : null;
-  return !$isDecoratorNode($getNearestNodeFromDOMNode(anchorDOM)) || nodeName !== 'INPUT' && nodeName !== 'TEXTAREA';
+  return $isDecoratorNode($getNearestNodeFromDOMNode(anchorDOM)) && (nodeName === 'INPUT' || nodeName === 'TEXTAREA');
 }
 function isSelectionWithinEditor(editor, anchorDOM, focusDOM) {
   const rootElement = editor.getRootElement();
 
   try {
     return rootElement !== null && rootElement.contains(anchorDOM) && rootElement.contains(focusDOM) && // Ignore if selection is within nested editor
-    anchorDOM !== null && isSelectionCapturedInDecoratorInput(anchorDOM) && getNearestEditorFromDOMNode(anchorDOM) === editor;
+    anchorDOM !== null && !isSelectionCapturedInDecoratorInput(anchorDOM) && getNearestEditorFromDOMNode(anchorDOM) === editor;
   } catch (error) {
     return false;
   }
@@ -601,6 +606,7 @@ function removeFromParent(writableNode) {
 
     internalMarkSiblingsAsDirty(writableNode);
     children.splice(index, 1);
+    writableNode.__parent = null;
   }
 } // Never use this function directly! It will break
 // the cloning heuristic. Instead use node.getWritable().
@@ -826,6 +832,13 @@ function getEditorsToPropagate(editor) {
 function createUID() {
   return Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0, 5);
 }
+function getAnchorTextFromDOM(anchorNode) {
+  if (anchorNode.nodeType === DOM_TEXT_TYPE) {
+    return anchorNode.nodeValue;
+  }
+
+  return null;
+}
 function $updateSelectedTextFromDOM(isCompositionEnd, data) {
   // Update the text content with the latest composition text
   const domSelection = getDOMSelection();
@@ -840,12 +853,12 @@ function $updateSelectedTextFromDOM(isCompositionEnd, data) {
     focusOffset
   } = domSelection;
 
-  if (anchorNode !== null && anchorNode.nodeType === DOM_TEXT_TYPE) {
+  if (anchorNode !== null) {
+    let textContent = getAnchorTextFromDOM(anchorNode);
     const node = $getNearestNodeFromDOMNode(anchorNode);
 
-    if ($isTextNode(node)) {
-      let textContent = anchorNode.nodeValue; // Data is intentionally truthy, as we check for boolean, null and empty string.
-
+    if (textContent !== null && $isTextNode(node)) {
+      // Data is intentionally truthy, as we check for boolean, null and empty string.
       if (textContent === COMPOSITION_SUFFIX && data) {
         const offset = data.length;
         textContent = data;
@@ -953,33 +966,6 @@ function $shouldInsertTextAfterOrBeforeTextNode(selection, node) {
   } else {
     return false;
   }
-} // This function is used to determine if Lexical should attempt to override
-// the default browser behavior for insertion of text and use its own internal
-// heuristics. This is an extremely important function, and makes much of Lexical
-// work as intended between different browsers and across word, line and character
-// boundary/formats. It also is important for text replacement, node schemas and
-// composition mechanics.
-
-
-function $shouldPreventDefaultAndInsertText(selection, text) {
-  const anchor = selection.anchor;
-  const focus = selection.focus;
-  const anchorNode = anchor.getNode();
-  const domSelection = getDOMSelection();
-  const domAnchorNode = domSelection !== null ? domSelection.anchorNode : null;
-  const anchorKey = anchor.key;
-  const backingAnchorElement = getActiveEditor().getElementByKey(anchorKey);
-  const textLength = text.length;
-  return anchorKey !== focus.key || // If we're working with a non-text node.
-  !$isTextNode(anchorNode) || // If we are replacing a range with a single character or grapheme, and not composing.
-  (textLength < 2 || doesContainGrapheme(text)) && anchor.offset !== focus.offset && !anchorNode.isComposing() || // Any non standard text node.
-  $isTokenOrSegmented(anchorNode) || // If the text length is more than a single character and we're either
-  // dealing with this in "beforeinput" or where the node has already recently
-  // been changed (thus is dirty).
-  anchorNode.isDirty() && textLength > 1 || // If the DOM selection element is not the same as the backing node
-  backingAnchorElement !== null && !anchorNode.isComposing() && domAnchorNode !== getDOMTextNode(backingAnchorElement) || // Check if we're changing from bold to italics, or some other format.
-  anchorNode.getFormat() !== selection.format || // One last set of heuristics to check against.
-  $shouldInsertTextAfterOrBeforeTextNode(selection, anchorNode);
 }
 function isTab(keyCode, altKey, ctrlKey, metaKey) {
   return keyCode === 9 && !altKey && !ctrlKey && !metaKey;
@@ -1176,8 +1162,15 @@ function setMutatedNode(mutatedNodes, registeredNodes, mutationListeners, node,
     mutatedNodes.set(klass, mutatedNodesByType);
   }
 
-  if (!mutatedNodesByType.has(nodeKey)) {
-    mutatedNodesByType.set(nodeKey, mutation);
+  const prevMutation = mutatedNodesByType.get(nodeKey); // If the node has already been "destroyed", yet we are
+  // re-making it, then this means a move likely happened.
+  // We should change the mutation to be that of "updated"
+  // instead.
+
+  const isMove = prevMutation === 'destroyed' && mutation === 'created';
+
+  if (prevMutation === undefined || isMove) {
+    mutatedNodesByType.set(nodeKey, isMove ? 'updated' : mutation);
   }
 }
 function $nodesOfType(klass) {
@@ -1444,6 +1437,17 @@ function errorOnInsertTextNodeOnRoot(node, insertNode) {
     }
   }
 }
+function $getNodeByKeyOrThrow(key) {
+  const node = $getNodeByKey(key);
+
+  if (node === null) {
+    {
+      throw Error(`Expected node with key ${key} to exist but it's not in the nodeMap.`);
+    }
+  }
+
+  return node;
+}
 
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
@@ -1709,6 +1713,10 @@ function setElementFormat(dom, format) {
     setTextAlign(domStyle, 'right');
   } else if (format === IS_ALIGN_JUSTIFY) {
     setTextAlign(domStyle, 'justify');
+  } else if (format === IS_ALIGN_START) {
+    setTextAlign(domStyle, 'start');
+  } else if (format === IS_ALIGN_END) {
+    setTextAlign(domStyle, 'end');
   }
 }
 
@@ -2284,12 +2292,43 @@ if (CAN_USE_BEFORE_INPUT) {
 
 let lastKeyDownTimeStamp = 0;
 let lastKeyCode = 0;
+let lastBeforeInputInsertTextTimeStamp = 0;
 let rootElementsRegistered = 0;
 let isSelectionChangeFromDOMUpdate = false;
 let isSelectionChangeFromMouseDown = false;
 let isInsertLineBreak = false;
 let isFirefoxEndingComposition = false;
-let collapsedSelectionFormat = [0, 0, 'root', 0];
+let collapsedSelectionFormat = [0, 0, 'root', 0]; // This function is used to determine if Lexical should attempt to override
+// the default browser behavior for insertion of text and use its own internal
+// heuristics. This is an extremely important function, and makes much of Lexical
+// work as intended between different browsers and across word, line and character
+// boundary/formats. It also is important for text replacement, node schemas and
+// composition mechanics.
+
+function $shouldPreventDefaultAndInsertText(selection, text, timeStamp, isBeforeInput) {
+  const anchor = selection.anchor;
+  const focus = selection.focus;
+  const anchorNode = anchor.getNode();
+  const domSelection = getDOMSelection();
+  const domAnchorNode = domSelection !== null ? domSelection.anchorNode : null;
+  const anchorKey = anchor.key;
+  const backingAnchorElement = getActiveEditor().getElementByKey(anchorKey);
+  const textLength = text.length;
+  return anchorKey !== focus.key || // If we're working with a non-text node.
+  !$isTextNode(anchorNode) || // If we are replacing a range with a single character or grapheme, and not composing.
+  (!isBeforeInput && (!CAN_USE_BEFORE_INPUT || // We check to see if there has been
+  // a recent beforeinput event for "textInput". If there has been one in the last
+  // 50ms then we proceed as normal. However, if there is not, then this is likely
+  // a dangling `input` event caused by execCommand('insertText').
+  lastBeforeInputInsertTextTimeStamp < timeStamp + 50) || textLength < 2 || doesContainGrapheme(text)) && anchor.offset !== focus.offset && !anchorNode.isComposing() || // Any non standard text node.
+  $isTokenOrSegmented(anchorNode) || // If the text length is more than a single character and we're either
+  // dealing with this in "beforeinput" or where the node has already recently
+  // been changed (thus is dirty).
+  anchorNode.isDirty() && textLength > 1 || // If the DOM selection element is not the same as the backing node during beforeinput.
+  (isBeforeInput || !CAN_USE_BEFORE_INPUT) && backingAnchorElement !== null && !anchorNode.isComposing() && domAnchorNode !== getDOMTextNode(backingAnchorElement) || // Check if we're changing from bold to italics, or some other format.
+  anchorNode.getFormat() !== selection.format || // One last set of heuristics to check against.
+  $shouldInsertTextAfterOrBeforeTextNode(selection, anchorNode);
+}
 
 function shouldSkipSelectionChange(domNode, offset) {
   return domNode !== null && domNode.nodeValue !== null && domNode.nodeType === DOM_TEXT_TYPE && offset !== 0 && offset !== domNode.nodeValue.length;
@@ -2525,11 +2564,12 @@ function onBeforeInput(event, editor) {
         const text = event.dataTransfer.getData('text/plain');
         event.preventDefault();
         selection.insertRawText(text);
-      } else if (data != null && $shouldPreventDefaultAndInsertText(selection, data)) {
+      } else if (data != null && $shouldPreventDefaultAndInsertText(selection, data, event.timeStamp, true)) {
         event.preventDefault();
         dispatchCommand(editor, CONTROLLED_TEXT_INSERTION_COMMAND, data);
       }
 
+      lastBeforeInputInsertTextTimeStamp = event.timeStamp;
       return;
     } // Prevent the browser from carrying out
     // the input event, so we can control the
@@ -2682,7 +2722,7 @@ function onInput(event, editor) {
     const selection = $getSelection();
     const data = event.data;
 
-    if (data != null && $isRangeSelection(selection) && $shouldPreventDefaultAndInsertText(selection, data)) {
+    if (data != null && $isRangeSelection(selection) && $shouldPreventDefaultAndInsertText(selection, data, event.timeStamp, false)) {
       // Given we're over-riding the default behavior, we will need
       // to ensure to disable composition before dispatching the
       // insertText command for when changing the sequence for FF.
@@ -2691,7 +2731,22 @@ function onInput(event, editor) {
         isFirefoxEndingComposition = false;
       }
 
-      dispatchCommand(editor, CONTROLLED_TEXT_INSERTION_COMMAND, data);
+      const anchor = selection.anchor;
+      const anchorNode = anchor.getNode();
+      const domSelection = getDOMSelection();
+
+      if (domSelection === null) {
+        return;
+      }
+
+      const offset = anchor.offset; // If the content is the same as inserted, then don't dispatch an insertion.
+      // Given onInput doesn't take the current selection (it uses the previous)
+      // we can compare that against what the DOM currently says.
+
+      if (!CAN_USE_BEFORE_INPUT || selection.isCollapsed() || !$isTextNode(anchorNode) || domSelection.anchorNode === null || anchorNode.getTextContent().slice(0, offset) + data + anchorNode.getTextContent().slice(offset + selection.focus.offset) !== getAnchorTextFromDOM(domSelection.anchorNode)) {
+        dispatchCommand(editor, CONTROLLED_TEXT_INSERTION_COMMAND, data);
+      }
+
       const textLength = data.length; // Another hack for FF, as it's possible that the IME is still
       // open, even though compositionend has already fired (sigh).
 
@@ -3209,6 +3264,7 @@ function selectPointOnNode(point, node) {
     if ($isTextNode(nextSibling)) {
       key = nextSibling.__key;
       offset = 0;
+      type = 'text';
     } else {
       const parentNode = node.getParent();
 
@@ -4284,8 +4340,18 @@ class RangeSelection {
             const childrenLength = children.length;
 
             if ($isElementNode(target)) {
+              let firstChild = target.getFirstChild();
+
               for (let s = 0; s < childrenLength; s++) {
-                target.append(children[s]);
+                const child = children[s];
+
+                if (firstChild === null) {
+                  target.append(child);
+                } else {
+                  firstChild.insertAfter(child);
+                }
+
+                firstChild = child;
               }
             } else {
               for (let s = childrenLength - 1; s >= 0; s--) {
@@ -4400,7 +4466,11 @@ class RangeSelection {
         if (lastChild === null) {
           target.select();
         } else if ($isTextNode(lastChild)) {
-          lastChild.select();
+          if (lastChild.getTextContent() === '') {
+            lastChild.selectPrevious();
+          } else {
+            lastChild.select();
+          }
         } else {
           lastChild.selectNext();
         }
@@ -5481,7 +5551,7 @@ function adjustPointOffsetForMergedSibling(point, isBefore, key, target, textLen
     point.offset -= 1;
   }
 }
-function updateDOMSelection(prevSelection, nextSelection, editor, domSelection, tags, rootElement) {
+function updateDOMSelection(prevSelection, nextSelection, editor, domSelection, tags, rootElement, dirtyLeavesCount) {
   const anchorDOMNode = domSelection.anchorNode;
   const focusDOMNode = domSelection.focusNode;
   const anchorOffset = domSelection.anchorOffset;
@@ -5489,7 +5559,7 @@ function updateDOMSelection(prevSelection, nextSelection, editor, domSelection,
   const activeElement = document.activeElement; // TODO: make this not hard-coded, and add another config option
   // that makes this configurable.
 
-  if (tags.has('collaboration') && activeElement !== rootElement) {
+  if (tags.has('collaboration') && activeElement !== rootElement || activeElement !== null && isSelectionCapturedInDecoratorInput(activeElement)) {
     return;
   }
 
@@ -5545,7 +5615,7 @@ function updateDOMSelection(prevSelection, nextSelection, editor, domSelection,
   if (anchorOffset === nextAnchorOffset && focusOffset === nextFocusOffset && anchorDOMNode === nextAnchorNode && focusDOMNode === nextFocusNode && // Badly interpreted range selection when collapsed - #1482
   !(domSelection.type === 'Range' && isCollapsed)) {
     // If the root element does not have focus, ensure it has focus
-    if (rootElement !== null && (activeElement === null || !rootElement.contains(activeElement))) {
+    if (activeElement === null || !rootElement.contains(activeElement)) {
       rootElement.focus({
         preventScroll: true
       });
@@ -5554,28 +5624,39 @@ function updateDOMSelection(prevSelection, nextSelection, editor, domSelection,
     if (anchor.type !== 'element') {
       return;
     }
-  } // Apply the updated selection to the DOM. Note: this will trigger
-  // a "selectionchange" event, although it will be asynchronous.
-
-
-  try {
-    domSelection.setBaseAndExtent(nextAnchorNode, nextAnchorOffset, nextFocusNode, nextFocusOffset);
-
-    if (!tags.has('skip-scroll-into-view') && nextSelection.isCollapsed() && rootElement !== null && rootElement === activeElement) {
-      const selectionTarget = nextSelection instanceof RangeSelection && nextSelection.anchor.type === 'element' ? nextAnchorNode.childNodes[nextAnchorOffset] || null : domSelection.rangeCount > 0 ? domSelection.getRangeAt(0) : null;
+  }
 
-      if (selectionTarget !== null) {
-        // @ts-ignore Text nodes do have getBoundingClientRect
-        const selectionRect = selectionTarget.getBoundingClientRect();
-        scrollIntoViewIfNeeded(editor, selectionRect, rootElement);
+  if (!tags.has('skip-scroll-into-view')) // Apply the updated selection to the DOM. Note: this will trigger
+    // a "selectionchange" event, although it will be asynchronous.
+    try {
+      // When updating more than 1000 nodes on Chrome, it's actually better to defer
+      // updating the selection till the next frame. This is because Chrome's
+      // Blink engine has hard limit on how many DOM nodes it can redraw in
+      // a single cycle, so keeping it to the next frame improves performance.
+      // The downside is that is makes the computation within Lexical more
+      // complex, as now, we've sync update the DOM, but selection no longer
+      // matches.
+      if (IS_CHROME && dirtyLeavesCount > 1000) {
+        window.requestAnimationFrame(() => domSelection.setBaseAndExtent(nextAnchorNode, nextAnchorOffset, nextFocusNode, nextFocusOffset));
+      } else {
+        domSelection.setBaseAndExtent(nextAnchorNode, nextAnchorOffset, nextFocusNode, nextFocusOffset);
       }
+    } catch (error) {// If we encounter an error, continue. This can sometimes
+      // occur with FF and there's no good reason as to why it
+      // should happen.
     }
 
-    markSelectionChangeFromDOMUpdate();
-  } catch (error) {// If we encounter an error, continue. This can sometimes
-    // occur with FF and there's no good reason as to why it
-    // should happen.
+  if (!tags.has('skip-scroll-into-view') && nextSelection.isCollapsed() && rootElement !== null && rootElement === document.activeElement) {
+    const selectionTarget = nextSelection instanceof RangeSelection && nextSelection.anchor.type === 'element' ? nextAnchorNode.childNodes[nextAnchorOffset] || null : domSelection.rangeCount > 0 ? domSelection.getRangeAt(0) : null;
+
+    if (selectionTarget !== null) {
+      // @ts-ignore Text nodes do have getBoundingClientRect
+      const selectionRect = selectionTarget.getBoundingClientRect();
+      scrollIntoViewIfNeeded(editor, selectionRect, rootElement);
+    }
   }
+
+  markSelectionChangeFromDOMUpdate();
 }
 function $insertNodes(nodes, selectStart) {
   let selection = $getSelection();
@@ -5976,6 +6057,7 @@ function commitPendingUpdates(editor) {
   const normalizedNodes = editor._normalizedNodes;
   const tags = editor._updateTags;
   const deferred = editor._deferred;
+  const dirtyLeavesCount = dirtyLeaves.size;
 
   if (needsUpdate) {
     editor._dirtyType = NO_DIRTY_NODES;
@@ -6001,7 +6083,7 @@ function commitPendingUpdates(editor) {
     activeEditorState = pendingEditorState;
 
     try {
-      updateDOMSelection(currentSelection, pendingSelection, editor, domSelection, tags, rootElement);
+      updateDOMSelection(currentSelection, pendingSelection, editor, domSelection, tags, rootElement, dirtyLeavesCount);
     } finally {
       activeEditor = previousActiveEditor;
       activeEditorState = previousActiveEditorState;
@@ -6379,10 +6461,9 @@ function removeNode(nodeToRemove, restoreSelection, preserveEmptyParent) {
     }
   }
 
-  internalMarkSiblingsAsDirty(nodeToRemove);
-  parentChildren.splice(index, 1);
   const writableNodeToRemove = nodeToRemove.getWritable();
-  writableNodeToRemove.__parent = null;
+  internalMarkSiblingsAsDirty(nodeToRemove);
+  removeFromParent(writableNodeToRemove);
 
   if ($isRangeSelection(selection) && restoreSelection && !selectionMoved) {
     $updateElementSelectionOnCreateDeleteNode(selection, parent, index, -1);
@@ -6396,17 +6477,6 @@ function removeNode(nodeToRemove, restoreSelection, preserveEmptyParent) {
     parent.selectEnd();
   }
 }
-function $getNodeByKeyOrThrow(key) {
-  const node = $getNodeByKey(key);
-
-  if (node === null) {
-    {
-      throw Error(`Expected node with key ${key} to exist but it's not in the nodeMap.`);
-    }
-  }
-
-  return node;
-}
 class LexicalNode {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   // Flow doesn't support abstract classes unfortunately, so we can't _force_
@@ -6430,6 +6500,8 @@ class LexicalNode {
     // @ts-expect-error
     this.__type = this.constructor.getType();
     this.__parent = null;
+    this.__prev = null;
+    this.__next = null;
     $setNodeKey(this, key);
 
     {
@@ -6854,9 +6926,14 @@ class LexicalNode {
 
     const mutableNode = constructor.clone(latestNode);
     mutableNode.__parent = parent;
+    mutableNode.__next = latestNode.__next;
+    mutableNode.__prev = latestNode.__prev;
 
     if ($isElementNode(latestNode) && $isElementNode(mutableNode)) {
       mutableNode.__children = Array.from(latestNode.__children);
+      mutableNode.__first = latestNode.__first;
+      mutableNode.__last = latestNode.__last;
+      mutableNode.__size = latestNode.__size;
       mutableNode.__indent = latestNode.__indent;
       mutableNode.__format = latestNode.__format;
       mutableNode.__dir = latestNode.__dir;
@@ -7175,10 +7252,20 @@ class ElementNode extends LexicalNode {
 
   /** @internal */
 
+  /** @internal */
+
+  /** @internal */
+
+  /** @internal */
+
   /** @internal */
   constructor(key) {
-    super(key);
+    super(key); // TODO: remove children and switch to using first/last as part of linked list work
+
     this.__children = [];
+    this.__first = null;
+    this.__last = null;
+    this.__size = 0;
     this.__format = 0;
     this.__indent = 0;
     this.__dir = null;
@@ -7547,33 +7634,16 @@ class ElementNode extends LexicalNode {
       if ($isRangeSelection(selection)) {
         const nodesToRemoveKeySet = new Set(nodesToRemoveKeys);
         const nodesToInsertKeySet = new Set(nodesToInsertKeys);
-
-        const isPointRemoved = point => {
-          let node = point.getNode();
-
-          while (node) {
-            const nodeKey = node.__key;
-
-            if (nodesToRemoveKeySet.has(nodeKey) && !nodesToInsertKeySet.has(nodeKey)) {
-              return true;
-            }
-
-            node = node.getParent();
-          }
-
-          return false;
-        };
-
         const {
           anchor,
           focus
         } = selection;
 
-        if (isPointRemoved(anchor)) {
+        if (isPointRemoved(anchor, nodesToRemoveKeySet, nodesToInsertKeySet)) {
           moveSelectionPointToSibling(anchor, anchor.getNode(), this, nodeBeforeRange, nodeAfterRange);
         }
 
-        if (isPointRemoved(focus)) {
+        if (isPointRemoved(focus, nodesToRemoveKeySet, nodesToInsertKeySet)) {
           moveSelectionPointToSibling(focus, focus.getNode(), this, nodeBeforeRange, nodeAfterRange);
         } // Unlink removed nodes from current parent
 
@@ -7687,6 +7757,22 @@ function $isElementNode(node) {
   return node instanceof ElementNode;
 }
 
+function isPointRemoved(point, nodesToRemoveKeySet, nodesToInsertKeySet) {
+  let node = point.getNode();
+
+  while (node) {
+    const nodeKey = node.__key;
+
+    if (nodesToRemoveKeySet.has(nodeKey) && !nodesToInsertKeySet.has(nodeKey)) {
+      return true;
+    }
+
+    node = node.getParent();
+  }
+
+  return false;
+}
+
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
@@ -8329,6 +8415,14 @@ class TextNode extends LexicalNode {
         conversion: convertTextFormatElement,
         priority: 0
       }),
+      sub: node => ({
+        conversion: convertTextFormatElement,
+        priority: 0
+      }),
+      sup: node => ({
+        conversion: convertTextFormatElement,
+        priority: 0
+      }),
       u: node => ({
         conversion: convertTextFormatElement,
         priority: 0
@@ -8401,15 +8495,24 @@ class TextNode extends LexicalNode {
 
   setMode(type) {
     const mode = TEXT_MODE_TO_TYPE[type];
+
+    if (this.__mode === mode) {
+      return this;
+    }
+
     const self = this.getWritable();
     self.__mode = mode;
     return self;
   }
 
   setTextContent(text) {
-    const writableSelf = this.getWritable();
-    writableSelf.__text = text;
-    return writableSelf;
+    if (this.__text === text) {
+      return this;
+    }
+
+    const self = this.getWritable();
+    self.__text = text;
+    return self;
   }
 
   select(_anchorOffset, _focusOffset) {
@@ -8741,6 +8844,8 @@ const nodeNameToTextFormat = {
   em: 'italic',
   i: 'italic',
   strong: 'bold',
+  sub: 'subscript',
+  sup: 'superscript',
   u: 'underline'
 };
 
@@ -9128,7 +9233,7 @@ class LexicalEditor {
     // Doing so, causes e2e tests around the lock to fail.
 
     this._editable = true;
-    this._headless = false;
+    this._headless = parentEditor !== null && parentEditor._headless;
     this._window = null;
   }
 
@@ -9452,7 +9557,7 @@ class LexicalEditor {
  * LICENSE file in the root directory of this source tree.
  *
  */
-const VERSION = '0.6.3';
+const VERSION = '0.6.5';
 
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.

package/Lexical.js.flow

@@ -494,7 +494,6 @@ type TextPointType = {
   getNode: () => TextNode,
   set: (key: NodeKey, offset: number, type: 'text' | 'element') => void,
   getCharacterOffset: () => number,
-  isAtNodeEnd: () => boolean,
 };
 export type ElementPoint = ElementPointType;
 type ElementPointType = {
@@ -505,7 +504,6 @@ type ElementPointType = {
   isBefore: (PointType) => boolean,
   getNode: () => ElementNode,
   set: (key: NodeKey, offset: number, type: 'text' | 'element') => void,
-  isAtNodeEnd: () => boolean,
 };
 export type Point = PointType;
 type PointType = TextPointType | ElementPointType;
@@ -629,7 +627,8 @@ declare export class LineBreakNode extends LexicalNode {
   static importJSON(
     serializedLineBreakNode: SerializedLineBreakNode,
   ): LineBreakNode;
-  exportJSON(): SerializedLexicalNode;
+  // $FlowExpectedError[incompatible-extend] 'linebreak' is a literal string
+  exportJSON(): SerializedLineBreakNode;
 }
 declare export function $createLineBreakNode(): LineBreakNode;
 declare export function $isLineBreakNode(
@@ -662,7 +661,14 @@ declare export function $isRootNode(
 /**
  * LexicalElementNode
  */
-export type ElementFormatType = 'left' | 'center' | 'right' | 'justify' | '';
+export type ElementFormatType =
+  | 'left'
+  | 'start'
+  | 'center'
+  | 'right'
+  | 'end'
+  | 'justify'
+  | '';
 declare export class ElementNode extends LexicalNode {
   __children: Array<NodeKey>;
   __format: number;
@@ -757,7 +763,8 @@ declare export class ParagraphNode extends ElementNode {
   static importJSON(
     serializedParagraphNode: SerializedParagraphNode,
   ): ParagraphNode;
-  exportJSON(): SerializedElementNode;
+  // $FlowExpectedError[incompatible-extend] 'paragraph' is a literal string
+  exportJSON(): SerializedParagraphNode;
 }
 declare export function $createParagraphNode(): ParagraphNode;
 declare export function $isParagraphNode(