editor: get rid of @remirror/core-utils

(cherry picked from commit c74f15c86b2f25c9f572ea74f47243e1b52f9c1f)

packages/editor/package.json

@@ -6,7 +6,6 @@
   "dependencies": {
     "@emotion/react": "^11.10.0",
     "@notesnook/theme": "*",
-    "@remirror/core-utils": "^2.0.10",
     "@social-embed/lib": "^0.0.2-next.1",
     "@theme-ui/components": "^0.14.7",
     "@theme-ui/core": "^0.14.7",

packages/editor/src/extensions/code-block/highlighter.ts

@@ -22,15 +22,15 @@ import { Decoration, DecorationSet } from "prosemirror-view";
 import {
   findChildren,
   findParentNodeClosestToPos,
-  NodeWithPos,
+  NodeWithPos
 } from "@tiptap/core";
 import { Root, refractor } from "refractor/lib/core";
 import { RootContent } from "hast";
 import { ReplaceAroundStep, ReplaceStep } from "prosemirror-transform";
 import { toCaretPosition, toCodeLines } from "./code-block";
-import { getChangedNodes } from "@remirror/core-utils";
 import Languages from "./languages.json";
 import { loadLanguage } from "./loader";
+import { getChangedNodes } from "../../utils/prosemirror";
 
 export type ReplaceMergedStep = ReplaceAroundStep | ReplaceStep;
 
@@ -66,7 +66,7 @@ function getHighlightNodes(result: Root) {
 
 function getDecorations({
   block,
-  defaultLanguage,
+  defaultLanguage
 }: {
   block: NodeWithPos;
   defaultLanguage: string | null | undefined;
@@ -87,7 +87,7 @@ function getDecorations({
     const to = from + node.text.length;
     if (node.classes.length) {
       const decoration = Decoration.inline(from, to, {
-        class: node.classes.join(" "),
+        class: node.classes.join(" ")
       });
       decorations.push(decoration);
     }
@@ -104,7 +104,7 @@ type HighlighterState = {
 
 export function HighlighterPlugin({
   name,
-  defaultLanguage,
+  defaultLanguage
 }: {
   name: string;
   defaultLanguage: string | null | undefined;
@@ -168,7 +168,7 @@ export function HighlighterPlugin({
             });
             view.dispatch(tr);
           }
-        },
+        }
       };
     },
     state: {
@@ -189,7 +189,7 @@ export function HighlighterPlugin({
         if (tr.docChanged && !tr.getMeta("selectionUpdate")) {
           const changedBlocks = getChangedNodes(tr, {
             descend: true,
-            predicate: (n) => n.type.name === name,
+            predicate: (n) => n.type.name === name
           });
           if (changedBlocks.length > 0) {
             const updated: Set<number> = new Set();
@@ -201,7 +201,7 @@ export function HighlighterPlugin({
               if (languages[id]) {
                 const newDecorations = getDecorations({
                   block,
-                  defaultLanguage,
+                  defaultLanguage
                 });
                 if (!newDecorations) return;
 
@@ -234,20 +234,20 @@ export function HighlighterPlugin({
 
         return {
           decorations: decorations.map(tr.mapping, tr.doc),
-          languages,
+          languages
         };
-      },
+      }
     },
 
     props: {
       decorations(state) {
         return HIGHLIGHTER_PLUGIN_KEY.getState(state)?.decorations;
-      },
+      }
     },
     appendTransaction(transactions, oldState, newState) {
       const isDocChanged = transactions.some((tr) => tr.docChanged);
       return updateSelection(name, oldState, newState, isDocChanged);
-    },
+    }
   });
 }
 

packages/editor/src/utils/prosemirror.ts

@@ -22,16 +22,18 @@ import {
   findParentNode,
   NodeWithPos,
   Predicate,
-  findParentNodeClosestToPos
+  findParentNodeClosestToPos,
+  getChangedRanges
 } from "@tiptap/core";
 import {
+  NodeRange,
   Node as ProsemirrorNode,
   Mark,
   NodeType,
   ResolvedPos,
   Attrs
 } from "prosemirror-model";
-import { EditorState, Selection } from "prosemirror-state";
+import { EditorState, Selection, Transaction } from "prosemirror-state";
 import { BulletList } from "../extensions/bullet-list";
 import { ListItem } from "../extensions/list-item";
 import { OrderedList } from "../extensions/ordered-list";
@@ -194,3 +196,87 @@ const equalNodeType = (
     node.type === nodeType
   );
 };
+
+export function getChangedNodeRanges(tr: Transaction): NodeRange[] {
+  // The container of the ranges to be returned from this function.
+  const nodeRanges: NodeRange[] = [];
+  const ranges = getChangedRanges(tr);
+
+  for (const range of ranges) {
+    try {
+      const $from = tr.doc.resolve(range.newRange.from);
+      const $to = tr.doc.resolve(range.newRange.to);
+
+      // Find the node range for this provided range.
+      const nodeRange = $from.blockRange($to);
+
+      // Make sure a valid node is available.
+      if (nodeRange) {
+        nodeRanges.push(nodeRange);
+      }
+    } catch {
+      // Changed ranged outside the document
+    }
+  }
+
+  return nodeRanges;
+}
+
+interface GetChangedNodesOptions {
+  /**
+   * Whether to descend into child nodes.
+   *
+   * @defaultValue false
+   */
+  descend?: boolean;
+
+  /**
+   * A predicate test for node which was found. Return `false` to skip the node.
+   *
+   * @param node - the node that was found
+   * @param pos - the pos of that node
+   * @param range - the `NodeRange` which contained this node.
+   */
+  predicate?: (node: ProsemirrorNode, pos: number, range: NodeRange) => boolean;
+}
+
+/**
+ * Get all the changed nodes from the provided transaction.
+ *
+ * The following example will give us all the text nodes in the provided
+ * transaction.
+ *
+ * ```ts
+ * import { getChangedNodes } from 'remirror/core';
+ *
+ * const changedTextNodes = getChangeNodes(tr, { descend: true, predicate: (node) => node.isText });
+ * ```
+ */
+export function getChangedNodes(
+  tr: Transaction,
+  options: GetChangedNodesOptions = {}
+): NodeWithPos[] {
+  const { descend = false, predicate } = options;
+  const nodeRange = getChangedNodeRanges(tr);
+
+  // The container for the nodes which have been added..
+  const nodes: NodeWithPos[] = [];
+
+  for (const range of nodeRange) {
+    const { start, end } = range;
+
+    // Find all the nodes between the provided node range.
+    tr.doc.nodesBetween(start, end, (node, pos) => {
+      // Check wether this is a node that should be added.
+      const shouldAdd = predicate?.(node, pos, range) ?? true;
+
+      if (shouldAdd) {
+        nodes.push({ node, pos });
+      }
+
+      return descend;
+    });
+  }
+
+  return nodes;
+}