@lexical/text 0.13.1 → 0.14.1

package/LexicalText.dev.esm.js

@@ -0,0 +1,288 @@
+/**
+ * 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 { $isElementNode, $isTextNode, $getRoot, $isDecoratorNode, $isParagraphNode, TextNode, $createTextNode } from 'lexical';
+
+/** @module @lexical/text */
+/**
+ * Finds a TextNode with a size larger than targetCharacters and returns
+ * the node along with the remaining length of the text.
+ * @param root - The RootNode.
+ * @param targetCharacters - The number of characters whose TextNode must be larger than.
+ * @returns The TextNode and the intersections offset, or null if no TextNode is found.
+ */
+function $findTextIntersectionFromCharacters(root, targetCharacters) {
+  let node = root.getFirstChild();
+  let currentCharacters = 0;
+  mainLoop: while (node !== null) {
+    if ($isElementNode(node)) {
+      const child = node.getFirstChild();
+      if (child !== null) {
+        node = child;
+        continue;
+      }
+    } else if ($isTextNode(node)) {
+      const characters = node.getTextContentSize();
+      if (currentCharacters + characters > targetCharacters) {
+        return {
+          node,
+          offset: targetCharacters - currentCharacters
+        };
+      }
+      currentCharacters += characters;
+    }
+    const sibling = node.getNextSibling();
+    if (sibling !== null) {
+      node = sibling;
+      continue;
+    }
+    let parent = node.getParent();
+    while (parent !== null) {
+      const parentSibling = parent.getNextSibling();
+      if (parentSibling !== null) {
+        node = parentSibling;
+        continue mainLoop;
+      }
+      parent = parent.getParent();
+    }
+    break;
+  }
+  return null;
+}
+
+/**
+ * Determines if the root has any text content and can trim any whitespace if it does.
+ * @param isEditorComposing - Is the editor in composition mode due to an active Input Method Editor?
+ * @param trim - Should the root text have its whitespaced trimmed? Defaults to true.
+ * @returns true if text content is empty, false if there is text or isEditorComposing is true.
+ */
+function $isRootTextContentEmpty(isEditorComposing, trim = true) {
+  if (isEditorComposing) {
+    return false;
+  }
+  let text = $rootTextContent();
+  if (trim) {
+    text = text.trim();
+  }
+  return text === '';
+}
+
+/**
+ * Returns a function that executes {@link $isRootTextContentEmpty}
+ * @param isEditorComposing - Is the editor in composition mode due to an active Input Method Editor?
+ * @param trim - Should the root text have its whitespaced trimmed? Defaults to true.
+ * @returns A function that executes $isRootTextContentEmpty based on arguments.
+ */
+function $isRootTextContentEmptyCurry(isEditorComposing, trim) {
+  return () => $isRootTextContentEmpty(isEditorComposing, trim);
+}
+
+/**
+ * Returns the root's text content.
+ * @returns The root's text content.
+ */
+function $rootTextContent() {
+  const root = $getRoot();
+  return root.getTextContent();
+}
+
+/**
+ * Determines if the input should show the placeholder. If anything is in
+ * in the root the placeholder should not be shown.
+ * @param isComposing - Is the editor in composition mode due to an active Input Method Editor?
+ * @returns true if the input should show the placeholder, false otherwise.
+ */
+function $canShowPlaceholder(isComposing) {
+  if (!$isRootTextContentEmpty(isComposing, false)) {
+    return false;
+  }
+  const root = $getRoot();
+  const children = root.getChildren();
+  const childrenLength = children.length;
+  if (childrenLength > 1) {
+    return false;
+  }
+  for (let i = 0; i < childrenLength; i++) {
+    const topBlock = children[i];
+    if ($isDecoratorNode(topBlock)) {
+      return false;
+    }
+    if ($isElementNode(topBlock)) {
+      if (!$isParagraphNode(topBlock)) {
+        return false;
+      }
+      if (topBlock.__indent !== 0) {
+        return false;
+      }
+      const topBlockChildren = topBlock.getChildren();
+      const topBlockChildrenLength = topBlockChildren.length;
+      for (let s = 0; s < topBlockChildrenLength; s++) {
+        const child = topBlockChildren[i];
+        if (!$isTextNode(child)) {
+          return false;
+        }
+      }
+    }
+  }
+  return true;
+}
+
+/**
+ * Returns a function that executes {@link $canShowPlaceholder}
+ * @param isEditorComposing - Is the editor in composition mode due to an active Input Method Editor?
+ * @returns A function that executes $canShowPlaceholder with arguments.
+ */
+function $canShowPlaceholderCurry(isEditorComposing) {
+  return () => $canShowPlaceholder(isEditorComposing);
+}
+/**
+ * Returns a tuple that can be rested (...) into mergeRegister to clean up
+ * node transforms listeners that transforms text into another node, eg. a HashtagNode.
+ * @example
+ * ```ts
+ *   useEffect(() => {
+    return mergeRegister(
+      ...registerLexicalTextEntity(editor, getMatch, targetNode, createNode),
+    );
+  }, [createNode, editor, getMatch, targetNode]);
+ * ```
+ * Where targetNode is the type of node containing the text you want to transform (like a text input),
+ * then getMatch uses a regex to find a matching text and creates the proper node to include the matching text.
+ * @param editor - The lexical editor.
+ * @param getMatch - Finds a matching string that satisfies a regex expression.
+ * @param targetNode - The node type that contains text to match with. eg. HashtagNode
+ * @param createNode - A function that creates a new node to contain the matched text. eg createHashtagNode
+ * @returns An array containing the plain text and reverse node transform listeners.
+ */
+function registerLexicalTextEntity(editor, getMatch, targetNode, createNode) {
+  const isTargetNode = node => {
+    return node instanceof targetNode;
+  };
+  const replaceWithSimpleText = node => {
+    const textNode = $createTextNode(node.getTextContent());
+    textNode.setFormat(node.getFormat());
+    node.replace(textNode);
+  };
+  const getMode = node => {
+    return node.getLatest().__mode;
+  };
+  const textNodeTransform = node => {
+    if (!node.isSimpleText()) {
+      return;
+    }
+    const prevSibling = node.getPreviousSibling();
+    let text = node.getTextContent();
+    let currentNode = node;
+    let match;
+    if ($isTextNode(prevSibling)) {
+      const previousText = prevSibling.getTextContent();
+      const combinedText = previousText + text;
+      const prevMatch = getMatch(combinedText);
+      if (isTargetNode(prevSibling)) {
+        if (prevMatch === null || getMode(prevSibling) !== 0) {
+          replaceWithSimpleText(prevSibling);
+          return;
+        } else {
+          const diff = prevMatch.end - previousText.length;
+          if (diff > 0) {
+            const concatText = text.slice(0, diff);
+            const newTextContent = previousText + concatText;
+            prevSibling.select();
+            prevSibling.setTextContent(newTextContent);
+            if (diff === text.length) {
+              node.remove();
+            } else {
+              const remainingText = text.slice(diff);
+              node.setTextContent(remainingText);
+            }
+            return;
+          }
+        }
+      } else if (prevMatch === null || prevMatch.start < previousText.length) {
+        return;
+      }
+    }
+
+    // eslint-disable-next-line no-constant-condition
+    while (true) {
+      match = getMatch(text);
+      let nextText = match === null ? '' : text.slice(match.end);
+      text = nextText;
+      if (nextText === '') {
+        const nextSibling = currentNode.getNextSibling();
+        if ($isTextNode(nextSibling)) {
+          nextText = currentNode.getTextContent() + nextSibling.getTextContent();
+          const nextMatch = getMatch(nextText);
+          if (nextMatch === null) {
+            if (isTargetNode(nextSibling)) {
+              replaceWithSimpleText(nextSibling);
+            } else {
+              nextSibling.markDirty();
+            }
+            return;
+          } else if (nextMatch.start !== 0) {
+            return;
+          }
+        }
+      } else {
+        const nextMatch = getMatch(nextText);
+        if (nextMatch !== null && nextMatch.start === 0) {
+          return;
+        }
+      }
+      if (match === null) {
+        return;
+      }
+      if (match.start === 0 && $isTextNode(prevSibling) && prevSibling.isTextEntity()) {
+        continue;
+      }
+      let nodeToReplace;
+      if (match.start === 0) {
+        [nodeToReplace, currentNode] = currentNode.splitText(match.end);
+      } else {
+        [, nodeToReplace, currentNode] = currentNode.splitText(match.start, match.end);
+      }
+      const replacementNode = createNode(nodeToReplace);
+      replacementNode.setFormat(nodeToReplace.getFormat());
+      nodeToReplace.replace(replacementNode);
+      if (currentNode == null) {
+        return;
+      }
+    }
+  };
+  const reverseNodeTransform = node => {
+    const text = node.getTextContent();
+    const match = getMatch(text);
+    if (match === null || match.start !== 0) {
+      replaceWithSimpleText(node);
+      return;
+    }
+    if (text.length > match.end) {
+      // This will split out the rest of the text as simple text
+      node.splitText(match.end);
+      return;
+    }
+    const prevSibling = node.getPreviousSibling();
+    if ($isTextNode(prevSibling) && prevSibling.isTextEntity()) {
+      replaceWithSimpleText(prevSibling);
+      replaceWithSimpleText(node);
+    }
+    const nextSibling = node.getNextSibling();
+    if ($isTextNode(nextSibling) && nextSibling.isTextEntity()) {
+      replaceWithSimpleText(nextSibling);
+
+      // This may have already been converted in the previous block
+      if (isTargetNode(node)) {
+        replaceWithSimpleText(node);
+      }
+    }
+  };
+  const removePlainTextTransform = editor.registerNodeTransform(TextNode, textNodeTransform);
+  const removeReverseNodeTransform = editor.registerNodeTransform(targetNode, reverseNodeTransform);
+  return [removePlainTextTransform, removeReverseNodeTransform];
+}
+
+export { $canShowPlaceholder, $canShowPlaceholderCurry, $findTextIntersectionFromCharacters, $isRootTextContentEmpty, $isRootTextContentEmptyCurry, $rootTextContent, registerLexicalTextEntity };

