@lexical/react 0.13.1 → 0.14.1

package/LexicalAutoEmbedPlugin.dev.esm.js

@@ -0,0 +1,131 @@
+/**
+ * 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.
+ */
+import { $isLinkNode, LinkNode, AutoLinkNode } from '@lexical/link';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { MenuOption, LexicalNodeMenuPlugin } from '@lexical/react/LexicalNodeMenuPlugin';
+import { mergeRegister } from '@lexical/utils';
+import { createCommand, $getNodeByKey, COMMAND_PRIORITY_EDITOR, $getSelection, COMMAND_PRIORITY_LOW } from 'lexical';
+import * as React from 'react';
+import { useState, useCallback, useEffect, useMemo } from 'react';
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+const URL_MATCHER = /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
+const INSERT_EMBED_COMMAND = createCommand('INSERT_EMBED_COMMAND');
+class AutoEmbedOption extends MenuOption {
+  constructor(title, options) {
+    super(title);
+    this.title = title;
+    this.onSelect = options.onSelect.bind(this);
+  }
+}
+function LexicalAutoEmbedPlugin({
+  embedConfigs,
+  onOpenEmbedModalForConfig,
+  getMenuOptions,
+  menuRenderFn,
+  menuCommandPriority = COMMAND_PRIORITY_LOW
+}) {
+  const [editor] = useLexicalComposerContext();
+  const [nodeKey, setNodeKey] = useState(null);
+  const [activeEmbedConfig, setActiveEmbedConfig] = useState(null);
+  const reset = useCallback(() => {
+    setNodeKey(null);
+    setActiveEmbedConfig(null);
+  }, []);
+  const checkIfLinkNodeIsEmbeddable = useCallback(key => {
+    editor.getEditorState().read(async () => {
+      const linkNode = $getNodeByKey(key);
+      if ($isLinkNode(linkNode)) {
+        for (let i = 0; i < embedConfigs.length; i++) {
+          const embedConfig = embedConfigs[i];
+          const urlMatch = await Promise.resolve(embedConfig.parseUrl(linkNode.__url));
+          if (urlMatch != null) {
+            setActiveEmbedConfig(embedConfig);
+            setNodeKey(linkNode.getKey());
+          }
+        }
+      }
+    });
+  }, [editor, embedConfigs]);
+  useEffect(() => {
+    const listener = (nodeMutations, {
+      updateTags,
+      dirtyLeaves
+    }) => {
+      for (const [key, mutation] of nodeMutations) {
+        if (mutation === 'created' && updateTags.has('paste') && dirtyLeaves.size <= 3) {
+          checkIfLinkNodeIsEmbeddable(key);
+        } else if (key === nodeKey) {
+          reset();
+        }
+      }
+    };
+    return mergeRegister(...[LinkNode, AutoLinkNode].map(Klass => editor.registerMutationListener(Klass, (...args) => listener(...args))));
+  }, [checkIfLinkNodeIsEmbeddable, editor, embedConfigs, nodeKey, reset]);
+  useEffect(() => {
+    return editor.registerCommand(INSERT_EMBED_COMMAND, embedConfigType => {
+      const embedConfig = embedConfigs.find(({
+        type
+      }) => type === embedConfigType);
+      if (embedConfig) {
+        onOpenEmbedModalForConfig(embedConfig);
+        return true;
+      }
+      return false;
+    }, COMMAND_PRIORITY_EDITOR);
+  }, [editor, embedConfigs, onOpenEmbedModalForConfig]);
+  const embedLinkViaActiveEmbedConfig = useCallback(async () => {
+    if (activeEmbedConfig != null && nodeKey != null) {
+      const linkNode = editor.getEditorState().read(() => {
+        const node = $getNodeByKey(nodeKey);
+        if ($isLinkNode(node)) {
+          return node;
+        }
+        return null;
+      });
+      if ($isLinkNode(linkNode)) {
+        const result = await Promise.resolve(activeEmbedConfig.parseUrl(linkNode.__url));
+        if (result != null) {
+          editor.update(() => {
+            if (!$getSelection()) {
+              linkNode.selectEnd();
+            }
+            activeEmbedConfig.insertNode(editor, result);
+            if (linkNode.isAttached()) {
+              linkNode.remove();
+            }
+          });
+        }
+      }
+    }
+  }, [activeEmbedConfig, editor, nodeKey]);
+  const options = useMemo(() => {
+    return activeEmbedConfig != null && nodeKey != null ? getMenuOptions(activeEmbedConfig, embedLinkViaActiveEmbedConfig, reset) : [];
+  }, [activeEmbedConfig, embedLinkViaActiveEmbedConfig, getMenuOptions, nodeKey, reset]);
+  const onSelectOption = useCallback((selectedOption, targetNode, closeMenu) => {
+    editor.update(() => {
+      selectedOption.onSelect(targetNode);
+      closeMenu();
+    });
+  }, [editor]);
+  return nodeKey != null ? /*#__PURE__*/React.createElement(LexicalNodeMenuPlugin, {
+    nodeKey: nodeKey,
+    onClose: reset,
+    onSelectOption: onSelectOption,
+    options: options,
+    menuRenderFn: menuRenderFn,
+    commandPriority: menuCommandPriority
+  }) : null;
+}
+
+export { AutoEmbedOption, INSERT_EMBED_COMMAND, LexicalAutoEmbedPlugin, URL_MATCHER };

