@portabletext/editor 1.1.5 → 1.1.6

package/src/editor/plugins/createWithPortableTextMarkModel.ts

@@ -4,8 +4,8 @@
  *
  */
 
-import {isPortableTextBlock, isPortableTextSpan} from '@portabletext/toolkit'
-import type {PortableTextObject, PortableTextSpan} from '@sanity/types'
+import {isPortableTextBlock} from '@portabletext/toolkit'
+import type {PortableTextObject} from '@sanity/types'
 import {isEqual, uniq} from 'lodash'
 import {Editor, Element, Node, Path, Range, Text, Transforms} from 'slate'
 import type {
@@ -14,6 +14,7 @@ import type {
 } from '../../types/editor'
 import {debugWithName} from '../../utils/debug'
 import {toPortableTextRange} from '../../utils/ranges'
+import {getNextSpan, getPreviousSpan} from '../../utils/sibling-utils'
 import {isChangingRemotely} from '../../utils/withChanges'
 import {isRedoing, isUndoing} from '../../utils/withUndoRedo'
 import type {EditorActor} from '../editor-machine'
@@ -313,32 +314,13 @@ export function createWithPortableTextMarkModel(
           const atTheBeginningOfSpan = selection.anchor.offset === 0
           const atTheEndOfSpan = selection.anchor.offset === span.text.length
 
-          let previousSpan: PortableTextSpan | undefined
-          let nextSpan: PortableTextSpan | undefined
-
-          for (const [child, childPath] of Node.children(editor, blockPath, {
-            reverse: true,
-          })) {
-            if (!editor.isTextSpan(child)) {
-              continue
-            }
-
-            if (Path.isBefore(childPath, spanPath)) {
-              previousSpan = child
-              break
-            }
-          }
-
-          for (const [child, childPath] of Node.children(editor, blockPath)) {
-            if (!editor.isTextSpan(child)) {
-              continue
-            }
-
-            if (Path.isAfter(childPath, spanPath)) {
-              nextSpan = child
-              break
-            }
-          }
+          const previousSpan = getPreviousSpan({editor, blockPath, spanPath})
+          const nextSpan = getNextSpan({editor, blockPath, spanPath})
+          const nextSpanAnnotations =
+            nextSpan?.marks?.filter((mark) => !decorators.includes(mark)) ?? []
+          const spanAnnotations = marks.filter(
+            (mark) => !decorators.includes(mark),
+          )
 
           const previousSpanHasSameAnnotation = previousSpan
             ? previousSpan.marks?.some(
@@ -348,14 +330,9 @@ export function createWithPortableTextMarkModel(
           const previousSpanHasSameMarks = previousSpan
             ? previousSpan.marks?.every((mark) => marks.includes(mark))
             : false
-          const nextSpanHasSameAnnotation = nextSpan
-            ? nextSpan.marks?.some(
-                (mark) => !decorators.includes(mark) && marks.includes(mark),
-              )
-            : false
-          const nextSpanHasSameMarks = nextSpan
-            ? nextSpan.marks?.every((mark) => marks.includes(mark))
-            : false
+          const nextSpanSharesSomeAnnotations = spanAnnotations.some((mark) =>
+            nextSpanAnnotations?.includes(mark),
+          )
 
           if (spanHasAnnotations && !spanIsEmpty) {
             if (atTheBeginningOfSpan) {
@@ -380,105 +357,100 @@ export function createWithPortableTextMarkModel(
             }
 
             if (atTheEndOfSpan) {
-              if (nextSpanHasSameMarks) {
+              if (
+                (nextSpan &&
+                  nextSpanSharesSomeAnnotations &&
+                  nextSpanAnnotations.length < spanAnnotations.length) ||
+                !nextSpanSharesSomeAnnotations
+              ) {
                 Transforms.insertNodes(editor, {
                   _type: 'span',
                   _key: editorActor.getSnapshot().context.keyGenerator(),
                   text: op.text,
                   marks: nextSpan?.marks ?? [],
                 })
-              } else if (nextSpanHasSameAnnotation) {
-                apply(op)
-              } else {
+                return
+              }
+
+              if (!nextSpan) {
                 Transforms.insertNodes(editor, {
                   _type: 'span',
                   _key: editorActor.getSnapshot().context.keyGenerator(),
                   text: op.text,
                   marks: [],
                 })
+                return
               }
-              return
             }
           }
         }
       }
 
       if (op.type === 'remove_text') {
-        const nodeEntry = Array.from(
-          Editor.nodes(editor, {
-            mode: 'lowest',
-            at: {path: op.path, offset: op.offset},
-            match: (n) => n._type === types.span.name,
-            voids: false,
-          }),
-        )[0]
-        const node = nodeEntry[0]
-        const blockEntry = Editor.node(editor, Path.parent(op.path))
-        const block = blockEntry[0]
-
-        if (
-          node &&
-          isPortableTextSpan(node) &&
-          block &&
-          isPortableTextBlock(block)
-        ) {
-          const markDefs = block.markDefs ?? []
-          const nodeHasAnnotations = (node.marks ?? []).some((mark) =>
-            markDefs.find((markDef) => markDef._key === mark),
-          )
-          const deletingPartOfTheNode = op.offset !== 0
-          const deletingFromTheEnd =
-            op.offset + op.text.length === node.text.length
+        const {selection} = editor
 
-          if (
-            nodeHasAnnotations &&
-            deletingPartOfTheNode &&
-            deletingFromTheEnd
-          ) {
-            Editor.withoutNormalizing(editor, () => {
-              Transforms.splitNodes(editor, {
-                match: Text.isText,
+        if (selection && Range.isExpanded(selection)) {
+          const [block, blockPath] = Editor.node(editor, selection, {
+            depth: 1,
+          })
+          const [span, spanPath] =
+            Array.from(
+              Editor.nodes(editor, {
+                mode: 'lowest',
                 at: {path: op.path, offset: op.offset},
-              })
-              Transforms.removeNodes(editor, {at: Path.next(op.path)})
-            })
-
-            editor.onChange()
-            return
-          }
-
-          const deletingAllText = op.offset === 0 && deletingFromTheEnd
-
-          if (nodeHasAnnotations && deletingAllText) {
-            const marksWithoutAnnotationMarks: string[] = (
-              {
-                ...(Editor.marks(editor) || {}),
-              }.marks || []
-            ).filter((mark) => decorators.includes(mark))
+                match: (n) => editor.isTextSpan(n),
+                voids: false,
+              }),
+            )[0] ?? ([undefined, undefined] as const)
 
-            Editor.withoutNormalizing(editor, () => {
-              apply(op)
-              Transforms.setNodes(
-                editor,
-                {marks: marksWithoutAnnotationMarks},
-                {at: op.path},
-              )
-            })
+          if (span && block && isPortableTextBlock(block)) {
+            const markDefs = block.markDefs ?? []
+            const marks = span.marks ?? []
+            const spanHasAnnotations = marks.some((mark) =>
+              markDefs.find((markDef) => markDef._key === mark),
+            )
+            const deletingFromTheEnd =
+              op.offset + op.text.length === span.text.length
+            const deletingAllText = op.offset === 0 && deletingFromTheEnd
 
-            editor.onChange()
-            return
-          }
+            const previousSpan = getPreviousSpan({editor, blockPath, spanPath})
+            const nextSpan = getNextSpan({editor, blockPath, spanPath})
 
-          const nodeHasMarks = node.marks !== undefined && node.marks.length > 0
+            const previousSpanHasSameAnnotation = previousSpan
+              ? previousSpan.marks?.some(
+                  (mark) => !decorators.includes(mark) && marks.includes(mark),
+                )
+              : false
+            const nextSpanHasSameAnnotation = nextSpan
+              ? nextSpan.marks?.some(
+                  (mark) => !decorators.includes(mark) && marks.includes(mark),
+                )
+              : false
+
+            if (
+              spanHasAnnotations &&
+              deletingAllText &&
+              !previousSpanHasSameAnnotation &&
+              !nextSpanHasSameAnnotation
+            ) {
+              const marksWithoutAnnotationMarks: string[] = (
+                {
+                  ...(Editor.marks(editor) || {}),
+                }.marks || []
+              ).filter((mark) => decorators.includes(mark))
 
-          if (nodeHasMarks && deletingAllText) {
-            Editor.withoutNormalizing(editor, () => {
-              apply(op)
-              Transforms.setNodes(editor, {marks: []}, {at: op.path})
-            })
+              Editor.withoutNormalizing(editor, () => {
+                apply(op)
+                Transforms.setNodes(
+                  editor,
+                  {marks: marksWithoutAnnotationMarks},
+                  {at: op.path},
+                )
+              })
 
-            editor.onChange()
-            return
+              editor.onChange()
+              return
+            }
           }
         }
       }

package/src/index.ts

@@ -1,4 +1,13 @@
 export type {Patch} from '@portabletext/patches'
+export type {
+  Behavior,
+  BehaviorActionIntend,
+  BehaviorContext,
+  BehaviorEvent,
+  BehaviorGuard,
+  RaiseBehaviorActionIntend,
+  PickFromUnion,
+} from './editor/behavior/behavior.types'
 export {PortableTextEditable} from './editor/Editable'
 export type {PortableTextEditableProps} from './editor/Editable'
 export {
@@ -8,8 +17,8 @@ export {
   type PatchEvent,
 } from './editor/editor-machine'
 export {usePortableTextEditor} from './editor/hooks/usePortableTextEditor'
-export {defaultKeyGenerator as keyGenerator} from './editor/key-generator'
 export {usePortableTextEditorSelection} from './editor/hooks/usePortableTextEditorSelection'
+export {defaultKeyGenerator as keyGenerator} from './editor/key-generator'
 export {PortableTextEditor} from './editor/PortableTextEditor'
 export type {PortableTextEditorProps} from './editor/PortableTextEditor'
 export * from './types/editor'

package/src/utils/sibling-utils.ts

@@ -0,0 +1,55 @@
+import type {PortableTextSpan} from '@sanity/types'
+import {Node, Path} from 'slate'
+import type {PortableTextSlateEditor} from '../types/editor'
+
+export function getPreviousSpan({
+  editor,
+  blockPath,
+  spanPath,
+}: {
+  editor: PortableTextSlateEditor
+  blockPath: Path
+  spanPath: Path
+}): PortableTextSpan | undefined {
+  let previousSpan: PortableTextSpan | undefined
+
+  for (const [child, childPath] of Node.children(editor, blockPath, {
+    reverse: true,
+  })) {
+    if (!editor.isTextSpan(child)) {
+      continue
+    }
+
+    if (Path.isBefore(childPath, spanPath)) {
+      previousSpan = child
+      break
+    }
+  }
+
+  return previousSpan
+}
+
+export function getNextSpan({
+  editor,
+  blockPath,
+  spanPath,
+}: {
+  editor: PortableTextSlateEditor
+  blockPath: Path
+  spanPath: Path
+}): PortableTextSpan | undefined {
+  let nextSpan: PortableTextSpan | undefined
+
+  for (const [child, childPath] of Node.children(editor, blockPath)) {
+    if (!editor.isTextSpan(child)) {
+      continue
+    }
+
+    if (Path.isAfter(childPath, spanPath)) {
+      nextSpan = child
+      break
+    }
+  }
+
+  return nextSpan
+}