chore: Update Lexical to 0.7.5 (#2117)

packages/blocks-editor/package.json

@@ -7,11 +7,11 @@
     "tsc": "tsc -p tsconfig.json"
   },
   "dependencies": {
-    "@lexical/react": "^0.6.5",
+    "@lexical/react": "0.7.5",
     "@standardnotes/icons": "workspace:*",
     "@types/react": "^18.0.26",
     "@types/react-dom": "^18.0.9",
-    "lexical": "^0.6.5",
+    "lexical": "0.7.5",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

packages/blocks-editor/src/Editor/BlocksEditor.tsx

@@ -21,6 +21,7 @@ import DraggableBlockPlugin from '../Lexical/Plugins/DraggableBlockPlugin';
 import CodeHighlightPlugin from '../Lexical/Plugins/CodeHighlightPlugin';
 import FloatingTextFormatToolbarPlugin from '../Lexical/Plugins/FloatingTextFormatToolbarPlugin';
 import FloatingLinkEditorPlugin from '../Lexical/Plugins/FloatingLinkEditorPlugin';
+import {TabIndentationPlugin} from '../Lexical/Plugins/TabIndentationPlugin';
 import {truncateString} from './Utils';
 import {SuperEditorContentId} from './Constants';
 import {classNames} from '@standardnotes/utils';
@@ -107,7 +108,7 @@ export const BlocksEditor: FunctionComponent<BlocksEditorProps> = ({
             </div>
           </div>
         }
-        placeholder=""
+        placeholder={null}
         ErrorBoundary={LexicalErrorBoundary}
       />
       <ListPlugin />
@@ -125,6 +126,7 @@ export const BlocksEditor: FunctionComponent<BlocksEditorProps> = ({
       <TwitterPlugin />
       <YouTubePlugin />
       <CollapsiblePlugin />
+      <TabIndentationPlugin />
       {!readonly && floatingAnchorElem && (
         <>
           <FloatingTextFormatToolbarPlugin anchorElem={floatingAnchorElem} />

packages/blocks-editor/src/Lexical/Plugins/AutoEmbedPlugin/index.tsx

@@ -192,9 +192,10 @@ export function AutoEmbedDialog({
   const embedResult =
     text != null && urlMatch != null ? embedConfig.parseUrl(text) : null;
 
-  const onClick = () => {
-    if (embedResult != null) {
-      embedConfig.insertNode(editor, embedResult);
+  const onClick = async () => {
+    const result = await embedResult;
+    if (result != null) {
+      embedConfig.insertNode(editor, result);
       onClose();
     }
   };

packages/blocks-editor/src/Lexical/Plugins/DraggableBlockPlugin/index.tsx

@@ -12,6 +12,7 @@ import {mergeRegister} from '@lexical/utils';
 import {
   $getNearestNodeFromDOMNode,
   $getNodeByKey,
+  $getRoot,
   COMMAND_PRIORITY_HIGH,
   COMMAND_PRIORITY_LOW,
   DRAGOVER_COMMAND,
@@ -58,8 +59,7 @@ function getCurrentIndex(keysLength: number): number {
 }
 
 function getTopLevelNodeKeys(editor: LexicalEditor): string[] {
-  const root = editor.getEditorState()._nodeMap.get('root');
-  return root ? root.__children : [];
+  return editor.getEditorState().read(() => $getRoot().getChildrenKeys());
 }
 
 function elementContainingEventLocation(

packages/blocks-editor/src/Lexical/Plugins/TabIndentationPlugin.tsx

@@ -0,0 +1,50 @@
+/**
+ * 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 {
+  $getSelection,
+  $isRangeSelection,
+  COMMAND_PRIORITY_EDITOR,
+  INDENT_CONTENT_COMMAND,
+  KEY_TAB_COMMAND,
+  OUTDENT_CONTENT_COMMAND,
+} from 'lexical';
+import {useEffect} from 'react';
+
+/**
+ * This plugin adds the ability to indent content using the tab key. Generally, we don't
+ * recommend using this plugin as it could negatively affect acessibility for keyboard
+ * users, causing focus to become trapped within the editor.
+ */
+export function TabIndentationPlugin(): null {
+  const [editor] = useLexicalComposerContext();
+
+  useEffect(() => {
+    return editor.registerCommand<KeyboardEvent>(
+      KEY_TAB_COMMAND,
+      (event) => {
+        const selection = $getSelection();
+
+        if (!$isRangeSelection(selection)) {
+          return false;
+        }
+
+        event.preventDefault();
+
+        return editor.dispatchCommand(
+          event.shiftKey ? OUTDENT_CONTENT_COMMAND : INDENT_CONTENT_COMMAND,
+          undefined,
+        );
+      },
+      COMMAND_PRIORITY_EDITOR,
+    );
+  });
+
+  return null;
+}

packages/mobile/ios/Podfile.lock

@@ -583,7 +583,7 @@ EXTERNAL SOURCES:
 SPEC CHECKSUMS:
   boost: a7c83b31436843459a1961bfd74b96033dc77234
   CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
-  DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54
+  DoubleConversion: 831926d9b8bf8166fd87886c4abab286c2422662
   FBLazyVector: 48289402952f4f7a4e235de70a9a590aa0b79ef4
   FBReactNativeSpec: dd1186fd05255e3457baa2f4ca65e94c2cd1e3ac
   Flipper: 26fc4b7382499f1281eb8cb921e5c3ad6de91fe0
@@ -596,7 +596,7 @@ SPEC CHECKSUMS:
   Flipper-RSocket: d9d9ade67cbecf6ac10730304bf5607266dd2541
   FlipperKit: cbdee19bdd4e7f05472a66ce290f1b729ba3cb86
   fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
-  glog: 04b94705f318337d7ead9e6d17c019bd9b1f6b1b
+  glog: 85ecdd10ee8d8ec362ef519a6a45ff9aa27b2e85
   hermes-engine: 2af7b7a59128f250adfd86f15aa1d5a2ecd39995
   libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913
   OpenSSL-Universal: ebc357f1e6bc71fa463ccb2fe676756aff50e88c

packages/web/package.json

@@ -28,7 +28,7 @@
     "@babel/plugin-transform-react-jsx": "^7.19.0",
     "@babel/preset-env": "*",
     "@babel/preset-typescript": "^7.18.6",
-    "@lexical/react": "^0.6.5",
+    "@lexical/react": "0.7.5",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.10",
     "@reach/alert": "^0.18.0",
     "@reach/alert-dialog": "^0.18.0",
@@ -84,7 +84,7 @@
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.3.1",
     "jest-environment-jsdom": "^29.3.1",
-    "lexical": "0.6.5",
+    "lexical": "0.7.5",
     "lint-staged": ">=13",
     "mini-css-extract-plugin": "^2.7.2",
     "minimatch": "^5.1.1",