@lexical/react 0.1.13 → 0.1.16

package/LexicalAutoFormatterPlugin.dev.js

@@ -12,6 +12,7 @@ var lexical = require('lexical');
 var CodeNode = require('lexical/CodeNode');
 var react = require('react');
 var LexicalHorizontalRuleNode = require('@lexical/react/LexicalHorizontalRuleNode');
+var text = require('@lexical/text');
 var HeadingNode = require('lexical/HeadingNode');
 var QuoteNode = require('lexical/QuoteNode');
 
@@ -23,108 +24,27 @@ var QuoteNode = require('lexical/QuoteNode');
  *
  * 
  */
-// Caution, this function creates a string and should not be used within a tight loop.
-// Use $getNodeWithOffsetsFromJoinedTextNodesFromElementNode below to convert
-// indexes in the return string back into their corresponding node and offsets.
-
-function $joinTextNodesInElementNode(elementNode, separator, stopAt) {
-  let textContent = '';
-  const children = elementNode.getChildren();
-  const length = children.length;
-
-  for (let i = 0; i < length; ++i) {
-    const child = children[i];
-
-    if (lexical.$isTextNode(child)) {
-      const childTextContent = child.getTextContent();
-
-      if (child.is(stopAt.node)) {
-        if (stopAt.offset > childTextContent.length) {
-          {
-            throw Error(`Node ${child.__key} and selection point do not match.`);
-          }
-        }
-
-        textContent += child.getTextContent().substr(0, stopAt.offset);
-        break;
-      } else {
-        textContent += childTextContent;
-      }
-    } else {
-      textContent += separator;
-    }
-  }
-
-  return textContent;
-} // This function converts the offsetInJoinedText to
-// a node and offset result or null if not found.
-// This function is to be used in conjunction with joinTextNodesInElementNode above.
-// The joinedTextContent should be return value from joinTextNodesInElementNode.
-//
-// The offsetInJoinedText is relative to the entire string which
-// itself is relevant to the parent ElementNode.
-//
-// Example:
-// Given a Paragraph with 2 TextNodes. The first is Hello, the second is World.
-// The joinedTextContent would be "HelloWorld"
-// The offsetInJoinedText might be for the letter "e" = 1 or "r" = 7.
-// The return values would be {TextNode1, 1} or {TextNode2,2}, respectively.
-
-function $findNodeWithOffsetFromJoinedText(elementNode, joinedTextLength, offsetInJoinedText, separatorLength) {
-  const children = elementNode.getChildren();
-  const childrenLength = children.length;
-  let runningLength = 0;
-  let isPriorNodeTextNode = false;
-
-  for (let i = 0; i < childrenLength; ++i) {
-    // We must examine the offsetInJoinedText that is located
-    // at the length of the string.
-    // For example, given "hello", the length is 5, yet
-    // the caller still wants the node + offset at the
-    // right edge of the "o".
-    if (runningLength > joinedTextLength) {
-      break;
-    }
-
-    const child = children[i];
-    const isChildNodeTestNode = lexical.$isTextNode(child);
-    const childContentLength = isChildNodeTestNode ? child.getTextContent().length : separatorLength;
-    const newRunningLength = runningLength + childContentLength;
-    const isJoinedOffsetWithinNode = isPriorNodeTextNode === false && runningLength === offsetInJoinedText || runningLength === 0 && runningLength === offsetInJoinedText || runningLength < offsetInJoinedText && offsetInJoinedText <= newRunningLength;
-
-    if (isJoinedOffsetWithinNode && lexical.$isTextNode(child)) {
-      // Check isTextNode again for flow.
-      return {
-        node: child,
-        offset: offsetInJoinedText - runningLength
-      };
-    }
-
-    runningLength = newRunningLength;
-    isPriorNodeTextNode = isChildNodeTestNode;
-  }
-
-  return null;
-}
-
-/**
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- *
- * 
- */
+/*
+How to add a new syntax to capture and transform.
+1. Create a new enumeration by adding to AutoFormatKind.
+2. Add a new criteria with a regEx pattern. See markdownStrikethrough as an example.
+3. Add your block criteria (e.g. '# ') to allAutoFormatCriteria or 
+   your text criteria (e.g. *MyItalic*) to allAutoFormatCriteriaForTextNodes.
+4. Add your Lexical block specific transforming code here: transformTextNodeForText.   
+   Add your Lexical text specific transforming code here: transformTextNodeForText.   
+*/
+// The trigger state helps to capture EditorState information
 // from the prior and current EditorState.
 // This is then used to determined if an auto format has been triggered.
 
 const TRIGGER_STRING = '\u0020'; // The space key triggers markdown.
 
-const TRIGGER_STRING_LENGTH = TRIGGER_STRING.length;
 const SEPARATOR_BETWEEN_TEXT_AND_NON_TEXT_NODES = '\u0004'; // Select an unused unicode character to separate text and non-text nodes.
 
+const SEPARATOR_LENGTH = SEPARATOR_BETWEEN_TEXT_AND_NON_TEXT_NODES.length; // Todo: speed up performance by having non-capture group variations of the regex.
+
 const autoFormatBase = {
-  nodeTransformationKind: null,
+  autoFormatKind: null,
   regEx: /(?:)/,
   requiresParagraphStart: false
 };
