@portabletext/editor 1.48.13 → 1.48.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portabletext/editor",
-  "version": "1.48.13",
+  "version": "1.48.15",
   "description": "Portable Text Editor made in React",
   "keywords": [
     "sanity",

package/src/behaviors/behavior.abstract.keyboard.ts

@@ -0,0 +1,16 @@
+import {keyIs} from '../internal-utils/key-is'
+import {raise} from './behavior.types.action'
+import {defineBehavior} from './behavior.types.behavior'
+
+export const abstractKeyboardBehaviors = [
+  /**
+   * On WebKit, Shift+Enter results in an `insertParagraph` input event rather
+   * than an `insertLineBreak` input event. This Behavior makes sure we catch
+   * that `keyboard.keydown` event beforehand and raise an `insert.soft break` manually.
+   */
+  defineBehavior({
+    on: 'keyboard.keydown',
+    guard: ({event}) => keyIs.lineBreak(event.originEvent),
+    actions: [() => [raise({type: 'insert.soft break'})]],
+  }),
+]

package/src/behaviors/{behavior.default.ts → behavior.abstract.ts}

@@ -7,12 +7,12 @@ import {abstractAnnotationBehaviors} from './behavior.abstract.annotation'
 import {abstractDecoratorBehaviors} from './behavior.abstract.decorator'
 import {abstractDeleteBehaviors} from './behavior.abstract.delete'
 import {abstractInsertBehaviors} from './behavior.abstract.insert'
+import {abstractKeyboardBehaviors} from './behavior.abstract.keyboard'
 import {abstractListItemBehaviors} from './behavior.abstract.list-item'
 import {abstractMoveBehaviors} from './behavior.abstract.move'
 import {abstractSelectBehaviors} from './behavior.abstract.select'
 import {abstractSplitBehaviors} from './behavior.abstract.split'
 import {abstractStyleBehaviors} from './behavior.abstract.style'
-import {raiseInsertSoftBreak} from './behavior.default.raise-soft-break'
 import {raise} from './behavior.types.action'
 import {defineBehavior} from './behavior.types.behavior'
 
@@ -102,7 +102,7 @@ const raiseSerializationSuccessOrFailure = defineBehavior({
   ],
 })
 
