Customize get dirty paths (#5069)

* Move getDirtyPaths to the Editor object to allow for customization * Add changeset for getDirtyPaths customization Co-authored-by: Tom Krenzke <tom@daybreakhealth.com>
ianstormtaylor · Aug 18, 2022 · 46d113f · 46d113f
1 parent 82a10a3
commit 46d113f
Show file tree

Hide file tree

Showing 5 changed files with 77 additions and 68 deletions.
diff --git a/.changeset/spotty-mirrors-matter.md b/.changeset/spotty-mirrors-matter.md
@@ -0,0 +1,5 @@
+---
+'slate': patch
+---
+
+Expose getDirtyPaths method on Editor object to allow for customization
diff --git a/packages/slate/src/create-editor.ts b/packages/slate/src/create-editor.ts
@@ -71,7 +71,7 @@ export const createEditor = (): Editor => {
         dirtyPathKeys = oldDirtyPathKeys
       }
 
-      const newDirtyPaths = getDirtyPaths(op)
+      const newDirtyPaths = editor.getDirtyPaths(op)
       for (const path of newDirtyPaths) {
         add(path)
       }
@@ -296,83 +296,83 @@ export const createEditor = (): Editor => {
         }
       }
     },
-  }
 
-  return editor
-}
+    /**
+     * Get the "dirty" paths generated from an operation.
+     */
+
+    getDirtyPaths: (op: Operation): Path[] => {
+      switch (op.type) {
+        case 'insert_text':
+        case 'remove_text':
+        case 'set_node': {
+          const { path } = op
+          return Path.levels(path)
+        }
 
-/**
- * Get the "dirty" paths generated from an operation.
- */
+        case 'insert_node': {
+          const { node, path } = op
+          const levels = Path.levels(path)
+          const descendants = Text.isText(node)
+            ? []
+            : Array.from(Node.nodes(node), ([, p]) => path.concat(p))
 
-const getDirtyPaths = (op: Operation): Path[] => {
-  switch (op.type) {
-    case 'insert_text':
-    case 'remove_text':
-    case 'set_node': {
-      const { path } = op
-      return Path.levels(path)
-    }
-
-    case 'insert_node': {
-      const { node, path } = op
-      const levels = Path.levels(path)
-      const descendants = Text.isText(node)
-        ? []
-        : Array.from(Node.nodes(node), ([, p]) => path.concat(p))
-
-      return [...levels, ...descendants]
-    }
-
-    case 'merge_node': {
-      const { path } = op
-      const ancestors = Path.ancestors(path)
-      const previousPath = Path.previous(path)
-      return [...ancestors, previousPath]
-    }
-
-    case 'move_node': {
-      const { path, newPath } = op
-
-      if (Path.equals(path, newPath)) {
-        return []
-      }
+          return [...levels, ...descendants]
+        }
 
-      const oldAncestors: Path[] = []
-      const newAncestors: Path[] = []
+        case 'merge_node': {
+          const { path } = op
+          const ancestors = Path.ancestors(path)
+          const previousPath = Path.previous(path)
+          return [...ancestors, previousPath]
+        }
 
-      for (const ancestor of Path.ancestors(path)) {
-        const p = Path.transform(ancestor, op)
-        oldAncestors.push(p!)
-      }
+        case 'move_node': {
+          const { path, newPath } = op
 
-      for (const ancestor of Path.ancestors(newPath)) {
-        const p = Path.transform(ancestor, op)
-        newAncestors.push(p!)
-      }
+          if (Path.equals(path, newPath)) {
+            return []
+          }
+
+          const oldAncestors: Path[] = []
+          const newAncestors: Path[] = []
 
-      const newParent = newAncestors[newAncestors.length - 1]
-      const newIndex = newPath[newPath.length - 1]
-      const resultPath = newParent.concat(newIndex)
+          for (const ancestor of Path.ancestors(path)) {
+            const p = Path.transform(ancestor, op)
+            oldAncestors.push(p!)
+          }
 
-      return [...oldAncestors, ...newAncestors, resultPath]
-    }
+          for (const ancestor of Path.ancestors(newPath)) {
+            const p = Path.transform(ancestor, op)
+            newAncestors.push(p!)
+          }
 
-    case 'remove_node': {
-      const { path } = op
-      const ancestors = Path.ancestors(path)
-      return [...ancestors]
-    }
+          const newParent = newAncestors[newAncestors.length - 1]
+          const newIndex = newPath[newPath.length - 1]
+          const resultPath = newParent.concat(newIndex)
 
-    case 'split_node': {
-      const { path } = op
-      const levels = Path.levels(path)
-      const nextPath = Path.next(path)
-      return [...levels, nextPath]
-    }
+          return [...oldAncestors, ...newAncestors, resultPath]
+        }
 
-    default: {
-      return []
-    }
+        case 'remove_node': {
+          const { path } = op
+          const ancestors = Path.ancestors(path)
+          return [...ancestors]
+        }
+
+        case 'split_node': {
+          const { path } = op
+          const levels = Path.levels(path)
+          const nextPath = Path.next(path)
+          return [...levels, nextPath]
+        }
+
+        default: {
+          return []
+        }
+      }
+    },
   }
+
+  return editor
 }
diff --git a/packages/slate/src/interfaces/editor.ts b/packages/slate/src/interfaces/editor.ts
@@ -77,6 +77,7 @@ export interface BaseEditor {
   insertNode: (node: Node) => void
   insertText: (text: string) => void
   removeMark: (key: string) => void
+  getDirtyPaths: (op: Operation) => Path[]
 }
 
 export type Editor = ExtendedType<'Editor', BaseEditor>
@@ -626,6 +627,7 @@ export const Editor: EditorInterface = {
       typeof value.normalizeNode === 'function' &&
       typeof value.onChange === 'function' &&
       typeof value.removeMark === 'function' &&
+      typeof value.getDirtyPaths === 'function' &&
       (value.marks === null || isPlainObject(value.marks)) &&
       (value.selection === null || Range.isRange(value.selection)) &&
       Node.isNodeList(value.children) &&

diff --git a/packages/slate/test/interfaces/Element/isElement/editor.tsx b/packages/slate/test/interfaces/Element/isElement/editor.tsx
@@ -20,6 +20,7 @@ export const input = {
   normalizeNode() {},
   onChange() {},
   removeMark() {},
+  getDirtyPaths() {},
 }
 export const test = value => {
   return Element.isElement(value)

diff --git a/packages/slate/test/interfaces/Element/isElementList/full-editor.tsx b/packages/slate/test/interfaces/Element/isElementList/full-editor.tsx
@@ -21,6 +21,7 @@ export const input = [
     normalizeNode() {},
     onChange() {},
     removeMark() {},
+    getDirtyPaths() {},
   },
 ]
 export const test = value => {