@portabletext/editor 2.1.11 → 2.2.0

package/lib/index.js

@@ -4,7 +4,7 @@ import { useEditor, EditorContext } from "./_chunks-es/use-editor.js";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useSelector, useActorRef } from "@xstate/react";
 import noop from "lodash/noop.js";
-import { Element as Element$1, Text, Range, Editor, Node, Transforms, Path, Operation, Point, createEditor, deleteText } from "slate";
+import { Element as Element$1, Text, Range, Editor, Node, Transforms, Path, Operation, deleteText, setSelection, Point, createEditor } from "slate";
 import { useSelected, useSlateSelector, useSlateStatic, withReact, ReactEditor, Slate, useSlate, Editable } from "slate-react";
 import debug$f from "debug";
 import { DOMEditor, isDOMNode, EDITOR_TO_PENDING_SELECTION } from "slate-dom";
@@ -1165,7 +1165,7 @@ const converterJson = {
         context: snapshot.context,
         block,
         options: {
-          refreshKeys: !0,
+          refreshKeys: !1,
           validateFields: !1
         }
       });
@@ -1229,7 +1229,7 @@ function createConverterTextHtml(legacySchema) {
           block,
           options: {
             refreshKeys: !1,
-            validateFields: !0
+            validateFields: !1
           }
         });
         return parsedBlock ? [parsedBlock] : [];
@@ -1277,7 +1277,7 @@ function createConverterTextPlain(legacySchema) {
           block,
           options: {
             refreshKeys: !1,
-            validateFields: !0
+            validateFields: !1
           }
         });
         return parsedBlock ? [parsedBlock] : [];
