@lexical/react 0.7.8 → 0.7.9

package/LexicalCharacterLimitPlugin.dev.js

@@ -45,16 +45,13 @@ function useCharacterLimit(editor, maxCharacters, optional = Object.freeze({}))
     }) => {
       const isComposing = editor.isComposing();
       const hasDirtyLeaves = dirtyLeaves.size > 0;
-
       if (isComposing || !hasDirtyLeaves) {
         return;
       }
-
       const textLength = strlen(text$1);
       const textLengthAboveThreshold = textLength > maxCharacters || lastComputedTextLength !== null && lastComputedTextLength > maxCharacters;
       const diff = maxCharacters - textLength;
       remainingCharacters(diff);
-
       if (lastComputedTextLength === null || textLengthAboveThreshold) {
         const offset = findOffset(text$1, maxCharacters, strlen);
         editor.update(() => {
@@ -63,75 +60,62 @@ function useCharacterLimit(editor, maxCharacters, optional = Object.freeze({}))
           tag: 'history-merge'
         });
       }
-
       lastComputedTextLength = textLength;
     }));
   }, [editor, maxCharacters, remainingCharacters, strlen]);
 }
-
 function findOffset(text, maxCharacters, strlen) {
   // @ts-ignore This is due to be added in a later version of TS
   const Segmenter = Intl.Segmenter;
   let offsetUtf16 = 0;
   let offset = 0;
-
   if (typeof Segmenter === 'function') {
     const segmenter = new Segmenter();
     const graphemes = segmenter.segment(text);
-
     for (const {
       segment: grapheme
     } of graphemes) {
       const nextOffset = offset + strlen(grapheme);
-
       if (nextOffset > maxCharacters) {
         break;
       }
-
       offset = nextOffset;
       offsetUtf16 += grapheme.length;
     }
   } else {
     const codepoints = Array.from(text);
     const codepointsLength = codepoints.length;
-
     for (let i = 0; i < codepointsLength; i++) {
       const codepoint = codepoints[i];
       const nextOffset = offset + strlen(codepoint);
-
       if (nextOffset > maxCharacters) {
         break;
       }
-
       offset = nextOffset;
       offsetUtf16 += codepoint.length;
     }
   }
-
   return offsetUtf16;
 }