-export const defaultBehaviors = [
+export const abstractBehaviors = [
   defineBehavior({
     on: 'clipboard.copy',
     guard: ({snapshot}) => {
@@ -451,6 +451,7 @@ export const defaultBehaviors = [
   ...abstractDecoratorBehaviors,
   ...abstractDeleteBehaviors,
   ...abstractInsertBehaviors,
+  ...abstractKeyboardBehaviors,
   ...abstractListItemBehaviors,
   ...abstractMoveBehaviors,
   ...abstractStyleBehaviors,
@@ -458,5 +459,4 @@ export const defaultBehaviors = [
   ...abstractSplitBehaviors,
   raiseDeserializationSuccessOrFailure,
   raiseSerializationSuccessOrFailure,
-  raiseInsertSoftBreak,
 ]

package/src/behaviors/behavior.config.ts

@@ -0,0 +1,7 @@
+import type {EditorPriority} from '../priority/priority.types'
+import type {Behavior} from './behavior.types.behavior'
+
+export type BehaviorConfig = {
+  behavior: Behavior
+  priority: EditorPriority
+}

package/src/behaviors/behavior.core.ts

@@ -1,3 +1,4 @@
+import {corePriority} from '../priority/priority.core'
 import {coreAnnotationBehaviors} from './behavior.core.annotations'
 import {coreBlockObjectBehaviors} from './behavior.core.block-objects'
 import {coreDecoratorBehaviors} from './behavior.core.decorators'
@@ -5,10 +6,7 @@ import {coreDndBehaviors} from './behavior.core.dnd'
 import {coreInsertBreakBehaviors} from './behavior.core.insert-break'
 import {coreListBehaviors} from './behavior.core.lists'
 
-/**
- * @beta
- */
-export const coreBehaviors = [
+export const coreBehaviorsConfig = [
   coreAnnotationBehaviors.addAnnotationOnCollapsedSelection,
   coreDecoratorBehaviors.strongShortcut,
   coreDecoratorBehaviors.emShortcut,
@@ -31,4 +29,7 @@ export const coreBehaviors = [
   coreInsertBreakBehaviors.breakingAtTheStartOfTextBlock,
   coreInsertBreakBehaviors.breakingEntireDocument,
   coreInsertBreakBehaviors.breakingEntireBlocks,
-]
+].map((behavior) => ({
+  behavior,
+  priority: corePriority,
+}))

package/src/behaviors/behavior.perform-event.ts

@@ -1,13 +1,11 @@
-import {performAction} from '../behavior-actions/behavior.actions'
 import type {EditorSchema} from '../editor/editor-schema'
 import type {EditorSnapshot} from '../editor/editor-snapshot'
-import {
-  withApplyingBehaviorActions,
-  withUndoStep,
-} from '../editor/with-applying-behavior-actions'
+import {withApplyingBehaviorOperations} from '../editor/with-applying-behavior-operations'
+import {withUndoStep} from '../editor/with-undo-step'
 import {debugWithName} from '../internal-utils/debug'
+import {performOperation} from '../operations/behavior.operations'
 import type {PortableTextSlateEditor} from '../types/editor'
-import {defaultBehaviors} from './behavior.default'
+import {abstractBehaviors} from './behavior.abstract'
 import type {BehaviorAction} from './behavior.types.action'
 import type {Behavior} from './behavior.types.behavior'
 import {
@@ -59,7 +57,7 @@ export function performEvent({
 
   const eventBehaviors = [
     ...remainingEventBehaviors,
-    ...defaultBehaviors,
+    ...abstractBehaviors,
   ].filter((behavior) => {
     // Catches all events
     if (behavior.on === '*') {
@@ -100,30 +98,19 @@ export function performEvent({
   if (eventBehaviors.length === 0 && isSyntheticBehaviorEvent(event)) {
     nativeEvent?.preventDefault()
 
-    withApplyingBehaviorActions(editor, () => {
-      try {
-        debug(
-          `(execute:${eventCategory(event)})`,
-          JSON.stringify(event, null, 2),
-        )
-
-        performAction({
-          context: {
-            keyGenerator,
-            schema,
-          },
-          action: {
-            ...event,
-            editor,
-          },
-        })
-      } catch (error) {
-        console.error(
-          new Error(
-            `Executing "${event.type}" failed due to: ${error.message}`,
-          ),
-        )
-      }
+    withApplyingBehaviorOperations(editor, () => {
+      debug(`(execute:${eventCategory(event)})`, JSON.stringify(event, null, 2))
+
+      performOperation({
+        context: {
+          keyGenerator,
+          schema,
+        },
+        operation: {
+          ...event,
+          editor,
+        },
+      })
     })
 
     editor.onChange()
@@ -339,27 +326,16 @@ export function performEvent({
   if (!defaultBehaviorOverwritten && isSyntheticBehaviorEvent(event)) {
     nativeEvent?.preventDefault()
 
-    withApplyingBehaviorActions(editor, () => {
-      try {
-        debug(
-          `(execute:${eventCategory(event)})`,
-          JSON.stringify(event, null, 2),
-        )
+    withApplyingBehaviorOperations(editor, () => {
+      debug(`(execute:${eventCategory(event)})`, JSON.stringify(event, null, 2))
 
-        performAction({
-          context: {keyGenerator, schema},
-          action: {
-            ...event,
-            editor,
-          },
-        })
-      } catch (error) {
-        console.error(
-          new Error(
-            `Executing "${event.type}" failed due to: ${error.message}`,
-          ),
-        )
-      }
+      performOperation({
+        context: {keyGenerator, schema},
+        operation: {
+          ...event,
+          editor,
+        },
+      })
     })
 
     editor.onChange()

package/src/behaviors/behavior.types.action.ts

@@ -1,8 +1,6 @@
 import type {EditorSnapshot} from '../editor/editor-snapshot'
-import type {OmitFromUnion, PickFromUnion} from '../type-utils'
-import type {PortableTextSlateEditor} from '../types/editor'
+import type {PickFromUnion} from '../type-utils'
 import type {
-  AbstractBehaviorEventType,
   CustomBehaviorEvent,
   NativeBehaviorEvent,
   SyntheticBehaviorEvent,
@@ -75,11 +73,3 @@ export type BehaviorActionSet<TBehaviorEvent, TGuardResponse> = (
   },
   guardResponse: TGuardResponse,
 ) => Array<BehaviorAction>
-
-export type InternalBehaviorAction = OmitFromUnion<
-  SyntheticBehaviorEvent,
-  'type',
-  AbstractBehaviorEventType
-> & {
-  editor: PortableTextSlateEditor
-}

package/src/editor/PortableTextEditor.tsx

@@ -16,10 +16,10 @@ import {Subject} from 'rxjs'
 import {Slate} from 'slate-react'
 import {useEffectEvent} from 'use-effect-event'
 import {createActor} from 'xstate'
-import type {AddedAnnotationPaths} from '../behavior-actions/behavior.action.annotation.add'
 import {createCoreConverters} from '../converters/converters.core'
 import {debugWithName} from '../internal-utils/debug'
 import {compileType} from '../internal-utils/schema'
+import type {AddedAnnotationPaths} from '../operations/behavior.operation.annotation.add'
 import type {
   EditableAPI,
   EditableAPIDeleteOptions,

package/src/editor/components/Element.tsx

@@ -26,6 +26,8 @@ import {debugWithName} from '../../internal-utils/debug'
 import type {EventPositionBlock} from '../../internal-utils/event-position'
 import {fromSlateValue} from '../../internal-utils/values'
 import {KEY_TO_VALUE_ELEMENT} from '../../internal-utils/weakMaps'
+import {corePriority} from '../../priority/priority.core'
+import {createEditorPriority} from '../../priority/priority.types'
 import * as selectors from '../../selectors'
 import type {
   BlockRenderProps,
@@ -150,15 +152,27 @@ export const Element: FunctionComponent<ElementProps> = ({
       ],
     })
 
+    const priority = createEditorPriority({
+      reference: {
+        priority: corePriority,
+        importance: 'lower',
+      },
+    })
+
+    const behaviorConfig = {
+      behavior,
+      priority,
+    }
+
     editorActor.send({
       type: 'add behavior',
-      behavior,
+      behaviorConfig,
     })
 
     return () => {
       editorActor.send({
         type: 'remove behavior',
-        behavior,
+        behaviorConfig,
       })
     }
   }, [editorActor, element._key])
@@ -182,15 +196,27 @@ export const Element: FunctionComponent<ElementProps> = ({
       ],
     })
 
+    const priority = createEditorPriority({
+      reference: {
+        priority: corePriority,
+        importance: 'lower',
+      },
+    })
+
+    const behaviorConfig = {
+      behavior,
+      priority,
+    }
+
     editorActor.send({
       type: 'add behavior',
-      behavior,
+      behaviorConfig,
     })
 
     return () => {
       editorActor.send({
         type: 'remove behavior',
-        behavior,
+        behaviorConfig,
       })
     }
   }, [editorActor])

package/src/editor/create-editor.ts

@@ -8,6 +8,8 @@ import type {Behavior} from '../behaviors/behavior.types.behavior'
 import type {ExternalBehaviorEvent} from '../behaviors/behavior.types.event'
 import {createCoreConverters} from '../converters/converters.core'
 import {compileType} from '../internal-utils/schema'
+import {corePriority} from '../priority/priority.core'
+import {createEditorPriority} from '../priority/priority.types'
 import type {EditableAPI} from '../types/editor'
 import {createSlateEditor, type SlateEditor} from './create-slate-editor'
 import type {
@@ -117,23 +119,33 @@ export function createInternalEditor(editorActor: EditorActor): InternalEditor {
         editorActorSnapshot: editorActor.getSnapshot(),
         slateEditorInstance: slateEditor.instance,
       }),
-    registerBehavior: (config) => {
+    registerBehavior: (behaviorConfig) => {
+      const priority = createEditorPriority({
+        name: 'custom',
+        reference: {
+          priority: corePriority,
+          importance: 'higher',
+        },
+      })
+      const behaviorConfigWithPriority = {
+        ...behaviorConfig,
+        priority,
+      }
+
       editorActor.send({
         type: 'add behavior',
-        behavior: config.behavior,
+        behaviorConfig: behaviorConfigWithPriority,
       })
 
       return () => {
         editorActor.send({
           type: 'remove behavior',
-          behavior: config.behavior,
+          behaviorConfig: behaviorConfigWithPriority,
         })
       }
     },
     send: (event) => {
       switch (event.type) {
-        case 'add behavior':
-        case 'remove behavior':
         case 'update key generator':
         case 'update readOnly':
         case 'patches':

package/src/editor/editor-machine.ts

@@ -11,12 +11,13 @@ import {
   setup,
   type ActorRefFrom,
 } from 'xstate'
-import {coreBehaviors} from '../behaviors/behavior.core'
+import type {BehaviorConfig} from '../behaviors/behavior.config'
+import {coreBehaviorsConfig} from '../behaviors/behavior.core'
 import {performEvent} from '../behaviors/behavior.perform-event'
-import type {Behavior} from '../behaviors/behavior.types.behavior'
 import type {BehaviorEvent} from '../behaviors/behavior.types.event'
 import type {Converter} from '../converters/converter.types'
 import type {EventPosition} from '../internal-utils/event-position'
+import {sortByPriority} from '../priority/priority.sort'
 import type {NamespaceEvent} from '../type-utils'
 import type {
   EditorSelection,
@@ -55,14 +56,6 @@ export type MutationEvent = {
  * @public
  */
 export type ExternalEditorEvent =
-  | {
-      type: 'add behavior'
-      behavior: Behavior
-    }
-  | {
-      type: 'remove behavior'
-      behavior: Behavior
-    }
   | {
       type: 'update readOnly'
       readOnly: boolean
@@ -140,7 +133,7 @@ type PatchEvent = {
 }
 
 type InternalPatchEvent = NamespaceEvent<PatchEvent, 'internal'> & {
-  actionId?: string
+  operationId?: string
   value: Array<PortableTextBlock>
 }
 
@@ -160,6 +153,14 @@ export type HasTag = ReturnType<EditorActor['getSnapshot']>['hasTag']
  */
 export type InternalEditorEvent =
   | ExternalEditorEvent
+  | {
+      type: 'add behavior'
+      behaviorConfig: BehaviorConfig
+    }
+  | {
+      type: 'remove behavior'
+      behaviorConfig: BehaviorConfig
+    }
   | {
       type: 'blur'
       editor: PortableTextSlateEditor
@@ -213,7 +214,7 @@ export type InternalEditorEmittedEvent =
 export const editorMachine = setup({
   types: {
     context: {} as {
-      behaviors: Set<Behavior>
+      behaviors: Set<BehaviorConfig>
       converters: Set<Converter>
       getLegacySchema: () => PortableTextMemberSchemaTypes
       keyGenerator: () => string
@@ -248,14 +249,14 @@ export const editorMachine = setup({
       behaviors: ({context, event}) => {
         assertEvent(event, 'add behavior')
 
-        return new Set([...context.behaviors, event.behavior])
+        return new Set([...context.behaviors, event.behaviorConfig])
       },
     }),
     'remove behavior from context': assign({
       behaviors: ({context, event}) => {
         assertEvent(event, 'remove behavior')
 
-        context.behaviors.delete(event.behavior)
+        context.behaviors.delete(event.behaviorConfig)
 
         return new Set([...context.behaviors])
       },
@@ -342,10 +343,15 @@ export const editorMachine = setup({
       assertEvent(event, ['behavior event'])
 
       try {
+        const behaviors = sortByPriority([
+          ...context.behaviors.values(),
+          ...coreBehaviorsConfig,
+        ]).map((config) => config.behavior)
+
         performEvent({
           mode: 'raise',
-          behaviors: [...context.behaviors.values()],
-          remainingEventBehaviors: [...context.behaviors.values()],
+          behaviors,
+          remainingEventBehaviors: behaviors,
           event: event.behaviorEvent,
           editor: event.editor,
           keyGenerator: context.keyGenerator,
@@ -383,7 +389,7 @@ export const editorMachine = setup({
 }).createMachine({
   id: 'editor',
   context: ({input}) => ({
-    behaviors: new Set([...coreBehaviors]),
+    behaviors: new Set([]),
     converters: new Set(input.converters ?? []),
     getLegacySchema: input.getLegacySchema,
     keyGenerator: input.keyGenerator,

package/src/editor/mutation-machine.ts

@@ -23,7 +23,7 @@ export const mutationMachine = setup({
   types: {
     context: {} as {
       pendingMutations: Array<{
-        actionId?: string
+        operationId?: string
         value: Array<PortableTextBlock> | undefined
         patches: Array<Patch>
       }>
@@ -34,7 +34,7 @@ export const mutationMachine = setup({
       | {
           type: 'patch'
           patch: Patch
-          actionId?: string
+          operationId?: string
           value: Array<PortableTextBlock>
         }
       | {
@@ -78,7 +78,7 @@ export const mutationMachine = setup({
         if (context.pendingMutations.length === 0) {
           return [
             {
-              actionId: event.actionId,
+              operationId: event.operationId,
               value: event.value,
               patches: [event.patch],
             },
@@ -87,17 +87,17 @@ export const mutationMachine = setup({
 
         const lastBulk = context.pendingMutations.at(-1)
 
-        if (lastBulk && lastBulk.actionId === event.actionId) {
+        if (lastBulk && lastBulk.operationId === event.operationId) {
           return context.pendingMutations.slice(0, -1).concat({
             value: event.value,
-            actionId: lastBulk.actionId,
+            operationId: lastBulk.operationId,
             patches: [...lastBulk.patches, event.patch],
           })
         }
 
         return context.pendingMutations.concat({
           value: event.value,
-          actionId: event.actionId,
+          operationId: event.operationId,
           patches: [event.patch],
         })
       },

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

@@ -1,9 +1,9 @@
 import {Editor} from 'slate'
-import {insertTextActionImplementation} from '../../behavior-actions/behavior.action.insert.text'
-import {performAction} from '../../behavior-actions/behavior.actions'
 import {slateRangeToSelection} from '../../internal-utils/slate-utils'
+import {insertTextOperationImplementation} from '../../operations/behavior.operation.insert.text'
+import {performOperation} from '../../operations/behavior.operations'
 import type {EditorActor} from '../editor-machine'
-import {isApplyingBehaviorActions} from '../with-applying-behavior-actions'
+import {isApplyingBehaviorOperations} from '../with-applying-behavior-operations'
 
 export function createWithEventListeners(editorActor: EditorActor) {
   return function withEventListeners(editor: Editor) {
@@ -11,12 +11,11 @@ export function createWithEventListeners(editorActor: EditorActor) {
       return editor
     }
 
-    const {deleteBackward, deleteForward, insertBreak, insertText, select} =
-      editor
+    const {insertText, select} = editor
 
     editor.deleteBackward = (unit) => {
-      if (isApplyingBehaviorActions(editor)) {
-        deleteBackward(unit)
+      if (isApplyingBehaviorOperations(editor)) {
+        console.error('Unexpected call to .deleteBackward(...)')
         return
       }
 
@@ -32,8 +31,8 @@ export function createWithEventListeners(editorActor: EditorActor) {
     }
 
     editor.deleteForward = (unit) => {
-      if (isApplyingBehaviorActions(editor)) {
-        deleteForward(unit)
+      if (isApplyingBehaviorOperations(editor)) {
+        console.error('Unexpected call to .deleteForward(...)')
         return
       }
 
@@ -49,8 +48,8 @@ export function createWithEventListeners(editorActor: EditorActor) {
     }
 
     editor.insertBreak = () => {
-      if (isApplyingBehaviorActions(editor)) {
-        insertBreak()
+      if (isApplyingBehaviorOperations(editor)) {
+        console.error('Unexpected call to .insertBreak(...)')
         return
       }
 
@@ -65,8 +64,9 @@ export function createWithEventListeners(editorActor: EditorActor) {
     }
 
     editor.insertData = (dataTransfer) => {
-      if (isApplyingBehaviorActions(editor)) {
-        throw new Error('Unexpected call to .insertData(...)')
+      if (isApplyingBehaviorOperations(editor)) {
+        console.error('Unexpected call to .insertData(...)')
+        return
       }
 
       editorActor.send({
@@ -82,13 +82,13 @@ export function createWithEventListeners(editorActor: EditorActor) {
     }
 
     editor.insertSoftBreak = () => {
-      if (isApplyingBehaviorActions(editor)) {
-        insertTextActionImplementation({
+      if (isApplyingBehaviorOperations(editor)) {
+        insertTextOperationImplementation({
           context: {
             keyGenerator: editorActor.getSnapshot().context.keyGenerator,
             schema: editorActor.getSnapshot().context.schema,
           },
-          action: {type: 'insert.text', text: '\n', editor},
+          operation: {type: 'insert.text', text: '\n', editor},
         })
         return
       }
@@ -104,7 +104,7 @@ export function createWithEventListeners(editorActor: EditorActor) {
     }
 
     editor.insertText = (text, options) => {
-      if (isApplyingBehaviorActions(editor)) {
+      if (isApplyingBehaviorOperations(editor)) {
         insertText(text, options)
         return
       }
@@ -121,13 +121,13 @@ export function createWithEventListeners(editorActor: EditorActor) {
     }
 
     editor.redo = () => {
-      if (isApplyingBehaviorActions(editor)) {
-        performAction({
+      if (isApplyingBehaviorOperations(editor)) {
+        performOperation({
           context: {
             keyGenerator: editorActor.getSnapshot().context.keyGenerator,
             schema: editorActor.getSnapshot().context.schema,
           },
-          action: {
+          operation: {
             type: 'history.redo',
             editor,
           },
@@ -146,7 +146,7 @@ export function createWithEventListeners(editorActor: EditorActor) {
     }
 
     editor.select = (location) => {
-      if (isApplyingBehaviorActions(editor)) {
+      if (isApplyingBehaviorOperations(editor)) {
         select(location)
         return
       }
@@ -169,18 +169,18 @@ export function createWithEventListeners(editorActor: EditorActor) {
     }
 
     editor.setFragmentData = () => {
-      console.warn('Unexpected call to .setFragmentData(...)')
+      console.error('Unexpected call to .setFragmentData(...)')
       return
     }
 
     editor.undo = () => {
-      if (isApplyingBehaviorActions(editor)) {
-        performAction({
+      if (isApplyingBehaviorOperations(editor)) {
+        performOperation({
           context: {
             keyGenerator: editorActor.getSnapshot().context.keyGenerator,
             schema: editorActor.getSnapshot().context.schema,
           },
-          action: {
+          operation: {
             type: 'history.undo',
             editor,
           },

package/src/editor/plugins/createWithEditableAPI.ts

@@ -16,7 +16,6 @@ import {
 } from 'slate'
 import type {DOMNode} from 'slate-dom'
 import {ReactEditor} from 'slate-react'
-import {addAnnotationActionImplementation} from '../../behavior-actions/behavior.action.annotation.add'
 import {debugWithName} from '../../internal-utils/debug'
 import {toSlateRange} from '../../internal-utils/ranges'
 import {
@@ -29,6 +28,7 @@ import {
   KEY_TO_VALUE_ELEMENT,
   SLATE_TO_PORTABLE_TEXT_RANGE,
 } from '../../internal-utils/weakMaps'
+import {addAnnotationOperationImplementation} from '../../operations/behavior.operation.annotation.add'
 import type {
   EditableAPI,
   EditableAPIDeleteOptions,
@@ -400,12 +400,12 @@ export function createEditableAPI(
       let paths: ReturnType<EditableAPI['addAnnotation']> = undefined
 
       Editor.withoutNormalizing(editor, () => {
-        paths = addAnnotationActionImplementation({
+        paths = addAnnotationOperationImplementation({
           context: {
             keyGenerator: editorActor.getSnapshot().context.keyGenerator,
             schema: types,
           },
-          action: {
+          operation: {
             type: 'annotation.add',
             annotation: {name: type.name, value: value ?? {}},
             editor,