@@ -132,72 +52,76 @@ const paragraphStartBase = { ...autoFormatBase,
   requiresParagraphStart: true
 };
 const markdownHeader1 = { ...paragraphStartBase,
-  nodeTransformationKind: 'paragraphH1',
+  autoFormatKind: 'paragraphH1',
   regEx: /^(?:# )/
 };
 const markdownHeader2 = { ...paragraphStartBase,
-  nodeTransformationKind: 'paragraphH2',
+  autoFormatKind: 'paragraphH2',
   regEx: /^(?:## )/
 };
 const markdownHeader3 = { ...paragraphStartBase,
-  nodeTransformationKind: 'paragraphH2',
+  autoFormatKind: 'paragraphH2',
   regEx: /^(?:### )/
 };
 const markdownBlockQuote = { ...paragraphStartBase,
-  nodeTransformationKind: 'paragraphBlockQuote',
+  autoFormatKind: 'paragraphBlockQuote',
   regEx: /^(?:> )/
 };
 const markdownUnorderedListDash = { ...paragraphStartBase,
-  nodeTransformationKind: 'paragraphUnorderedList',
+  autoFormatKind: 'paragraphUnorderedList',
   regEx: /^(?:- )/
 };
 const markdownUnorderedListAsterisk = { ...paragraphStartBase,
-  nodeTransformationKind: 'paragraphUnorderedList',
+  autoFormatKind: 'paragraphUnorderedList',
   regEx: /^(?:\* )/
 };
 const markdownCodeBlock = { ...paragraphStartBase,
-  nodeTransformationKind: 'paragraphCodeBlock',
+  autoFormatKind: 'paragraphCodeBlock',
   regEx: /^(```)([a-z]*)( )/
 };
 const markdownOrderedList = { ...paragraphStartBase,
-  nodeTransformationKind: 'paragraphOrderedList',
+  autoFormatKind: 'paragraphOrderedList',
   regEx: /^(\d+)\.\s/
 };
 const markdownHorizontalRule = { ...paragraphStartBase,
-  nodeTransformationKind: 'horizontalRule',
+  autoFormatKind: 'horizontalRule',
   regEx: /^(?:\*\*\* )/
 };
 const markdownHorizontalRuleUsingDashes = { ...paragraphStartBase,
-  nodeTransformationKind: 'horizontalRule',
+  autoFormatKind: 'horizontalRule',
   regEx: /^(?:--- )/
 };
 const markdownItalic = { ...autoFormatBase,
-  nodeTransformationKind: 'italic',
-  regEx: /(\*)(\s*\b)([^\*]*)(\b\s*)(\*\s)$/
+  autoFormatKind: 'italic',
+  regEx: /(\*)(\s*\b)([^\*]*)(\b\s*)(\*)(\s)$/
 };
 const markdownBold = { ...autoFormatBase,
-  nodeTransformationKind: 'bold',
-  regEx: /(\*\*)(\s*\b)([^\*\*]*)(\b\s*)(\*\*\s)$/
+  autoFormatKind: 'bold',
+  regEx: /(\*\*)(\s*\b)([^\*\*]*)(\b\s*)(\*\*)(\s)$/
 };
 const markdownBoldWithUnderlines = { ...autoFormatBase,
-  nodeTransformationKind: 'bold',
-  regEx: /(__)(\s*)([^__]*)(\s*)(__\s)$/
+  autoFormatKind: 'bold',
+  regEx: /(__)(\s*)([^__]*)(\s*)(__)(\s)$/
 };
 const markdownBoldItalic = { ...autoFormatBase,
-  nodeTransformationKind: 'bold_italic',
-  regEx: /(\*\*\*)(\s*\b)([^\*\*\*]*)(\b\s*)(\*\*\*\s)$/
+  autoFormatKind: 'bold_italic',
+  regEx: /(\*\*\*)(\s*\b)([^\*\*\*]*)(\b\s*)(\*\*\*)(\s)$/
 }; // Markdown does not support underline, but we can allow folks to use
 // the HTML tags for underline.
 
 const fakeMarkdownUnderline = { ...autoFormatBase,
-  nodeTransformationKind: 'underline',
-  regEx: /(\<u\>)(\s*\b)([^\<]*)(\b\s*)(\<\/u\>\s)$/
+  autoFormatKind: 'underline',
+  regEx: /(\<u\>)(\s*\b)([^\<]*)(\b\s*)(\<\/u\>)(\s)$/
 };
 const markdownStrikethrough = { ...autoFormatBase,
-  nodeTransformationKind: 'strikethrough',
-  regEx: /(~~)(\s*\b)([^~~]*)(\b\s*)(~~\s)$/
+  autoFormatKind: 'strikethrough',
+  regEx: /(~~)(\s*\b)([^~~]*)(\b\s*)(~~)(\s)$/
 };
-const allAutoFormatCriteriaForTextNodes = [markdownBoldItalic, markdownItalic, markdownBold, markdownBoldWithUnderlines, fakeMarkdownUnderline, markdownStrikethrough];
+const markdownLink = { ...autoFormatBase,
+  autoFormatKind: 'link',
+  regEx: /(\[)(.+)(\]\()([^ ]+)(?: \"(?:.+)\")?(\))(\s)$/
+};
+const allAutoFormatCriteriaForTextNodes = [markdownBoldItalic, markdownItalic, markdownBold, markdownBoldWithUnderlines, fakeMarkdownUnderline, markdownStrikethrough, markdownLink];
 const allAutoFormatCriteria = [markdownHeader1, markdownHeader2, markdownHeader3, markdownBlockQuote, markdownUnorderedListDash, markdownUnorderedListAsterisk, markdownOrderedList, markdownCodeBlock, markdownHorizontalRule, markdownHorizontalRuleUsingDashes, ...allAutoFormatCriteriaForTextNodes];
 function getAllAutoFormatCriteriaForTextNodes() {
   return allAutoFormatCriteriaForTextNodes;
@@ -205,17 +129,17 @@ function getAllAutoFormatCriteriaForTextNodes() {
 function getAllAutoFormatCriteria() {
   return allAutoFormatCriteria;
 }
-function getInitialScanningContext(textNodeWithOffset, triggerState) {
+function getInitialScanningContext(editor, textNodeWithOffset, triggerState) {
   return {
     autoFormatCriteria: {
-      nodeTransformationKind: 'noTransformation',
+      autoFormatKind: 'noTransformation',
       regEx: /(?:)/,
       // Empty reg ex will do until the precise criteria is discovered.
       requiresParagraphStart: null
     },
+    editor,
     joinedText: null,
-    matchResultContext: {
-      offsetInJoinedTextForCollapsedSelection: 0,
+    patternMatchResults: {
       regExCaptureGroups: []
     },
     textNodeWithOffset,
@@ -223,26 +147,21 @@ function getInitialScanningContext(textNodeWithOffset, triggerState) {
   };
 }
 
-function getMatchResultContextWithRegEx(textToSearch, matchMustAppearAtStartOfString, matchMustAppearAtEndOfString, regEx) {
-  const matchResultContext = {
-    offsetInJoinedTextForCollapsedSelection: 0,
+function getPatternMatchResultsWithRegEx(textToSearch, matchMustAppearAtStartOfString, matchMustAppearAtEndOfString, regEx) {
+  const patternMatchResults = {
     regExCaptureGroups: []
   };
   const regExMatches = textToSearch.match(regEx);
 
   if (regExMatches !== null && regExMatches.length > 0 && (matchMustAppearAtStartOfString === false || regExMatches.index === 0) && (matchMustAppearAtEndOfString === false || regExMatches.index + regExMatches[0].length === textToSearch.length)) {
-    matchResultContext.offsetInJoinedTextForCollapsedSelection = textToSearch.length;
     const captureGroupsCount = regExMatches.length;
     let runningLength = regExMatches.index;
 
     for (let captureGroupIndex = 0; captureGroupIndex < captureGroupsCount; captureGroupIndex++) {
       const textContent = regExMatches[captureGroupIndex];
-      matchResultContext.regExCaptureGroups.push({
-        anchorTextNodeWithOffset: null,
-        focusTextNodeWithOffset: null,
+      patternMatchResults.regExCaptureGroups.push({
         offsetInParent: runningLength,
-        text: textContent,
-        textLength: textContent.length - (captureGroupIndex + 1 === captureGroupsCount ? TRIGGER_STRING_LENGTH : 0)
+        text: textContent
       }); // The 0th capture group is special in that it's text contents is
       // a join of all subsequent capture groups. So, skip this group
       // when calculating the runningLength.
@@ -252,31 +171,31 @@ function getMatchResultContextWithRegEx(textToSearch, matchMustAppearAtStartOfSt
       }
     }
 
-    return matchResultContext;
+    return patternMatchResults;
   }
 
   return null;
 }
 
-function getMatchResultContextForParagraphs(autoFormatCriteria, scanningContext) {
+function getPatternMatchResultsForParagraphs(autoFormatCriteria, scanningContext) {
   const textNodeWithOffset = scanningContext.textNodeWithOffset; // At start of paragraph.
 
   if (textNodeWithOffset.node.getPreviousSibling() === null) {
     const textToSearch = scanningContext.textNodeWithOffset.node.getTextContent();
-    return getMatchResultContextWithRegEx(textToSearch, true, false, autoFormatCriteria.regEx);
+    return getPatternMatchResultsWithRegEx(textToSearch, true, false, autoFormatCriteria.regEx);
   }
 
   return null;
 }
 
-function getMatchResultContextForText(autoFormatCriteria, scanningContext) {
+function getPatternMatchResultsForText(autoFormatCriteria, scanningContext) {
   if (scanningContext.joinedText == null) {
-    const parentNode = scanningContext.textNodeWithOffset.node.getParentOrThrow();
+    const parentNode = getParent(scanningContext);
 
     if (lexical.$isElementNode(parentNode)) {
       if (scanningContext.joinedText == null) {
         // Lazy calculate the text to search.
-        scanningContext.joinedText = $joinTextNodesInElementNode(parentNode, SEPARATOR_BETWEEN_TEXT_AND_NON_TEXT_NODES, scanningContext.textNodeWithOffset);
+        scanningContext.joinedText = text.$joinTextNodesInElementNode(parentNode, SEPARATOR_BETWEEN_TEXT_AND_NON_TEXT_NODES, scanningContext.textNodeWithOffset);
       }
     } else {
       {
@@ -285,25 +204,25 @@ function getMatchResultContextForText(autoFormatCriteria, scanningContext) {
     }
   }
 
-  return getMatchResultContextWithRegEx(scanningContext.joinedText, false, true, autoFormatCriteria.regEx);
+  return getPatternMatchResultsWithRegEx(scanningContext.joinedText, false, true, autoFormatCriteria.regEx);
 }
 
-function getMatchResultContextForCriteria(autoFormatCriteria, scanningContext) {
+function getPatternMatchResultsForCriteria(autoFormatCriteria, scanningContext) {
   if (autoFormatCriteria.requiresParagraphStart !== null && autoFormatCriteria.requiresParagraphStart === true) {
-    return getMatchResultContextForParagraphs(autoFormatCriteria, scanningContext);
+    return getPatternMatchResultsForParagraphs(autoFormatCriteria, scanningContext);
   }
 
-  return getMatchResultContextForText(autoFormatCriteria, scanningContext);
+  return getPatternMatchResultsForText(autoFormatCriteria, scanningContext);
 }
 
 function getNewNodeForCriteria(scanningContext, element) {
   let newNode = null;
   const children = element.getChildren();
   const autoFormatCriteria = scanningContext.autoFormatCriteria;
-  const matchResultContext = scanningContext.matchResultContext;
+  const patternMatchResults = scanningContext.patternMatchResults;
 
-  if (autoFormatCriteria.nodeTransformationKind != null) {
-    switch (autoFormatCriteria.nodeTransformationKind) {
+  if (autoFormatCriteria.autoFormatKind != null) {
+    switch (autoFormatCriteria.autoFormatKind) {
       case 'paragraphH1':
         {
           newNode = HeadingNode.$createHeadingNode('h1');
@@ -343,7 +262,7 @@ function getNewNodeForCriteria(scanningContext, element) {
 
       case 'paragraphOrderedList':
         {
-          const startAsString = matchResultContext.regExCaptureGroups.length > 1 ? matchResultContext.regExCaptureGroups[matchResultContext.regExCaptureGroups.length - 1].text : '1';
+          const startAsString = patternMatchResults.regExCaptureGroups.length > 1 ? patternMatchResults.regExCaptureGroups[patternMatchResults.regExCaptureGroups.length - 1].text : '1';
           const start = parseInt(startAsString, 10);
           newNode = list.$createListNode('ol', start);
           const listItem = list.$createListItemNode();
@@ -359,7 +278,7 @@ function getNewNodeForCriteria(scanningContext, element) {
             newNode = lexical.$createParagraphNode();
           } else {
             newNode = CodeNode.$createCodeNode();
-            const codingLanguage = matchResultContext.regExCaptureGroups.length >= 3 ? matchResultContext.regExCaptureGroups[2].text : null;
+            const codingLanguage = patternMatchResults.regExCaptureGroups.length >= 3 ? patternMatchResults.regExCaptureGroups[2].text : null;
 
             if (codingLanguage != null && codingLanguage.length > 0) {
               newNode.setLanguage(codingLanguage);
@@ -383,15 +302,6 @@ function getNewNodeForCriteria(scanningContext, element) {
   return newNode;
 }
 
-function updateTextNode(node, count) {
-  const textNode = node.spliceText(0, count, '', true);
-
-  if (textNode.getTextContent() === '') {
-    textNode.selectPrevious();
-    textNode.remove();
-  }
-}
-
 function transformTextNodeForAutoFormatCriteria(scanningContext) {
   if (scanningContext.autoFormatCriteria.requiresParagraphStart) {
     transformTextNodeForParagraphs(scanningContext);
@@ -403,8 +313,16 @@ function transformTextNodeForAutoFormatCriteria(scanningContext) {
 function transformTextNodeForParagraphs(scanningContext) {
   const textNodeWithOffset = scanningContext.textNodeWithOffset;
   const element = textNodeWithOffset.node.getParentOrThrow();
-  const text = scanningContext.matchResultContext.regExCaptureGroups[0].text;
-  updateTextNode(textNodeWithOffset.node, text.length);
+  const text = scanningContext.patternMatchResults.regExCaptureGroups[0].text; // Remove the text which we matched.
+
+  const textNode = textNodeWithOffset.node.spliceText(0, text.length, '', true);
+
+  if (textNode.getTextContent() === '') {
+    textNode.selectPrevious();
+    textNode.remove();
+  } // Transform the current element kind to the new element kind.
+
+
   const elementNode = getNewNodeForCriteria(scanningContext, element);
 
   if (elementNode !== null) {
@@ -412,155 +330,223 @@ function transformTextNodeForParagraphs(scanningContext) {
   }
 }
 
-function getTextFormatType(nodeTransformationKind) {
-  switch (nodeTransformationKind) {
-    case 'italic':
-    case 'bold':
-    case 'underline':
-    case 'strikethrough':
-      return [nodeTransformationKind];
+function transformTextNodeForText(scanningContext) {
+  const autoFormatCriteria = scanningContext.autoFormatCriteria;
 
-    case 'bold_italic':
-      {
-        return ['bold', 'italic'];
-      }
+  if (autoFormatCriteria.autoFormatKind != null) {
+    const formatting = getTextFormatType(autoFormatCriteria.autoFormatKind);
+
+    if (formatting != null) {
+      transformTextNodeWithFormatting(formatting, scanningContext);
+      return;
+    }
+
+    if (autoFormatCriteria.autoFormatKind === 'link') {
+      transformTextNodeWithLink(scanningContext);
+    }
   }
+}
 
-  return null;
+function transformTextNodeWithFormatting(formatting, scanningContext) {
+  const patternMatchResults = scanningContext.patternMatchResults;
+  const groupCount = patternMatchResults.regExCaptureGroups.length;
+
+  if (groupCount !== 7) {
+    // For BIUS and similar formats which have a pattern + text + pattern:
+    // given '*italic* ' below are the capture groups by index:
+    // 0. '*italic* '
+    // 1. '*'
+    // 2. whitespace  // typically this is "".
+    // 3. 'italic'
+    // 4. whitespace  // typicallly this is "".
+    // 5. '*'
+    // 6. ' '
+    return;
+  } // Remove unwanted text in reg ex pattern.
+  // Remove group 5.
+
+
+  removeTextByCaptureGroups(5, 5, scanningContext); // Remove group 1.
+
+  removeTextByCaptureGroups(1, 1, scanningContext); // Apply the formatting.
+
+  formatTextInCaptureGroupIndex(formatting, 3, scanningContext); // Place caret at end of final capture group.
+
+  selectAfterFinalCaptureGroup(scanningContext);
 }
 
-function transformTextNodeForText(scanningContext) {
-  const autoFormatCriteria = scanningContext.autoFormatCriteria;
-  const matchResultContext = scanningContext.matchResultContext;
-
-  if (autoFormatCriteria.nodeTransformationKind != null) {
-    if (matchResultContext.regExCaptureGroups.length !== 6) {
-      // For BIUS and other formatts which have a pattern + text + pattern,
-      // the expected reg ex pattern should have 6 groups.
-      // If it does not, then break and fail silently.
-      // e2e tests validate the regEx pattern.
-      return;
-    }
+function transformTextNodeWithLink(scanningContext) {
+  const patternMatchResults = scanningContext.patternMatchResults;
+  const regExCaptureGroups = patternMatchResults.regExCaptureGroups;
+  const groupCount = regExCaptureGroups.length;
+
+  if (groupCount !== 7) {
+    // For links and similar formats which have: pattern + text + pattern + pattern2 text2 + pattern2:
+    // Given '[title](url) ', below are the capture groups by index:
+    // 0. '[title](url) '
+    // 1. '['
+    // 2. 'title'
+    // 3. ']('
+    // 4. 'url'
+    // 5. ')'
+    // 6. ' '
+    return;
+  }
 
-    const formatting = getTextFormatType(autoFormatCriteria.nodeTransformationKind);
+  const title = regExCaptureGroups[2].text;
+  const url = regExCaptureGroups[4].text;
 
-    if (formatting != null) {
-      const captureGroupsToDelete = [1, 5];
-      const formatCaptureGroup = 3;
-      matchResultContext.regExCaptureGroups = getCaptureGroupsByResolvingAllDetails(scanningContext);
+  if (title.length === 0 || url.length === 0) {
+    return;
+  } // Remove the initial pattern through to the final pattern.
 
-      if (captureGroupsToDelete.length > 0) {
-        // Remove unwanted text in reg ex pattern.
-        removeTextInCaptureGroups(captureGroupsToDelete, matchResultContext);
-      }
 
-      formatTextInCaptureGroupIndex(formatting, formatCaptureGroup, matchResultContext);
-      makeCollapsedSelectionAtOffsetInJoinedText(matchResultContext.offsetInJoinedTextForCollapsedSelection, matchResultContext.offsetInJoinedTextForCollapsedSelection + 1, scanningContext.textNodeWithOffset.node.getParentOrThrow());
-    }
+  removeTextByCaptureGroups(1, 5, scanningContext);
+  insertTextPriorToCaptureGroup(1, // Insert at the beginning of the meaningful capture groups, namely index 1. Index 0 refers to the whole matched string.
+  title, scanningContext);
+  const newSelectionForLink = createSelectionWithCaptureGroups(1, 1, false, true, scanningContext);
+
+  if (newSelectionForLink == null) {
+    return;
   }
-} // Some Capture Group Details were left lazily unresolved as their calculation
-// was not necessary during the scanning phase. Now that the nodeTransformationKind is
-// known, the details may be fully resolved without incurring unwasted performance cost.
 
+  lexical.$setSelection(newSelectionForLink);
+  scanningContext.editor.execCommand('toggleLink', url); // Place caret at end of final capture group.
 
-function getCaptureGroupsByResolvingAllDetails(scanningContext) {
-  const autoFormatCriteria = scanningContext.autoFormatCriteria;
-  const matchResultContext = scanningContext.matchResultContext;
-  const textNodeWithOffset = scanningContext.textNodeWithOffset;
-  const regExCaptureGroups = matchResultContext.regExCaptureGroups;
-  const captureGroupsCount = regExCaptureGroups.length;
-  const parentElementNode = textNodeWithOffset.node.getParentOrThrow();
+  selectAfterFinalCaptureGroup(scanningContext);
+} // Below are lower level helper functions.
 
-  if (scanningContext.joinedText == null) {
-    {
-      throw Error(`joinedText was not calculated`);
-    }
+
+function getParent(scanningContext) {
+  return scanningContext.textNodeWithOffset.node.getParentOrThrow();
+}
+
+function getJoinedTextLength(patternMatchResults) {
+  const groupCount = patternMatchResults.regExCaptureGroups.length;
+
+  if (groupCount < 2) {
+    // Ignore capture group 0, as regEx defaults the 0th one to the entire matched string.
+    return 0;
   }
 
-  const joinedTextLength = scanningContext.joinedText.length;
+  const lastGroupIndex = groupCount - 1;
+  return patternMatchResults.regExCaptureGroups[lastGroupIndex].offsetInParent + patternMatchResults.regExCaptureGroups[lastGroupIndex].text.length;
+}
 
-  for (let captureGroupIndex = 1; captureGroupIndex < captureGroupsCount; captureGroupIndex++) {
-    const captureGroupDetail = regExCaptureGroups[captureGroupIndex];
-    captureGroupDetail.anchorTextNodeWithOffset = $findNodeWithOffsetFromJoinedText(parentElementNode, joinedTextLength, captureGroupDetail.offsetInParent, TRIGGER_STRING_LENGTH);
-    captureGroupDetail.focusTextNodeWithOffset = $findNodeWithOffsetFromJoinedText(parentElementNode, joinedTextLength, captureGroupDetail.offsetInParent + captureGroupDetail.textLength, TRIGGER_STRING_LENGTH);
+function getTextFormatType(autoFormatKind) {
+  switch (autoFormatKind) {
+    case 'italic':
+    case 'bold':
+    case 'underline':
+    case 'strikethrough':
+      return [autoFormatKind];
 
-    if (captureGroupDetail.textLength < 0) {
+    case 'bold_italic':
       {
-        throw Error(`Bad regEx pattern found for ${autoFormatCriteria.nodeTransformationKind}`);
+        return ['bold', 'italic'];
       }
-    }
   }
 
-  return regExCaptureGroups;
+  return null;
 }
 
-function removeTextInCaptureGroups(regExCaptureGroupsToDelete, matchResultContext) {
-  const regExCaptureGroups = matchResultContext.regExCaptureGroups;
+function createSelectionWithCaptureGroups(anchorCaptureGroupIndex, focusCaptureGroupIndex, startAtEndOfAnchor, finishAtEndOfFocus, scanningContext) {
+  const patternMatchResults = scanningContext.patternMatchResults;
+  const regExCaptureGroups = patternMatchResults.regExCaptureGroups;
   const regExCaptureGroupsCount = regExCaptureGroups.length;
 
-  for (let i = regExCaptureGroupsToDelete.length - 1; i >= 0; i--) {
-    if (i < regExCaptureGroupsCount) {
-      const captureGroupIndex = regExCaptureGroupsToDelete[i];
-      const captureGroupDetail = regExCaptureGroups[captureGroupIndex];
-      const anchorTextNodeWithOffset = captureGroupDetail.anchorTextNodeWithOffset;
-      const focusTextNodeWithOffset = captureGroupDetail.focusTextNodeWithOffset;
+  if (anchorCaptureGroupIndex >= regExCaptureGroupsCount || focusCaptureGroupIndex >= regExCaptureGroupsCount) {
+    return null;
+  }
 
-      if (anchorTextNodeWithOffset != null && focusTextNodeWithOffset != null && captureGroupDetail.textLength > 0) {
-        const newSelection = lexical.$createRangeSelection();
-        newSelection.anchor.set(anchorTextNodeWithOffset.node.getKey(), anchorTextNodeWithOffset.offset, 'text');
-        newSelection.focus.set(focusTextNodeWithOffset.node.getKey(), focusTextNodeWithOffset.offset, 'text');
-        lexical.$setSelection(newSelection);
-        const currentSelection = lexical.$getSelection();
+  const parentElementNode = getParent(scanningContext);
+  const joinedTextLength = getJoinedTextLength(patternMatchResults);
+  const anchorCaptureGroupDetail = regExCaptureGroups[anchorCaptureGroupIndex];
+  const focusCaptureGroupDetail = regExCaptureGroups[focusCaptureGroupIndex];
+  const anchorLocation = startAtEndOfAnchor ? anchorCaptureGroupDetail.offsetInParent + anchorCaptureGroupDetail.text.length : anchorCaptureGroupDetail.offsetInParent;
+  const focusLocation = finishAtEndOfFocus ? focusCaptureGroupDetail.offsetInParent + focusCaptureGroupDetail.text.length : focusCaptureGroupDetail.offsetInParent;
+  const anchorTextNodeWithOffset = text.$findNodeWithOffsetFromJoinedText(anchorLocation, joinedTextLength, SEPARATOR_LENGTH, parentElementNode);
+  const focusTextNodeWithOffset = text.$findNodeWithOffsetFromJoinedText(focusLocation, joinedTextLength, SEPARATOR_LENGTH, parentElementNode);
 
-        if (lexical.$isRangeSelection(currentSelection)) {
-          currentSelection.removeText(); // Shift offsets for capture groups which are within the same node
+  if (anchorTextNodeWithOffset == null || focusTextNodeWithOffset == null) {
+    return null;
+  }
 
-          if (anchorTextNodeWithOffset.node.getKey() === focusTextNodeWithOffset.node.getKey()) {
-            const delta = focusTextNodeWithOffset.offset - anchorTextNodeWithOffset.offset;
+  const selection = lexical.$createRangeSelection();
+  selection.anchor.set(anchorTextNodeWithOffset.node.getKey(), anchorTextNodeWithOffset.offset, 'text');
+  selection.focus.set(focusTextNodeWithOffset.node.getKey(), focusTextNodeWithOffset.offset, 'text');
+  return selection;
+}
 
-            if (!(delta > 0)) {
-              throw Error(`Expected anchor and focus offsets to have ascending character order.`);
-            }
+function removeTextByCaptureGroups(anchorCaptureGroupIndex, focusCaptureGroupIndex, scanningContext) {
+  const patternMatchResults = scanningContext.patternMatchResults;
+  const regExCaptureGroups = patternMatchResults.regExCaptureGroups;
+  const newSelection = createSelectionWithCaptureGroups(anchorCaptureGroupIndex, focusCaptureGroupIndex, false, true, scanningContext);
 
-            shiftCaptureGroupOffsets(-delta, focusTextNodeWithOffset.offset, anchorTextNodeWithOffset.node, captureGroupIndex, matchResultContext);
-          } else {
-            const focusDelta = focusTextNodeWithOffset.offset;
+  if (newSelection != null) {
+    lexical.$setSelection(newSelection);
+    const currentSelection = lexical.$getSelection();
 
-            if (focusDelta > 0) {
-              shiftCaptureGroupOffsets(-focusDelta, focusDelta, focusTextNodeWithOffset.node, captureGroupIndex, matchResultContext);
-            }
-          }
+    if (currentSelection != null && lexical.$isRangeSelection(currentSelection) && currentSelection.isCollapsed() === false) {
+      currentSelection.removeText(); // Shift all group offsets and clear out group text.
+
+      let runningLength = 0;
+      const groupCount = regExCaptureGroups.length;
+
+      for (let i = anchorCaptureGroupIndex; i < groupCount; i++) {
+        const captureGroupDetail = regExCaptureGroups[i];
+
+        if (i > anchorCaptureGroupIndex) {
+          captureGroupDetail.offsetInParent -= runningLength;
+        }
+
+        if (i <= focusCaptureGroupIndex) {
+          runningLength += captureGroupDetail.text.length;
+          captureGroupDetail.text = '';
         }
       }
     }
   }
 }
 
-function shiftCaptureGroupOffsets(delta, applyAtOrAfterOffset, node, startingCaptureGroupIndex, matchResultContext) {
-  matchResultContext.offsetInJoinedTextForCollapsedSelection += delta;
+function insertTextPriorToCaptureGroup(captureGroupIndex, text, scanningContext) {
+  const patternMatchResults = scanningContext.patternMatchResults;
+  const regExCaptureGroups = patternMatchResults.regExCaptureGroups;
+  const regExCaptureGroupsCount = regExCaptureGroups.length;
 
-  if (!(matchResultContext.offsetInJoinedTextForCollapsedSelection > 0)) {
-    throw Error(`The text content string length does not correlate with insertions/deletions of new text.`);
+  if (captureGroupIndex >= regExCaptureGroupsCount) {
+    return;
   }
 
-  const regExCaptureGroups = matchResultContext.regExCaptureGroups;
-  const regExCaptureGroupsCount = regExCaptureGroups.length;
+  const captureGroupDetail = regExCaptureGroups[captureGroupIndex];
+  const newCaptureGroupDetail = {
+    offsetInParent: captureGroupDetail.offsetInParent,
+    text
+  };
+  const newSelection = createSelectionWithCaptureGroups(captureGroupIndex, captureGroupIndex, false, false, scanningContext);
 
-  for (let captureGroupIndex = startingCaptureGroupIndex + 1; captureGroupIndex < regExCaptureGroupsCount; captureGroupIndex++) {
-    const captureGroupDetail = regExCaptureGroups[captureGroupIndex];
+  if (newSelection != null) {
+    lexical.$setSelection(newSelection);
+    const currentSelection = lexical.$getSelection();
 
-    if (captureGroupDetail.anchorTextNodeWithOffset != null && captureGroupDetail.anchorTextNodeWithOffset.offset >= applyAtOrAfterOffset && captureGroupDetail.anchorTextNodeWithOffset.node.is(node)) {
-      captureGroupDetail.anchorTextNodeWithOffset.offset += delta;
-    }
+    if (currentSelection != null && lexical.$isRangeSelection(currentSelection) && currentSelection.isCollapsed()) {
+      currentSelection.insertText(newCaptureGroupDetail.text); // Update the capture groups.
 
-    if (captureGroupDetail.focusTextNodeWithOffset != null && captureGroupDetail.focusTextNodeWithOffset.offset >= applyAtOrAfterOffset && captureGroupDetail.focusTextNodeWithOffset.node.is(node)) {
-      captureGroupDetail.focusTextNodeWithOffset.offset += delta;
+      regExCaptureGroups.splice(captureGroupIndex, 0, newCaptureGroupDetail);
+      const textLength = newCaptureGroupDetail.text.length;
+      const newGroupCount = regExCaptureGroups.length;
+
+      for (let i = captureGroupIndex + 1; i < newGroupCount; i++) {
+        const currentCaptureGroupDetail = regExCaptureGroups[i];
+        currentCaptureGroupDetail.offsetInParent += textLength;
+      }
     }
   }
 }
 
-function formatTextInCaptureGroupIndex(formatTypes, captureGroupIndex, matchResultContext) {
-  const regExCaptureGroups = matchResultContext.regExCaptureGroups;
+function formatTextInCaptureGroupIndex(formatTypes, captureGroupIndex, scanningContext) {
+  const patternMatchResults = scanningContext.patternMatchResults;
+  const regExCaptureGroups = patternMatchResults.regExCaptureGroups;
   const regExCaptureGroupsCount = regExCaptureGroups.length;
 
   if (!(captureGroupIndex < regExCaptureGroupsCount)) {
@@ -568,13 +554,14 @@ function formatTextInCaptureGroupIndex(formatTypes, captureGroupIndex, matchResu
   }
 
   const captureGroupDetail = regExCaptureGroups[captureGroupIndex];
-  const anchorTextNodeWithOffset = captureGroupDetail.anchorTextNodeWithOffset;
-  const focusTextNodeWithOffset = captureGroupDetail.focusTextNodeWithOffset;
 
-  if (anchorTextNodeWithOffset != null && focusTextNodeWithOffset != null && captureGroupDetail.textLength > 0) {
-    const newSelection = lexical.$createRangeSelection();
-    newSelection.anchor.set(anchorTextNodeWithOffset.node.getKey(), anchorTextNodeWithOffset.offset, 'text');
-    newSelection.focus.set(focusTextNodeWithOffset.node.getKey(), focusTextNodeWithOffset.offset, 'text');
+  if (captureGroupDetail.text.length === 0) {
+    return;
+  }
+
+  const newSelection = createSelectionWithCaptureGroups(captureGroupIndex, captureGroupIndex, false, true, scanningContext);
+
+  if (newSelection != null) {
     lexical.$setSelection(newSelection);
     const currentSelection = lexical.$getSelection();
 
@@ -582,22 +569,24 @@ function formatTextInCaptureGroupIndex(formatTypes, captureGroupIndex, matchResu
       for (let i = 0; i < formatTypes.length; i++) {
         currentSelection.formatText(formatTypes[i]);
       }
-
-      const finalSelection = lexical.$createRangeSelection();
-      finalSelection.anchor.set(focusTextNodeWithOffset.node.getKey(), focusTextNodeWithOffset.offset + 1, 'text');
-      finalSelection.focus.set(focusTextNodeWithOffset.node.getKey(), focusTextNodeWithOffset.offset + 1, 'text');
-      lexical.$setSelection(finalSelection);
     }
   }
-}
+} // Place caret at end of final capture group.
+
 
-function makeCollapsedSelectionAtOffsetInJoinedText(offsetInJoinedText, joinedTextLength, parentElementNode) {
-  const textNodeWithOffset = $findNodeWithOffsetFromJoinedText(parentElementNode, joinedTextLength, offsetInJoinedText, TRIGGER_STRING_LENGTH);
+function selectAfterFinalCaptureGroup(scanningContext) {
+  const patternMatchResults = scanningContext.patternMatchResults;
+  const groupCount = patternMatchResults.regExCaptureGroups.length;
 
-  if (textNodeWithOffset != null) {
-    const newSelection = lexical.$createRangeSelection();
-    newSelection.anchor.set(textNodeWithOffset.node.getKey(), textNodeWithOffset.offset, 'text');
-    newSelection.focus.set(textNodeWithOffset.node.getKey(), textNodeWithOffset.offset, 'text');
+  if (groupCount < 2) {
+    // Ignore capture group 0, as regEx defaults the 0th one to the entire matched string.
+    return;
+  }
+
+  const lastGroupIndex = groupCount - 1;
+  const newSelection = createSelectionWithCaptureGroups(lastGroupIndex, lastGroupIndex, true, true, scanningContext);
+
+  if (newSelection != null) {
     lexical.$setSelection(newSelection);
   }
 }
@@ -611,20 +600,20 @@ function makeCollapsedSelectionAtOffsetInJoinedText(offsetInJoinedText, joinedTe
  * 
  */
 
-function getCriteriaWithMatchResultContext(autoFormatCriteriaArray, scanningContext) {
+function getCriteriaWithPatternMatchResults(autoFormatCriteriaArray, scanningContext) {
   const currentTriggerState = scanningContext.triggerState;
   const count = autoFormatCriteriaArray.length;
 
   for (let i = 0; i < count; i++) {
-    const autoFormatCriteria = autoFormatCriteriaArray[i]; // Skip code block nodes, unless the nodeTransformationKind calls for toggling the code block.
+    const autoFormatCriteria = autoFormatCriteriaArray[i]; // Skip code block nodes, unless the autoFormatKind calls for toggling the code block.
 
-    if (currentTriggerState != null && currentTriggerState.isCodeBlock === false || autoFormatCriteria.nodeTransformationKind === 'paragraphCodeBlock') {
-      const matchResultContext = getMatchResultContextForCriteria(autoFormatCriteria, scanningContext);
+    if (currentTriggerState != null && currentTriggerState.isCodeBlock === false || autoFormatCriteria.autoFormatKind === 'paragraphCodeBlock') {
+      const patternMatchResults = getPatternMatchResultsForCriteria(autoFormatCriteria, scanningContext);
 
-      if (matchResultContext != null) {
+      if (patternMatchResults != null) {
         return {
           autoFormatCriteria: autoFormatCriteria,
-          matchResultContext
+          patternMatchResults
         };
       }
     }
@@ -632,7 +621,7 @@ function getCriteriaWithMatchResultContext(autoFormatCriteriaArray, scanningCont
 
   return {
     autoFormatCriteria: null,
-    matchResultContext: null
+    patternMatchResults: null
   };
 }
 
@@ -661,9 +650,9 @@ function updateAutoFormatting(editor, scanningContext) {
   });
 }
 
-function findScanningContextWithValidMatch(editorState, currentTriggerState) {
+function findScanningContextWithValidMatch(editor, currentTriggerState) {
   let scanningContext = null;
-  editorState.read(() => {
+  editor.getEditorState().read(() => {
     const textNodeWithOffset = getTextNodeForAutoFormatting(lexical.$getSelection());
 
     if (textNodeWithOffset === null) {
@@ -671,23 +660,23 @@ function findScanningContextWithValidMatch(editorState, currentTriggerState) {
     } // Please see the declaration of ScanningContext for a detailed explanation.
 
 
-    const initialScanningContext = getInitialScanningContext(textNodeWithOffset, currentTriggerState);
-    const criteriaWithMatchResultContext = getCriteriaWithMatchResultContext( // Do not apply paragraph node changes like blockQuote or H1 to listNodes. Also, do not attempt to transform a list into a list using * or -.
+    const initialScanningContext = getInitialScanningContext(editor, textNodeWithOffset, currentTriggerState);
+    const criteriaWithPatternMatchResults = getCriteriaWithPatternMatchResults( // Do not apply paragraph node changes like blockQuote or H1 to listNodes. Also, do not attempt to transform a list into a list using * or -.
     currentTriggerState.isParentAListItemNode === false ? getAllAutoFormatCriteria() : getAllAutoFormatCriteriaForTextNodes(), initialScanningContext);
 
-    if (criteriaWithMatchResultContext.autoFormatCriteria === null || criteriaWithMatchResultContext.matchResultContext === null) {
+    if (criteriaWithPatternMatchResults.autoFormatCriteria === null || criteriaWithPatternMatchResults.patternMatchResults === null) {
       return;
     }
 
     scanningContext = initialScanningContext; // Lazy fill-in the particular format criteria and any matching result information.
 
-    scanningContext.autoFormatCriteria = criteriaWithMatchResultContext.autoFormatCriteria;
-    scanningContext.matchResultContext = criteriaWithMatchResultContext.matchResultContext;
+    scanningContext.autoFormatCriteria = criteriaWithPatternMatchResults.autoFormatCriteria;
+    scanningContext.patternMatchResults = criteriaWithPatternMatchResults.patternMatchResults;
   });
   return scanningContext;
 }
 
-function findScanningContext(editorState, currentTriggerState, priorTriggerState) {
+function findScanningContext(editor, currentTriggerState, priorTriggerState) {
   if (currentTriggerState == null || priorTriggerState == null) {
     return null;
   } // The below checks needs to execute relativey quickly, so perform the light-weight ones first.
@@ -703,7 +692,7 @@ function findScanningContext(editorState, currentTriggerState, priorTriggerState
     return null;
   }
 
-  return findScanningContextWithValidMatch(editorState, currentTriggerState);
+  return findScanningContextWithValidMatch(editor, currentTriggerState);
 }
 
 function getTriggerState(editorState) {
@@ -745,9 +734,8 @@ function useAutoFormatter(editor) {
     }) => {
       // Examine historic so that we are not running autoformatting within markdown.
       if (tags.has('historic') === false) {
-        const editorState = editor.getEditorState();
-        const currentTriggerState = getTriggerState(editorState);
-        const scanningContext = currentTriggerState == null ? null : findScanningContext(editorState, currentTriggerState, priorTriggerState);
+        const currentTriggerState = getTriggerState(editor.getEditorState());
+        const scanningContext = currentTriggerState == null ? null : findScanningContext(editor, currentTriggerState, priorTriggerState);
 
         if (scanningContext != null) {
           updateAutoFormatting(editor, scanningContext);