@portabletext/editor 1.43.1 → 1.44.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portabletext/editor",
-  "version": "1.43.1",
+  "version": "1.44.1",
   "description": "Portable Text Editor made in React",
   "keywords": [
     "sanity",
@@ -85,7 +85,7 @@
   "devDependencies": {
     "@portabletext/toolkit": "^2.0.17",
     "@sanity/diff-match-patch": "^3.2.0",
-    "@sanity/pkg-utils": "^7.2.0",
+    "@sanity/pkg-utils": "^7.2.1",
     "@sanity/schema": "^3.81.0",
     "@sanity/types": "^3.81.0",
     "@testing-library/jest-dom": "^6.6.3",

package/src/behavior-actions/behavior.actions.ts

@@ -4,12 +4,8 @@ import type {EditorContext} from '../editor/editor-snapshot'
 import {
   addAnnotationActionImplementation,
   removeAnnotationActionImplementation,
-  toggleAnnotationActionImplementation,
 } from '../editor/plugins/createWithEditableAPI'
-import {
-  removeDecoratorActionImplementation,
-  toggleDecoratorActionImplementation,
-} from '../editor/plugins/createWithPortableTextMarkModel'
+import {removeDecoratorActionImplementation} from '../editor/plugins/createWithPortableTextMarkModel'
 import {
   historyRedoActionImplementation,
   historyUndoActionImplementation,
@@ -19,18 +15,14 @@ import type {PickFromUnion} from '../type-utils'
 import {blockSetBehaviorActionImplementation} from './behavior.action.block.set'
 import {blockUnsetBehaviorActionImplementation} from './behavior.action.block.unset'
 import {blurActionImplementation} from './behavior.action.blur'
-import {dataTransferSetActionImplementation} from './behavior.action.data-transfer-set'
 import {decoratorAddActionImplementation} from './behavior.action.decorator.add'
 import {deleteActionImplementation} from './behavior.action.delete'
 import {deleteBackwardActionImplementation} from './behavior.action.delete.backward'
 import {deleteBlockActionImplementation} from './behavior.action.delete.block'
 import {deleteForwardActionImplementation} from './behavior.action.delete.forward'
 import {deleteTextActionImplementation} from './behavior.action.delete.text'
-import {deserializationFailureActionImplementation} from './behavior.action.deserialization.failure'
-import {deserializationSuccessActionImplementation} from './behavior.action.deserialization.success'
 import {effectActionImplementation} from './behavior.action.effect'
 import {focusActionImplementation} from './behavior.action.focus'
-import {insertBlocksActionImplementation} from './behavior.action.insert-blocks'
 import {
   insertBreakActionImplementation,
   insertSoftBreakActionImplementation,
@@ -39,25 +31,11 @@ import {insertInlineObjectActionImplementation} from './behavior.action.insert-i
 import {insertSpanActionImplementation} from './behavior.action.insert-span'
 import {insertBlockActionImplementation} from './behavior.action.insert.block'
 import {insertTextActionImplementation} from './behavior.action.insert.text'
-import {
-  addListItemActionImplementation,
-  removeListItemActionImplementation,
-  toggleListItemActionImplementation,
-} from './behavior.action.list-item'
 import {moveBlockActionImplementation} from './behavior.action.move.block'
 import {moveBlockDownActionImplementation} from './behavior.action.move.block-down'
 import {moveBlockUpActionImplementation} from './behavior.action.move.block-up'
 import {noopActionImplementation} from './behavior.action.noop'
 import {selectActionImplementation} from './behavior.action.select'
-import {selectNextBlockActionImplementation} from './behavior.action.select.next-block'
-import {selectPreviousBlockActionImplementation} from './behavior.action.select.previous-block'
-import {serializationFailureActionImplementation} from './behavior.action.serialization.failure'
-import {serializationSuccessActionImplementation} from './behavior.action.serialization.success'
-import {
-  addStyleActionImplementation,
-  removeStyleActionImplementation,
-  toggleStyleActionImplementation,
-} from './behavior.action.style'
 
 const debug = debugWithName('behaviors:action')
 
@@ -84,47 +62,31 @@ type BehaviorActionImplementations = {
 const behaviorActionImplementations: BehaviorActionImplementations = {
   'annotation.add': addAnnotationActionImplementation,
   'annotation.remove': removeAnnotationActionImplementation,
-  'annotation.toggle': toggleAnnotationActionImplementation,
   'block.set': blockSetBehaviorActionImplementation,
   'block.unset': blockUnsetBehaviorActionImplementation,
   'blur': blurActionImplementation,
-  'data transfer.set': dataTransferSetActionImplementation,
   'decorator.add': decoratorAddActionImplementation,
   'decorator.remove': removeDecoratorActionImplementation,
-  'decorator.toggle': toggleDecoratorActionImplementation,
   'focus': focusActionImplementation,
   'delete': deleteActionImplementation,
   'delete.backward': deleteBackwardActionImplementation,
   'delete.forward': deleteForwardActionImplementation,
   'delete.block': deleteBlockActionImplementation,
   'delete.text': deleteTextActionImplementation,
-  'deserialization.failure': deserializationFailureActionImplementation,
-  'deserialization.success': deserializationSuccessActionImplementation,
   'history.redo': historyRedoActionImplementation,
   'history.undo': historyUndoActionImplementation,
   'insert.block': insertBlockActionImplementation,
-  'insert.blocks': insertBlocksActionImplementation,
   'insert.break': insertBreakActionImplementation,
   'insert.inline object': insertInlineObjectActionImplementation,
   'insert.soft break': insertSoftBreakActionImplementation,
   'insert.span': insertSpanActionImplementation,
   'insert.text': insertTextActionImplementation,
   'effect': effectActionImplementation,
-  'list item.add': addListItemActionImplementation,
-  'list item.remove': removeListItemActionImplementation,
-  'list item.toggle': toggleListItemActionImplementation,
   'move.block': moveBlockActionImplementation,
   'move.block down': moveBlockDownActionImplementation,
   'move.block up': moveBlockUpActionImplementation,
   'noop': noopActionImplementation,
   'select': selectActionImplementation,
-  'select.previous block': selectPreviousBlockActionImplementation,
-  'select.next block': selectNextBlockActionImplementation,
-  'serialization.failure': serializationFailureActionImplementation,
-  'serialization.success': serializationSuccessActionImplementation,
-  'style.toggle': toggleStyleActionImplementation,
-  'style.add': addStyleActionImplementation,
-  'style.remove': removeStyleActionImplementation,
 }
 
 export function performAction({
@@ -151,13 +113,6 @@ export function performAction({
       })
       break
     }
-    case 'annotation.toggle': {
-      behaviorActionImplementations['annotation.toggle']({
-        context,
-        action,
-      })
-      break
-    }
     case 'block.set': {
       behaviorActionImplementations['block.set']({
         context,
@@ -179,13 +134,6 @@ export function performAction({
       })
       break
     }
-    case 'data transfer.set': {
-      behaviorActionImplementations['data transfer.set']({
-        context,
-        action,
-      })
-      break
-    }
     case 'decorator.add': {
       behaviorActionImplementations['decorator.add']({
         context,
@@ -200,13 +148,6 @@ export function performAction({
       })
       break
     }
-    case 'decorator.toggle': {
-      behaviorActionImplementations['decorator.toggle']({
-        context,
-        action,
-      })
-      break
-    }
     case 'delete': {
       behaviorActionImplementations.delete({
         context,
@@ -242,20 +183,6 @@ export function performAction({
       })
       break
     }
-    case 'deserialization.failure': {
-      behaviorActionImplementations['deserialization.failure']({
-        context,
-        action,
-      })
-      break
-    }
-    case 'deserialization.success': {
-      behaviorActionImplementations['deserialization.success']({
-        context,
-        action,
-      })
-      break
-    }
     case 'effect': {
       behaviorActionImplementations.effect({
         context,
@@ -291,13 +218,6 @@ export function performAction({
       })
       break
     }
-    case 'insert.blocks': {
-      behaviorActionImplementations['insert.blocks']({
-        context,
-        action,
-      })
-      break
-    }
     case 'insert.inline object': {
       behaviorActionImplementations['insert.inline object']({
         context,
@@ -333,27 +253,6 @@ export function performAction({
       })
       break
     }
-    case 'list item.add': {
-      behaviorActionImplementations['list item.add']({
-        context,
-        action,
-      })
-      break
-    }
-    case 'list item.remove': {
-      behaviorActionImplementations['list item.remove']({
-        context,
-        action,
-      })
-      break
-    }
-    case 'list item.toggle': {
-      behaviorActionImplementations['list item.toggle']({
-        context,
-        action,
-      })
-      break
-    }
     case 'move.block': {
       behaviorActionImplementations['move.block']({
         context,
@@ -382,57 +281,8 @@ export function performAction({
       })
       break
     }
-    case 'select': {
-      behaviorActionImplementations.select({
-        context,
-        action,
-      })
-      break
-    }
-    case 'select.previous block': {
-      behaviorActionImplementations['select.previous block']({
-        context,
-        action,
-      })
-      break
-    }
-    case 'select.next block': {
-      behaviorActionImplementations['select.next block']({
-        context,
-        action,
-      })
-      break
-    }
-    case 'serialization.failure': {
-      behaviorActionImplementations['serialization.failure']({
-        context,
-        action,
-      })
-      break
-    }
-    case 'serialization.success': {
-      behaviorActionImplementations['serialization.success']({
-        context,
-        action,
-      })
-      break
-    }
-    case 'style.add': {
-      behaviorActionImplementations['style.add']({
-        context,
-        action,
-      })
-      break
-    }
-    case 'style.remove': {
-      behaviorActionImplementations['style.remove']({
-        context,
-        action,
-      })
-      break
-    }
     default: {
-      behaviorActionImplementations['style.toggle']({
+      behaviorActionImplementations.select({
         context,
         action,
       })

package/src/behaviors/behavior.default.ts

@@ -1,115 +1,16 @@
 import {isTextBlock} from '../internal-utils/parse-blocks'
 import * as selectors from '../selectors'
-import {blockOffsetsToSelection, getTextBlockText} from '../utils'
+import {getTextBlockText} from '../utils'
 import {raiseInsertSoftBreak} from './behavior.default.raise-soft-break'
+import {internalAnnotationBehaviors} from './behavior.internal.annotation'
+import {internalDecoratorBehaviors} from './behavior.internal.decorator'
+import {internalInsertBehaviors} from './behavior.internal.insert'
+import {internalListItemBehaviors} from './behavior.internal.list-item'
+import {internalSelectBehaviors} from './behavior.internal.select'
+import {internalStyleBehaviors} from './behavior.internal.style'
 import {raise} from './behavior.types.action'
 import {defineBehavior} from './behavior.types.behavior'
 
-const toggleAnnotationOff = defineBehavior({
-  on: 'annotation.toggle',
-  guard: ({snapshot, event}) =>
-    selectors.isActiveAnnotation(event.annotation.name)(snapshot),
-  actions: [
-    ({event}) => [
-      raise({type: 'annotation.remove', annotation: event.annotation}),
-    ],
-  ],
-})
-
-const toggleAnnotationOn = defineBehavior({
-  on: 'annotation.toggle',
-  guard: ({snapshot, event}) =>
-    !selectors.isActiveAnnotation(event.annotation.name)(snapshot),
-  actions: [
-    ({event}) => [
-      raise({type: 'annotation.add', annotation: event.annotation}),
-    ],
-  ],
-})
-
-const toggleDecoratorOff = defineBehavior({
-  on: 'decorator.toggle',
-  guard: ({snapshot, event}) =>
-    selectors.isActiveDecorator(event.decorator)(snapshot),
-  actions: [
-    ({event}) => [
-      raise({type: 'decorator.remove', decorator: event.decorator}),
-    ],
-  ],
-})
-
-const toggleDecoratorOn = defineBehavior({
-  on: 'decorator.toggle',
-  guard: ({snapshot, event}) => {
-    const manualSelection = event.offsets
-      ? blockOffsetsToSelection({
-          value: snapshot.context.value,
-          offsets: event.offsets,
-        })
-      : null
-
-    if (manualSelection) {
-      return !selectors.isActiveDecorator(event.decorator)({
-        ...snapshot,
-        context: {
-          ...snapshot.context,
-          selection: manualSelection,
-        },
-      })
-    }
-
-    return !selectors.isActiveDecorator(event.decorator)(snapshot)
-  },
-  actions: [
-    ({event}) => [
-      raise({
-        ...event,
-        type: 'decorator.add',
-      }),
-    ],
-  ],
-})
-
-const toggleListItemOff = defineBehavior({
-  on: 'list item.toggle',
-  guard: ({snapshot, event}) =>
-    selectors.isActiveListItem(event.listItem)(snapshot),
-  actions: [
-    ({event}) => [
-      raise({
-        type: 'list item.remove',
-        listItem: event.listItem,
-      }),
-    ],
-  ],
-})
-
-const toggleListItemOn = defineBehavior({
-  on: 'list item.toggle',
-  guard: ({snapshot, event}) =>
-    !selectors.isActiveListItem(event.listItem)(snapshot),
-  actions: [
-    ({event}) => [
-      raise({
-        type: 'list item.add',
-        listItem: event.listItem,
-      }),
-    ],
-  ],
-})
-
-const toggleStyleOff = defineBehavior({
-  on: 'style.toggle',
-  guard: ({snapshot, event}) => selectors.isActiveStyle(event.style)(snapshot),
-  actions: [({event}) => [raise({type: 'style.remove', style: event.style})]],
-})
-
-const toggleStyleOn = defineBehavior({
-  on: 'style.toggle',
-  guard: ({snapshot, event}) => !selectors.isActiveStyle(event.style)(snapshot),
-  actions: [({event}) => [raise({type: 'style.add', style: event.style})]],
-})
-
 const raiseDeserializationSuccessOrFailure = defineBehavior({
   on: 'deserialize',
   guard: ({snapshot, event}) => {
@@ -265,12 +166,30 @@ export const defaultBehaviors = [
     on: 'serialization.success',
     actions: [
       ({event}) => [
-        raise({
-          type: 'data transfer.set',
-          data: event.data,
-          dataTransfer: event.originEvent.originEvent.dataTransfer,
-          mimeType: event.mimeType,
-        }),
+        {
+          type: 'effect',
+          effect: () => {
+            event.originEvent.originEvent.dataTransfer.setData(
+              event.mimeType,
+              event.data,
+            )
+          },
+        },
+      ],
+    ],
+  }),
+  defineBehavior({
+    on: 'serialization.failure',
+    actions: [
+      ({event}) => [
+        {
+          type: 'effect',
+          effect: () => {
+            console.warn(
+              `Serialization of ${event.mimeType} failed with reason "${event.reason}"`,
+            )
+          },
+        },
       ],
     ],
   }),
@@ -465,6 +384,21 @@ export const defaultBehaviors = [
       ],
     ],
   }),
+  defineBehavior({
+    on: 'deserialization.failure',
+    actions: [
+      ({event}) => [
+        {
+          type: 'effect',
+          effect: () => {
+            console.warn(
+              `Deserialization of ${event.mimeType} failed with reason "${event.reason}"`,
+            )
+          },
+        },
+      ],
+    ],
+  }),
   defineBehavior({
     on: 'clipboard.paste',
     guard: ({snapshot}) => {
@@ -508,14 +442,12 @@ export const defaultBehaviors = [
       ],
     ],
   }),
-  toggleAnnotationOff,
-  toggleAnnotationOn,
-  toggleDecoratorOff,
-  toggleDecoratorOn,
-  toggleListItemOff,
-  toggleListItemOn,
-  toggleStyleOff,
-  toggleStyleOn,
+  ...internalAnnotationBehaviors,
+  ...internalDecoratorBehaviors,
+  ...internalInsertBehaviors,
+  ...internalListItemBehaviors,
+  ...internalStyleBehaviors,
+  ...internalSelectBehaviors,
   raiseDeserializationSuccessOrFailure,
   raiseSerializationSuccessOrFailure,
   raiseInsertSoftBreak,

package/src/behaviors/behavior.internal.annotation.ts

@@ -0,0 +1,26 @@
+import {isActiveAnnotation} from '../selectors'
+import {raise} from './behavior.types.action'
+import {defineBehavior} from './behavior.types.behavior'
+
+export const internalAnnotationBehaviors = [
+  defineBehavior({
+    on: 'annotation.toggle',
+    guard: ({snapshot, event}) =>
+      isActiveAnnotation(event.annotation.name)(snapshot),
+    actions: [
+      ({event}) => [
+        raise({type: 'annotation.remove', annotation: event.annotation}),
+      ],
+    ],
+  }),
+  defineBehavior({
+    on: 'annotation.toggle',
+    guard: ({snapshot, event}) =>
+      !isActiveAnnotation(event.annotation.name)(snapshot),
+    actions: [
+      ({event}) => [
+        raise({type: 'annotation.add', annotation: event.annotation}),
+      ],
+    ],
+  }),
+]

package/src/behaviors/behavior.internal.decorator.ts

@@ -0,0 +1,47 @@
+import {isActiveDecorator} from '../selectors'
+import {blockOffsetsToSelection} from '../utils'
+import {raise} from './behavior.types.action'
+import {defineBehavior} from './behavior.types.behavior'
+
+export const internalDecoratorBehaviors = [
+  defineBehavior({
+    on: 'decorator.toggle',
+    guard: ({snapshot, event}) => isActiveDecorator(event.decorator)(snapshot),
+    actions: [
+      ({event}) => [
+        raise({type: 'decorator.remove', decorator: event.decorator}),
+      ],
+    ],
+  }),
+  defineBehavior({
+    on: 'decorator.toggle',
+    guard: ({snapshot, event}) => {
+      const manualSelection = event.offsets
+        ? blockOffsetsToSelection({
+            value: snapshot.context.value,
+            offsets: event.offsets,
+          })
+        : null
+
+      if (manualSelection) {
+        return !isActiveDecorator(event.decorator)({
+          ...snapshot,
+          context: {
+            ...snapshot.context,
+            selection: manualSelection,
+          },
+        })
+      }
+
+      return !isActiveDecorator(event.decorator)(snapshot)
+    },
+    actions: [
+      ({event}) => [
+        raise({
+          ...event,
+          type: 'decorator.add',
+        }),
+      ],
+    ],
+  }),
+]

package/src/behaviors/behavior.internal.insert.ts

@@ -0,0 +1,118 @@
+import {getFocusTextBlock} from '../selectors'
+import {raise} from './behavior.types.action'
+import {defineBehavior} from './behavior.types.behavior'
+
+export const internalInsertBehaviors = [
+  defineBehavior({
+    on: 'insert.blocks',
+    guard: ({event}) => event.placement === 'before',
+    actions: [
+      ({event}) =>
+        event.blocks.map((block, index) =>
+          raise({
+            type: 'insert.block',
+            block,
+            placement: index === 0 ? 'before' : 'after',
+            select: 'end',
+          }),
+        ),
+    ],
+  }),
+  defineBehavior({
+    on: 'insert.blocks',
+    guard: ({event}) => event.placement === 'after',
+    actions: [
+      ({event}) =>
+        event.blocks.map((block) =>
+          raise({
+            type: 'insert.block',
+            block,
+            placement: 'after',
+            select: 'end',
+          }),
+        ),
+    ],
+  }),
+  defineBehavior({
+    on: 'insert.blocks',
+    guard: ({snapshot, event}) => {
+      if (event.placement !== 'auto') {
+        return false
+      }
+
+      const focusTextBlock = getFocusTextBlock(snapshot)
+
+      if (!focusTextBlock) {
+        return false
+      }
+
+      return true
+    },
+    actions: [
+      ({event}) =>
+        event.blocks.length === 1
+          ? [
+              raise({
+                type: 'insert.block',
+                block: event.blocks[0],
+                placement: 'auto',
+                select: 'end',
+              }),
+            ]
+          : event.blocks.flatMap((block, index) =>
+              index === 0
+                ? [
+                    raise({
+                      type: 'insert.break',
+                    }),
+                    raise({
+                      type: 'select.previous block',
+                      select: 'end',
+                    }),
+                    raise({
+                      type: 'insert.block',
+                      block,
+                      placement: 'auto',
+                      select: 'end',
+                    }),
+                  ]
+                : index === event.blocks.length - 1
+                  ? [
+                      raise({
+                        type: 'select.next block',
+                        select: 'start',
+                      }),
+                      raise({
+                        type: 'insert.block',
+                        block,
+                        placement: 'auto',
+                        select: 'end',
+                      }),
+                    ]
+                  : [
+                      raise({
+                        type: 'insert.block',
+                        block,
+                        placement: 'after',
+                        select: 'end',
+                      }),
+                    ],
+            ),
+    ],
+  }),
+  defineBehavior({
+    on: 'insert.blocks',
+    guard: ({event}) => event.placement === 'auto',
+    actions: [
+      ({event}) =>
+        event.blocks.map((block, index) =>
+          raise({
+            type: 'insert.block',
+            block,
+            placement: index === 0 ? 'auto' : 'after',
+            select: 'end',
+          }),
+        ),
+    ],
+  }),
+]