@@ -3305,9 +3305,17 @@ const addAnnotationOperationImplementation = ({
   context,
   operation
 }) => {
-  const anchorBlockKey = getBlockKeyFromSelectionPoint(operation.at.anchor), focusBlockKey = getBlockKeyFromSelectionPoint(operation.at.focus), endBlockKey = operation.at.backward ? anchorBlockKey : focusBlockKey, endOffset = operation.at.backward ? operation.at.focus.offset : operation.at.anchor.offset;
+  const anchorBlockKey = getBlockKeyFromSelectionPoint(operation.at.anchor), focusBlockKey = getBlockKeyFromSelectionPoint(operation.at.focus), startBlockKey = operation.at.backward ? focusBlockKey : anchorBlockKey, endBlockKey = operation.at.backward ? anchorBlockKey : focusBlockKey, endOffset = operation.at.backward ? operation.at.focus.offset : operation.at.anchor.offset;
+  if (!startBlockKey)
+    throw new Error("Failed to get start block key");
   if (!endBlockKey)
     throw new Error("Failed to get end block key");
+  const startBlockIndex = operation.editor.blockIndexMap.get(startBlockKey);
+  if (startBlockIndex === void 0)
+    throw new Error("Failed to get start block index");
+  const startBlock = operation.editor.value.at(startBlockIndex);
+  if (!startBlock)
+    throw new Error("Failed to get start block");
   const endBlockIndex = operation.editor.blockIndexMap.get(endBlockKey);
   if (endBlockIndex === void 0)
     throw new Error("Failed to get end block index");
@@ -3338,11 +3346,14 @@ const addAnnotationOperationImplementation = ({
   if (!range)
     throw new Error(`Failed to get Slate Range for selection ${JSON.stringify(operation.at)}`);
   const hanging = isTextBlock(context, endBlock) && endOffset === 0;
-  operation.editor.delete({
+  deleteText(operation.editor, {
     at: range,
     reverse: operation.direction === "backward",
     unit: operation.unit,
     hanging
+  }), operation.editor.selection && isTextBlock(context, startBlock) && isTextBlock(context, endBlock) && setSelection(operation.editor, {
+    anchor: operation.editor.selection.focus,
+    focus: operation.editor.selection.focus
   });
 }, insertInlineObjectOperationImplementation = ({
   context,
@@ -3434,19 +3445,19 @@ const addAnnotationOperationImplementation = ({
   if (!fragment)
     throw new Error(`Failed to convert block to Slate fragment ${JSON.stringify(parsedBlock)}`);
   insertBlock({
+    context,
     block: fragment,
     placement: operation.placement,
     select: operation.select ?? "start",
-    editor: operation.editor,
-    schema: context.schema
+    editor: operation.editor
   });
 };
 function insertBlock({
+  context,
   block,
   placement,
   select,
-  editor,
-  schema
+  editor
 }) {
   const [startBlock, startBlockPath] = getSelectionStartBlock({
     editor
@@ -3468,7 +3479,7 @@ function insertBlock({
         at: nextPath
       }), select === "start" ? Transforms.select(editor, Editor.start(editor, nextPath)) : select === "end" && Transforms.select(editor, Editor.end(editor, nextPath));
     } else {
-      if (lastBlock && isEqualToEmptyEditor([lastBlock], schema)) {
+      if (lastBlock && isEqualToEmptyEditor([lastBlock], context.schema)) {
         Transforms.removeNodes(editor, {
           at: lastBlockPath
         }), Transforms.insertNodes(editor, [block], {
@@ -3519,14 +3530,14 @@ function insertBlock({
         node: block,
         path: [newSelection.anchor.path[0]]
       }) : newSelection;
-      select === "none" && adjustedSelection && Transforms.select(editor, adjustedSelection), focusBlock && isEqualToEmptyEditor([focusBlock], schema) && Transforms.removeNodes(editor, {
+      select === "none" && adjustedSelection && Transforms.select(editor, adjustedSelection), focusBlock && isEqualToEmptyEditor([focusBlock], context.schema) && Transforms.removeNodes(editor, {
         at: focusBlockPath
       });
       return;
     }
     if (editor.isTextBlock(endBlock) && editor.isTextBlock(block)) {
       const selectionStartPoint = Range.start(currentSelection);
-      if (isEqualToEmptyEditor([endBlock], schema)) {
+      if (isEqualToEmptyEditor([endBlock], context.schema)) {
         const currentSelection2 = editor.selection;
         Transforms.insertNodes(editor, [block], {
           at: endBlockPath,
@@ -3536,17 +3547,46 @@ function insertBlock({
         }), select === "start" ? Transforms.select(editor, selectionStartPoint) : select === "end" ? Transforms.select(editor, Editor.end(editor, endBlockPath)) : Transforms.select(editor, currentSelection2);
         return;
       }
-      if (Transforms.setNodes(editor, {
-        markDefs: [...endBlock.markDefs ?? [], ...block.markDefs ?? []]
+      const endBlockChildKeys = endBlock.children.map((child) => child._key), endBlockMarkDefsKeys = endBlock.markDefs?.map((markDef) => markDef._key) ?? [], markDefKeyMap = /* @__PURE__ */ new Map(), adjustedMarkDefs = block.markDefs?.map((markDef) => {
+        if (endBlockMarkDefsKeys.includes(markDef._key)) {
+          const newKey = context.keyGenerator();
+          return markDefKeyMap.set(markDef._key, newKey), {
+            ...markDef,
+            _key: newKey
+          };
+        }
+        return markDef;
+      }), adjustedChildren = block.children.map((child) => {
+        if (isSpan(context, child)) {
+          const marks = child.marks?.map((mark) => markDefKeyMap.get(mark) || mark) ?? [];
+          if (!isEqual(child.marks, marks))
+            return {
+              ...child,
+              _key: endBlockChildKeys.includes(child._key) ? context.keyGenerator() : child._key,
+              marks
+            };
+        }
+        return endBlockChildKeys.includes(child._key) ? {
+          ...child,
+          _key: context.keyGenerator()
+        } : child;
+      });
+      Transforms.setNodes(editor, {
+        markDefs: [...endBlock.markDefs ?? [], ...adjustedMarkDefs ?? []]
       }, {
         at: endBlockPath
-      }), select === "end") {
-        Transforms.insertFragment(editor, [block], {
+      });
+      const adjustedBlock = isEqual(block.children, adjustedChildren) ? block : {
+        ...block,
+        children: adjustedChildren
+      };
+      if (select === "end") {
+        Transforms.insertFragment(editor, [adjustedBlock], {
           voids: !0
         });
         return;
       }
-      Transforms.insertFragment(editor, [block], {
+      Transforms.insertFragment(editor, [adjustedBlock], {
         at: currentSelection,
         voids: !0
       }), select === "start" ? Transforms.select(editor, selectionStartPoint) : Point.equals(selectionStartPoint, endBlockEndPoint) || Transforms.select(editor, selectionStartPoint);
@@ -3556,9 +3596,7 @@ function insertBlock({
         Transforms.insertNodes(editor, [block], {
           at: endBlockPath,
           select: !1
-        }), (select === "start" || select === "end") && Transforms.select(editor, Editor.start(editor, endBlockPath)), isEmptyTextBlock({
-          schema
-        }, endBlock) && Transforms.removeNodes(editor, {
+        }), (select === "start" || select === "end") && Transforms.select(editor, Editor.start(editor, endBlockPath)), isEmptyTextBlock(context, endBlock) && Transforms.removeNodes(editor, {
           at: Path.next(endBlockPath)
         });
       else if (Range.isCollapsed(currentSelection) && Point.equals(selectionEndPoint, endBlockEndPoint2)) {
@@ -4094,6 +4132,58 @@ function createWithObjectKeys(editorActor) {
         });
         return;
       }
+      if (operation.type === "merge_node") {
+        const index = operation.path[operation.path.length - 1], prevPath = Path.previous(operation.path), prevIndex = prevPath[prevPath.length - 1];
+        if (operation.path.length !== 1 || prevPath.length !== 1) {
+          apply2(operation);
+          return;
+        }
+        const block = editor.value.at(index), previousBlock = editor.value.at(prevIndex);
+        if (!block || !previousBlock) {
+          apply2(operation);
+          return;
+        }
+        if (!isTextBlock(editorActor.getSnapshot().context, block) || !isTextBlock(editorActor.getSnapshot().context, previousBlock)) {
+          apply2(operation);
+          return;
+        }
+        const previousBlockChildKeys = previousBlock.children.map((child) => child._key), previousBlockMarkDefKeys = previousBlock.markDefs?.map((markDef) => markDef._key) ?? [], markDefKeyMap = /* @__PURE__ */ new Map(), adjustedMarkDefs = block.markDefs?.map((markDef) => {
+          if (previousBlockMarkDefKeys.includes(markDef._key)) {
+            const newKey = editorActor.getSnapshot().context.keyGenerator();
+            return markDefKeyMap.set(markDef._key, newKey), {
+              ...markDef,
+              _key: newKey
+            };
+          }
+          return markDef;
+        });
+        let childIndex = 0;
+        for (const child of block.children) {
+          if (isSpan(editorActor.getSnapshot().context, child)) {
+            const marks = child.marks?.map((mark) => markDefKeyMap.get(mark) || mark) ?? [];
+            isEqual(child.marks, marks) || Transforms.setNodes(editor, {
+              marks
+            }, {
+              at: [index, childIndex]
+            });
+          }
+          previousBlockChildKeys.includes(child._key) && Transforms.setNodes(editor, {
+            _key: editorActor.getSnapshot().context.keyGenerator()
+          }, {
+            at: [index, childIndex]
+          }), childIndex++;
+        }
+        apply2({
+          ...operation,
+          properties: {
+            ...operation.properties,
+            // Make sure the adjusted markDefs are carried along for the merge
+            // operation
+            markDefs: adjustedMarkDefs
+          }
+        });
+        return;
+      }
       apply2(operation);
     }, editor.normalizeNode = (entry) => {
       const [node, path] = entry;
@@ -6996,6 +7086,57 @@ const MAX_LIST_LEVEL = 10, clearListOnBackspace = defineBehavior({
       at: selection
     })]]
   }),
+  defineBehavior({
+    on: "split",
+    guard: ({
+      snapshot
+    }) => {
+      const selection = snapshot.context.selection;
+      if (!selection || isSelectionCollapsed(selection))
+        return !1;
+      const selectionStartBlock = getSelectionStartBlock$1(snapshot), selectionEndBlock = getSelectionEndBlock$1(snapshot);
+      if (!selectionStartBlock || !selectionEndBlock || selectionStartBlock.node._key === selectionEndBlock.node._key)
+        return !1;
+      const startPoint = getSelectionStartPoint(selection), startBlockEndPoint = getBlockEndPoint({
+        context: snapshot.context,
+        block: selectionStartBlock
+      }), endPoint = getSelectionEndPoint(selection), endBlockStartPoint = getBlockStartPoint({
+        context: snapshot.context,
+        block: selectionEndBlock
+      }), blocksInBetween = getSelectedValue(snapshot).filter((block) => block._key !== selectionStartBlock.node._key && block._key !== selectionEndBlock.node._key);
+      return {
+        startPoint,
+        startBlockEndPoint,
+        endPoint,
+        endBlockStartPoint,
+        blocksInBetween
+      };
+    },
+    actions: [(_, {
+      startPoint,
+      startBlockEndPoint,
+      endPoint,
+      endBlockStartPoint,
+      blocksInBetween
+    }) => [raise({
+      type: "delete",
+      at: {
+        anchor: startPoint,
+        focus: startBlockEndPoint
+      }
+    }), ...blocksInBetween.map((block) => raise({
+      type: "delete.block",
+      at: [{
+        _key: block._key
+      }]
+    })), raise({
+      type: "delete",
+      at: {
+        anchor: endBlockStartPoint,
+        focus: endPoint
+      }
+    })]]
+  }),
   defineBehavior({
     on: "split",
     guard: ({
@@ -7042,8 +7183,8 @@ const MAX_LIST_LEVEL = 10, clearListOnBackspace = defineBehavior({
         }),
         context: snapshot.context,
         options: {
-          refreshKeys: !0,
-          validateFields: !0
+          refreshKeys: !1,
+          validateFields: !1
         }
       });
       return newTextBlock ? {
@@ -11370,8 +11511,8 @@ const debug = debugWithName("component:Editable"), PortableTextEditable = forwar
               },
               blocks: result_1.insert,
               options: {
-                refreshKeys: !0,
-                validateFields: !0
+                refreshKeys: !1,
+                validateFields: !1
               }
             }),
             placement: "auto"
@@ -11752,12 +11893,12 @@ function defineSchema(definition) {
   return definition;
 }
 const usePortableTextEditorSelection = () => {
-  const $ = c(3), editorActor = useContext(EditorActorContext), [selection, setSelection] = useState(null);
+  const $ = c(3), editorActor = useContext(EditorActorContext), [selection, setSelection2] = useState(null);
   let t0, t1;
   return $[0] !== editorActor ? (t0 = () => {
     const subscription = editorActor.on("selection", (event) => {
       startTransition(() => {
-        setSelection(event.selection);
+        setSelection2(event.selection);
       });
     });
     return () => {