package/LexicalAutoEmbedPlugin.esm.js

@@ -0,0 +1,13 @@
+/**
+ * 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.
+ */
+import * as modDev from './LexicalAutoEmbedPlugin.dev.esm.js';
+import * as modProd from './LexicalAutoEmbedPlugin.prod.esm.js';
+const mod = process.env.NODE_ENV === 'development' ? modDev : modProd;
+export const AutoEmbedOption = mod.AutoEmbedOption;
+export const INSERT_EMBED_COMMAND = mod.INSERT_EMBED_COMMAND;
+export const LexicalAutoEmbedPlugin = mod.LexicalAutoEmbedPlugin;
+export const URL_MATCHER = mod.URL_MATCHER;

package/LexicalAutoEmbedPlugin.js

@@ -5,5 +5,5 @@
  * LICENSE file in the root directory of this source tree.
  */
 'use strict'
-const LexicalAutoEmbedPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalAutoEmbedPlugin.dev.js') : require('./LexicalAutoEmbedPlugin.prod.js')
+const LexicalAutoEmbedPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalAutoEmbedPlugin.dev.js') : require('./LexicalAutoEmbedPlugin.prod.js');
 module.exports = LexicalAutoEmbedPlugin;

package/LexicalAutoEmbedPlugin.prod.esm.js

