@lexical/code 0.8.1 → 0.9.0

package/CodeHighlightNode.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-import { type EditorConfig, type LexicalNode, type NodeKey, type SerializedTextNode, type Spread, TextNode, ElementNode } from 'lexical';
+import type { EditorConfig, LexicalNode, NodeKey, SerializedTextNode, Spread } from 'lexical';
 import 'prismjs/components/prism-clike';
 import 'prismjs/components/prism-javascript';
 import 'prismjs/components/prism-markup';
@@ -20,6 +20,7 @@ import 'prismjs/components/prism-swift';
 import 'prismjs/components/prism-typescript';
 import 'prismjs/components/prism-java';
 import 'prismjs/components/prism-cpp';
+import { ElementNode, TextNode } from 'lexical';
 export declare const DEFAULT_CODE_LANGUAGE = "javascript";
 declare type SerializedCodeHighlightNode = Spread<{
     highlightType: string | null | undefined;

package/LexicalCode.dev.js

@@ -31,50 +31,60 @@ var lexical = require('lexical');
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 const mapToPrismLanguage = language => {
   // eslint-disable-next-line no-prototype-builtins
   return language != null && Prism.languages.hasOwnProperty(language) ? language : undefined;
 };
+
 function hasChildDOMNodeTag(node, tagName) {
   for (const child of node.childNodes) {
     if (utils.isHTMLElement(child) && child.tagName === tagName) {
       return true;
     }
+
     hasChildDOMNodeTag(child, tagName);
   }
+
   return false;
 }
-const LANGUAGE_DATA_ATTRIBUTE = 'data-highlight-language';
 
+const LANGUAGE_DATA_ATTRIBUTE = 'data-highlight-language';
 /** @noInheritDoc */
+
 class CodeNode extends lexical.ElementNode {
   /** @internal */
-
   static getType() {
     return 'code';
   }
+
   static clone(node) {
     return new CodeNode(node.__language, node.__key);
   }
+
   constructor(language, key) {
     super(key);
     this.__language = mapToPrismLanguage(language);
-  }
+  } // View
+
 
-  // View
   createDOM(config) {
     const element = document.createElement('code');
     utils.addClassNamesToElement(element, config.theme.code);
     element.setAttribute('spellcheck', 'false');
     const language = this.getLanguage();
+
     if (language) {
       element.setAttribute(LANGUAGE_DATA_ATTRIBUTE, language);
     }
+
     return element;
   }
+
   updateDOM(prevNode, dom, config) {
     const language = this.__language;
     const prevLanguage = prevNode.__language;
+
     if (language) {
       if (language !== prevLanguage) {
         dom.setAttribute(LANGUAGE_DATA_ATTRIBUTE, language);
@@ -82,8 +92,10 @@ class CodeNode extends lexical.ElementNode {
     } else if (prevLanguage) {
       dom.removeAttribute(LANGUAGE_DATA_ATTRIBUTE);
     }
+
     return false;
   }
+
   static importDOM() {
     return {
       // Typically <pre> is used for code blocks, and <code> for inline code styles
@@ -105,26 +117,29 @@ class CodeNode extends lexical.ElementNode {
         priority: 0
       }),
       table: node => {
-        const table = node;
-        // domNode is a <table> since we matched it by nodeName
+        const table = node; // domNode is a <table> since we matched it by nodeName
+
         if (isGitHubCodeTable(table)) {
           return {
             conversion: convertTableElement,
             priority: 3
           };
         }
+
         return null;
       },
       td: node => {
         // element is a <td> since we matched it by nodeName
         const td = node;
         const table = td.closest('table');
+
         if (isGitHubCodeCell(td)) {
           return {
             conversion: convertTableCellElement,
             priority: 3
           };
         }
+
         if (table && isGitHubCodeTable(table)) {
           // Return a no-op if it's a table cell in a code table, but not a code line.
           // Otherwise it'll fall back to the T
@@ -133,22 +148,26 @@ class CodeNode extends lexical.ElementNode {
             priority: 3
           };
         }
+
         return null;
       },
       tr: node => {
         // element is a <tr> since we matched it by nodeName
         const tr = node;
         const table = tr.closest('table');
+
         if (table && isGitHubCodeTable(table)) {
           return {
             conversion: convertCodeNoop,
             priority: 3
           };
         }
+
         return null;
       }
     };
   }
+
   static importJSON(serializedNode) {
     const node = $createCodeNode(serializedNode.language);
     node.setFormat(serializedNode.format);
@@ -156,38 +175,42 @@ class CodeNode extends lexical.ElementNode {
     node.setDirection(serializedNode.direction);
     return node;
   }
+
   exportJSON() {
-    return {
-      ...super.exportJSON(),
+    return { ...super.exportJSON(),
       language: this.getLanguage(),
       type: 'code',
       version: 1
     };
-  }
+  } // Mutation
+
 
-  // Mutation
   insertNewAfter(selection, restoreSelection = true) {
     const children = this.getChildren();
     const childrenLength = children.length;
+
     if (childrenLength >= 2 && children[childrenLength - 1].getTextContent() === '\n' && children[childrenLength - 2].getTextContent() === '\n' && selection.isCollapsed() && selection.anchor.key === this.__key && selection.anchor.offset === childrenLength) {
       children[childrenLength - 1].remove();
       children[childrenLength - 2].remove();
       const newElement = lexical.$createParagraphNode();
       this.insertAfter(newElement, restoreSelection);
       return newElement;
-    }
-
-    // If the selection is within the codeblock, find all leading tabs and
+    } // If the selection is within the codeblock, find all leading tabs and
     // spaces of the current line. Create a new line that has all those
     // tabs and spaces, such that leading indentation is preserved.
+
+
     const anchor = selection.anchor.getNode();
     const firstNode = getFirstCodeHighlightNodeOfLine(anchor);
+
     if (firstNode != null) {
       let leadingWhitespace = 0;
       const firstNodeText = firstNode.getTextContent();
+
       while (leadingWhitespace < firstNodeText.length && /[\t ]/.test(firstNodeText[leadingWhitespace])) {
         leadingWhitespace += 1;
       }
+
       if (leadingWhitespace > 0) {
         const whitespace = firstNodeText.substring(0, leadingWhitespace);
         const indentedChild = $createCodeHighlightNode(whitespace);
@@ -197,18 +220,24 @@ class CodeNode extends lexical.ElementNode {
         return indentedChild;
       }
     }
+
     return null;
   }
+
   canInsertTab() {
     const selection = lexical.$getSelection();
+
     if (!lexical.$isRangeSelection(selection) || !selection.isCollapsed()) {
       return false;
     }
+
     return true;
   }
+
   canIndent() {
     return false;
   }
+
   collapseAtStart() {
     const paragraph = lexical.$createParagraphNode();
     const children = this.getChildren();
@@ -216,13 +245,16 @@ class CodeNode extends lexical.ElementNode {
     this.replace(paragraph);
     return true;
   }
+
   setLanguage(language) {
     const writable = this.getWritable();
     writable.__language = mapToPrismLanguage(language);
   }
+
   getLanguage() {
     return this.getLatest().__language;
   }
+
 }
 function $createCodeNode(language) {
   return lexical.$applyNodeReplacement(new CodeNode(language));
@@ -230,44 +262,53 @@ function $createCodeNode(language) {
 function $isCodeNode(node) {
   return node instanceof CodeNode;
 }
+
 function convertPreElement(domNode) {
   return {
     node: $createCodeNode(),
     preformatted: true
   };
 }
+
 function convertDivElement(domNode) {
   // domNode is a <div> since we matched it by nodeName
   const div = domNode;
   const isCode = isCodeElement(div);
+
   if (!isCode && !isCodeChildElement(div)) {
     return {
       node: null
     };
   }
+
   return {
     after: childLexicalNodes => {
       const domParent = domNode.parentNode;
+
       if (domParent != null && domNode !== domParent.lastChild) {
         childLexicalNodes.push(lexical.$createLineBreakNode());
       }
+
       return childLexicalNodes;
     },
     node: isCode ? $createCodeNode() : null,
     preformatted: isCode
   };
 }
+
 function convertTableElement() {
   return {
     node: $createCodeNode(),
     preformatted: true
   };
 }
+
 function convertCodeNoop() {
   return {
     node: null
   };
 }
+
 function convertTableCellElement(domNode) {
   // domNode is a <td> since we matched it by nodeName
   const cell = domNode;
@@ -277,27 +318,35 @@ function convertTableCellElement(domNode) {
         // Append newline between code lines
         childLexicalNodes.push(lexical.$createLineBreakNode());
       }
+
       return childLexicalNodes;
     },
     node: null
   };
 }
+
 function isCodeElement(div) {
   return div.style.fontFamily.match('monospace') !== null;
 }
+
 function isCodeChildElement(node) {
   let parent = node.parentElement;
+
   while (parent !== null) {
     if (isCodeElement(parent)) {
       return true;
     }
+
     parent = parent.parentElement;
   }
+
   return false;
 }
+
 function isGitHubCodeCell(cell) {
   return cell.classList.contains('js-file-line');
 }
+
 function isGitHubCodeTable(table) {
   return table.classList.contains('js-file-line-container');
 }
@@ -343,52 +392,60 @@ function normalizeCodeLang(lang) {
 }
 function getLanguageFriendlyName(lang) {
   const _lang = normalizeCodeLang(lang);
+
   return CODE_LANGUAGE_FRIENDLY_NAME_MAP[_lang] || _lang;
 }
 const getDefaultCodeLanguage = () => DEFAULT_CODE_LANGUAGE;
-const getCodeLanguages = () => Object.keys(Prism.languages).filter(
-// Prism has several language helpers mixed into languages object
+const getCodeLanguages = () => Object.keys(Prism.languages).filter( // Prism has several language helpers mixed into languages object
 // so filtering them out here to get langs list
 language => typeof Prism.languages[language] !== 'function').sort();
-
 /** @noInheritDoc */
+
 class CodeHighlightNode extends lexical.TextNode {
   /** @internal */
-
   constructor(text, highlightType, key) {
     super(text, key);
     this.__highlightType = highlightType;
   }
+
   static getType() {
     return 'code-highlight';
   }
+
   static clone(node) {
     return new CodeHighlightNode(node.__text, node.__highlightType || undefined, node.__key);
   }
+
   getHighlightType() {
     const self = this.getLatest();
     return self.__highlightType;
   }
+
   createDOM(config) {
     const element = super.createDOM(config);
     const className = getHighlightThemeClass(config.theme, this.__highlightType);
     utils.addClassNamesToElement(element, className);
     return element;
   }
+
   updateDOM(prevNode, dom, config) {
     const update = super.updateDOM(prevNode, dom, config);
     const prevClassName = getHighlightThemeClass(config.theme, prevNode.__highlightType);
     const nextClassName = getHighlightThemeClass(config.theme, this.__highlightType);
+
     if (prevClassName !== nextClassName) {
       if (prevClassName) {
         utils.removeClassNamesFromElement(dom, prevClassName);
       }
+
       if (nextClassName) {
         utils.addClassNamesToElement(dom, nextClassName);
       }
     }
+
     return update;
   }
+
   static importJSON(serializedNode) {
     const node = $createCodeHighlightNode(serializedNode.text, serializedNode.highlightType);
     node.setFormat(serializedNode.format);
@@ -397,29 +454,34 @@ class CodeHighlightNode extends lexical.TextNode {
     node.setStyle(serializedNode.style);
     return node;
   }
+
   exportJSON() {
-    return {
-      ...super.exportJSON(),
+    return { ...super.exportJSON(),
       highlightType: this.getHighlightType(),
       type: 'code-highlight',
       version: 1
     };
-  }
+  } // Prevent formatting (bold, underline, etc)
+
 
-  // Prevent formatting (bold, underline, etc)
   setFormat(format) {
     return this;
   }
+
   isParentRequired() {
     return true;
   }
+
   createParentElementNode() {
     return $createCodeNode();
   }
+
 }
+
 function getHighlightThemeClass(theme, highlightType) {
   return highlightType && theme && theme.codeHighlight && theme.codeHighlight[highlightType];
 }
+
 function $createCodeHighlightNode(text, highlightType) {
   return lexical.$applyNodeReplacement(new CodeHighlightNode(text, highlightType));
 }
@@ -430,30 +492,38 @@ function getFirstCodeHighlightNodeOfLine(anchor) {
   let currentNode = null;
   const previousSiblings = anchor.getPreviousSiblings();
   previousSiblings.push(anchor);
+
   while (previousSiblings.length > 0) {
     const node = previousSiblings.pop();
+
     if ($isCodeHighlightNode(node)) {
       currentNode = node;
     }
+
     if (lexical.$isLineBreakNode(node)) {
       break;
     }
   }
+
   return currentNode;
 }
 function getLastCodeHighlightNodeOfLine(anchor) {
   let currentNode = null;
   const nextSiblings = anchor.getNextSiblings();
   nextSiblings.unshift(anchor);
+
   while (nextSiblings.length > 0) {
     const node = nextSiblings.shift();
+
     if ($isCodeHighlightNode(node)) {
       currentNode = node;
     }
+
     if (lexical.$isLineBreakNode(node)) {
       break;
     }
   }
+
   return currentNode;
 }
 
@@ -466,19 +536,25 @@ function getLastCodeHighlightNodeOfLine(anchor) {
  */
 const PrismTokenizer = {
   defaultLanguage: DEFAULT_CODE_LANGUAGE,
+
   tokenize(code, language) {
     return Prism.tokenize(code, Prism.languages[language || ''] || Prism.languages[this.defaultLanguage]);
   }
+
 };
+
 function isSpaceOrTabChar(char) {
   return char === ' ' || char === '\t';
 }
+
 function findFirstNotSpaceOrTabCharAtText(text, isForward) {
   const length = text.length;
   let offset = -1;
+
   if (isForward) {
     for (let i = 0; i < length; i++) {
       const char = text[i];
+
       if (!isSpaceOrTabChar(char)) {
         offset = i;
         break;
@@ -487,51 +563,64 @@ function findFirstNotSpaceOrTabCharAtText(text, isForward) {
   } else {
     for (let i = length - 1; i > -1; i--) {
       const char = text[i];
+
       if (!isSpaceOrTabChar(char)) {
         offset = i;
         break;
       }
     }
   }
+
   return offset;
 }
+
 function getStartOfCodeInLine(anchor) {
   let currentNode = null;
   let currentNodeOffset = -1;
   const previousSiblings = anchor.getPreviousSiblings();
   previousSiblings.push(anchor);
+
   while (previousSiblings.length > 0) {
     const node = previousSiblings.pop();
+
     if ($isCodeHighlightNode(node)) {
       const text = node.getTextContent();
       const offset = findFirstNotSpaceOrTabCharAtText(text, true);
+
       if (offset !== -1) {
         currentNode = node;
         currentNodeOffset = offset;
       }
     }
+
     if (lexical.$isLineBreakNode(node)) {
       break;
     }
   }
+
   if (currentNode === null) {
     const nextSiblings = anchor.getNextSiblings();
+
     while (nextSiblings.length > 0) {
       const node = nextSiblings.shift();
+
       if ($isCodeHighlightNode(node)) {
         const text = node.getTextContent();
         const offset = findFirstNotSpaceOrTabCharAtText(text, true);
+
         if (offset !== -1) {
           currentNode = node;
           currentNodeOffset = offset;
           break;
         }
       }
+
       if (lexical.$isLineBreakNode(node)) {
         break;
       }
     }
   }
+
   return {
     node: currentNode,
     offset: currentNodeOffset
@@ -542,47 +631,59 @@ function getEndOfCodeInLine(anchor) {
   let currentNodeOffset = -1;
   const nextSiblings = anchor.getNextSiblings();
   nextSiblings.unshift(anchor);
+
   while (nextSiblings.length > 0) {
     const node = nextSiblings.shift();
+
     if ($isCodeHighlightNode(node)) {
       const text = node.getTextContent();
       const offset = findFirstNotSpaceOrTabCharAtText(text, false);
+
       if (offset !== -1) {
         currentNode = node;
         currentNodeOffset = offset + 1;
       }
     }
+
     if (lexical.$isLineBreakNode(node)) {
       break;
     }
   }
+
   if (currentNode === null) {
     const previousSiblings = anchor.getPreviousSiblings();
+
     while (previousSiblings.length > 0) {
       const node = previousSiblings.pop();
+
       if ($isCodeHighlightNode(node)) {
         const text = node.getTextContent();
         const offset = findFirstNotSpaceOrTabCharAtText(text, false);
+
         if (offset !== -1) {
           currentNode = node;
           currentNodeOffset = offset + 1;
           break;
         }
       }
+
       if (lexical.$isLineBreakNode(node)) {
         break;
       }
     }
   }
+
   return {
     node: currentNode,
     offset: currentNodeOffset
   };
 }
+
 function textNodeTransform(node, editor, tokenizer) {
   // Since CodeNode has flat children structure we only need to check
   // if node's parent is a code node and run highlighting if so
   const parentNode = node.getParent();
+
   if ($isCodeNode(parentNode)) {
     codeNodeTransform(parentNode, editor, tokenizer);
   } else if ($isCodeHighlightNode(node)) {
@@ -591,31 +692,35 @@ function textNodeTransform(node, editor, tokenizer) {
     node.replace(lexical.$createTextNode(node.__text));
   }
 }
+
 function updateCodeGutter(node, editor) {
   const codeElement = editor.getElementByKey(node.getKey());
+
   if (codeElement === null) {
     return;
   }
+
   const children = node.getChildren();
-  const childrenLength = children.length;
-  // @ts-ignore: internal field
+  const childrenLength = children.length; // @ts-ignore: internal field
+
   if (childrenLength === codeElement.__cachedChildrenLength) {
     // Avoid updating the attribute if the children length hasn't changed.
     return;
-  }
-  // @ts-ignore:: internal field
+  } // @ts-ignore:: internal field
+
+
   codeElement.__cachedChildrenLength = childrenLength;
   let gutter = '1';
   let count = 1;
+
   for (let i = 0; i < childrenLength; i++) {
     if (lexical.$isLineBreakNode(children[i])) {
       gutter += '\n' + ++count;
     }
   }
-  codeElement.setAttribute('data-gutter', gutter);
-}
 
-// Using `skipTransforms` to prevent extra transforms since reformatting the code
+  codeElement.setAttribute('data-gutter', gutter);
+} // Using `skipTransforms` to prevent extra transforms since reformatting the code
 // will not affect code block content itself.
 //
 // Using extra cache (`nodesCurrentlyHighlighting`) since both CodeNode and CodeHighlightNode
@@ -623,28 +728,33 @@ function updateCodeGutter(node, editor) {
 // in both cases we'll rerun whole reformatting over CodeNode, which is redundant.
 // Especially when pasting code into CodeBlock.
 
+
 const nodesCurrentlyHighlighting = new Set();
+
 function codeNodeTransform(node, editor, tokenizer) {
   const nodeKey = node.getKey();
+
   if (nodesCurrentlyHighlighting.has(nodeKey)) {
     return;
   }
-  nodesCurrentlyHighlighting.add(nodeKey);
 
-  // When new code block inserted it might not have language selected
+  nodesCurrentlyHighlighting.add(nodeKey); // When new code block inserted it might not have language selected
+
   if (node.getLanguage() === undefined) {
     node.setLanguage(tokenizer.defaultLanguage);
-  }
-
-  // Using nested update call to pass `skipTransforms` since we don't want
+  } // Using nested update call to pass `skipTransforms` since we don't want
   // each individual codehighlight node to be transformed again as it's already
   // in its final state
+
+
   editor.update(() => {
     updateAndRetainSelection(nodeKey, () => {
       const currentNode = lexical.$getNodeByKey(nodeKey);
+
       if (!$isCodeNode(currentNode) || !currentNode.isAttached()) {
         return false;
       }
+
       const code = currentNode.getTextContent();
       const tokens = tokenizer.tokenize(code, currentNode.getLanguage() || tokenizer.defaultLanguage);
       const highlightNodes = getHighlightNodes(tokens);
@@ -654,10 +764,12 @@ function codeNodeTransform(node, editor, tokenizer) {
         to,
         nodesForReplacement
       } = diffRange;
+
       if (from !== to || nodesForReplacement.length) {
         node.splice(from, to - from, nodesForReplacement);
         return true;
       }
+
       return false;
     });
   }, {
@@ -667,16 +779,20 @@ function codeNodeTransform(node, editor, tokenizer) {
     skipTransforms: true
   });
 }
+
 function getHighlightNodes(tokens) {
   const nodes = [];
   tokens.forEach(token => {
     if (typeof token === 'string') {
       const partials = token.split('\n');
+
       for (let i = 0; i < partials.length; i++) {
         const text = partials[i];
+
         if (text.length) {
           nodes.push($createCodeHighlightNode(text));
         }
+
         if (i < partials.length - 1) {
           nodes.push(lexical.$createLineBreakNode());
         }
@@ -685,6 +801,7 @@ function getHighlightNodes(tokens) {
       const {
         content
       } = token;
+
       if (typeof content === 'string') {
         nodes.push($createCodeHighlightNode(content, token.type));
       } else if (Array.isArray(content) && content.length === 1 && typeof content[0] === 'string') {
@@ -695,83 +812,98 @@ function getHighlightNodes(tokens) {
     }
   });
   return nodes;
-}
-
-// Wrapping update function into selection retainer, that tries to keep cursor at the same
+} // Wrapping update function into selection retainer, that tries to keep cursor at the same
 // position as before.
+
+
 function updateAndRetainSelection(nodeKey, updateFn) {
   const node = lexical.$getNodeByKey(nodeKey);
+
   if (!$isCodeNode(node) || !node.isAttached()) {
     return;
   }
-  const selection = lexical.$getSelection();
-  // If it's not range selection (or null selection) there's no need to change it,
+
+  const selection = lexical.$getSelection(); // If it's not range selection (or null selection) there's no need to change it,
   // but we can still run highlighting logic
+
   if (!lexical.$isRangeSelection(selection)) {
     updateFn();
     return;
   }
+
   const anchor = selection.anchor;
   const anchorOffset = anchor.offset;
   const isNewLineAnchor = anchor.type === 'element' && lexical.$isLineBreakNode(node.getChildAtIndex(anchor.offset - 1));
-  let textOffset = 0;
+  let textOffset = 0; // Calculating previous text offset (all text node prior to anchor + anchor own text offset)
 
-  // Calculating previous text offset (all text node prior to anchor + anchor own text offset)
   if (!isNewLineAnchor) {
     const anchorNode = anchor.getNode();
     textOffset = anchorOffset + anchorNode.getPreviousSiblings().reduce((offset, _node) => {
       return offset + _node.getTextContentSize();
     }, 0);
   }
+
   const hasChanges = updateFn();
+
   if (!hasChanges) {
     return;
-  }
-
-  // Non-text anchors only happen for line breaks, otherwise
+  } // Non-text anchors only happen for line breaks, otherwise
   // selection will be within text node (code highlight node)
+
+
   if (isNewLineAnchor) {
     anchor.getNode().select(anchorOffset, anchorOffset);
     return;
-  }
-
-  // If it was non-element anchor then we walk through child nodes
+  } // If it was non-element anchor then we walk through child nodes
   // and looking for a position of original text offset
+
+
   node.getChildren().some(_node => {
     const isText = lexical.$isTextNode(_node);
+
     if (isText || lexical.$isLineBreakNode(_node)) {
       const textContentSize = _node.getTextContentSize();
+
       if (isText && textContentSize >= textOffset) {
         _node.select(textOffset, textOffset);
+
         return true;
       }
+
       textOffset -= textContentSize;
     }
+
     return false;
   });
-}
-
-// Finds minimal diff range between two nodes lists. It returns from/to range boundaries of prevNodes
+} // Finds minimal diff range between two nodes lists. It returns from/to range boundaries of prevNodes
 // that needs to be replaced with `nodes` (subset of nextNodes) to make prevNodes equal to nextNodes.
+
+
 function getDiffRange(prevNodes, nextNodes) {
   let leadingMatch = 0;
+
   while (leadingMatch < prevNodes.length) {
     if (!isEqual(prevNodes[leadingMatch], nextNodes[leadingMatch])) {
       break;
     }
+
     leadingMatch++;
   }
+
   const prevNodesLength = prevNodes.length;
   const nextNodesLength = nextNodes.length;
   const maxTrailingMatch = Math.min(prevNodesLength, nextNodesLength) - leadingMatch;
   let trailingMatch = 0;
+
   while (trailingMatch < maxTrailingMatch) {
     trailingMatch++;
+
     if (!isEqual(prevNodes[prevNodesLength - trailingMatch], nextNodes[nextNodesLength - trailingMatch])) {
       trailingMatch--;
       break;
     }
   }
+
   const from = leadingMatch;
   const to = prevNodesLength - trailingMatch;
   const nodesForReplacement = nextNodes.slice(leadingMatch, nextNodesLength - trailingMatch);
@@ -781,45 +913,59 @@ function getDiffRange(prevNodes, nextNodes) {
     to
   };
 }
+
 function isEqual(nodeA, nodeB) {
   // Only checking for code higlight nodes and linebreaks. If it's regular text node
   // returning false so that it's transformed into code highlight node
   if ($isCodeHighlightNode(nodeA) && $isCodeHighlightNode(nodeB)) {
     return nodeA.__text === nodeB.__text && nodeA.__highlightType === nodeB.__highlightType;
   }
+
   if (lexical.$isLineBreakNode(nodeA) && lexical.$isLineBreakNode(nodeB)) {
     return true;
   }
+
   return false;
 }
+
 function handleMultilineIndent(type) {
   const selection = lexical.$getSelection();
+
   if (!lexical.$isRangeSelection(selection) || selection.isCollapsed()) {
     return false;
-  }
+  } // Only run multiline indent logic on selections exclusively composed of code highlights and linebreaks
+
 
-  // Only run multiline indent logic on selections exclusively composed of code highlights and linebreaks
   const nodes = selection.getNodes();
+
   for (let i = 0; i < nodes.length; i++) {
     const node = nodes[i];
+
     if (!$isCodeHighlightNode(node) && !lexical.$isLineBreakNode(node)) {
       return false;
     }
   }
+
   const startOfLine = getFirstCodeHighlightNodeOfLine(nodes[0]);
+
   if (startOfLine != null) {
     doIndent(startOfLine, type);
   }
+
   for (let i = 1; i < nodes.length; i++) {
     const node = nodes[i];
+
     if (lexical.$isLineBreakNode(nodes[i - 1]) && $isCodeHighlightNode(node)) {
       doIndent(node, type);
     }
   }
+
   return true;
 }
+
 function doIndent(node, type) {
   const text = node.getTextContent();
+
   if (type === lexical.INDENT_CONTENT_COMMAND) {
     // If the codeblock node doesn't start with whitespace, we don't want to
     // naively prepend a '\t'; Prism will then mangle all of our nodes when
@@ -844,15 +990,17 @@ function doIndent(node, type) {
     }
   }
 }
+
 function handleShiftLines(type, event) {
   // We only care about the alt+arrow keys
   const selection = lexical.$getSelection();
+
   if (!lexical.$isRangeSelection(selection)) {
     return false;
-  }
-
-  // I'm not quite sure why, but it seems like calling anchor.getNode() collapses the selection here
+  } // I'm not quite sure why, but it seems like calling anchor.getNode() collapses the selection here
   // So first, get the anchor and the focus, then get their nodes
+
+
   const {
     anchor,
     focus
@@ -861,19 +1009,21 @@ function handleShiftLines(type, event) {
   const focusOffset = focus.offset;
   const anchorNode = anchor.getNode();
   const focusNode = focus.getNode();
-  const arrowIsUp = type === lexical.KEY_ARROW_UP_COMMAND;
+  const arrowIsUp = type === lexical.KEY_ARROW_UP_COMMAND; // Ensure the selection is within the codeblock
 
-  // Ensure the selection is within the codeblock
   if (!$isCodeHighlightNode(anchorNode) || !$isCodeHighlightNode(focusNode)) {
     return false;
   }
+
   if (!event.altKey) {
     // Handle moving selection out of the code block, given there are no
     // sibling thats can natively take the selection.
     if (selection.isCollapsed()) {
       const codeNode = anchorNode.getParentOrThrow();
+
       if (arrowIsUp && anchorOffset === 0 && anchorNode.getPreviousSibling() === null) {
         const codeNodeSibling = codeNode.getPreviousSibling();
+
         if (codeNodeSibling === null) {
           codeNode.selectPrevious();
           event.preventDefault();
@@ -881,6 +1031,7 @@ function handleShiftLines(type, event) {
         }
       } else if (!arrowIsUp && anchorOffset === anchorNode.getTextContentSize() && anchorNode.getNextSibling() === null) {
         const codeNodeSibling = codeNode.getNextSibling();
+
         if (codeNodeSibling === null) {
           codeNode.selectNext();
           event.preventDefault();
@@ -888,39 +1039,50 @@ function handleShiftLines(type, event) {
         }
       }
     }
+
     return false;
   }
+
   const start = getFirstCodeHighlightNodeOfLine(anchorNode);
   const end = getLastCodeHighlightNodeOfLine(focusNode);
+
   if (start == null || end == null) {
     return false;
   }
+
   const range = start.getNodesBetween(end);
+
   for (let i = 0; i < range.length; i++) {
     const node = range[i];
+
     if (!$isCodeHighlightNode(node) && !lexical.$isLineBreakNode(node)) {
       return false;
     }
-  }
-
-  // After this point, we know the selection is within the codeblock. We may not be able to
+  } // After this point, we know the selection is within the codeblock. We may not be able to
   // actually move the lines around, but we want to return true either way to prevent
   // the event's default behavior
+
+
   event.preventDefault();
   event.stopPropagation(); // required to stop cursor movement under Firefox
 
   const linebreak = arrowIsUp ? start.getPreviousSibling() : end.getNextSibling();
+
   if (!lexical.$isLineBreakNode(linebreak)) {
     return true;
   }
+
   const sibling = arrowIsUp ? linebreak.getPreviousSibling() : linebreak.getNextSibling();
+
   if (sibling == null) {
     return true;
   }
+
   const maybeInsertionPoint = arrowIsUp ? getFirstCodeHighlightNodeOfLine(sibling) : getLastCodeHighlightNodeOfLine(sibling);
   let insertionPoint = maybeInsertionPoint != null ? maybeInsertionPoint : sibling;
   linebreak.remove();
   range.forEach(node => node.remove());
+
   if (type === lexical.KEY_ARROW_UP_COMMAND) {
     range.forEach(node => insertionPoint.insertBefore(node));
     insertionPoint.insertBefore(linebreak);
@@ -932,14 +1094,18 @@ function handleShiftLines(type, event) {
       insertionPoint = node;
     });
   }
+
   selection.setTextNodeRange(anchorNode, anchorOffset, focusNode, focusOffset);
   return true;
 }
+
 function handleMoveTo(type, event) {
   const selection = lexical.$getSelection();
+
   if (!lexical.$isRangeSelection(selection)) {
     return false;
   }
+
   const {
     anchor,
     focus
@@ -947,11 +1113,14 @@ function handleMoveTo(type, event) {
   const anchorNode = anchor.getNode();
   const focusNode = focus.getNode();
   const isMoveToStart = type === lexical.MOVE_TO_START;
+
   if (!$isCodeHighlightNode(anchorNode) || !$isCodeHighlightNode(focusNode)) {
     return false;
   }
+
   let node;
   let offset;
+
   if (isMoveToStart) {
     ({
       node,
@@ -963,25 +1132,31 @@ function handleMoveTo(type, event) {
       offset
     } = getEndOfCodeInLine(focusNode));
   }
+
   if (node !== null && offset !== -1) {
     selection.setTextNodeRange(node, offset, node, offset);
   }
+
   event.preventDefault();
   event.stopPropagation();
   return true;
 }
+
 function registerCodeHighlighting(editor, tokenizer) {
   if (!editor.hasNodes([CodeNode, CodeHighlightNode])) {
     throw new Error('CodeHighlightPlugin: CodeNode or CodeHighlightNode not registered on editor');
   }
+
   if (tokenizer == null) {
     tokenizer = PrismTokenizer;
   }
+
   return utils.mergeRegister(editor.registerMutationListener(CodeNode, mutations => {
     editor.update(() => {
       for (const [key, type] of mutations) {
         if (type !== 'destroyed') {
           const node = lexical.$getNodeByKey(key);
+
           if (node !== null) {
             updateCodeGutter(node, editor);
           }

package/package.json

@@ -8,13 +8,13 @@
     "code"
   ],
   "license": "MIT",
-  "version": "0.8.1",
+  "version": "0.9.0",
   "main": "LexicalCode.js",
   "peerDependencies": {
-    "lexical": "0.8.1"
+    "lexical": "0.9.0"
   },
   "dependencies": {
-    "@lexical/utils": "0.8.1",
+    "@lexical/utils": "0.9.0",
     "prismjs": "^1.27.0"
   },
   "repository": {