@portabletext/editor 1.20.0 → 1.21.1

package/src/editor/editor-machine.ts

@@ -12,21 +12,23 @@ import {
 } from 'xstate'
 import {performAction} from '../behavior-actions/behavior.actions'
 import {coreBehaviors} from '../behaviors/behavior.core'
-import type {
-  Behavior,
-  BehaviorAction,
-  NativeBehaviorEvent,
-  SyntheticBehaviorEvent,
+import {
+  isCustomBehaviorEvent,
+  type Behavior,
+  type BehaviorAction,
+  type CustomBehaviorEvent,
+  type NativeBehaviorEvent,
+  type SyntheticBehaviorEvent,
 } from '../behaviors/behavior.types'
+import {toPortableTextRange} from '../internal-utils/ranges'
+import {fromSlateValue} from '../internal-utils/values'
+import {KEY_TO_VALUE_ELEMENT} from '../internal-utils/weakMaps'
 import type {OmitFromUnion, PickFromUnion} from '../type-utils'
 import type {
   EditorSelection,
   InvalidValueResolution,
   PortableTextSlateEditor,
 } from '../types/editor'
-import {toPortableTextRange} from '../utils/ranges'
-import {fromSlateValue} from '../utils/values'
-import {KEY_TO_VALUE_ELEMENT} from '../utils/weakMaps'
 import type {EditorSchema} from './define-schema'
 import type {EditorContext} from './editor-snapshot'
 import {getActiveDecorators} from './get-active-decorators'
@@ -77,8 +79,16 @@ export type InternalEditorEvent =
       type: 'behavior event'
       behaviorEvent: SyntheticBehaviorEvent | NativeBehaviorEvent
       editor: PortableTextSlateEditor
+      defaultActionCallback?: () => void
+      nativeEvent?: {preventDefault: () => void}
+    }
+  | {
+      type: 'custom behavior event'
+      behaviorEvent: CustomBehaviorEvent
+      editor: PortableTextSlateEditor
       nativeEvent?: {preventDefault: () => void}
     }
