@portabletext/editor 1.47.10 → 1.47.12

package/src/behaviors/behavior.core.insert-break.ts

@@ -1,4 +1,5 @@
 import * as selectors from '../selectors'
+import * as utils from '../utils'
 import {raise} from './behavior.types.action'
 import {defineBehavior} from './behavior.types.behavior'
 
@@ -112,7 +113,119 @@ const breakingAtTheStartOfTextBlock = defineBehavior({
   ],
 })
 
+const breakingEntireDocument = defineBehavior({
+  on: 'insert.break',
+  guard: ({snapshot}) => {
+    if (!snapshot.context.selection) {
+      return false
+    }
+
+    if (!selectors.isSelectionExpanded(snapshot)) {
+      return false
+    }
+
+    const firstBlock = selectors.getFirstBlock(snapshot)
+    const lastBlock = selectors.getLastBlock(snapshot)
+
+    if (!firstBlock || !lastBlock) {
+      return false
+    }
+
+    const firstBlockStartPoint = utils.getBlockStartPoint(firstBlock)
+    const selectionStartPoint = utils.getSelectionStartPoint(
+      snapshot.context.selection,
+    )
+    const lastBlockEndPoint = utils.getBlockEndPoint(lastBlock)
+    const selectionEndPoint = utils.getSelectionEndPoint(
+      snapshot.context.selection,
+    )
+
+    if (
+      utils.isEqualSelectionPoints(firstBlockStartPoint, selectionStartPoint) &&
+      utils.isEqualSelectionPoints(lastBlockEndPoint, selectionEndPoint)
+    ) {
+      return {selection: snapshot.context.selection}
+    }
+
+    return false
+  },
+  actions: [
+    (_, {selection}) => [
+      raise({
+        type: 'delete',
+        at: selection,
+      }),
+    ],
+  ],
+})
+
+const breakingEntireBlocks = defineBehavior({
+  on: 'insert.break',
+  guard: ({snapshot}) => {
+    if (!snapshot.context.selection) {
+      return false
+    }
+
+    if (!selectors.isSelectionExpanded(snapshot)) {
+      return false
+    }
+
+    const selectedBlocks = selectors.getSelectedBlocks(snapshot)
+    const selectionStartBlock = selectors.getSelectionStartBlock(snapshot)
+    const selectionEndBlock = selectors.getSelectionEndBlock(snapshot)
+
+    if (!selectionStartBlock || !selectionEndBlock) {
+      return false
+    }
+
+    const startBlockStartPoint = utils.getBlockStartPoint(selectionStartBlock)
+    const selectionStartPoint = utils.getSelectionStartPoint(
+      snapshot.context.selection,
+    )
+    const endBlockEndPoint = utils.getBlockEndPoint(selectionEndBlock)
+    const selectionEndPoint = utils.getSelectionEndPoint(
+      snapshot.context.selection,
+    )
+
+    if (
+      utils.isEqualSelectionPoints(selectionStartPoint, startBlockStartPoint) &&
+      utils.isEqualSelectionPoints(selectionEndPoint, endBlockEndPoint)
+    ) {
+      return {selectedBlocks}
+    }
+
+    return false
+  },
+  actions: [
+    ({snapshot}, {selectedBlocks}) => [
+      raise({
+        type: 'insert.block',
+        block: {
+          _type: snapshot.context.schema.block.name,
+          children: [
+            {
+              _type: snapshot.context.schema.span.name,
+              text: '',
+              marks: [],
+            },
+          ],
+        },
+        placement: 'before',
+        select: 'start',
+      }),
+      ...selectedBlocks.map((block) =>
+        raise({
+          type: 'delete.block',
+          at: block.path,
+        }),
+      ),
+    ],
+  ],
+})
+
 export const coreInsertBreakBehaviors = {
   breakingAtTheEndOfTextBlock,
   breakingAtTheStartOfTextBlock,
+  breakingEntireDocument,
+  breakingEntireBlocks,
 }

package/src/behaviors/behavior.core.ts

@@ -29,4 +29,6 @@ export const coreBehaviors = [
   coreListBehaviors.unindentListOnShiftTab,
   coreInsertBreakBehaviors.breakingAtTheEndOfTextBlock,
   coreInsertBreakBehaviors.breakingAtTheStartOfTextBlock,
+  coreInsertBreakBehaviors.breakingEntireDocument,
+  coreInsertBreakBehaviors.breakingEntireBlocks,
 ]

package/src/behaviors/behavior.default.ts

