@portabletext/editor 4.1.0 → 4.1.2

package/lib/index.js

@@ -1,9 +1,9 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { c } from "react/compiler-runtime";
 import { useSelector, useActorRef } from "@xstate/react";
-import { createContext, useRef, useContext, useState, useEffect, forwardRef, Component, startTransition } from "react";
+import { createContext, useContext, useRef, useState, useEffect, forwardRef, Component, startTransition } from "react";
 import { Element as Element$1, Text, Range, Editor, Node, Point, Path, Transforms, createEditor, deleteText, Operation } from "slate";
-import { useSelected, useSlateSelector, useSlateStatic, ReactEditor, useSlate, Editable, withReact, Slate } from "slate-react";
+import { useSlateStatic, ReactEditor, useSlate, Editable, withReact, Slate } from "slate-react";
 import debug$e from "debug";
 import { DOMEditor, isDOMNode, EDITOR_TO_PENDING_SELECTION, IS_FOCUSED, IS_READ_ONLY } from "slate-dom";
 import { getBlockEndPoint, getBlockStartPoint, getBlockKeyFromSelectionPoint, isSelectionCollapsed, isKeyedSegment, isEqualSelectionPoints, getChildKeyFromSelectionPoint, blockOffsetToSpanSelectionPoint, defaultKeyGenerator, parseBlocks, parseBlock, isListBlock, isTypedObject, getSelectionStartPoint as getSelectionStartPoint$1, getSelectionEndPoint as getSelectionEndPoint$1, parseAnnotation, parseMarkDefs, parseSpan, parseInlineObject } from "./_chunks-es/util.slice-blocks.js";
@@ -11,7 +11,7 @@ import { isTextBlock, isSpan, compileSchema } from "@portabletext/schema";
 import { defineSchema } from "@portabletext/schema";
 import { isEmptyTextBlock, sliceTextBlock, getTextBlockText } from "./_chunks-es/util.slice-text-block.js";
 import { setup, fromCallback, assign, and, enqueueActions, emit, assertEvent, raise as raise$1, not, createActor } from "xstate";
-import { isSelectionCollapsed as isSelectionCollapsed$1, getFocusSpan as getFocusSpan$1, isOverlappingSelection, getFocusInlineObject, getFocusTextBlock, getSelectedBlocks, isSelectionExpanded, getSelectionStartBlock, getSelectionEndBlock, getFocusBlock as getFocusBlock$1, isSelectingEntireBlocks, getSelectedValue, isActiveAnnotation, getActiveAnnotationsMarks, getActiveDecorators, getSelectionStartChild, getSelectionEndChild, getSelectionStartPoint, getSelectionEndPoint, getPreviousSpan, getNextSpan, getCaretWordSelection, getFocusBlockObject, getPreviousBlock, getNextBlock, getMarkState, isAtTheEndOfBlock, isAtTheStartOfBlock, getFocusListBlock, isActiveDecorator, getFocusChild as getFocusChild$1, getActiveAnnotations, getLastBlock as getLastBlock$1, getSelectedTextBlocks, isActiveListItem, isActiveStyle } from "./_chunks-es/selector.is-at-the-start-of-block.js";
+import { isSelectionCollapsed as isSelectionCollapsed$1, getFocusSpan as getFocusSpan$1, getSelectedChildren, getSelectionStartPoint, getSelectionEndPoint, getFocusInlineObject, getFocusTextBlock, getSelectedBlocks, isSelectionExpanded, getSelectionStartBlock, getSelectionEndBlock, isOverlappingSelection, getFocusBlock as getFocusBlock$1, isSelectingEntireBlocks, getSelectedValue, isActiveAnnotation, getActiveAnnotationsMarks, getActiveDecorators, getSelectionStartChild, getSelectionEndChild, getPreviousSpan, getNextSpan, getCaretWordSelection, getFocusBlockObject, getPreviousBlock, getNextBlock, getMarkState, isAtTheEndOfBlock, isAtTheStartOfBlock, getFocusListBlock, isActiveDecorator, getFocusChild as getFocusChild$1, getActiveAnnotations, getLastBlock as getLastBlock$1, getSelectedTextBlocks, isActiveListItem, isActiveStyle } from "./_chunks-es/selector.is-at-the-start-of-block.js";
 import { defineBehavior, forward, raise, effect } from "./behaviors/index.js";
 import { compileSchemaDefinitionToPortableTextMemberSchemaTypes, createPortableTextMemberSchemaTypes, portableTextMemberSchemaTypesToSchema } from "@portabletext/sanity-bridge";
 import { htmlToBlocks } from "@portabletext/block-tools";
@@ -1156,43 +1156,155 @@ function DropIndicator() {
     zIndex: 5
   }, children: /* @__PURE__ */ jsx("span", {}) }), $[0] = t0) : t0 = $[0], t0;
 }