@@ -0,0 +1,7 @@
+/**
+ * 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.
+ */
+import{$isLinkNode as e,LinkNode as t,AutoLinkNode as n}from"@lexical/link";import{useLexicalComposerContext as o}from"@lexical/react/LexicalComposerContext";import{MenuOption as r,LexicalNodeMenuPlugin as l}from"@lexical/react/LexicalNodeMenuPlugin";import{mergeRegister as i}from"@lexical/utils";import{createCommand as s,$getNodeByKey as a,COMMAND_PRIORITY_EDITOR as c,$getSelection as u,COMMAND_PRIORITY_LOW as m}from"lexical";import*as d from"react";import{useState as p,useCallback as f,useEffect as g,useMemo as x}from"react";const w=/((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/,y=s("INSERT_EMBED_COMMAND");class C extends r{constructor(e,t){super(e),this.title=e,this.onSelect=t.onSelect.bind(this)}}function E({embedConfigs:r,onOpenEmbedModalForConfig:s,getMenuOptions:w,menuRenderFn:C,menuCommandPriority:E=m}){const[_]=o(),[h,M]=p(null),[S,A]=p(null),P=f((()=>{M(null),A(null)}),[]),b=f((t=>{_.getEditorState().read((async()=>{const n=a(t);if(e(n))for(let e=0;e<r.length;e++){const t=r[e];null!=await Promise.resolve(t.parseUrl(n.__url))&&(A(t),M(n.getKey()))}}))}),[_,r]);g((()=>i(...[t,n].map((e=>_.registerMutationListener(e,((...e)=>((e,{updateTags:t,dirtyLeaves:n})=>{for(const[o,r]of e)"created"===r&&t.has("paste")&&n.size<=3?b(o):o===h&&P()})(...e))))))),[b,_,r,h,P]),g((()=>_.registerCommand(y,(e=>{const t=r.find((({type:t})=>t===e));return!!t&&(s(t),!0)}),c)),[_,r,s]);const v=f((async()=>{if(null!=S&&null!=h){const t=_.getEditorState().read((()=>{const t=a(h);return e(t)?t:null}));if(e(t)){const e=await Promise.resolve(S.parseUrl(t.__url));null!=e&&_.update((()=>{u()||t.selectEnd(),S.insertNode(_,e),t.isAttached()&&t.remove()}))}}}),[S,_,h]),z=x((()=>null!=S&&null!=h?w(S,v,P):[]),[S,v,w,h,P]),L=f(((e,t,n)=>{_.update((()=>{e.onSelect(t),n()}))}),[_]);return null!=h?d.createElement(l,{nodeKey:h,onClose:P,onSelectOption:L,options:z,menuRenderFn:C,commandPriority:E}):null}export{C as AutoEmbedOption,y as INSERT_EMBED_COMMAND,E as LexicalAutoEmbedPlugin,w as URL_MATCHER};

package/LexicalAutoFocusPlugin.dev.esm.js

@@ -0,0 +1,42 @@
+/**
+ * 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.
+ */
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { useEffect } from 'react';
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+function AutoFocusPlugin({
+  defaultSelection
+}) {
+  const [editor] = useLexicalComposerContext();
+  useEffect(() => {
+    editor.focus(() => {
+      // If we try and move selection to the same point with setBaseAndExtent, it won't
+      // trigger a re-focus on the element. So in the case this occurs, we'll need to correct it.
+      // Normally this is fine, Selection API !== Focus API, but fore the intents of the naming
+      // of this plugin, which should preserve focus too.
+      const activeElement = document.activeElement;
+      const rootElement = editor.getRootElement();
+      if (rootElement !== null && (activeElement === null || !rootElement.contains(activeElement))) {
+        // Note: preventScroll won't work in Webkit.
+        rootElement.focus({
+          preventScroll: true
+        });
+      }
+    }, {
+      defaultSelection
+    });
+  }, [defaultSelection, editor]);
+  return null;
+}
+
+export { AutoFocusPlugin };

package/LexicalAutoFocusPlugin.esm.js

@@ -0,0 +1,10 @@
+/**
+ * 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.
+ */
+import * as modDev from './LexicalAutoFocusPlugin.dev.esm.js';
+import * as modProd from './LexicalAutoFocusPlugin.prod.esm.js';
+const mod = process.env.NODE_ENV === 'development' ? modDev : modProd;
+export const AutoFocusPlugin = mod.AutoFocusPlugin;

package/LexicalAutoFocusPlugin.js

@@ -5,5 +5,5 @@
  * LICENSE file in the root directory of this source tree.
  */
 'use strict'
-const LexicalAutoFocusPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalAutoFocusPlugin.dev.js') : require('./LexicalAutoFocusPlugin.prod.js')
+const LexicalAutoFocusPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalAutoFocusPlugin.dev.js') : require('./LexicalAutoFocusPlugin.prod.js');
 module.exports = LexicalAutoFocusPlugin;

package/LexicalAutoFocusPlugin.prod.esm.js

@@ -0,0 +1,7 @@
+/**
+ * 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.
+ */
+import{useLexicalComposerContext as e}from"@lexical/react/LexicalComposerContext";import{useEffect as t}from"react";function o({defaultSelection:o}){const[l]=e();return t((()=>{l.focus((()=>{const e=document.activeElement,t=l.getRootElement();null===t||null!==e&&t.contains(e)||t.focus({preventScroll:!0})}),{defaultSelection:o})}),[o,l]),null}export{o as AutoFocusPlugin};

package/LexicalAutoLinkPlugin.dev.esm.js

@@ -0,0 +1,312 @@
+/**
+ * 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.
+ */
+import { AutoLinkNode, $isAutoLinkNode, $isLinkNode, $createAutoLinkNode } from '@lexical/link';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { mergeRegister } from '@lexical/utils';
+import { TextNode, $isTextNode, $isLineBreakNode, $isElementNode, $createTextNode, $getSelection, $isRangeSelection, $isNodeSelection } from 'lexical';
+import { useEffect } from 'react';
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+function createLinkMatcherWithRegExp(regExp, urlTransformer = text => text) {
+  return text => {
+    const match = regExp.exec(text);
+    if (match === null) {
+      return null;
+    }
+    return {
+      index: match.index,
+      length: match[0].length,
+      text: match[0],
+      url: urlTransformer(match[0])
+    };
+  };
+}
+function findFirstMatch(text, matchers) {
+  for (let i = 0; i < matchers.length; i++) {
+    const match = matchers[i](text);
+    if (match) {
+      return match;
+    }
+  }
+  return null;
+}
+const PUNCTUATION_OR_SPACE = /[.,;\s]/;
+function isSeparator(char) {
+  return PUNCTUATION_OR_SPACE.test(char);
+}
+function endsWithSeparator(textContent) {
+  return isSeparator(textContent[textContent.length - 1]);
+}
+function startsWithSeparator(textContent) {
+  return isSeparator(textContent[0]);
+}
+function isPreviousNodeValid(node) {
+  let previousNode = node.getPreviousSibling();
+  if ($isElementNode(previousNode)) {
+    previousNode = previousNode.getLastDescendant();
+  }
+  return previousNode === null || $isLineBreakNode(previousNode) || $isTextNode(previousNode) && endsWithSeparator(previousNode.getTextContent());
+}
+function isNextNodeValid(node) {
+  let nextNode = node.getNextSibling();
+  if ($isElementNode(nextNode)) {
+    nextNode = nextNode.getFirstDescendant();
+  }
+  return nextNode === null || $isLineBreakNode(nextNode) || $isTextNode(nextNode) && startsWithSeparator(nextNode.getTextContent());
+}
+function isContentAroundIsValid(matchStart, matchEnd, text, nodes) {
+  const contentBeforeIsValid = matchStart > 0 ? isSeparator(text[matchStart - 1]) : isPreviousNodeValid(nodes[0]);
+  if (!contentBeforeIsValid) {
+    return false;
+  }
+  const contentAfterIsValid = matchEnd < text.length ? isSeparator(text[matchEnd]) : isNextNodeValid(nodes[nodes.length - 1]);
+  return contentAfterIsValid;
+}
+function extractMatchingNodes(nodes, startIndex, endIndex) {
+  const unmodifiedBeforeNodes = [];
+  const matchingNodes = [];
+  const unmodifiedAfterNodes = [];
+  let matchingOffset = 0;
+  let currentOffset = 0;
+  const currentNodes = [...nodes];
+  while (currentNodes.length > 0) {
+    const currentNode = currentNodes[0];
+    const currentNodeText = currentNode.getTextContent();
+    const currentNodeLength = currentNodeText.length;
+    const currentNodeStart = currentOffset;
+    const currentNodeEnd = currentOffset + currentNodeLength;
+    if (currentNodeEnd <= startIndex) {
+      unmodifiedBeforeNodes.push(currentNode);
+      matchingOffset += currentNodeLength;
+    } else if (currentNodeStart >= endIndex) {
+      unmodifiedAfterNodes.push(currentNode);
+    } else {
+      matchingNodes.push(currentNode);
+    }
+    currentOffset += currentNodeLength;
+    currentNodes.shift();
+  }
+  return [matchingOffset, unmodifiedBeforeNodes, matchingNodes, unmodifiedAfterNodes];
+}
+function createAutoLinkNode(nodes, startIndex, endIndex, match) {
+  const linkNode = $createAutoLinkNode(match.url, match.attributes);
+  if (nodes.length === 1) {
+    let remainingTextNode = nodes[0];
+    let linkTextNode;
+    if (startIndex === 0) {
+      [linkTextNode, remainingTextNode] = remainingTextNode.splitText(endIndex);
+    } else {
+      [, linkTextNode, remainingTextNode] = remainingTextNode.splitText(startIndex, endIndex);
+    }
+    const textNode = $createTextNode(match.text);
+    textNode.setFormat(linkTextNode.getFormat());
+    textNode.setDetail(linkTextNode.getDetail());
+    linkNode.append(textNode);
+    linkTextNode.replace(linkNode);
+    return remainingTextNode;
+  } else if (nodes.length > 1) {
+    const firstTextNode = nodes[0];
+    let offset = firstTextNode.getTextContent().length;
+    let firstLinkTextNode;
+    if (startIndex === 0) {
+      firstLinkTextNode = firstTextNode;
+    } else {
+      [, firstLinkTextNode] = firstTextNode.splitText(startIndex);
+    }
+    const linkNodes = [];
+    let remainingTextNode;
+    for (let i = 1; i < nodes.length; i++) {
+      const currentNode = nodes[i];
+      const currentNodeText = currentNode.getTextContent();
+      const currentNodeLength = currentNodeText.length;
+      const currentNodeStart = offset;
+      const currentNodeEnd = offset + currentNodeLength;
+      if (currentNodeStart < endIndex) {
+        if (currentNodeEnd <= endIndex) {
+          linkNodes.push(currentNode);
+        } else {
+          const [linkTextNode, endNode] = currentNode.splitText(endIndex - currentNodeStart);
+          linkNodes.push(linkTextNode);
+          remainingTextNode = endNode;
+        }
+      }
+      offset += currentNodeLength;
+    }
+    const selection = $getSelection();
+    const selectedTextNode = selection ? selection.getNodes().find($isTextNode) : undefined;
+    const textNode = $createTextNode(firstLinkTextNode.getTextContent());
+    textNode.setFormat(firstLinkTextNode.getFormat());
+    textNode.setDetail(firstLinkTextNode.getDetail());
+    linkNode.append(textNode, ...linkNodes);
+    // it does not preserve caret position if caret was at the first text node
+    // so we need to restore caret position
+    if (selectedTextNode && selectedTextNode === firstLinkTextNode) {
+      if ($isRangeSelection(selection)) {
+        textNode.select(selection.anchor.offset, selection.focus.offset);
+      } else if ($isNodeSelection(selection)) {
+        textNode.select(0, textNode.getTextContent().length);
+      }
+    }
+    firstLinkTextNode.replace(linkNode);
+    return remainingTextNode;
+  }
+  return undefined;
+}
+function handleLinkCreation(nodes, matchers, onChange) {
+  let currentNodes = [...nodes];
+  const initialText = currentNodes.map(node => node.getTextContent()).join('');
+  let text = initialText;
+  let match;
+  let invalidMatchEnd = 0;
+  while ((match = findFirstMatch(text, matchers)) && match !== null) {
+    const matchStart = match.index;
+    const matchLength = match.length;
+    const matchEnd = matchStart + matchLength;
+    const isValid = isContentAroundIsValid(invalidMatchEnd + matchStart, invalidMatchEnd + matchEnd, initialText, currentNodes);
+    if (isValid) {
+      const [matchingOffset,, matchingNodes, unmodifiedAfterNodes] = extractMatchingNodes(currentNodes, invalidMatchEnd + matchStart, invalidMatchEnd + matchEnd);
+      const actualMatchStart = invalidMatchEnd + matchStart - matchingOffset;
+      const actualMatchEnd = invalidMatchEnd + matchEnd - matchingOffset;
+      const remainingTextNode = createAutoLinkNode(matchingNodes, actualMatchStart, actualMatchEnd, match);
+      currentNodes = remainingTextNode ? [remainingTextNode, ...unmodifiedAfterNodes] : unmodifiedAfterNodes;
+      onChange(match.url, null);
+      invalidMatchEnd = 0;
+    } else {
+      invalidMatchEnd += matchEnd;
+    }
+    text = text.substring(matchEnd);
+  }
+}
+function handleLinkEdit(linkNode, matchers, onChange) {
+  // Check children are simple text
+  const children = linkNode.getChildren();
+  const childrenLength = children.length;
+  for (let i = 0; i < childrenLength; i++) {
+    const child = children[i];
+    if (!$isTextNode(child) || !child.isSimpleText()) {
+      replaceWithChildren(linkNode);
+      onChange(null, linkNode.getURL());
+      return;
+    }
+  }
+
+  // Check text content fully matches
+  const text = linkNode.getTextContent();
+  const match = findFirstMatch(text, matchers);
+  if (match === null || match.text !== text) {
+    replaceWithChildren(linkNode);
+    onChange(null, linkNode.getURL());
+    return;
+  }
+
+  // Check neighbors
+  if (!isPreviousNodeValid(linkNode) || !isNextNodeValid(linkNode)) {
+    replaceWithChildren(linkNode);
+    onChange(null, linkNode.getURL());
+    return;
+  }
+  const url = linkNode.getURL();
+  if (url !== match.url) {
+    linkNode.setURL(match.url);
+    onChange(match.url, url);
+  }
+  if (match.attributes) {
+    const rel = linkNode.getRel();
+    if (rel !== match.attributes.rel) {
+      linkNode.setRel(match.attributes.rel || null);
+      onChange(match.attributes.rel || null, rel);
+    }
+    const target = linkNode.getTarget();
+    if (target !== match.attributes.target) {
+      linkNode.setTarget(match.attributes.target || null);
+      onChange(match.attributes.target || null, target);
+    }
+  }
+}
+
+// Bad neighbors are edits in neighbor nodes that make AutoLinks incompatible.
+// Given the creation preconditions, these can only be simple text nodes.
+function handleBadNeighbors(textNode, matchers, onChange) {
+  const previousSibling = textNode.getPreviousSibling();
+  const nextSibling = textNode.getNextSibling();
+  const text = textNode.getTextContent();
+  if ($isAutoLinkNode(previousSibling) && !startsWithSeparator(text)) {
+    previousSibling.append(textNode);
+    handleLinkEdit(previousSibling, matchers, onChange);
+    onChange(null, previousSibling.getURL());
+  }
+  if ($isAutoLinkNode(nextSibling) && !endsWithSeparator(text)) {
+    replaceWithChildren(nextSibling);
+    handleLinkEdit(nextSibling, matchers, onChange);
+    onChange(null, nextSibling.getURL());
+  }
+}
+function replaceWithChildren(node) {
+  const children = node.getChildren();
+  const childrenLength = children.length;
+  for (let j = childrenLength - 1; j >= 0; j--) {
+    node.insertAfter(children[j]);
+  }
+  node.remove();
+  return children.map(child => child.getLatest());
+}
+function getTextNodesToMatch(textNode) {
+  // check if next siblings are simple text nodes till a node contains a space separator
+  const textNodesToMatch = [textNode];
+  let nextSibling = textNode.getNextSibling();
+  while (nextSibling !== null && $isTextNode(nextSibling) && nextSibling.isSimpleText()) {
+    textNodesToMatch.push(nextSibling);
+    if (/[\s]/.test(nextSibling.getTextContent())) {
+      break;
+    }
+    nextSibling = nextSibling.getNextSibling();
+  }
+  return textNodesToMatch;
+}
+function useAutoLink(editor, matchers, onChange) {
+  useEffect(() => {
+    if (!editor.hasNodes([AutoLinkNode])) {
+      {
+        throw Error(`LexicalAutoLinkPlugin: AutoLinkNode not registered on editor`);
+      }
+    }
+    const onChangeWrapped = (url, prevUrl) => {
+      if (onChange) {
+        onChange(url, prevUrl);
+      }
+    };
+    return mergeRegister(editor.registerNodeTransform(TextNode, textNode => {
+      const parent = textNode.getParentOrThrow();
+      const previous = textNode.getPreviousSibling();
+      if ($isAutoLinkNode(parent)) {
+        handleLinkEdit(parent, matchers, onChangeWrapped);
+      } else if (!$isLinkNode(parent)) {
+        if (textNode.isSimpleText() && (startsWithSeparator(textNode.getTextContent()) || !$isAutoLinkNode(previous))) {
+          const textNodesToMatch = getTextNodesToMatch(textNode);
+          handleLinkCreation(textNodesToMatch, matchers, onChangeWrapped);
+        }
+        handleBadNeighbors(textNode, matchers, onChangeWrapped);
+      }
+    }));
+  }, [editor, matchers, onChange]);
+}
+function AutoLinkPlugin({
+  matchers,
+  onChange
+}) {
+  const [editor] = useLexicalComposerContext();
+  useAutoLink(editor, matchers, onChange);
+  return null;
+}
+
+export { AutoLinkPlugin, createLinkMatcherWithRegExp };

package/LexicalAutoLinkPlugin.dev.js

@@ -22,7 +22,9 @@ var react = require('react');
 function createLinkMatcherWithRegExp(regExp, urlTransformer = text => text) {
   return text => {
     const match = regExp.exec(text);
-    if (match === null) return null;
+    if (match === null) {
+      return null;
+    }
     return {
       index: match.index,
       length: match[0].length,

package/LexicalAutoLinkPlugin.esm.js

@@ -0,0 +1,11 @@
+/**
+ * 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.
+ */
+import * as modDev from './LexicalAutoLinkPlugin.dev.esm.js';
+import * as modProd from './LexicalAutoLinkPlugin.prod.esm.js';
+const mod = process.env.NODE_ENV === 'development' ? modDev : modProd;
+export const AutoLinkPlugin = mod.AutoLinkPlugin;
+export const createLinkMatcherWithRegExp = mod.createLinkMatcherWithRegExp;

package/LexicalAutoLinkPlugin.js

@@ -5,5 +5,5 @@
  * LICENSE file in the root directory of this source tree.
  */
 'use strict'
-const LexicalAutoLinkPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalAutoLinkPlugin.dev.js') : require('./LexicalAutoLinkPlugin.prod.js')
+const LexicalAutoLinkPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalAutoLinkPlugin.dev.js') : require('./LexicalAutoLinkPlugin.prod.js');
 module.exports = LexicalAutoLinkPlugin;

package/LexicalAutoLinkPlugin.prod.esm.js

@@ -0,0 +1,7 @@
+/**
+ * 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.
+ */
+import{AutoLinkNode as t,$isAutoLinkNode as e,$isLinkNode as n,$createAutoLinkNode as r}from"@lexical/link";import{useLexicalComposerContext as l}from"@lexical/react/LexicalComposerContext";import{mergeRegister as o}from"@lexical/utils";import{TextNode as i,$isTextNode as s,$isLineBreakNode as u,$isElementNode as g,$createTextNode as c,$getSelection as f,$isRangeSelection as a,$isNodeSelection as x}from"lexical";import{useEffect as h}from"react";var p=function(t){const e=new URLSearchParams;e.append("code",t);for(let t=1;t<arguments.length;t++)e.append("v",arguments[t]);throw Error(`Minified Lexical error #${t}; visit https://lexical.dev/docs/error?${e} for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`)};function d(t,e=(t=>t)){return n=>{const r=t.exec(n);return null===r?null:{index:r.index,length:r[0].length,text:r[0],url:e(r[0])}}}function m(t,e){for(let n=0;n<e.length;n++){const r=e[n](t);if(r)return r}return null}const T=/[.,;\s]/;function C(t){return T.test(t)}function b(t){return C(t[t.length-1])}function v(t){return C(t[0])}function L(t){let e=t.getPreviousSibling();return g(e)&&(e=e.getLastDescendant()),null===e||u(e)||s(e)&&b(e.getTextContent())}function S(t){let e=t.getNextSibling();return g(e)&&(e=e.getFirstDescendant()),null===e||u(e)||s(e)&&v(e.getTextContent())}function R(t,e,n,r){if(!(t>0?C(n[t-1]):L(r[0])))return!1;return e<n.length?C(n[e]):S(r[r.length-1])}function U(t,e,n){const r=[],l=[],o=[];let i=0,s=0;const u=[...t];for(;u.length>0;){const t=u[0],g=t.getTextContent().length,c=s;s+g<=e?(r.push(t),i+=g):c>=n?o.push(t):l.push(t),s+=g,u.shift()}return[i,r,l,o]}function N(t,e,n,l){const o=r(l.url,l.attributes);if(1===t.length){let r,i=t[0];0===e?[r,i]=i.splitText(n):[,r,i]=i.splitText(e,n);const s=c(l.text);return s.setFormat(r.getFormat()),s.setDetail(r.getDetail()),o.append(s),r.replace(o),i}if(t.length>1){const r=t[0];let l,i=r.getTextContent().length;0===e?l=r:[,l]=r.splitText(e);const u=[];let g;for(let e=1;e<t.length;e++){const r=t[e],l=r.getTextContent().length,o=i;if(o<n)if(i+l<=n)u.push(r);else{const[t,e]=r.splitText(n-o);u.push(t),g=e}i+=l}const h=f(),p=h?h.getNodes().find(s):void 0,d=c(l.getTextContent());return d.setFormat(l.getFormat()),d.setDetail(l.getDetail()),o.append(d,...u),p&&p===l&&(a(h)?d.select(h.anchor.offset,h.focus.offset):x(h)&&d.select(0,d.getTextContent().length)),l.replace(o),g}}function D(t,e,n){const r=t.getChildren(),l=r.length;for(let e=0;e<l;e++){const l=r[e];if(!s(l)||!l.isSimpleText())return F(t),void n(null,t.getURL())}const o=t.getTextContent(),i=m(o,e);if(null===i||i.text!==o)return F(t),void n(null,t.getURL());if(!L(t)||!S(t))return F(t),void n(null,t.getURL());const u=t.getURL();if(u!==i.url&&(t.setURL(i.url),n(i.url,u)),i.attributes){const e=t.getRel();e!==i.attributes.rel&&(t.setRel(i.attributes.rel||null),n(i.attributes.rel||null,e));const r=t.getTarget();r!==i.attributes.target&&(t.setTarget(i.attributes.target||null),n(i.attributes.target||null,r))}}function F(t){const e=t.getChildren();for(let n=e.length-1;n>=0;n--)t.insertAfter(e[n]);return t.remove(),e.map((t=>t.getLatest()))}function P(r,l,u){h((()=>{r.hasNodes([t])||p(77);const g=(t,e)=>{u&&u(t,e)};return o(r.registerNodeTransform(i,(t=>{const r=t.getParentOrThrow(),o=t.getPreviousSibling();if(e(r))D(r,l,g);else if(!n(r)){if(t.isSimpleText()&&(v(t.getTextContent())||!e(o))){const e=function(t){const e=[t];let n=t.getNextSibling();for(;null!==n&&s(n)&&n.isSimpleText()&&(e.push(n),!/[\s]/.test(n.getTextContent()));)n=n.getNextSibling();return e}(t);!function(t,e,n){let r=[...t];const l=r.map((t=>t.getTextContent())).join("");let o,i=l,s=0;for(;(o=m(i,e))&&null!==o;){const t=o.index,e=t+o.length;if(R(s+t,s+e,l,r)){const[l,,i,u]=U(r,s+t,s+e),g=N(i,s+t-l,s+e-l,o);r=g?[g,...u]:u,n(o.url,null),s=0}else s+=e;i=i.substring(e)}}(e,l,g)}!function(t,n,r){const l=t.getPreviousSibling(),o=t.getNextSibling(),i=t.getTextContent();e(l)&&!v(i)&&(l.append(t),D(l,n,r),r(null,l.getURL())),e(o)&&!b(i)&&(F(o),D(o,n,r),r(null,o.getURL()))}(t,l,g)}})))}),[r,l,u])}function w({matchers:t,onChange:e}){const[n]=l();return P(n,t,e),null}export{w as AutoLinkPlugin,d as createLinkMatcherWithRegExp};