@@ -10,6 +10,7 @@ import {abstractInsertBehaviors} from './behavior.abstract.insert'
 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'
@@ -454,6 +455,7 @@ export const defaultBehaviors = [
   ...abstractMoveBehaviors,
   ...abstractStyleBehaviors,
   ...abstractSelectBehaviors,
+  ...abstractSplitBehaviors,
   raiseDeserializationSuccessOrFailure,
   raiseSerializationSuccessOrFailure,
   raiseInsertSoftBreak,

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

@@ -83,7 +83,6 @@ const syntheticBehaviorEventTypes = [
   'move.block',
   'move.forward',
   'select',
-  'split.block',
 ] as const
 
 type SyntheticBehaviorEventType = (typeof syntheticBehaviorEventTypes)[number]
@@ -195,9 +194,6 @@ export type SyntheticBehaviorEvent =
       type: StrictExtract<SyntheticBehaviorEventType, 'select'>
       at: EditorSelection
     }
-  | {
-      type: StrictExtract<SyntheticBehaviorEventType, 'split.block'>
-    }
 
 export type InsertPlacement = 'auto' | 'after' | 'before'
 
@@ -231,6 +227,7 @@ const abstractBehaviorEventTypes = [
   'serialize',
   'serialization.success',
   'serialization.failure',
+  'split',
   'style.add',
   'style.remove',
   'style.toggle',
@@ -362,6 +359,9 @@ export type AbstractBehaviorEvent =
       type: StrictExtract<AbstractBehaviorEventType, 'select.next block'>
       select?: 'start' | 'end'
     }