+function defaultCompare(a, b) {
+  return a === b;
+}
+function useEditorSelector(editor, selector, t0) {
+  const $ = c(3), compare = t0 === void 0 ? defaultCompare : t0;
+  let t1;
+  return $[0] !== editor || $[1] !== selector ? (t1 = (editorActorSnapshot) => {
+    const snapshot = getEditorSnapshot({
+      editorActorSnapshot,
+      slateEditorInstance: editor._internal.slateEditor.instance
+    });
+    return selector(snapshot);
+  }, $[0] = editor, $[1] = selector, $[2] = t1) : t1 = $[2], useSelector(editor._internal.editorActor, t1, compare);
+}
+function getEditorSnapshot({
+  editorActorSnapshot,
+  slateEditorInstance
+}) {
+  const selection = slateEditorInstance.selection ? slateRangeToSelection({
+    schema: editorActorSnapshot.context.schema,
+    editor: slateEditorInstance,
+    range: slateEditorInstance.selection
+  }) : null;
+  return {
+    blockIndexMap: slateEditorInstance.blockIndexMap,
+    context: {
+      converters: [...editorActorSnapshot.context.converters],
+      keyGenerator: editorActorSnapshot.context.keyGenerator,
+      readOnly: editorActorSnapshot.matches({
+        "edit mode": "read only"
+      }),
+      schema: editorActorSnapshot.context.schema,
+      selection,
+      value: slateEditorInstance.value
+    },
+    decoratorState: slateEditorInstance.decoratorState
+  };
+}
+const emptySet = /* @__PURE__ */ new Set(), defaultSelectionState = {
+  focusedChildKey: void 0,
+  selectedChildKeys: emptySet,
+  focusedBlockKey: void 0,
+  selectedBlockKeys: emptySet
+}, SelectionStateContext = createContext(defaultSelectionState);
+function SelectionStateProvider(t0) {
+  const $ = c(5), {
+    children
+  } = t0, editorActor = useContext(EditorActorContext), slateEditor = useSlateStatic();
+  let t1;
+  $[0] !== slateEditor ? (t1 = (editorActorSnapshot) => {
+    const snapshot = getEditorSnapshot({
+      editorActorSnapshot,
+      slateEditorInstance: slateEditor
+    });
+    if (!snapshot.context.selection)
+      return defaultSelectionState;
+    const isCollapsed = isSelectionCollapsed$1(snapshot);
+    let focusedChildKey;
+    isCollapsed && (focusedChildKey = getFocusSpan$1(snapshot)?.node._key);
+    const selectedChildren = getSelectedChildren()(snapshot);
+    let selectedChildKeys = selectedChildren.length > 0 ? new Set(selectedChildren.map(_temp$4)) : emptySet;
+    isCollapsed && focusedChildKey && !selectedChildKeys.has(focusedChildKey) && (selectedChildKeys = new Set(selectedChildKeys), selectedChildKeys.add(focusedChildKey));
+    const startPoint = getSelectionStartPoint(snapshot), endPoint = getSelectionEndPoint(snapshot), startBlockKey = startPoint ? getBlockKeyFromSelectionPoint(startPoint) : void 0, endBlockKey = endPoint ? getBlockKeyFromSelectionPoint(endPoint) : void 0;
+    let selectedBlockKeys = emptySet;
+    if (startBlockKey && endBlockKey) {
+      const startBlockIndex = snapshot.blockIndexMap.get(startBlockKey), endBlockIndex = snapshot.blockIndexMap.get(endBlockKey);
+      if (startBlockIndex !== void 0 && endBlockIndex !== void 0) {
+        const minIndex = Math.min(startBlockIndex, endBlockIndex), maxIndex = Math.max(startBlockIndex, endBlockIndex);
+        selectedBlockKeys = /* @__PURE__ */ new Set();
+        for (const [key, index] of snapshot.blockIndexMap)
+          index >= minIndex && index <= maxIndex && selectedBlockKeys.add(key);
+      }
+    }
+    const focusedBlockKey = isCollapsed ? startBlockKey : void 0;
+    return {
+      focusedChildKey,
+      selectedChildKeys: selectedChildKeys.size > 0 ? selectedChildKeys : emptySet,
+      focusedBlockKey,
+      selectedBlockKeys: selectedBlockKeys.size > 0 ? selectedBlockKeys : emptySet
+    };
+  }, $[0] = slateEditor, $[1] = t1) : t1 = $[1];
+  const selectionState = useSelector(editorActor, t1, _temp2$3);
+  let t2;
+  return $[2] !== children || $[3] !== selectionState ? (t2 = /* @__PURE__ */ jsx(SelectionStateContext.Provider, { value: selectionState, children }), $[2] = children, $[3] = selectionState, $[4] = t2) : t2 = $[4], t2;
+}
+function _temp2$3(prev, next) {
+  if (prev.focusedChildKey !== next.focusedChildKey)
+    return !1;
+  if (prev.selectedChildKeys !== next.selectedChildKeys) {
+    if (prev.selectedChildKeys.size !== next.selectedChildKeys.size)
+      return !1;
+    for (const key_0 of prev.selectedChildKeys)
+      if (!next.selectedChildKeys.has(key_0))
+        return !1;
+  }
+  if (prev.focusedBlockKey !== next.focusedBlockKey)
+    return !1;
+  if (prev.selectedBlockKeys !== next.selectedBlockKeys) {
+    if (prev.selectedBlockKeys.size !== next.selectedBlockKeys.size)
+      return !1;
+    for (const key_1 of prev.selectedBlockKeys)
+      if (!next.selectedBlockKeys.has(key_1))
+        return !1;
+  }
+  return !0;
+}
+function _temp$4(child) {
+  return child.node._key;
+}
 function RenderBlockObject(props) {
-  const $ = c(33), blockObjectRef = useRef(null), selected = useSelected();
+  const $ = c(34), blockObjectRef = useRef(null), {
+    selectedBlockKeys,
+    focusedBlockKey
+  } = useContext(SelectionStateContext);
   let t0;
-  $[0] !== selected ? (t0 = (editor) => selected && editor.selection !== null && Range.isCollapsed(editor.selection), $[0] = selected, $[1] = t0) : t0 = $[1];
-  const focused = useSlateSelector(t0);
+  $[0] !== props.element._key || $[1] !== selectedBlockKeys ? (t0 = selectedBlockKeys.has(props.element._key), $[0] = props.element._key, $[1] = selectedBlockKeys, $[2] = t0) : t0 = $[2];
+  const selected = t0, focused = focusedBlockKey === props.element._key;
   let t1;
-  if ($[2] !== props.element._type || $[3] !== props.legacySchema.blockObjects) {
+  if ($[3] !== props.element._type || $[4] !== props.legacySchema.blockObjects) {
     let t22;
-    $[5] !== props.element._type ? (t22 = (schemaType) => schemaType.name === props.element._type, $[5] = props.element._type, $[6] = t22) : t22 = $[6], t1 = props.legacySchema.blockObjects.find(t22), $[2] = props.element._type, $[3] = props.legacySchema.blockObjects, $[4] = t1;
+    $[6] !== props.element._type ? (t22 = (schemaType) => schemaType.name === props.element._type, $[6] = props.element._type, $[7] = t22) : t22 = $[7], t1 = props.legacySchema.blockObjects.find(t22), $[3] = props.element._type, $[4] = props.legacySchema.blockObjects, $[5] = t1;
   } else
-    t1 = $[4];
+    t1 = $[5];
   const legacySchemaType = t1;
   legacySchemaType || console.error(`Unable to find Block Object "${props.element._type}" in Schema`);
   let t2;
-  $[7] !== props.blockObject || $[8] !== props.element._key || $[9] !== props.element._type ? (t2 = props.blockObject ?? {
+  $[8] !== props.blockObject || $[9] !== props.element._key || $[10] !== props.element._type ? (t2 = props.blockObject ?? {
     _key: props.element._key,
     _type: props.element._type
-  }, $[7] = props.blockObject, $[8] = props.element._key, $[9] = props.element._type, $[10] = t2) : t2 = $[10];
+  }, $[8] = props.blockObject, $[9] = props.element._key, $[10] = props.element._type, $[11] = t2) : t2 = $[11];
   const blockObject = t2;
   let t3;
-  $[11] !== props.dropPosition ? (t3 = props.dropPosition === "start" ? /* @__PURE__ */ jsx(DropIndicator, {}) : null, $[11] = props.dropPosition, $[12] = t3) : t3 = $[12];
+  $[12] !== props.dropPosition ? (t3 = props.dropPosition === "start" ? /* @__PURE__ */ jsx(DropIndicator, {}) : null, $[12] = props.dropPosition, $[13] = t3) : t3 = $[13];
   const t4 = !props.readOnly;
   let t5;
-  $[13] !== blockObject || $[14] !== focused || $[15] !== legacySchemaType || $[16] !== props.element._key || $[17] !== props.renderBlock || $[18] !== selected ? (t5 = props.renderBlock && legacySchemaType ? /* @__PURE__ */ jsx(RenderBlock$1, { renderBlock: props.renderBlock, editorElementRef: blockObjectRef, focused, path: [{
+  $[14] !== blockObject || $[15] !== focused || $[16] !== legacySchemaType || $[17] !== props.element._key || $[18] !== props.renderBlock || $[19] !== selected ? (t5 = props.renderBlock && legacySchemaType ? /* @__PURE__ */ jsx(RenderBlock$1, { renderBlock: props.renderBlock, editorElementRef: blockObjectRef, focused, path: [{
     _key: props.element._key
-  }], schemaType: legacySchemaType, selected, type: legacySchemaType, value: blockObject, children: /* @__PURE__ */ jsx(RenderDefaultBlockObject, { blockObject }) }) : /* @__PURE__ */ jsx(RenderDefaultBlockObject, { blockObject }), $[13] = blockObject, $[14] = focused, $[15] = legacySchemaType, $[16] = props.element._key, $[17] = props.renderBlock, $[18] = selected, $[19] = t5) : t5 = $[19];
+  }], schemaType: legacySchemaType, selected, type: legacySchemaType, value: blockObject, children: /* @__PURE__ */ jsx(RenderDefaultBlockObject, { blockObject }) }) : /* @__PURE__ */ jsx(RenderDefaultBlockObject, { blockObject }), $[14] = blockObject, $[15] = focused, $[16] = legacySchemaType, $[17] = props.element._key, $[18] = props.renderBlock, $[19] = selected, $[20] = t5) : t5 = $[20];
   let t6;
-  $[20] !== t4 || $[21] !== t5 ? (t6 = /* @__PURE__ */ jsx("div", { ref: blockObjectRef, contentEditable: !1, draggable: t4, children: t5 }), $[20] = t4, $[21] = t5, $[22] = t6) : t6 = $[22];
+  $[21] !== t4 || $[22] !== t5 ? (t6 = /* @__PURE__ */ jsx("div", { ref: blockObjectRef, contentEditable: !1, draggable: t4, children: t5 }), $[21] = t4, $[22] = t5, $[23] = t6) : t6 = $[23];
   let t7;
-  $[23] !== props.dropPosition ? (t7 = props.dropPosition === "end" ? /* @__PURE__ */ jsx(DropIndicator, {}) : null, $[23] = props.dropPosition, $[24] = t7) : t7 = $[24];
+  $[24] !== props.dropPosition ? (t7 = props.dropPosition === "end" ? /* @__PURE__ */ jsx(DropIndicator, {}) : null, $[24] = props.dropPosition, $[25] = t7) : t7 = $[25];
   let t8;
-  return $[25] !== props.attributes || $[26] !== props.children || $[27] !== props.element._key || $[28] !== props.element._type || $[29] !== t3 || $[30] !== t6 || $[31] !== t7 ? (t8 = /* @__PURE__ */ jsxs("div", { ...props.attributes, className: "pt-block pt-object-block", "data-block-key": props.element._key, "data-block-name": props.element._type, "data-block-type": "object", children: [
+  return $[26] !== props.attributes || $[27] !== props.children || $[28] !== props.element._key || $[29] !== props.element._type || $[30] !== t3 || $[31] !== t6 || $[32] !== t7 ? (t8 = /* @__PURE__ */ jsxs("div", { ...props.attributes, className: "pt-block pt-object-block", "data-block-key": props.element._key, "data-block-name": props.element._type, "data-block-type": "object", children: [
     t3,
     props.children,
     t6,
     t7
-  ] }), $[25] = props.attributes, $[26] = props.children, $[27] = props.element._key, $[28] = props.element._type, $[29] = t3, $[30] = t6, $[31] = t7, $[32] = t8) : t8 = $[32], t8;
+  ] }), $[26] = props.attributes, $[27] = props.children, $[28] = props.element._key, $[29] = props.element._type, $[30] = t3, $[31] = t6, $[32] = t7, $[33] = t8) : t8 = $[33], t8;
 }
 function RenderBlock$1({
   renderBlock,
@@ -1217,20 +1329,23 @@ function RenderBlock$1({
   });
 }
 function RenderInlineObject(props) {
-  const $ = c(32), inlineObjectRef = useRef(null), slateEditor = useSlateStatic(), selected = useSelected();
+  const $ = c(33), inlineObjectRef = useRef(null), slateEditor = useSlateStatic(), {
+    selectedChildKeys,
+    focusedChildKey
+  } = useContext(SelectionStateContext);
   let t0;
-  $[0] !== selected ? (t0 = (editor) => selected && editor.selection !== null && Range.isCollapsed(editor.selection), $[0] = selected, $[1] = t0) : t0 = $[1];
-  const focused = useSlateSelector(t0);
+  $[0] !== props.element._key || $[1] !== selectedChildKeys ? (t0 = selectedChildKeys.has(props.element._key), $[0] = props.element._key, $[1] = selectedChildKeys, $[2] = t0) : t0 = $[2];
+  const selected = t0, focused = focusedChildKey === props.element._key;
   let t1;
-  if ($[2] !== props.element._type || $[3] !== props.legacySchema.inlineObjects) {
+  if ($[3] !== props.element._type || $[4] !== props.legacySchema.inlineObjects) {
     let t22;
-    $[5] !== props.element._type ? (t22 = (inlineObject) => inlineObject.name === props.element._type, $[5] = props.element._type, $[6] = t22) : t22 = $[6], t1 = props.legacySchema.inlineObjects.find(t22), $[2] = props.element._type, $[3] = props.legacySchema.inlineObjects, $[4] = t1;
+    $[6] !== props.element._type ? (t22 = (inlineObject) => inlineObject.name === props.element._type, $[6] = props.element._type, $[7] = t22) : t22 = $[7], t1 = props.legacySchema.inlineObjects.find(t22), $[3] = props.element._type, $[4] = props.legacySchema.inlineObjects, $[5] = t1;
   } else
-    t1 = $[4];
+    t1 = $[5];
   const legacySchemaType = t1;
   legacySchemaType || console.error(`Unable to find Inline Object "${props.element._type}" in Schema`);
   let t2;
-  if ($[7] !== props.element || $[8] !== slateEditor) {
+  if ($[8] !== props.element || $[9] !== slateEditor) {
     const path = DOMEditor.findPath(slateEditor, props.element);
     t2 = getPointBlock({
       editor: slateEditor,
@@ -1238,35 +1353,35 @@ function RenderInlineObject(props) {
         path,
         offset: 0
       }
-    }), $[7] = props.element, $[8] = slateEditor, $[9] = t2;
+    }), $[8] = props.element, $[9] = slateEditor, $[10] = t2;
   } else
-    t2 = $[9];
+    t2 = $[10];
   const [block] = t2;
   block || console.error(`Unable to find parent block of inline object ${props.element._key}`);
   let t3;
-  $[10] !== props.element ? (t3 = "value" in props.element && typeof props.element.value == "object" ? props.element.value : {}, $[10] = props.element, $[11] = t3) : t3 = $[11];
+  $[11] !== props.element ? (t3 = "value" in props.element && typeof props.element.value == "object" ? props.element.value : {}, $[11] = props.element, $[12] = t3) : t3 = $[12];
   let t4;
-  $[12] !== props.element._key || $[13] !== props.element._type || $[14] !== t3 ? (t4 = {
+  $[13] !== props.element._key || $[14] !== props.element._type || $[15] !== t3 ? (t4 = {
     _key: props.element._key,
     _type: props.element._type,
     ...t3
-  }, $[12] = props.element._key, $[13] = props.element._type, $[14] = t3, $[15] = t4) : t4 = $[15];
+  }, $[13] = props.element._key, $[14] = props.element._type, $[15] = t3, $[16] = t4) : t4 = $[16];
   const inlineObject_0 = t4, t5 = !props.readOnly;
   let t6;
-  $[16] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t6 = {
+  $[17] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t6 = {
     display: "inline-block"
-  }, $[16] = t6) : t6 = $[16];
+  }, $[17] = t6) : t6 = $[17];
   let t7;
-  $[17] !== block || $[18] !== focused || $[19] !== inlineObject_0 || $[20] !== legacySchemaType || $[21] !== props.element._key || $[22] !== props.renderChild || $[23] !== selected ? (t7 = /* @__PURE__ */ jsx("span", { ref: inlineObjectRef, style: t6, children: props.renderChild && block && legacySchemaType ? /* @__PURE__ */ jsx(RenderChild$1, { renderChild: props.renderChild, annotations: [], editorElementRef: inlineObjectRef, selected, focused, path: [{
+  $[18] !== block || $[19] !== focused || $[20] !== inlineObject_0 || $[21] !== legacySchemaType || $[22] !== props.element._key || $[23] !== props.renderChild || $[24] !== selected ? (t7 = /* @__PURE__ */ jsx("span", { ref: inlineObjectRef, style: t6, children: props.renderChild && block && legacySchemaType ? /* @__PURE__ */ jsx(RenderChild$1, { renderChild: props.renderChild, annotations: [], editorElementRef: inlineObjectRef, selected, focused, path: [{
     _key: block._key
   }, "children", {
     _key: props.element._key
-  }], schemaType: legacySchemaType, value: inlineObject_0, type: legacySchemaType, children: /* @__PURE__ */ jsx(RenderDefaultInlineObject, { inlineObject: inlineObject_0 }) }) : /* @__PURE__ */ jsx(RenderDefaultInlineObject, { inlineObject: inlineObject_0 }) }), $[17] = block, $[18] = focused, $[19] = inlineObject_0, $[20] = legacySchemaType, $[21] = props.element._key, $[22] = props.renderChild, $[23] = selected, $[24] = t7) : t7 = $[24];
+  }], schemaType: legacySchemaType, value: inlineObject_0, type: legacySchemaType, children: /* @__PURE__ */ jsx(RenderDefaultInlineObject, { inlineObject: inlineObject_0 }) }) : /* @__PURE__ */ jsx(RenderDefaultInlineObject, { inlineObject: inlineObject_0 }) }), $[18] = block, $[19] = focused, $[20] = inlineObject_0, $[21] = legacySchemaType, $[22] = props.element._key, $[23] = props.renderChild, $[24] = selected, $[25] = t7) : t7 = $[25];
   let t8;
-  return $[25] !== inlineObject_0._key || $[26] !== inlineObject_0._type || $[27] !== props.attributes || $[28] !== props.children || $[29] !== t5 || $[30] !== t7 ? (t8 = /* @__PURE__ */ jsxs("span", { ...props.attributes, draggable: t5, className: "pt-inline-object", "data-child-key": inlineObject_0._key, "data-child-name": inlineObject_0._type, "data-child-type": "object", children: [
+  return $[26] !== inlineObject_0._key || $[27] !== inlineObject_0._type || $[28] !== props.attributes || $[29] !== props.children || $[30] !== t5 || $[31] !== t7 ? (t8 = /* @__PURE__ */ jsxs("span", { ...props.attributes, draggable: t5, className: "pt-inline-object", "data-child-key": inlineObject_0._key, "data-child-name": inlineObject_0._type, "data-child-type": "object", children: [
     props.children,
     t7
-  ] }), $[25] = inlineObject_0._key, $[26] = inlineObject_0._type, $[27] = props.attributes, $[28] = props.children, $[29] = t5, $[30] = t7, $[31] = t8) : t8 = $[31], t8;
+  ] }), $[26] = inlineObject_0._key, $[27] = inlineObject_0._type, $[28] = props.attributes, $[29] = props.children, $[30] = t5, $[31] = t7, $[32] = t8) : t8 = $[32], t8;
 }
 function RenderChild$1({
   renderChild,
@@ -1293,87 +1408,90 @@ function RenderChild$1({
   });
 }
 function RenderTextBlock(props) {
-  const $ = c(75), blockRef = useRef(null), selected = useSelected();
+  const $ = c(77), blockRef = useRef(null), {
+    selectedBlockKeys,
+    focusedBlockKey
+  } = useContext(SelectionStateContext);
   let t0;
-  $[0] !== selected ? (t0 = (editor) => selected && editor.selection !== null && Range.isCollapsed(editor.selection), $[0] = selected, $[1] = t0) : t0 = $[1];
-  const focused = useSlateSelector(t0);
+  $[0] !== props.textBlock._key || $[1] !== selectedBlockKeys ? (t0 = selectedBlockKeys.has(props.textBlock._key), $[0] = props.textBlock._key, $[1] = selectedBlockKeys, $[2] = t0) : t0 = $[2];
+  const selected = t0, focused = focusedBlockKey === props.textBlock._key, slateEditor = useSlateStatic();
   let t1;
-  $[2] !== props.textBlock._key ? (t1 = (editor_0) => editor_0.listIndexMap.get(props.textBlock._key), $[2] = props.textBlock._key, $[3] = t1) : t1 = $[3];
-  const listIndex = useSlateSelector(t1);
+  $[3] !== props.textBlock._key || $[4] !== slateEditor.listIndexMap ? (t1 = slateEditor.listIndexMap.get(props.textBlock._key), $[3] = props.textBlock._key, $[4] = slateEditor.listIndexMap, $[5] = t1) : t1 = $[5];
+  const listIndex = t1;
   let children = props.children;
   if (props.renderStyle && props.textBlock.style) {
     let t22;
-    $[4] !== props.legacySchema || $[5] !== props.textBlock.style ? (t22 = props.textBlock.style !== void 0 ? props.legacySchema.styles.find((style) => style.value === props.textBlock.style) : void 0, $[4] = props.legacySchema, $[5] = props.textBlock.style, $[6] = t22) : t22 = $[6];
+    $[6] !== props.legacySchema || $[7] !== props.textBlock.style ? (t22 = props.textBlock.style !== void 0 ? props.legacySchema.styles.find((style) => style.value === props.textBlock.style) : void 0, $[6] = props.legacySchema, $[7] = props.textBlock.style, $[8] = t22) : t22 = $[8];
     const legacyStyleSchemaType = t22;
     if (legacyStyleSchemaType) {
       let t32;
-      $[7] !== props.textBlock._key ? (t32 = [{
+      $[9] !== props.textBlock._key ? (t32 = [{
         _key: props.textBlock._key
-      }], $[7] = props.textBlock._key, $[8] = t32) : t32 = $[8];
+      }], $[9] = props.textBlock._key, $[10] = t32) : t32 = $[10];
       let t42;
-      $[9] !== children || $[10] !== focused || $[11] !== legacyStyleSchemaType || $[12] !== props.renderStyle || $[13] !== props.textBlock || $[14] !== selected || $[15] !== t32 ? (t42 = /* @__PURE__ */ jsx(RenderStyle, { renderStyle: props.renderStyle, block: props.textBlock, editorElementRef: blockRef, focused, path: t32, schemaType: legacyStyleSchemaType, selected, value: props.textBlock.style, children }), $[9] = children, $[10] = focused, $[11] = legacyStyleSchemaType, $[12] = props.renderStyle, $[13] = props.textBlock, $[14] = selected, $[15] = t32, $[16] = t42) : t42 = $[16], children = t42;
+      $[11] !== children || $[12] !== focused || $[13] !== legacyStyleSchemaType || $[14] !== props.renderStyle || $[15] !== props.textBlock || $[16] !== selected || $[17] !== t32 ? (t42 = /* @__PURE__ */ jsx(RenderStyle, { renderStyle: props.renderStyle, block: props.textBlock, editorElementRef: blockRef, focused, path: t32, schemaType: legacyStyleSchemaType, selected, value: props.textBlock.style, children }), $[11] = children, $[12] = focused, $[13] = legacyStyleSchemaType, $[14] = props.renderStyle, $[15] = props.textBlock, $[16] = selected, $[17] = t32, $[18] = t42) : t42 = $[18], children = t42;
     } else
       console.error(`Unable to find Schema type for text block style ${props.textBlock.style}`);
   }
   if (props.renderListItem && props.textBlock.listItem) {
     let t22;
-    if ($[17] !== props.legacySchema.lists || $[18] !== props.textBlock.listItem) {
+    if ($[19] !== props.legacySchema.lists || $[20] !== props.textBlock.listItem) {
       let t32;
-      $[20] !== props.textBlock.listItem ? (t32 = (list) => list.value === props.textBlock.listItem, $[20] = props.textBlock.listItem, $[21] = t32) : t32 = $[21], t22 = props.legacySchema.lists.find(t32), $[17] = props.legacySchema.lists, $[18] = props.textBlock.listItem, $[19] = t22;
+      $[22] !== props.textBlock.listItem ? (t32 = (list) => list.value === props.textBlock.listItem, $[22] = props.textBlock.listItem, $[23] = t32) : t32 = $[23], t22 = props.legacySchema.lists.find(t32), $[19] = props.legacySchema.lists, $[20] = props.textBlock.listItem, $[21] = t22;
     } else
-      t22 = $[19];
+      t22 = $[21];
     const legacyListItemSchemaType = t22;
     if (legacyListItemSchemaType) {
       const t32 = props.textBlock.level ?? 1;
       let t42;
-      $[22] !== props.textBlock._key ? (t42 = [{
+      $[24] !== props.textBlock._key ? (t42 = [{
         _key: props.textBlock._key
-      }], $[22] = props.textBlock._key, $[23] = t42) : t42 = $[23];
+      }], $[24] = props.textBlock._key, $[25] = t42) : t42 = $[25];
       let t52;
-      $[24] !== children || $[25] !== focused || $[26] !== legacyListItemSchemaType || $[27] !== props.renderListItem || $[28] !== props.textBlock || $[29] !== selected || $[30] !== t32 || $[31] !== t42 ? (t52 = /* @__PURE__ */ jsx(RenderListItem, { renderListItem: props.renderListItem, block: props.textBlock, editorElementRef: blockRef, focused, level: t32, path: t42, selected, value: props.textBlock.listItem, schemaType: legacyListItemSchemaType, children }), $[24] = children, $[25] = focused, $[26] = legacyListItemSchemaType, $[27] = props.renderListItem, $[28] = props.textBlock, $[29] = selected, $[30] = t32, $[31] = t42, $[32] = t52) : t52 = $[32], children = t52;
+      $[26] !== children || $[27] !== focused || $[28] !== legacyListItemSchemaType || $[29] !== props.renderListItem || $[30] !== props.textBlock || $[31] !== selected || $[32] !== t32 || $[33] !== t42 ? (t52 = /* @__PURE__ */ jsx(RenderListItem, { renderListItem: props.renderListItem, block: props.textBlock, editorElementRef: blockRef, focused, level: t32, path: t42, selected, value: props.textBlock.listItem, schemaType: legacyListItemSchemaType, children }), $[26] = children, $[27] = focused, $[28] = legacyListItemSchemaType, $[29] = props.renderListItem, $[30] = props.textBlock, $[31] = selected, $[32] = t32, $[33] = t42, $[34] = t52) : t52 = $[34], children = t52;
     } else
       console.error(`Unable to find Schema type for text block list item ${props.textBlock.listItem}`);
   }
   const t2 = props.attributes;
   let t3;
-  $[33] !== props.textBlock.style ? (t3 = props.textBlock.style ? [`pt-text-block-style-${props.textBlock.style}`] : [], $[33] = props.textBlock.style, $[34] = t3) : t3 = $[34];
+  $[35] !== props.textBlock.style ? (t3 = props.textBlock.style ? [`pt-text-block-style-${props.textBlock.style}`] : [], $[35] = props.textBlock.style, $[36] = t3) : t3 = $[36];
   let t4;
-  $[35] !== props.textBlock.level || $[36] !== props.textBlock.listItem ? (t4 = props.textBlock.listItem ? ["pt-list-item", `pt-list-item-${props.textBlock.listItem}`, `pt-list-item-level-${props.textBlock.level ?? 1}`] : [], $[35] = props.textBlock.level, $[36] = props.textBlock.listItem, $[37] = t4) : t4 = $[37];
+  $[37] !== props.textBlock.level || $[38] !== props.textBlock.listItem ? (t4 = props.textBlock.listItem ? ["pt-list-item", `pt-list-item-${props.textBlock.listItem}`, `pt-list-item-level-${props.textBlock.level ?? 1}`] : [], $[37] = props.textBlock.level, $[38] = props.textBlock.listItem, $[39] = t4) : t4 = $[39];
   let t5;
-  $[38] !== t3 || $[39] !== t4 ? (t5 = ["pt-block", "pt-text-block", ...t3, ...t4], $[38] = t3, $[39] = t4, $[40] = t5) : t5 = $[40];
+  $[40] !== t3 || $[41] !== t4 ? (t5 = ["pt-block", "pt-text-block", ...t3, ...t4], $[40] = t3, $[41] = t4, $[42] = t5) : t5 = $[42];
   const t6 = t5.join(" ");
   let t7;
-  $[41] !== props.textBlock.listItem ? (t7 = props.textBlock.listItem !== void 0 ? {
+  $[43] !== props.textBlock.listItem ? (t7 = props.textBlock.listItem !== void 0 ? {
     "data-list-item": props.textBlock.listItem
-  } : {}, $[41] = props.textBlock.listItem, $[42] = t7) : t7 = $[42];
+  } : {}, $[43] = props.textBlock.listItem, $[44] = t7) : t7 = $[44];
   let t8;
-  $[43] !== props.textBlock.level ? (t8 = props.textBlock.level !== void 0 ? {
+  $[45] !== props.textBlock.level ? (t8 = props.textBlock.level !== void 0 ? {
     "data-level": props.textBlock.level
-  } : {}, $[43] = props.textBlock.level, $[44] = t8) : t8 = $[44];
+  } : {}, $[45] = props.textBlock.level, $[46] = t8) : t8 = $[46];
   let t9;
-  $[45] !== props.textBlock.style ? (t9 = props.textBlock.style !== void 0 ? {
+  $[47] !== props.textBlock.style ? (t9 = props.textBlock.style !== void 0 ? {
     "data-style": props.textBlock.style
-  } : {}, $[45] = props.textBlock.style, $[46] = t9) : t9 = $[46];
+  } : {}, $[47] = props.textBlock.style, $[48] = t9) : t9 = $[48];
   let t10;
-  $[47] !== listIndex ? (t10 = listIndex !== void 0 ? {
+  $[49] !== listIndex ? (t10 = listIndex !== void 0 ? {
     "data-list-index": listIndex
-  } : {}, $[47] = listIndex, $[48] = t10) : t10 = $[48];
+  } : {}, $[49] = listIndex, $[50] = t10) : t10 = $[50];
   let t11;
-  $[49] !== props.dropPosition ? (t11 = props.dropPosition === "start" ? /* @__PURE__ */ jsx(DropIndicator, {}) : null, $[49] = props.dropPosition, $[50] = t11) : t11 = $[50];
+  $[51] !== props.dropPosition ? (t11 = props.dropPosition === "start" ? /* @__PURE__ */ jsx(DropIndicator, {}) : null, $[51] = props.dropPosition, $[52] = t11) : t11 = $[52];
   let t12;
-  $[51] !== children || $[52] !== focused || $[53] !== props.legacySchema || $[54] !== props.renderBlock || $[55] !== props.textBlock || $[56] !== selected ? (t12 = props.renderBlock ? /* @__PURE__ */ jsx(RenderBlock, { renderBlock: props.renderBlock, editorElementRef: blockRef, focused, level: props.textBlock.level, listItem: props.textBlock.listItem, path: [{
+  $[53] !== children || $[54] !== focused || $[55] !== props.legacySchema || $[56] !== props.renderBlock || $[57] !== props.textBlock || $[58] !== selected ? (t12 = props.renderBlock ? /* @__PURE__ */ jsx(RenderBlock, { renderBlock: props.renderBlock, editorElementRef: blockRef, focused, level: props.textBlock.level, listItem: props.textBlock.listItem, path: [{
     _key: props.textBlock._key
-  }], selected, schemaType: props.legacySchema.block, style: props.textBlock.style, type: props.legacySchema.block, value: props.textBlock, children }) : children, $[51] = children, $[52] = focused, $[53] = props.legacySchema, $[54] = props.renderBlock, $[55] = props.textBlock, $[56] = selected, $[57] = t12) : t12 = $[57];
+  }], selected, schemaType: props.legacySchema.block, style: props.textBlock.style, type: props.legacySchema.block, value: props.textBlock, children }) : children, $[53] = children, $[54] = focused, $[55] = props.legacySchema, $[56] = props.renderBlock, $[57] = props.textBlock, $[58] = selected, $[59] = t12) : t12 = $[59];
   let t13;
-  $[58] !== t12 ? (t13 = /* @__PURE__ */ jsx("div", { ref: blockRef, children: t12 }), $[58] = t12, $[59] = t13) : t13 = $[59];
+  $[60] !== t12 ? (t13 = /* @__PURE__ */ jsx("div", { ref: blockRef, children: t12 }), $[60] = t12, $[61] = t13) : t13 = $[61];
   let t14;
-  $[60] !== props.dropPosition ? (t14 = props.dropPosition === "end" ? /* @__PURE__ */ jsx(DropIndicator, {}) : null, $[60] = props.dropPosition, $[61] = t14) : t14 = $[61];
+  $[62] !== props.dropPosition ? (t14 = props.dropPosition === "end" ? /* @__PURE__ */ jsx(DropIndicator, {}) : null, $[62] = props.dropPosition, $[63] = t14) : t14 = $[63];
   let t15;
-  return $[62] !== props.attributes || $[63] !== props.spellCheck || $[64] !== props.textBlock._key || $[65] !== props.textBlock._type || $[66] !== t10 || $[67] !== t11 || $[68] !== t13 || $[69] !== t14 || $[70] !== t6 || $[71] !== t7 || $[72] !== t8 || $[73] !== t9 ? (t15 = /* @__PURE__ */ jsxs("div", { ...t2, className: t6, spellCheck: props.spellCheck, "data-block-key": props.textBlock._key, "data-block-name": props.textBlock._type, "data-block-type": "text", ...t7, ...t8, ...t9, ...t10, children: [
+  return $[64] !== props.attributes || $[65] !== props.spellCheck || $[66] !== props.textBlock._key || $[67] !== props.textBlock._type || $[68] !== t10 || $[69] !== t11 || $[70] !== t13 || $[71] !== t14 || $[72] !== t6 || $[73] !== t7 || $[74] !== t8 || $[75] !== t9 ? (t15 = /* @__PURE__ */ jsxs("div", { ...t2, className: t6, spellCheck: props.spellCheck, "data-block-key": props.textBlock._key, "data-block-name": props.textBlock._type, "data-block-type": "text", ...t7, ...t8, ...t9, ...t10, children: [
     t11,
     t13,
     t14
-  ] }), $[62] = props.attributes, $[63] = props.spellCheck, $[64] = props.textBlock._key, $[65] = props.textBlock._type, $[66] = t10, $[67] = t11, $[68] = t13, $[69] = t14, $[70] = t6, $[71] = t7, $[72] = t8, $[73] = t9, $[74] = t15) : t15 = $[74], t15;
+  ] }), $[64] = props.attributes, $[65] = props.spellCheck, $[66] = props.textBlock._key, $[67] = props.textBlock._type, $[68] = t10, $[69] = t11, $[70] = t13, $[71] = t14, $[72] = t6, $[73] = t7, $[74] = t8, $[75] = t9, $[76] = t15) : t15 = $[76], t15;
 }
 function RenderBlock({
   renderBlock,
@@ -1478,101 +1596,25 @@ function _temp2$2(s_0) {
 function _temp$3(s) {
   return s.context.schema;
 }
-function defaultCompare(a, b) {
-  return a === b;
-}
-function useEditorSelector(editor, selector, t0) {
-  const $ = c(3), compare = t0 === void 0 ? defaultCompare : t0;
-  let t1;
-  return $[0] !== editor || $[1] !== selector ? (t1 = (editorActorSnapshot) => {
-    const snapshot = getEditorSnapshot({
-      editorActorSnapshot,
-      slateEditorInstance: editor._internal.slateEditor.instance
-    });
-    return selector(snapshot);
-  }, $[0] = editor, $[1] = selector, $[2] = t1) : t1 = $[2], useSelector(editor._internal.editorActor, t1, compare);
-}
-function getEditorSnapshot({
-  editorActorSnapshot,
-  slateEditorInstance
-}) {
-  const selection = slateEditorInstance.selection ? slateRangeToSelection({
-    schema: editorActorSnapshot.context.schema,
-    editor: slateEditorInstance,
-    range: slateEditorInstance.selection
-  }) : null;
-  return {
-    blockIndexMap: slateEditorInstance.blockIndexMap,
-    context: {
-      converters: [...editorActorSnapshot.context.converters],
-      keyGenerator: editorActorSnapshot.context.keyGenerator,
-      readOnly: editorActorSnapshot.matches({
-        "edit mode": "read only"
-      }),
-      schema: editorActorSnapshot.context.schema,
-      selection,
-      value: slateEditorInstance.value
-    },
-    decoratorState: slateEditorInstance.decoratorState
-  };
-}
 function RenderSpan(props) {
-  const $ = c(40), slateEditor = useSlateStatic(), editorActor = useContext(EditorActorContext), legacySchema = useSelector(editorActor, _temp$2), spanRef = useRef(null);
+  const $ = c(35), slateEditor = useSlateStatic(), editorActor = useContext(EditorActorContext), legacySchema = useSelector(editorActor, _temp$2), spanRef = useRef(null), selectionState = useContext(SelectionStateContext), focused = selectionState.focusedChildKey === props.leaf._key;
   let t0;
-  $[0] !== props.leaf._key || $[1] !== slateEditor ? (t0 = (editorActorSnapshot) => {
-    const snapshot = getEditorSnapshot({
-      editorActorSnapshot,
-      slateEditorInstance: slateEditor
-    });
-    if (!snapshot.context.selection || !isSelectionCollapsed$1(snapshot))
-      return !1;
-    const focusedSpan = getFocusSpan$1(snapshot);
-    return focusedSpan ? focusedSpan.node._key === props.leaf._key : !1;
-  }, $[0] = props.leaf._key, $[1] = slateEditor, $[2] = t0) : t0 = $[2];
-  const focused = useSelector(editorActor, t0);
+  $[0] !== props.leaf._key || $[1] !== selectionState.selectedChildKeys ? (t0 = selectionState.selectedChildKeys.has(props.leaf._key), $[0] = props.leaf._key, $[1] = selectionState.selectedChildKeys, $[2] = t0) : t0 = $[2];
+  const selected = t0, parent = props.children.props.parent, block = parent && slateEditor.isTextBlock(parent) ? parent : void 0;
   let t1;
-  $[3] !== props.children.props.parent || $[4] !== props.leaf._key || $[5] !== props.leaf.text || $[6] !== slateEditor ? (t1 = (editorActorSnapshot_0) => {
-    const snapshot_0 = getEditorSnapshot({
-      editorActorSnapshot: editorActorSnapshot_0,
-      slateEditorInstance: slateEditor
-    });
-    if (!snapshot_0.context.selection)
-      return !1;
-    const parent = props.children.props.parent, block = parent && isTextBlock(snapshot_0.context, parent) ? parent : void 0, spanSelection = block ? {
-      anchor: {
-        path: [{
-          _key: block._key
-        }, "children", {
-          _key: props.leaf._key
-        }],
-        offset: 0
-      },
-      focus: {
-        path: [{
-          _key: block._key
-        }, "children", {
-          _key: props.leaf._key
-        }],
-        offset: props.leaf.text.length
-      }
-    } : null;
-    return isOverlappingSelection(spanSelection)(snapshot_0);
-  }, $[3] = props.children.props.parent, $[4] = props.leaf._key, $[5] = props.leaf.text, $[6] = slateEditor, $[7] = t1) : t1 = $[7];
-  const selected = useSelector(editorActor, t1), parent_0 = props.children.props.parent, block_0 = parent_0 && slateEditor.isTextBlock(parent_0) ? parent_0 : void 0;
-  let t2;
-  $[8] !== block_0 || $[9] !== props.leaf._key ? (t2 = block_0 ? [{
-    _key: block_0._key
+  $[3] !== block || $[4] !== props.leaf._key ? (t1 = block ? [{
+    _key: block._key
   }, "children", {
     _key: props.leaf._key
-  }] : void 0, $[8] = block_0, $[9] = props.leaf._key, $[10] = t2) : t2 = $[10];
-  const path = t2;
+  }] : void 0, $[3] = block, $[4] = props.leaf._key, $[5] = t1) : t1 = $[5];
+  const path = t1;
   let annotationMarkDefs, children;
-  if ($[11] !== block_0 || $[12] !== editorActor || $[13] !== focused || $[14] !== legacySchema || $[15] !== path || $[16] !== props.children || $[17] !== props.leaf.marks || $[18] !== props.renderAnnotation || $[19] !== props.renderDecorator || $[20] !== selected) {
+  if ($[6] !== block || $[7] !== editorActor || $[8] !== focused || $[9] !== legacySchema || $[10] !== path || $[11] !== props.children || $[12] !== props.leaf.marks || $[13] !== props.renderAnnotation || $[14] !== props.renderDecorator || $[15] !== selected) {
     const decoratorSchemaTypes = editorActor.getSnapshot().context.schema.decorators.map(_temp2$1), decorators = [...new Set((props.leaf.marks ?? []).filter((mark) => decoratorSchemaTypes.includes(mark)))];
     annotationMarkDefs = (props.leaf.marks ?? []).flatMap((mark_0) => {
       if (decoratorSchemaTypes.includes(mark_0))
         return [];
-      const markDef_0 = block_0?.markDefs?.find((markDef) => markDef._key === mark_0);
+      const markDef_0 = block?.markDefs?.find((markDef) => markDef._key === mark_0);
       return markDef_0 ? [markDef_0] : [];
     }), children = props.children;
     for (const mark_1 of decorators) {
@@ -1581,26 +1623,26 @@ function RenderSpan(props) {
     }
     for (const annotationMarkDef of annotationMarkDefs) {
       const legacyAnnotationSchemaType = legacySchema.annotations.find((t) => t.name === annotationMarkDef._type);
-      legacyAnnotationSchemaType && (block_0 && path && props.renderAnnotation ? children = /* @__PURE__ */ jsx("span", { ref: spanRef, children: /* @__PURE__ */ jsx(RenderAnnotation, { renderAnnotation: props.renderAnnotation, block: block_0, editorElementRef: spanRef, focused, path, selected, schemaType: legacyAnnotationSchemaType, value: annotationMarkDef, type: legacyAnnotationSchemaType, children }) }) : children = /* @__PURE__ */ jsx("span", { ref: spanRef, children }));
+      legacyAnnotationSchemaType && (block && path && props.renderAnnotation ? children = /* @__PURE__ */ jsx("span", { ref: spanRef, children: /* @__PURE__ */ jsx(RenderAnnotation, { renderAnnotation: props.renderAnnotation, block, editorElementRef: spanRef, focused, path, selected, schemaType: legacyAnnotationSchemaType, value: annotationMarkDef, type: legacyAnnotationSchemaType, children }) }) : children = /* @__PURE__ */ jsx("span", { ref: spanRef, children }));
     }
-    $[11] = block_0, $[12] = editorActor, $[13] = focused, $[14] = legacySchema, $[15] = path, $[16] = props.children, $[17] = props.leaf.marks, $[18] = props.renderAnnotation, $[19] = props.renderDecorator, $[20] = selected, $[21] = annotationMarkDefs, $[22] = children;
+    $[6] = block, $[7] = editorActor, $[8] = focused, $[9] = legacySchema, $[10] = path, $[11] = props.children, $[12] = props.leaf.marks, $[13] = props.renderAnnotation, $[14] = props.renderDecorator, $[15] = selected, $[16] = annotationMarkDefs, $[17] = children;
   } else
-    annotationMarkDefs = $[21], children = $[22];
-  if (block_0 && path && props.renderChild) {
-    let t32;
-    if ($[23] !== block_0.children || $[24] !== props.leaf) {
-      let t4;
-      $[26] !== props.leaf ? (t4 = (_child) => _child._key === props.leaf._key, $[26] = props.leaf, $[27] = t4) : t4 = $[27], t32 = block_0.children.find(t4), $[23] = block_0.children, $[24] = props.leaf, $[25] = t32;
+    annotationMarkDefs = $[16], children = $[17];
+  if (block && path && props.renderChild) {
+    let t22;
+    if ($[18] !== block.children || $[19] !== props.leaf) {
+      let t3;
+      $[21] !== props.leaf ? (t3 = (_child) => _child._key === props.leaf._key, $[21] = props.leaf, $[22] = t3) : t3 = $[22], t22 = block.children.find(t3), $[18] = block.children, $[19] = props.leaf, $[20] = t22;
     } else
-      t32 = $[25];
-    const child = t32;
+      t22 = $[20];
+    const child = t22;
     if (child) {
-      let t4;
-      $[28] !== annotationMarkDefs || $[29] !== child || $[30] !== children || $[31] !== focused || $[32] !== legacySchema.span || $[33] !== path || $[34] !== props.renderChild || $[35] !== selected ? (t4 = /* @__PURE__ */ jsx(RenderChild, { renderChild: props.renderChild, annotations: annotationMarkDefs, editorElementRef: spanRef, focused, path, schemaType: legacySchema.span, selected, value: child, type: legacySchema.span, children }), $[28] = annotationMarkDefs, $[29] = child, $[30] = children, $[31] = focused, $[32] = legacySchema.span, $[33] = path, $[34] = props.renderChild, $[35] = selected, $[36] = t4) : t4 = $[36], children = t4;
+      let t3;
+      $[23] !== annotationMarkDefs || $[24] !== child || $[25] !== children || $[26] !== focused || $[27] !== legacySchema.span || $[28] !== path || $[29] !== props.renderChild || $[30] !== selected ? (t3 = /* @__PURE__ */ jsx(RenderChild, { renderChild: props.renderChild, annotations: annotationMarkDefs, editorElementRef: spanRef, focused, path, schemaType: legacySchema.span, selected, value: child, type: legacySchema.span, children }), $[23] = annotationMarkDefs, $[24] = child, $[25] = children, $[26] = focused, $[27] = legacySchema.span, $[28] = path, $[29] = props.renderChild, $[30] = selected, $[31] = t3) : t3 = $[31], children = t3;
     }
   }
-  let t3;
-  return $[37] !== children || $[38] !== props.attributes ? (t3 = /* @__PURE__ */ jsx("span", { ...props.attributes, ref: spanRef, children }), $[37] = children, $[38] = props.attributes, $[39] = t3) : t3 = $[39], t3;
+  let t2;
+  return $[32] !== children || $[33] !== props.attributes ? (t2 = /* @__PURE__ */ jsx("span", { ...props.attributes, ref: spanRef, children }), $[32] = children, $[33] = props.attributes, $[34] = t2) : t2 = $[34], t2;
 }
 function _temp2$1(decorator) {
   return decorator.name;
@@ -2713,7 +2755,7 @@ const debug$b = debugWithName("component:Editable"), PortableTextEditable = forw
   if (!portableTextEditor)
     return null;
   let t39;
-  return $[152] !== callbackRef || $[153] !== decorate || $[154] !== handleClick || $[155] !== handleCopy || $[156] !== handleCut || $[157] !== handleDrag || $[158] !== handleDragEnd || $[159] !== handleDragEnter || $[160] !== handleDragLeave || $[161] !== handleDragOver || $[162] !== handleDragStart || $[163] !== handleDrop || $[164] !== handleKeyDown || $[165] !== handleKeyUp || $[166] !== handleOnBeforeInput || $[167] !== handleOnBlur || $[168] !== handleOnFocus || $[169] !== handlePaste || $[170] !== hasInvalidValue || $[171] !== readOnly || $[172] !== renderElement || $[173] !== renderLeaf || $[174] !== restProps || $[175] !== scrollSelectionIntoViewToSlate ? (t39 = hasInvalidValue ? null : /* @__PURE__ */ jsx(Editable, { ...restProps, ref: callbackRef, "data-read-only": readOnly, autoFocus: !1, className: restProps.className || "pt-editable", decorate, onBlur: handleOnBlur, onCopy: handleCopy, onCut: handleCut, onClick: handleClick, onDOMBeforeInput: handleOnBeforeInput, onDragStart: handleDragStart, onDrag: handleDrag, onDragEnd: handleDragEnd, onDragEnter: handleDragEnter, onDragOver: handleDragOver, onDrop: handleDrop, onDragLeave: handleDragLeave, onFocus: handleOnFocus, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, onPaste: handlePaste, readOnly, renderPlaceholder: void 0, renderElement, renderLeaf, renderText, scrollSelectionIntoView: scrollSelectionIntoViewToSlate }), $[152] = callbackRef, $[153] = decorate, $[154] = handleClick, $[155] = handleCopy, $[156] = handleCut, $[157] = handleDrag, $[158] = handleDragEnd, $[159] = handleDragEnter, $[160] = handleDragLeave, $[161] = handleDragOver, $[162] = handleDragStart, $[163] = handleDrop, $[164] = handleKeyDown, $[165] = handleKeyUp, $[166] = handleOnBeforeInput, $[167] = handleOnBlur, $[168] = handleOnFocus, $[169] = handlePaste, $[170] = hasInvalidValue, $[171] = readOnly, $[172] = renderElement, $[173] = renderLeaf, $[174] = restProps, $[175] = scrollSelectionIntoViewToSlate, $[176] = t39) : t39 = $[176], t39;
+  return $[152] !== callbackRef || $[153] !== decorate || $[154] !== handleClick || $[155] !== handleCopy || $[156] !== handleCut || $[157] !== handleDrag || $[158] !== handleDragEnd || $[159] !== handleDragEnter || $[160] !== handleDragLeave || $[161] !== handleDragOver || $[162] !== handleDragStart || $[163] !== handleDrop || $[164] !== handleKeyDown || $[165] !== handleKeyUp || $[166] !== handleOnBeforeInput || $[167] !== handleOnBlur || $[168] !== handleOnFocus || $[169] !== handlePaste || $[170] !== hasInvalidValue || $[171] !== readOnly || $[172] !== renderElement || $[173] !== renderLeaf || $[174] !== restProps || $[175] !== scrollSelectionIntoViewToSlate ? (t39 = hasInvalidValue ? null : /* @__PURE__ */ jsx(SelectionStateProvider, { children: /* @__PURE__ */ jsx(Editable, { ...restProps, ref: callbackRef, "data-read-only": readOnly, autoFocus: !1, className: restProps.className || "pt-editable", decorate, onBlur: handleOnBlur, onCopy: handleCopy, onCut: handleCut, onClick: handleClick, onDOMBeforeInput: handleOnBeforeInput, onDragStart: handleDragStart, onDrag: handleDrag, onDragEnd: handleDragEnd, onDragEnter: handleDragEnter, onDragOver: handleDragOver, onDrop: handleDrop, onDragLeave: handleDragLeave, onFocus: handleOnFocus, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, onPaste: handlePaste, readOnly, renderPlaceholder: void 0, renderElement, renderLeaf, renderText, scrollSelectionIntoView: scrollSelectionIntoViewToSlate }) }), $[152] = callbackRef, $[153] = decorate, $[154] = handleClick, $[155] = handleCopy, $[156] = handleCut, $[157] = handleDrag, $[158] = handleDragEnd, $[159] = handleDragEnter, $[160] = handleDragLeave, $[161] = handleDragOver, $[162] = handleDragStart, $[163] = handleDrop, $[164] = handleKeyDown, $[165] = handleKeyUp, $[166] = handleOnBeforeInput, $[167] = handleOnBlur, $[168] = handleOnFocus, $[169] = handlePaste, $[170] = hasInvalidValue, $[171] = readOnly, $[172] = renderElement, $[173] = renderLeaf, $[174] = restProps, $[175] = scrollSelectionIntoViewToSlate, $[176] = t39) : t39 = $[176], t39;
 });
 PortableTextEditable.displayName = "ForwardRef(PortableTextEditable)";
 function noop() {