+  | CustomBehaviorEvent
   | {
       type: 'add behavior'
       behavior: Behavior
@@ -182,6 +192,10 @@ export type InternalEditorEmittedEvent =
       | 'focus'
       | 'style.toggle'
     >
+  | {
+      type: 'custom.*'
+      event: CustomBehaviorEvent
+    }
 
 /**
  * @internal
@@ -264,9 +278,10 @@ export const editorMachine = setup({
       pendingEvents: [],
     }),
     'handle behavior event': enqueueActions(({context, event, enqueue}) => {
-      assertEvent(event, ['behavior event'])
+      assertEvent(event, ['behavior event', 'custom behavior event'])
 
       const defaultAction =
+        event.type === 'custom behavior event' ||
         event.behaviorEvent.type === 'copy' ||
         event.behaviorEvent.type === 'key.down' ||
         event.behaviorEvent.type === 'key.up' ||
@@ -276,22 +291,51 @@ export const editorMachine = setup({
               ...event.behaviorEvent,
               editor: event.editor,
             } satisfies BehaviorAction)
+      const defaultActionCallback =
+        event.type === 'behavior event'
+          ? event.defaultActionCallback
+          : undefined
 
       const eventBehaviors = [...context.behaviors.values()].filter(
         (behavior) => behavior.on === event.behaviorEvent.type,
       )
 
       if (eventBehaviors.length === 0) {
+        if (defaultActionCallback) {
+          withApplyingBehaviorActions(event.editor, () => {
+            Editor.withoutNormalizing(event.editor, () => {
+              try {
+                defaultActionCallback()
+              } catch (error) {
+                console.error(
+                  new Error(
+                    `Performing action "${event.behaviorEvent.type}" failed due to: ${error.message}`,
+                  ),
+                )
+              }
+            })
+          })
+          return
+        }
+
         if (!defaultAction) {
           return
         }
 
         withApplyingBehaviorActions(event.editor, () => {
           Editor.withoutNormalizing(event.editor, () => {
-            performAction({
-              context,
-              action: defaultAction,
-            })
+            try {
+              performAction({
+                context,
+                action: defaultAction,
+              })
+            } catch (error) {
+              console.error(
+                new Error(
+                  `Performing action "${defaultAction.type}" as a result of "${event.behaviorEvent.type}" failed due to: ${error.message}`,
+                ),
+              )
+            }
           })
         })
         event.editor.onChange()
@@ -353,11 +397,19 @@ export const editorMachine = setup({
             Editor.withoutNormalizing(event.editor, () => {
               for (const actionIntend of actionIntends) {
                 if (actionIntend.type === 'raise') {
-                  enqueue.raise({
-                    type: 'behavior event',
-                    behaviorEvent: actionIntend.event,
-                    editor: event.editor,
-                  })
+                  if (isCustomBehaviorEvent(actionIntend.event)) {
+                    enqueue.raise({
+                      type: 'custom behavior event',
+                      behaviorEvent: actionIntend.event as CustomBehaviorEvent,
+                      editor: event.editor,
+                    })
+                  } else {
+                    enqueue.raise({
+                      type: 'behavior event',
+                      behaviorEvent: actionIntend.event,
+                      editor: event.editor,
+                    })
+                  }
                   continue
                 }
 
@@ -366,7 +418,16 @@ export const editorMachine = setup({
                   editor: event.editor,
                 }
 
-                performAction({context, action})
+                try {
+                  performAction({context, action})
+                } catch (error) {
+                  console.error(
+                    new Error(
+                      `Performing action "${action.type}" as a result of "${event.behaviorEvent.type}" failed due to: ${error.message}`,
+                    ),
+                  )
+                  break
+                }
               }
             })
           })
@@ -380,16 +441,41 @@ export const editorMachine = setup({
       }
 
       if (!behaviorOverwritten) {
+        if (defaultActionCallback) {
+          withApplyingBehaviorActions(event.editor, () => {
+            Editor.withoutNormalizing(event.editor, () => {
+              try {
+                defaultActionCallback()
+              } catch (error) {
+                console.error(
+                  new Error(
+                    `Performing "${event.behaviorEvent.type}" failed due to: ${error.message}`,
+                  ),
+                )
+              }
+            })
+          })
+          return
+        }
+
         if (!defaultAction) {
           return
         }
 
         withApplyingBehaviorActions(event.editor, () => {
           Editor.withoutNormalizing(event.editor, () => {
-            performAction({
-              context,
-              action: defaultAction,
-            })
+            try {
+              performAction({
+                context,
+                action: defaultAction,
+              })
+            } catch (error) {
+              console.error(
+                new Error(
+                  `Performing action "${defaultAction.type}" as a result of "${event.behaviorEvent.type}" failed due to: ${error.message}`,
+                ),
+              )
+            }
           })
         })
         event.editor.onChange()
@@ -475,12 +561,18 @@ export const editorMachine = setup({
             'behavior event': {
               actions: 'handle behavior event',
             },
+            'custom behavior event': {
+              actions: 'handle behavior event',
+            },
             'annotation.*': {
               actions: emit(({event}) => event),
             },
             'blur': {
               actions: emit(({event}) => event),
             },
+            'custom.*': {
+              actions: emit(({event}) => ({type: 'custom.*', event})),
+            },
             'decorator.*': {
               actions: emit(({event}) => event),
             },

package/src/editor/get-value.ts

@@ -1,6 +1,6 @@
+import {fromSlateValue} from '../internal-utils/values'
+import {KEY_TO_VALUE_ELEMENT} from '../internal-utils/weakMaps'
 import type {PortableTextSlateEditor} from '../types/editor'
-import {fromSlateValue} from '../utils/values'
-import {KEY_TO_VALUE_ELEMENT} from '../utils/weakMaps'
 import type {EditorActor} from './editor-machine'
 
 export function getValue({

package/src/editor/hooks/usePortableTextEditorSelection.tsx

@@ -5,8 +5,8 @@ import {
   useEffect,
   useState,
 } from 'react'
+import {debugWithName} from '../../internal-utils/debug'
 import type {EditorSelection} from '../../types/editor'
-import {debugWithName} from '../../utils/debug'
 import type {EditorActor} from '../editor-machine'
 
 /**

package/src/editor/mutation-machine.ts

@@ -2,9 +2,9 @@ import type {Patch} from '@portabletext/patches'
 import type {PortableTextBlock} from '@sanity/types'
 import {Editor} from 'slate'
 import {assign, emit, setup} from 'xstate'
+import {fromSlateValue} from '../internal-utils/values'
+import {KEY_TO_VALUE_ELEMENT} from '../internal-utils/weakMaps'
 import type {PortableTextSlateEditor} from '../types/editor'
-import {fromSlateValue} from '../utils/values'
-import {KEY_TO_VALUE_ELEMENT} from '../utils/weakMaps'
 import type {EditorSchema} from './define-schema'
 
 const FLUSH_PATCHES_THROTTLED_MS = process.env.NODE_ENV === 'test' ? 500 : 1000

package/src/editor/plugins/create-with-event-listeners.ts

@@ -1,7 +1,7 @@
 import {Editor} from 'slate'
-import {toPortableTextRange} from '../../utils/ranges'
-import {fromSlateValue} from '../../utils/values'
-import {KEY_TO_VALUE_ELEMENT} from '../../utils/weakMaps'
+import {toPortableTextRange} from '../../internal-utils/ranges'
+import {fromSlateValue} from '../../internal-utils/values'
+import {KEY_TO_VALUE_ELEMENT} from '../../internal-utils/weakMaps'
 import type {EditorActor} from '../editor-machine'
 import {isApplyingBehaviorActions} from '../with-applying-behavior-actions'
 
@@ -49,6 +49,14 @@ export function createWithEventListeners(
             })
             break
           }
+          case 'custom.*': {
+            editorActor.send({
+              type: 'custom behavior event',
+              behaviorEvent: event.event,
+              editor,
+            })
+            break
+          }
           case 'decorator.toggle': {
             editorActor.send({
               type: 'behavior event',
@@ -134,9 +142,21 @@ export function createWithEventListeners(
       }
     })
 
-    const {select} = editor
+    const {
+      deleteBackward,
+      deleteForward,
+      insertBreak,
+      insertSoftBreak,
+      insertText,
+      select,
+    } = editor
 
     editor.deleteBackward = (unit) => {
+      if (isApplyingBehaviorActions(editor)) {
+        deleteBackward(unit)
+        return
+      }
+
       editorActor.send({
         type: 'behavior event',
         behaviorEvent: {
@@ -149,6 +169,11 @@ export function createWithEventListeners(
     }
 
     editor.deleteForward = (unit) => {
+      if (isApplyingBehaviorActions(editor)) {
+        deleteForward(unit)
+        return
+      }
+
       editorActor.send({
         type: 'behavior event',
         behaviorEvent: {
@@ -161,6 +186,11 @@ export function createWithEventListeners(
     }
 
     editor.insertBreak = () => {
+      if (isApplyingBehaviorActions(editor)) {
+        insertBreak()
+        return
+      }
+
       editorActor.send({
         type: 'behavior event',
         behaviorEvent: {
@@ -172,6 +202,11 @@ export function createWithEventListeners(
     }
 
     editor.insertSoftBreak = () => {
+      if (isApplyingBehaviorActions(editor)) {
+        insertSoftBreak()
+        return
+      }
+
       editorActor.send({
         type: 'behavior event',
         behaviorEvent: {
@@ -183,6 +218,11 @@ export function createWithEventListeners(
     }
 
     editor.insertText = (text, options) => {
+      if (isApplyingBehaviorActions(editor)) {
+        insertText(text, options)
+        return
+      }
+
       editorActor.send({
         type: 'behavior event',
         behaviorEvent: {
@@ -191,6 +231,9 @@ export function createWithEventListeners(
           options,
         },
         editor,
+        defaultActionCallback: () => {
+          insertText(text, options)
+        },
       })
       return
     }
@@ -218,6 +261,9 @@ export function createWithEventListeners(
           ),
         },
         editor,
+        defaultActionCallback: () => {
+          select(location)
+        },
       })
       return
     }

package/src/editor/plugins/createWithEditableAPI.ts

@@ -21,19 +21,19 @@ import {ReactEditor} from 'slate-react'
 import {isListItemActive} from '../../behavior-actions/behavior.action.list-item'
 import {isStyleActive} from '../../behavior-actions/behavior.action.style'
 import type {BehaviorActionImplementation} from '../../behavior-actions/behavior.actions'
+import {debugWithName} from '../../internal-utils/debug'
+import {toPortableTextRange, toSlateRange} from '../../internal-utils/ranges'
+import {fromSlateValue, toSlateValue} from '../../internal-utils/values'
+import {
+  KEY_TO_VALUE_ELEMENT,
+  SLATE_TO_PORTABLE_TEXT_RANGE,
+} from '../../internal-utils/weakMaps'
 import type {
   EditableAPI,
   EditableAPIDeleteOptions,
   EditorSelection,
   PortableTextSlateEditor,
 } from '../../types/editor'
-import {debugWithName} from '../../utils/debug'
-import {toPortableTextRange, toSlateRange} from '../../utils/ranges'
-import {fromSlateValue, toSlateValue} from '../../utils/values'
-import {
-  KEY_TO_VALUE_ELEMENT,
-  SLATE_TO_PORTABLE_TEXT_RANGE,
-} from '../../utils/weakMaps'
 import type {EditorActor} from '../editor-machine'
 import {isDecoratorActive} from './createWithPortableTextMarkModel'
 

package/src/editor/plugins/createWithHotKeys.ts

@@ -1,9 +1,9 @@
 import type {KeyboardEvent} from 'react'
 import type {ReactEditor} from 'slate-react'
+import {debugWithName} from '../../internal-utils/debug'
+import {isHotkey} from '../../internal-utils/is-hotkey'
 import type {PortableTextSlateEditor} from '../../types/editor'
 import type {HotkeyOptions} from '../../types/options'
-import {debugWithName} from '../../utils/debug'
-import {isHotkey} from '../../utils/is-hotkey'
 import type {EditorActor} from '../editor-machine'
 import type {PortableTextEditor} from '../PortableTextEditor'
 

package/src/editor/plugins/createWithInsertData.ts

@@ -3,17 +3,17 @@ import type {PortableTextBlock, PortableTextChild} from '@sanity/types'
 import {isEqual, uniq} from 'lodash'
 import {Editor, Range, Transforms, type Descendant, type Node} from 'slate'
 import {ReactEditor} from 'slate-react'
-import type {
-  PortableTextMemberSchemaTypes,
-  PortableTextSlateEditor,
-} from '../../types/editor'
-import {debugWithName} from '../../utils/debug'
-import {validateValue} from '../../utils/validateValue'
+import {debugWithName} from '../../internal-utils/debug'
+import {validateValue} from '../../internal-utils/validateValue'
 import {
   fromSlateValue,
   isEqualToEmptyEditor,
   toSlateValue,
-} from '../../utils/values'
+} from '../../internal-utils/values'
+import type {
+  PortableTextMemberSchemaTypes,
+  PortableTextSlateEditor,
+} from '../../types/editor'
 import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withInsertData')

package/src/editor/plugins/createWithMaxBlocks.ts

@@ -1,6 +1,6 @@
+import {isChangingRemotely} from '../../internal-utils/withChanges'
+import {isRedoing, isUndoing} from '../../internal-utils/withUndoRedo'
 import type {PortableTextSlateEditor} from '../../types/editor'
-import {isChangingRemotely} from '../../utils/withChanges'
-import {isRedoing, isUndoing} from '../../utils/withUndoRedo'
 import type {EditorActor} from '../editor-machine'
 
 /**

package/src/editor/plugins/createWithObjectKeys.ts

@@ -1,10 +1,10 @@
 import {Editor, Element, Node, Transforms} from 'slate'
+import {isChangingRemotely} from '../../internal-utils/withChanges'
+import {isRedoing, isUndoing} from '../../internal-utils/withUndoRedo'
 import type {
   PortableTextMemberSchemaTypes,
   PortableTextSlateEditor,
 } from '../../types/editor'
-import {isChangingRemotely} from '../../utils/withChanges'
-import {isRedoing, isUndoing} from '../../utils/withUndoRedo'
 import type {EditorActor} from '../editor-machine'
 
 /**

package/src/editor/plugins/createWithPatches.ts

@@ -12,23 +12,23 @@ import {
   type SetNodeOperation,
   type SplitNodeOperation,
 } from 'slate'
-import type {
-  PortableTextMemberSchemaTypes,
-  PortableTextSlateEditor,
-} from '../../types/editor'
-import {createApplyPatch} from '../../utils/applyPatch'
-import {debugWithName} from '../../utils/debug'
-import {fromSlateValue, isEqualToEmptyEditor} from '../../utils/values'
+import {createApplyPatch} from '../../internal-utils/applyPatch'
+import {debugWithName} from '../../internal-utils/debug'
+import {fromSlateValue, isEqualToEmptyEditor} from '../../internal-utils/values'
 import {
   IS_PROCESSING_REMOTE_CHANGES,
   KEY_TO_VALUE_ELEMENT,
-} from '../../utils/weakMaps'
-import {withRemoteChanges} from '../../utils/withChanges'
+} from '../../internal-utils/weakMaps'
+import {withRemoteChanges} from '../../internal-utils/withChanges'
 import {
   isPatching,
   PATCHING,
   withoutPatching,
-} from '../../utils/withoutPatching'
+} from '../../internal-utils/withoutPatching'
+import type {
+  PortableTextMemberSchemaTypes,
+  PortableTextSlateEditor,
+} from '../../types/editor'
 import type {EditorActor} from '../editor-machine'
 import {withoutSaving} from './createWithUndoRedo'
 

package/src/editor/plugins/createWithPlaceholderBlock.ts

@@ -1,9 +1,9 @@
 import {Editor, Path} from 'slate'
+import {debugWithName} from '../../internal-utils/debug'
+import {isChangingRemotely} from '../../internal-utils/withChanges'
+import {isRedoing, isUndoing} from '../../internal-utils/withUndoRedo'
 import type {PortableTextSlateEditor} from '../../types/editor'
 import type {SlateTextBlock, VoidElement} from '../../types/slate'
-import {debugWithName} from '../../utils/debug'
-import {isChangingRemotely} from '../../utils/withChanges'
-import {isRedoing, isUndoing} from '../../utils/withUndoRedo'
 import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withPlaceholderBlock')

package/src/editor/plugins/createWithPortableTextBlockStyle.ts

@@ -1,9 +1,9 @@
 import {Editor, Path, Text as SlateText, Transforms} from 'slate'
+import {debugWithName} from '../../internal-utils/debug'
 import type {
   PortableTextMemberSchemaTypes,
   PortableTextSlateEditor,
 } from '../../types/editor'
-import {debugWithName} from '../../utils/debug'
 import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withPortableTextBlockStyle')

package/src/editor/plugins/createWithPortableTextMarkModel.ts

@@ -9,14 +9,14 @@ import type {PortableTextObject, PortableTextSpan} from '@sanity/types'
 import {isEqual, uniq} from 'lodash'
 import {Editor, Element, Node, Path, Range, Text, Transforms} from 'slate'
 import type {BehaviorActionImplementation} from '../../behavior-actions/behavior.actions'
+import {debugWithName} from '../../internal-utils/debug'
+import {getNextSpan, getPreviousSpan} from '../../internal-utils/sibling-utils'
+import {isChangingRemotely} from '../../internal-utils/withChanges'
+import {isRedoing, isUndoing} from '../../internal-utils/withUndoRedo'
 import type {
   PortableTextMemberSchemaTypes,
   PortableTextSlateEditor,
 } from '../../types/editor'
-import {debugWithName} from '../../utils/debug'
-import {getNextSpan, getPreviousSpan} from '../../utils/sibling-utils'
-import {isChangingRemotely} from '../../utils/withChanges'
-import {isRedoing, isUndoing} from '../../utils/withUndoRedo'
 import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withPortableTextMarkModel')

package/src/editor/plugins/createWithPortableTextSelections.ts

@@ -1,15 +1,15 @@
 import type {BaseRange} from 'slate'
+import {debugWithName} from '../../internal-utils/debug'
+import {
+  toPortableTextRange,
+  type ObjectWithKeyAndType,
+} from '../../internal-utils/ranges'
+import {SLATE_TO_PORTABLE_TEXT_RANGE} from '../../internal-utils/weakMaps'
 import type {
   EditorSelection,
   PortableTextMemberSchemaTypes,
   PortableTextSlateEditor,
 } from '../../types/editor'
-import {debugWithName} from '../../utils/debug'
-import {
-  toPortableTextRange,
-  type ObjectWithKeyAndType,
-} from '../../utils/ranges'
-import {SLATE_TO_PORTABLE_TEXT_RANGE} from '../../utils/weakMaps'
 import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withPortableTextSelections')

package/src/editor/plugins/createWithSchemaTypes.ts

@@ -7,11 +7,11 @@ import {
   type PortableTextTextBlock,
 } from '@sanity/types'
 import {Transforms, type Element} from 'slate'
+import {debugWithName} from '../../internal-utils/debug'
 import type {
   PortableTextMemberSchemaTypes,
   PortableTextSlateEditor,
 } from '../../types/editor'
-import {debugWithName} from '../../utils/debug'
 import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withSchemaTypes')

package/src/editor/plugins/createWithUndoRedo.ts

@@ -20,10 +20,9 @@ import {
   type Descendant,
   type SelectionOperation,
 } from 'slate'
-import type {PortableTextSlateEditor} from '../../types/editor'
-import {debugWithName} from '../../utils/debug'
-import {fromSlateValue} from '../../utils/values'
-import {isChangingRemotely} from '../../utils/withChanges'
+import {debugWithName} from '../../internal-utils/debug'
+import {fromSlateValue} from '../../internal-utils/values'
+import {isChangingRemotely} from '../../internal-utils/withChanges'
 import {
   isRedoing,
   isUndoing,
@@ -31,7 +30,8 @@ import {
   setIsUndoing,
   withRedoing,
   withUndoing,
-} from '../../utils/withUndoRedo'
+} from '../../internal-utils/withUndoRedo'
+import type {PortableTextSlateEditor} from '../../types/editor'
 import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withUndoRedo')

package/src/editor/plugins/createWithUtils.ts

@@ -1,10 +1,10 @@
 import {Editor, Range, Text, Transforms} from 'slate'
+import {debugWithName} from '../../internal-utils/debug'
+import {toSlateValue} from '../../internal-utils/values'
 import type {
   PortableTextMemberSchemaTypes,
   PortableTextSlateEditor,
 } from '../../types/editor'
-import {debugWithName} from '../../utils/debug'
-import {toSlateValue} from '../../utils/values'
 import type {EditorActor} from '../editor-machine'
 
 const debug = debugWithName('plugin:withUtils')

package/src/editor/plugins/with-plugins.ts

@@ -1,6 +1,6 @@
 import type {BaseOperation, Editor, Node, NodeEntry} from 'slate'
+import {createOperationToPatches} from '../../internal-utils/operationToPatches'
 import type {PortableTextSlateEditor} from '../../types/editor'
-import {createOperationToPatches} from '../../utils/operationToPatches'
 import type {EditorActor} from '../editor-machine'
 import {createWithEventListeners} from './create-with-event-listeners'
 import {createWithMaxBlocks} from './createWithMaxBlocks'

package/src/editor/sync-machine.ts

@@ -11,16 +11,19 @@ import {
   type AnyEventObject,
   type CallbackLogicFunction,
 } from 'xstate'
+import {debugWithName} from '../internal-utils/debug'
+import {validateValue} from '../internal-utils/validateValue'
+import {toSlateValue, VOID_CHILD_KEY} from '../internal-utils/values'
+import {
+  isChangingRemotely,
+  withRemoteChanges,
+} from '../internal-utils/withChanges'
+import {withoutPatching} from '../internal-utils/withoutPatching'
 import type {PickFromUnion} from '../type-utils'
 import type {
   InvalidValueResolution,
   PortableTextSlateEditor,
 } from '../types/editor'
-import {debugWithName} from '../utils/debug'
-import {validateValue} from '../utils/validateValue'
-import {toSlateValue, VOID_CHILD_KEY} from '../utils/values'
-import {isChangingRemotely, withRemoteChanges} from '../utils/withChanges'
-import {withoutPatching} from '../utils/withoutPatching'
 import type {EditorSchema} from './define-schema'
 import {withoutSaving} from './plugins/createWithUndoRedo'