+  | {
+      type: StrictExtract<AbstractBehaviorEventType, 'split'>
+    }
   | {
       type: StrictExtract<AbstractBehaviorEventType, 'style.add'>
       style: string

package/src/internal-utils/slate-utils.ts

@@ -3,6 +3,27 @@ import type {EditorSchema} from '../editor/editor-schema'
 import type {EditorSelection, PortableTextSlateEditor} from '../types/editor'
 import {fromSlateValue} from './values'
 
+export function getAnchorBlock({
+  editor,
+}: {
+  editor: PortableTextSlateEditor
+}): [node: Node, path: Path] | [undefined, undefined] {
+  if (!editor.selection) {
+    return [undefined, undefined]
+  }
+
+  try {
+    return (
+      Editor.node(editor, editor.selection.anchor.path.slice(0, 1)) ?? [
+        undefined,
+        undefined,
+      ]
+    )
+  } catch {
+    return [undefined, undefined]
+  }
+}
+
 export function getFocusBlock({
   editor,
 }: {
@@ -24,6 +45,34 @@ export function getFocusBlock({
   }
 }
 
+export function getSelectionStartBlock({
+  editor,
+}: {
+  editor: PortableTextSlateEditor
+}): [node: Node, path: Path] | [undefined, undefined] {
+  if (!editor.selection) {
+    return [undefined, undefined]
+  }
+
+  const selectionStartPoint = Range.start(editor.selection)
+
+  return getPointBlock({editor, point: selectionStartPoint})
+}
+
+export function getSelectionEndBlock({
+  editor,
+}: {
+  editor: PortableTextSlateEditor
+}): [node: Node, path: Path] | [undefined, undefined] {
+  if (!editor.selection) {
+    return [undefined, undefined]
+  }
+
+  const selectionEndPoint = Range.end(editor.selection)
+
+  return getPointBlock({editor, point: selectionEndPoint})
+}
+
 function getPointBlock({
   editor,
   point,
@@ -36,7 +85,7 @@ function getPointBlock({
       undefined,
       undefined,
     ]
-    return block ? [block, point.path] : [undefined, undefined]
+    return block ? [block, point.path.slice(0, 1)] : [undefined, undefined]
   } catch {
     return [undefined, undefined]
   }

package/src/plugins/plugin.one-line.tsx

@@ -23,13 +23,6 @@ const oneLineBehaviors = [
     on: 'insert.break',
     actions: [() => [{type: 'noop'}]],
   }),
-  /**
-   * `split.block`s as well.
-   */
-  defineBehavior({
-    on: 'split.block',
-    actions: [() => [{type: 'noop'}]],
-  }),
   /**
    * `insert.block` `before` or `after` is not allowed in a one-line editor.
    */

package/src/behavior-actions/behavior.action.split.block.ts

@@ -1,146 +0,0 @@
-import {isEqual} from 'lodash'
-import {Editor, Node, Path, Transforms} from 'slate'
-import type {SlateTextBlock, VoidElement} from '../types/slate'
-import type {BehaviorActionImplementation} from './behavior.actions'
-
-export const splitBlockActionImplementation: BehaviorActionImplementation<
-  'split.block'
-> = ({context, action}) => {
-  const keyGenerator = context.keyGenerator
-  const schema = context.schema
-  const editor = action.editor
-
-  if (!editor.selection) {
-    return
-  }
-
-  const anchorBlockPath = editor.selection.anchor.path.slice(0, 1)
-  const focusBlockPath = editor.selection.focus.path.slice(0, 1)
-  const focusBlock = Node.descendant(editor, focusBlockPath) as
-    | SlateTextBlock
-    | VoidElement
-
-  if (editor.isTextBlock(focusBlock)) {
-    const selectionAcrossBlocks = anchorBlockPath[0] !== focusBlockPath[0]
-
-    if (!selectionAcrossBlocks) {
-      Transforms.splitNodes(editor, {
-        at: editor.selection,
-        always: true,
-      })
-
-      const [nextBlock, nextBlockPath] = Editor.node(
-        editor,
-        Path.next(focusBlockPath),
-        {depth: 1},
-      )
-
-      const nextChild = Node.child(nextBlock, 0)
-      const firstChildIsInlineObject = !editor.isTextSpan(nextChild)
-
-      if (firstChildIsInlineObject) {
-        // If the first child in the next block is an inline object then we
-        // add an empty span right before it to a place to put the cursor.
-        // This is a Slate constraint that we have to adhere to.
-        Transforms.insertNodes(
-          editor,
-          {
-            _key: context.keyGenerator(),
-            _type: 'span',
-            text: '',
-            marks: [],
-          },
-          {
-            at: [nextBlockPath[0], 0],
-          },
-        )
-      }
-
-      Transforms.setSelection(editor, {
-        anchor: {path: [...nextBlockPath, 0], offset: 0},
-        focus: {path: [...nextBlockPath, 0], offset: 0},
-      })
-
-      /**
-       * Assign new keys to markDefs that are now split across two blocks
-       */
-      if (
-        editor.isTextBlock(nextBlock) &&
-        nextBlock.markDefs &&
-        nextBlock.markDefs.length > 0
-      ) {
-        const newMarkDefKeys = new Map<string, string>()
-
-        const prevNodeSpans = Array.from(Node.children(editor, focusBlockPath))
-          .map((entry) => entry[0])
-          .filter((node) => editor.isTextSpan(node))
-        const children = Node.children(editor, nextBlockPath)
-
-        for (const [child, childPath] of children) {
-          if (!editor.isTextSpan(child)) {
-            continue
-          }
-
-          const marks = child.marks ?? []
-
-          // Go through the marks of the span and figure out if any of
-          // them refer to annotations that are also present in the
-          // previous block
-          for (const mark of marks) {
-            if (
-              schema.decorators.some((decorator) => decorator.name === mark)
-            ) {
-              continue
-            }
-
-            if (
-              prevNodeSpans.some((prevNodeSpan) =>
-                prevNodeSpan.marks?.includes(mark),
-              ) &&
-              !newMarkDefKeys.has(mark)
-            ) {
-              // This annotation is both present in the previous block
-              // and this block, so let's assign a new key to it
-              newMarkDefKeys.set(mark, keyGenerator())
-            }
-          }
-
-          const newMarks = marks.map((mark) => newMarkDefKeys.get(mark) ?? mark)
-
-          // No need to update the marks if they are the same
-          if (!isEqual(marks, newMarks)) {
-            Transforms.setNodes(
-              editor,
-              {marks: newMarks},
-              {
-                at: childPath,
-              },
-            )
-          }
-        }
-
-        // Time to update all the markDefs that need a new key because
-        // they've been split across blocks
-        const newMarkDefs = nextBlock.markDefs.map((markDef) => ({
-          ...markDef,
-          _key: newMarkDefKeys.get(markDef._key) ?? markDef._key,
-        }))
-
-        // No need to update the markDefs if they are the same
-        if (!isEqual(nextBlock.markDefs, newMarkDefs)) {
-          Transforms.setNodes(
-            editor,
-            {markDefs: newMarkDefs},
-            {
-              at: nextBlockPath,
-              match: (node) => editor.isTextBlock(node),
-            },
-          )
-        }
-      }
-      return
-    }
-  }
-
-  Transforms.splitNodes(editor, {always: true})
-}