package/LexicalText.esm.js

@@ -0,0 +1,16 @@
+/**
+ * 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 './LexicalText.dev.esm.js';
+import * as modProd from './LexicalText.prod.esm.js';
+const mod = process.env.NODE_ENV === 'development' ? modDev : modProd;
+export const $canShowPlaceholder = mod.$canShowPlaceholder;
+export const $canShowPlaceholderCurry = mod.$canShowPlaceholderCurry;
+export const $findTextIntersectionFromCharacters = mod.$findTextIntersectionFromCharacters;
+export const $isRootTextContentEmpty = mod.$isRootTextContentEmpty;
+export const $isRootTextContentEmptyCurry = mod.$isRootTextContentEmptyCurry;
+export const $rootTextContent = mod.$rootTextContent;
+export const registerLexicalTextEntity = mod.registerLexicalTextEntity;

package/LexicalText.js

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

package/LexicalText.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{$isElementNode as t,$isTextNode as e,$getRoot as n,$isDecoratorNode as r,$isParagraphNode as i,TextNode as o,$createTextNode as l}from"lexical";function s(n,r){let i=n.getFirstChild(),o=0;t:for(;null!==i;){if(t(i)){const t=i.getFirstChild();if(null!==t){i=t;continue}}else if(e(i)){const t=i.getTextContentSize();if(o+t>r)return{node:i,offset:r-o};o+=t}const n=i.getNextSibling();if(null!==n){i=n;continue}let l=i.getParent();for(;null!==l;){const t=l.getNextSibling();if(null!==t){i=t;continue t}l=l.getParent()}break}return null}function u(t,e=!0){if(t)return!1;let n=c();return e&&(n=n.trim()),""===n}function f(t,e){return()=>u(t,e)}function c(){return n().getTextContent()}function g(o){if(!u(o,!1))return!1;const l=n().getChildren(),s=l.length;if(s>1)return!1;for(let n=0;n<s;n++){const o=l[n];if(r(o))return!1;if(t(o)){if(!i(o))return!1;if(0!==o.__indent)return!1;const t=o.getChildren(),r=t.length;for(let i=0;i<r;i++){const r=t[n];if(!e(r))return!1}}}return!0}function x(t){return()=>g(t)}function a(t,n,r,i){const s=t=>t instanceof r,u=t=>{const e=l(t.getTextContent());e.setFormat(t.getFormat()),t.replace(e)};return[t.registerNodeTransform(o,(t=>{if(!t.isSimpleText())return;const r=t.getPreviousSibling();let o,l=t.getTextContent(),f=t;if(e(r)){const e=r.getTextContent(),i=n(e+l);if(s(r)){if(null===i||0!==(t=>t.getLatest().__mode)(r))return void u(r);{const n=i.end-e.length;if(n>0){const i=e+l.slice(0,n);if(r.select(),r.setTextContent(i),n===l.length)t.remove();else{const e=l.slice(n);t.setTextContent(e)}return}}}else if(null===i||i.start<e.length)return}for(;;){o=n(l);let t,c=null===o?"":l.slice(o.end);if(l=c,""===c){const t=f.getNextSibling();if(e(t)){c=f.getTextContent()+t.getTextContent();const e=n(c);if(null===e)return void(s(t)?u(t):t.markDirty());if(0!==e.start)return}}else{const t=n(c);if(null!==t&&0===t.start)return}if(null===o)return;if(0===o.start&&e(r)&&r.isTextEntity())continue;0===o.start?[t,f]=f.splitText(o.end):[,t,f]=f.splitText(o.start,o.end);const g=i(t);if(g.setFormat(t.getFormat()),t.replace(g),null==f)return}})),t.registerNodeTransform(r,(t=>{const r=t.getTextContent(),i=n(r);if(null===i||0!==i.start)return void u(t);if(r.length>i.end)return void t.splitText(i.end);const o=t.getPreviousSibling();e(o)&&o.isTextEntity()&&(u(o),u(t));const l=t.getNextSibling();e(l)&&l.isTextEntity()&&(u(l),s(t)&&u(t))}))]}export{g as $canShowPlaceholder,x as $canShowPlaceholderCurry,s as $findTextIntersectionFromCharacters,u as $isRootTextContentEmpty,f as $isRootTextContentEmptyCurry,c as $rootTextContent,a as registerLexicalTextEntity};

package/README.md

@@ -1,3 +1,5 @@
 # `@lexical/text`
 
+[![See API Documentation](https://lexical.dev/img/see-api-documentation.svg)](https://lexical.dev/docs/api/modules/lexical_text)
+
 This package contains utilities and helpers for handling Lexical text.

package/package.json

@@ -9,14 +9,16 @@
     "text"
   ],
   "license": "MIT",
-  "version": "0.13.1",
+  "version": "0.14.1",
   "main": "LexicalText.js",
   "peerDependencies": {
-    "lexical": "0.13.1"
+    "lexical": "0.14.1"
   },
   "repository": {
     "type": "git",
     "url": "https://github.com/facebook/lexical",
     "directory": "packages/lexical-text"
-  }
+  },
+  "module": "LexicalText.esm.js",
+  "sideEffects": false
 }