-
 function $wrapOverflowedNodes(offset) {
   const dfsNodes = utils.$dfs();
   const dfsNodesLength = dfsNodes.length;
   let accumulatedLength = 0;
-
   for (let i = 0; i < dfsNodesLength; i += 1) {
     const {
       node
     } = dfsNodes[i];
-
     if (overflow.$isOverflowNode(node)) {
       const previousLength = accumulatedLength;
       const nextLength = accumulatedLength + node.getTextContentSize();
-
       if (nextLength <= offset) {
         const parent = node.getParent();
         const previousSibling = node.getPreviousSibling();
         const nextSibling = node.getNextSibling();
         $unwrapNode(node);
-        const selection = lexical.$getSelection(); // Restore selection when the overflow children are removed
+        const selection = lexical.$getSelection();
 
+        // Restore selection when the overflow children are removed
         if (lexical.$isRangeSelection(selection) && (!selection.anchor.getNode().isAttached() || !selection.focus.getNode().isAttached())) {
           if (lexical.$isTextNode(previousSibling)) {
             previousSibling.select();
@@ -144,12 +128,11 @@ function $wrapOverflowedNodes(offset) {
       } else if (previousLength < offset) {
         const descendant = node.getFirstDescendant();
         const descendantLength = descendant !== null ? descendant.getTextContentSize() : 0;
-        const previousPlusDescendantLength = previousLength + descendantLength; // For simple text we can redimension the overflow into a smaller and more accurate
+        const previousPlusDescendantLength = previousLength + descendantLength;
+        // For simple text we can redimension the overflow into a smaller and more accurate
         // container
-
         const firstDescendantIsSimpleText = lexical.$isTextNode(descendant) && descendant.isSimpleText();
         const firstDescendantDoesNotOverflow = previousPlusDescendantLength <= offset;
-
         if (firstDescendantIsSimpleText || firstDescendantDoesNotOverflow) {
           $unwrapNode(node);
         }
@@ -157,59 +140,49 @@ function $wrapOverflowedNodes(offset) {
     } else if (lexical.$isLeafNode(node)) {
       const previousAccumulatedLength = accumulatedLength;
       accumulatedLength += node.getTextContentSize();
-
       if (accumulatedLength > offset && !overflow.$isOverflowNode(node.getParent())) {
         const previousSelection = lexical.$getSelection();
-        let overflowNode; // For simple text we can improve the limit accuracy by splitting the TextNode
-        // on the split point
+        let overflowNode;
 
+        // For simple text we can improve the limit accuracy by splitting the TextNode
+        // on the split point
         if (previousAccumulatedLength < offset && lexical.$isTextNode(node) && node.isSimpleText()) {
           const [, overflowedText] = node.splitText(offset - previousAccumulatedLength);
           overflowNode = $wrapNode(overflowedText);
         } else {
           overflowNode = $wrapNode(node);
         }
-
         if (previousSelection !== null) {
           lexical.$setSelection(previousSelection);
         }
-
         mergePrevious(overflowNode);
       }
     }
   }
 }
-
 function $wrapNode(node) {
   const overflowNode = overflow.$createOverflowNode();
   node.insertBefore(overflowNode);
   overflowNode.append(node);
   return overflowNode;
 }
-
 function $unwrapNode(node) {
   const children = node.getChildren();
   const childrenLength = children.length;
-
   for (let i = 0; i < childrenLength; i++) {
     node.insertBefore(children[i]);
   }
-
   node.remove();
   return childrenLength > 0 ? children[childrenLength - 1] : null;
 }
-
 function mergePrevious(overflowNode) {
   const previousNode = overflowNode.getPreviousSibling();
-
   if (!overflow.$isOverflowNode(previousNode)) {
     return;
   }
-
   const firstChild = overflowNode.getFirstChild();
   const previousNodeChildren = previousNode.getChildren();
   const previousNodeChildrenLength = previousNodeChildren.length;
-
   if (firstChild === null) {
     overflowNode.append(...previousNodeChildren);
   } else {
@@ -217,28 +190,23 @@ function mergePrevious(overflowNode) {
       firstChild.insertBefore(previousNodeChildren[i]);
     }
   }
-
   const selection = lexical.$getSelection();
-
   if (lexical.$isRangeSelection(selection)) {
     const anchor = selection.anchor;
     const anchorNode = anchor.getNode();
     const focus = selection.focus;
     const focusNode = anchor.getNode();
-
     if (anchorNode.is(previousNode)) {
       anchor.set(overflowNode.getKey(), anchor.offset, 'element');
     } else if (anchorNode.is(overflowNode)) {
       anchor.set(overflowNode.getKey(), previousNodeChildrenLength + anchor.offset, 'element');
     }
-
     if (focusNode.is(previousNode)) {
       focus.set(overflowNode.getKey(), focus.offset, 'element');
     } else if (focusNode.is(overflowNode)) {
       focus.set(overflowNode.getKey(), previousNodeChildrenLength + focus.offset, 'element');
     }
   }
-
   previousNode.remove();
 }
 
@@ -251,31 +219,24 @@ function mergePrevious(overflowNode) {
  */
 const CHARACTER_LIMIT = 5;
 let textEncoderInstance = null;
-
 function textEncoder() {
   if (window.TextEncoder === undefined) {
     return null;
   }
-
   if (textEncoderInstance === null) {
     textEncoderInstance = new window.TextEncoder();
   }
-
   return textEncoderInstance;
 }
-
 function utf8Length(text) {
   const currentTextEncoder = textEncoder();
-
   if (currentTextEncoder === null) {
     // http://stackoverflow.com/a/5515960/210370
     const m = encodeURIComponent(text).match(/%[89ABab]/g);
     return text.length + (m ? m.length : 0);
   }
-
   return currentTextEncoder.encode(text).length;
 }
-
 function CharacterLimitPlugin({
   charset = 'UTF-16',
   maxLength = CHARACTER_LIMIT

package/LexicalCheckListPlugin.dev.js

@@ -31,25 +31,19 @@ function CheckListPlugin() {
       return handleArrownUpOrDown(event, editor, true);
     }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_ESCAPE_COMMAND, event => {
       const activeItem = getActiveCheckListItem();
-
       if (activeItem != null) {
         const rootElement = editor.getRootElement();
-
         if (rootElement != null) {
           rootElement.focus();
         }
-
         return true;
       }
-
       return false;
     }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_SPACE_COMMAND, event => {
       const activeItem = getActiveCheckListItem();
-
       if (activeItem != null && editor.isEditable()) {
         editor.update(() => {
           const listItemNode = lexical.$getNearestNodeFromDOMNode(activeItem);
-
           if (list.$isListItemNode(listItemNode)) {
             event.preventDefault();
             listItemNode.toggleChecked();
@@ -57,28 +51,22 @@ function CheckListPlugin() {
         });
         return true;
       }
-
       return false;
     }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_ARROW_LEFT_COMMAND, event => {
       return editor.getEditorState().read(() => {
         const selection = lexical.$getSelection();
-
         if (lexical.$isRangeSelection(selection) && selection.isCollapsed()) {
           const {
             anchor
           } = selection;
           const isElement = anchor.type === 'element';
-
           if (isElement || anchor.offset === 0) {
             const anchorNode = anchor.getNode();
             const elementNode = utils.$findMatchingParent(anchorNode, node => lexical.$isElementNode(node) && !node.isInline());
-
             if (list.$isListItemNode(elementNode)) {
               const parent = elementNode.getParent();
-
               if (list.$isListNode(parent) && parent.getListType() === 'check' && (isElement || elementNode.getFirstDescendant() === anchorNode)) {
                 const domNode = editor.getElementByKey(elementNode.__key);
-
                 if (domNode != null && document.activeElement !== domNode) {
                   domNode.focus();
                   event.preventDefault();
@@ -88,7 +76,6 @@ function CheckListPlugin() {
             }
           }
         }
-
         return false;
       });
     }, lexical.COMMAND_PRIORITY_LOW), editor.registerRootListener((rootElement, prevElement) => {
@@ -96,7 +83,6 @@ function CheckListPlugin() {
         rootElement.addEventListener('click', handleClick);
         rootElement.addEventListener('pointerdown', handlePointerDown);
       }
-
       if (prevElement !== null) {
         prevElement.removeEventListener('click', handleClick);
         prevElement.removeEventListener('pointerdown', handlePointerDown);
@@ -105,45 +91,37 @@ function CheckListPlugin() {
   });
   return null;
 }
-
 function handleCheckItemEvent(event, callback) {
   const target = event.target;
-
   if (!(target instanceof HTMLElement)) {
     return;
-  } // Ignore clicks on LI that have nested lists
-
+  }
 
+  // Ignore clicks on LI that have nested lists
   const firstChild = target.firstChild;
-
   if (firstChild != null && firstChild instanceof HTMLElement && (firstChild.tagName === 'UL' || firstChild.tagName === 'OL')) {
     return;
   }
+  const parentNode = target.parentNode;
 
-  const parentNode = target.parentNode; // @ts-ignore internal field
-
+  // @ts-ignore internal field
   if (!parentNode || parentNode.__lexicalListType !== 'check') {
     return;
   }
-
   const pageX = event.pageX;
   const rect = target.getBoundingClientRect();
-
   if (target.dir === 'rtl' ? pageX < rect.right && pageX > rect.right - 20 : pageX > rect.left && pageX < rect.left + 20) {
     callback();
   }
 }
-
 function handleClick(event) {
   handleCheckItemEvent(event, () => {
     const domNode = event.target;
     const editor = findEditor(domNode);
-
     if (editor != null && editor.isEditable()) {
       editor.update(() => {
         if (event.target) {
           const node = lexical.$getNearestNodeFromDOMNode(domNode);
-
           if (list.$isListItemNode(node)) {
             domNode.focus();
             node.toggleChecked();
@@ -153,80 +131,65 @@ function handleClick(event) {
     }
   });
 }
-
 function handlePointerDown(event) {
   handleCheckItemEvent(event, () => {
     // Prevents caret moving when clicking on check mark
     event.preventDefault();
   });
 }
-
 function findEditor(target) {
   let node = target;
-
   while (node) {
     // @ts-ignore internal field
     if (node.__lexicalEditor) {
       // @ts-ignore internal field
       return node.__lexicalEditor;
     }
-
     node = node.parentNode;
   }
-
   return null;
 }
-
 function getActiveCheckListItem() {
   const activeElement = document.activeElement;
-  return activeElement != null && activeElement.tagName === 'LI' && activeElement.parentNode != null && // @ts-ignore internal field
+  return activeElement != null && activeElement.tagName === 'LI' && activeElement.parentNode != null &&
+  // @ts-ignore internal field
   activeElement.parentNode.__lexicalListType === 'check' ? activeElement : null;
 }
-
 function findCheckListItemSibling(node, backward) {
   let sibling = backward ? node.getPreviousSibling() : node.getNextSibling();
-  let parent = node; // Going up in a tree to get non-null sibling
+  let parent = node;
 
+  // Going up in a tree to get non-null sibling
   while (sibling == null && list.$isListItemNode(parent)) {
     // Get li -> parent ul/ol -> parent li
     parent = parent.getParentOrThrow().getParent();
-
     if (parent != null) {
       sibling = backward ? parent.getPreviousSibling() : parent.getNextSibling();
     }
-  } // Going down in a tree to get first non-nested list item
-
+  }
 
+  // Going down in a tree to get first non-nested list item
   while (list.$isListItemNode(sibling)) {
     const firstChild = backward ? sibling.getLastChild() : sibling.getFirstChild();
-
     if (!list.$isListNode(firstChild)) {
       return sibling;
     }
-
     sibling = backward ? firstChild.getLastChild() : firstChild.getFirstChild();
   }
-
   return null;
 }
-
 function handleArrownUpOrDown(event, editor, backward) {
   const activeItem = getActiveCheckListItem();
-
   if (activeItem != null) {
     editor.update(() => {
       const listItem = lexical.$getNearestNodeFromDOMNode(activeItem);
-
       if (!list.$isListItemNode(listItem)) {
         return;
       }
-
       const nextListItem = findCheckListItemSibling(listItem, backward);
-
       if (nextListItem != null) {
         nextListItem.selectStart();
         const dom = editor.getElementByKey(nextListItem.__key);
-
         if (dom != null) {
           event.preventDefault();
           setTimeout(() => {
@@ -236,7 +199,6 @@ function handleArrownUpOrDown(event, editor, backward) {
       }
     });
   }
-
   return false;
 }
 

package/LexicalClearEditorPlugin.dev.js

@@ -17,6 +17,7 @@ var react = require('react');
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
 
 /**
@@ -49,7 +50,6 @@ function ClearEditorPlugin({
           const paragraph = lexical.$createParagraphNode();
           root.clear();
           root.append(paragraph);
-
           if (selection !== null) {
             paragraph.select();
           }

package/LexicalCollaborationContext.dev.js

@@ -26,15 +26,12 @@ const CollaborationContext = /*#__PURE__*/react.createContext({
 });
 function useCollaborationContext(username, color) {
   const collabContext = react.useContext(CollaborationContext);
-
   if (username != null) {
     collabContext.name = username;
   }
-
   if (color != null) {
     collabContext.color = color;
   }
-
   return collabContext;
 }
 

package/LexicalCollaborationPlugin.dev.js

@@ -31,7 +31,8 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
   const disconnect = React.useCallback(() => {
     try {
       provider.disconnect();
-    } catch (e) {// Do nothing
+    } catch (e) {
+      // Do nothing
     }
   }, [provider]);
   React.useEffect(() => {
@@ -41,45 +42,37 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
     const {
       awareness
     } = provider;
-
     const onStatus = ({
       status
     }) => {
       editor.dispatchCommand(yjs.CONNECTED_COMMAND, status === 'connected');
     };
-
     const onSync = isSynced => {
       if (shouldBootstrap && isSynced && root.isEmpty() && root._xmlText._length === 0 && isReloadingDoc.current === false) {
         initializeEditor(editor, initialEditorState);
       }
-
       isReloadingDoc.current = false;
     };
-
     const onAwarenessUpdate = () => {
       yjs.syncCursorPositions(binding, provider);
     };
-
     const onYjsTreeChanges = (events, transaction) => {
       if (transaction.origin !== binding) {
         yjs.syncYjsChangesToLexical(binding, provider, events);
       }
     };
-
     yjs.initLocalState(provider, name, color, document.activeElement === editor.getRootElement());
-
     const onProviderDocReload = ydoc => {
       clearEditorSkipCollab(editor, binding);
       setDoc(ydoc);
       docMap.set(id, ydoc);
       isReloadingDoc.current = true;
     };
-
     provider.on('reload', onProviderDocReload);
     provider.on('status', onStatus);
     provider.on('sync', onSync);
-    awareness.on('update', onAwarenessUpdate); // This updates the local editor state when we recieve updates from other clients
-
+    awareness.on('update', onAwarenessUpdate);
+    // This updates the local editor state when we recieve updates from other clients
     root.getSharedType().observeDeep(onYjsTreeChanges);
     const removeListener = editor.registerUpdateListener(({
       prevEditorState,
@@ -98,7 +91,6 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
       if (isReloadingDoc.current === false) {
         disconnect();
       }
-
       provider.off('sync', onSync);
       provider.off('status', onStatus);
       provider.off('reload', onProviderDocReload);
@@ -112,7 +104,6 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
     const ref = element => {
       binding.cursorsContainer = element;
     };
-
     return /*#__PURE__*/reactDom.createPortal( /*#__PURE__*/React.createElement("div", {
       ref: ref
     }), cursorsContainerRef && cursorsContainerRef.current || document.body);
@@ -121,7 +112,6 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
     return editor.registerCommand(yjs.TOGGLE_CONNECT_COMMAND, payload => {
       if (connect !== undefined && disconnect !== undefined) {
         const shouldConnect = payload;
-
         if (shouldConnect) {
           // eslint-disable-next-line no-console
           console.log('Collaboration connected!');
@@ -132,7 +122,6 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
           disconnect();
         }
       }
-
       return true;
     }, lexical.COMMAND_PRIORITY_EDITOR);
   }, [connect, disconnect, editor]);
@@ -155,11 +144,9 @@ function useYjsHistory(editor, binding) {
     const undo = () => {
       undoManager.undo();
     };
-
     const redo = () => {
       undoManager.redo();
     };
-
     return utils.mergeRegister(editor.registerCommand(lexical.UNDO_COMMAND, () => {
       undo();
       return true;
@@ -173,11 +160,9 @@ function useYjsHistory(editor, binding) {
   }, [undoManager]);
   return clearHistory;
 }
-
 function initializeEditor(editor, initialEditorState) {
   editor.update(() => {
     const root = lexical.$getRoot();
-
     if (root.isEmpty()) {
       if (initialEditorState) {
         switch (typeof initialEditorState) {
@@ -189,7 +174,6 @@ function initializeEditor(editor, initialEditorState) {
               });
               break;
             }
-
           case 'object':
             {
               editor.setEditorState(initialEditorState, {
@@ -197,12 +181,10 @@ function initializeEditor(editor, initialEditorState) {
               });
               break;
             }
-
           case 'function':
             {
               editor.update(() => {
                 const root1 = lexical.$getRoot();
-
                 if (root1.isEmpty()) {
                   initialEditorState(editor);
                 }
@@ -218,7 +200,6 @@ function initializeEditor(editor, initialEditorState) {
         const {
           activeElement
         } = document;
-
         if (lexical.$getSelection() !== null || activeElement !== null && activeElement === editor.getRootElement()) {
           paragraph.select();
         }
@@ -228,7 +209,6 @@ function initializeEditor(editor, initialEditorState) {
     tag: 'history-merge'
   });
 }
-
 function clearEditorSkipCollab(editor, binding) {
   // reset editor state
   editor.update(() => {
@@ -238,33 +218,25 @@ function clearEditorSkipCollab(editor, binding) {
   }, {
     tag: 'skip-collab'
   });
-
   if (binding.cursors == null) {
     return;
   }
-
   const cursors = binding.cursors;
-
   if (cursors == null) {
     return;
   }
-
   const cursorsContainer = binding.cursorsContainer;
-
   if (cursorsContainer == null) {
     return;
-  } // reset cursors in dom
-
+  }
 
+  // reset cursors in dom
   const cursorsArr = Array.from(cursors.values());
-
   for (let i = 0; i < cursorsArr.length; i++) {
     const cursor = cursorsArr[i];
     const selection = cursor.selection;
-
     if (selection && selection.selections != null) {
       const selections = selection.selections;
-
       for (let j = 0; j < selections.length; j++) {
         cursorsContainer.removeChild(selections[i]);
       }