@portabletext/editor 1.1.0 → 1.1.2

package/lib/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: !0 });
-var jsxRuntime = require("react/jsx-runtime"), isEqual = require("lodash/isEqual.js"), noop = require("lodash/noop.js"), react = require("react"), slate = require("slate"), slateReact = require("slate-react"), debug$m = require("debug"), types = require("@sanity/types"), styledComponents = require("styled-components"), uniq = require("lodash/uniq.js"), rxjs = require("rxjs"), schema = require("@sanity/schema"), patches = require("@portabletext/patches"), get = require("lodash/get.js"), isUndefined = require("lodash/isUndefined.js"), omitBy = require("lodash/omitBy.js"), flatten = require("lodash/flatten.js"), isHotkeyEsm = require("is-hotkey-esm"), blockTools = require("@sanity/block-tools"), isPlainObject = require("lodash/isPlainObject.js"), throttle = require("lodash/throttle.js"), content = require("@sanity/util/content"), debounce = require("lodash/debounce.js");
+var jsxRuntime = require("react/jsx-runtime"), isEqual = require("lodash/isEqual.js"), noop = require("lodash/noop.js"), react = require("react"), slate = require("slate"), slateReact = require("slate-react"), debug$m = require("debug"), types = require("@sanity/types"), styledComponents = require("styled-components"), uniq = require("lodash/uniq.js"), rxjs = require("rxjs"), xstate = require("xstate"), schema = require("@sanity/schema"), patches = require("@portabletext/patches"), get = require("lodash/get.js"), isUndefined = require("lodash/isUndefined.js"), omitBy = require("lodash/omitBy.js"), flatten = require("lodash/flatten.js"), isHotkeyEsm = require("is-hotkey-esm"), blockTools = require("@sanity/block-tools"), isPlainObject = require("lodash/isPlainObject.js"), throttle = require("lodash/throttle.js"), content = require("@sanity/util/content"), debounce = require("lodash/debounce.js");
 function _interopDefaultCompat(e) {
   return e && typeof e == "object" && "default" in e ? e : { default: e };
 }
@@ -110,7 +110,7 @@ function normalizeSelection(selection, value) {
   const { anchor, focus } = selection;
   return anchor && value.find((blk) => isEqual__default.default({ _key: blk._key }, anchor.path[0])) && (newAnchor = normalizePoint(anchor, value)), focus && value.find((blk) => isEqual__default.default({ _key: blk._key }, focus.path[0])) && (newFocus = normalizePoint(focus, value)), newAnchor && newFocus ? { anchor: newAnchor, focus: newFocus, backward: selection.backward } : null;
 }
-const EMPTY_MARKDEFS = [], VOID_CHILD_KEY = "void-child";
+const VOID_CHILD_KEY = "void-child";
 function keepObjectEquality(object, keyMap) {
   const value = keyMap[object._key];
   return value && isEqual__default.default(object, value) ? value : (keyMap[object._key] = object, object);
@@ -708,7 +708,6 @@ const EMPTY_ANNOTATIONS = [], inlineBlockStyle = { display: "inline-block" }, El
 };
 function DefaultAnnotation(props) {
   const handleClick = react.useCallback(
-    // eslint-disable-next-line no-alert
     () => alert(JSON.stringify(props.annotation)),
     [props.annotation]
   );
@@ -1695,7 +1694,7 @@ function createWithMaxBlocks(maxBlocks) {
     }, editor;
   };
 }
-function createWithObjectKeys(schemaTypes, keyGenerator) {
+function createWithObjectKeys(editorActor, schemaTypes, keyGenerator) {
   return function(editor) {
     const { apply: apply2, normalizeNode } = editor;
     return editor.apply = (operation) => {
@@ -1731,10 +1730,13 @@ function createWithObjectKeys(schemaTypes, keyGenerator) {
     }, editor.normalizeNode = (entry) => {
       const [node, path] = entry;
       if (slate.Element.isElement(node) && node._type === schemaTypes.block.name) {
-        node._key || slate.Transforms.setNodes(editor, { _key: keyGenerator() }, { at: path });
+        if (!node._key) {
+          editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(editor, { _key: keyGenerator() }, { at: path }), editorActor.send({ type: "done normalizing" });
+          return;
+        }
         for (const [child, childPath] of slate.Node.children(editor, path))
           if (!child._key) {
-            slate.Transforms.setNodes(editor, { _key: keyGenerator() }, { at: childPath });
+            editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(editor, { _key: keyGenerator() }, { at: childPath }), editorActor.send({ type: "done normalizing" });
             return;
           }
       }
@@ -2440,7 +2442,7 @@ function toInt(num) {
 const debug$i = debugWithName("applyPatches"), debugVerbose$4 = debug$i.enabled && !0;
 function createApplyPatch(schemaTypes) {
   let previousPatch;
-  return function(editor, patch) {
+  return (editor, patch) => {
     let changed = !1;
     debugVerbose$4 && (debug$i(
       `
@@ -2891,7 +2893,7 @@ function findOperationTargetBlock(editor, operation) {
 }
 const debug$g = debugWithName("plugin:withPatches");
 function createWithPatches({
-  change$,
+  editorActor,
   patches$,
   patchFunctions,
   readOnly,
@@ -3020,7 +3022,7 @@ function createWithPatches({
       }
       return !editorWasEmpty && editorIsEmpty && ["merge_node", "set_node", "remove_text", "remove_node"].includes(
         operation.type
-      ) && (patches$1 = [...patches$1, patches.unset([])], change$.next({
+      ) && (patches$1 = [...patches$1, patches.unset([])], editorActor.send({
         type: "unset",
         previousValue: fromSlateValue(
           previousChildren,
@@ -3028,7 +3030,7 @@ function createWithPatches({
           KEY_TO_VALUE_ELEMENT.get(editor)
         )
       })), editorWasEmpty && patches$1.length > 0 && (patches$1 = [patches.setIfMissing([], []), ...patches$1]), patches$1.length > 0 && patches$1.forEach((patch) => {
-        change$.next({
+        editorActor.send({
           type: "patch",
           patch: { ...patch, origin: "local" }
         });
@@ -3064,25 +3066,25 @@ function createWithPlaceholderBlock() {
   };
 }
 const debug$e = debugWithName("plugin:withPortableTextBlockStyle");
-function createWithPortableTextBlockStyle(types2) {
+function createWithPortableTextBlockStyle(editorActor, types2) {
   const defaultStyle = types2.styles[0].value;
   return function(editor) {
     const { normalizeNode } = editor;
     return editor.normalizeNode = (nodeEntry) => {
-      normalizeNode(nodeEntry);
       const [, path] = nodeEntry;
       for (const op of editor.operations)
         if (op.type === "split_node" && op.path.length === 1 && editor.isTextBlock(op.properties) && op.properties.style !== defaultStyle && op.path[0] === path[0] && !slate.Path.equals(path, op.path)) {
           const [child] = slate.Editor.node(editor, [op.path[0] + 1, 0]);
           if (slate.Text.isText(child) && child.text === "") {
-            debug$e(`Normalizing split node to ${defaultStyle} style`, op), slate.Transforms.setNodes(
+            debug$e(`Normalizing split node to ${defaultStyle} style`, op), editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(
               editor,
               { style: defaultStyle },
               { at: [op.path[0] + 1], voids: !1 }
-            );
-            break;
+            ), editorActor.send({ type: "done normalizing" });
+            return;
           }
         }
+      normalizeNode(nodeEntry);
     }, editor.pteHasBlockStyle = (style) => editor.selection ? [
       ...slate.Editor.nodes(editor, {
         at: editor.selection,
@@ -3227,7 +3229,7 @@ function isPortableTextBlock(node) {
   );
 }
 const debug$c = debugWithName("plugin:withPortableTextMarkModel");
-function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
+function createWithPortableTextMarkModel(editorActor, types2, keyGenerator) {
   return function(editor) {
     const { apply: apply2, normalizeNode } = editor, decorators = types2.decorators.map((t) => t.value), forceNewSelection = () => {
       editor.selection && (slate.Transforms.select(editor, { ...editor.selection }), editor.selection = { ...editor.selection });
@@ -3236,7 +3238,7 @@ function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
         editor.selection,
         types2
       );
-      change$.next({ type: "selection", selection: ptRange });
+      editorActor.send({ type: "selection", selection: ptRange });
     };
     return editor.normalizeNode = (nodeEntry) => {
       const [node, path] = nodeEntry;
@@ -3249,20 +3251,20 @@ function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
               "Merging spans",
               JSON.stringify(child, null, 2),
               JSON.stringify(nextNode, null, 2)
-            ), slate.Transforms.mergeNodes(editor, {
+            ), editorActor.send({ type: "normalizing" }), slate.Transforms.mergeNodes(editor, {
               at: [childPath[0], childPath[1] + 1],
               voids: !0
-            });
+            }), editorActor.send({ type: "done normalizing" });
             return;
           }
         }
       }
       if (editor.isTextBlock(node) && !Array.isArray(node.markDefs)) {
-        debug$c("Adding .markDefs to block node"), slate.Transforms.setNodes(editor, { markDefs: [] }, { at: path });
+        debug$c("Adding .markDefs to block node"), editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(editor, { markDefs: [] }, { at: path }), editorActor.send({ type: "done normalizing" });
         return;
       }
       if (editor.isTextSpan(node) && !Array.isArray(node.marks)) {
-        debug$c("Adding .marks to span node"), slate.Transforms.setNodes(editor, { marks: [] }, { at: path });
+        debug$c("Adding .marks to span node"), editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(editor, { marks: [] }, { at: path }), editorActor.send({ type: "done normalizing" });
         return;
       }
       if (editor.isTextSpan(node)) {
@@ -3270,11 +3272,11 @@ function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
           (mark) => !decorators2.includes(mark)
         );
         if (editor.isTextBlock(block) && node.text === "" && annotations && annotations.length > 0) {
-          debug$c("Removing annotations from empty span node"), slate.Transforms.setNodes(
+          debug$c("Removing annotations from empty span node"), editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(
             editor,
             { marks: node.marks?.filter((mark) => decorators2.includes(mark)) },
             { at: path }
-          );
+          ), editorActor.send({ type: "done normalizing" });
           return;
         }
       }
@@ -3284,7 +3286,7 @@ function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
           if (editor.isTextSpan(child)) {
             const marks = child.marks ?? [], orphanedAnnotations = marks.filter((mark) => !decorators2.includes(mark) && !node.markDefs?.find((def) => def._key === mark));
             if (orphanedAnnotations.length > 0) {
-              debug$c("Removing orphaned annotations from span node"), slate.Transforms.setNodes(
+              debug$c("Removing orphaned annotations from span node"), editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(
                 editor,
                 {
                   marks: marks.filter(
@@ -3292,7 +3294,7 @@ function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
                   )
                 },
                 { at: childPath }
-              );
+              ), editorActor.send({ type: "done normalizing" });
               return;
             }
           }
@@ -3304,7 +3306,7 @@ function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
             (decorator) => decorator.value
           ), marks = node.marks ?? [], orphanedAnnotations = marks.filter((mark) => !decorators2.includes(mark) && !block.markDefs?.find((def) => def._key === mark));
           if (orphanedAnnotations.length > 0) {
-            debug$c("Removing orphaned annotations from span node"), slate.Transforms.setNodes(
+            debug$c("Removing orphaned annotations from span node"), editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(
               editor,
               {
                 marks: marks.filter(
@@ -3312,7 +3314,7 @@ function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
                 )
               },
               { at: path }
-            );
+            ), editorActor.send({ type: "done normalizing" });
             return;
           }
         }
@@ -3321,20 +3323,23 @@ function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
         const markDefs = node.markDefs ?? [], markDefKeys = /* @__PURE__ */ new Set(), newMarkDefs = [];
         for (const markDef of markDefs)
           markDefKeys.has(markDef._key) || (markDefKeys.add(markDef._key), newMarkDefs.push(markDef));
-        markDefs.length !== newMarkDefs.length && (debug$c("Removing duplicate markDefs"), slate.Transforms.setNodes(editor, { markDefs: newMarkDefs }, { at: path }));
+        if (markDefs.length !== newMarkDefs.length) {
+          debug$c("Removing duplicate markDefs"), editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(editor, { markDefs: newMarkDefs }, { at: path }), editorActor.send({ type: "done normalizing" });
+          return;
+        }
       }
       if (editor.isTextBlock(node) && !editor.operations.some(
         (op) => op.type === "merge_node" && "markDefs" in op.properties && op.path.length === 1
       )) {
         const newMarkDefs = (node.markDefs || []).filter((def) => node.children.find((child) => slate.Text.isText(child) && Array.isArray(child.marks) && child.marks.includes(def._key)));
         if (node.markDefs && !isEqual__default.default(newMarkDefs, node.markDefs)) {
-          debug$c("Removing markDef not in use"), slate.Transforms.setNodes(
+          debug$c("Removing markDef not in use"), editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(
             editor,
             {
               markDefs: newMarkDefs
             },
             { at: path }
-          );
+          ), editorActor.send({ type: "done normalizing" });
           return;
         }
       }
@@ -3567,7 +3572,7 @@ function createWithPortableTextMarkModel(types2, change$, keyGenerator) {
   };
 }
 const debug$b = debugWithName("plugin:withPortableTextSelections"), debugVerbose$2 = debug$b.enabled && !1;
-function createWithPortableTextSelections(change$, types2) {
+function createWithPortableTextSelections(editorActor, types2) {
   let prevSelection = null;
   return function(editor) {
     const emitPortableTextSelection = () => {
@@ -3586,7 +3591,7 @@ function createWithPortableTextSelections(change$, types2) {
           `Emitting selection ${JSON.stringify(ptRange || null)} (${JSON.stringify(
             editor.selection
           )})`
-        ), ptRange ? change$.next({ type: "selection", selection: ptRange }) : change$.next({ type: "selection", selection: null });
+        ), ptRange ? editorActor.send({ type: "selection", selection: ptRange }) : editorActor.send({ type: "selection", selection: null });
       }
       prevSelection = editor.selection;
     }, { onChange } = editor;
@@ -3598,27 +3603,30 @@ function createWithPortableTextSelections(change$, types2) {
 }
 const debug$a = debugWithName("plugin:withSchemaTypes");
 function createWithSchemaTypes({
+  editorActor,
   schemaTypes,
   keyGenerator
 }) {
   return function(editor) {
-    editor.isTextBlock = (value) => types.isPortableTextTextBlock(value) && value._type === schemaTypes.block.name, editor.isTextSpan = (value) => types.isPortableTextSpan(value) && value._type == schemaTypes.span.name, editor.isListBlock = (value) => types.isPortableTextListBlock(value) && value._type === schemaTypes.block.name, editor.isVoid = (element) => schemaTypes.block.name !== element._type && (schemaTypes.blockObjects.map((obj) => obj.name).includes(element._type) || schemaTypes.inlineObjects.map((obj) => obj.name).includes(element._type)), editor.isInline = (element) => schemaTypes.inlineObjects.map((obj) => obj.name).includes(element._type) && "__inline" in element && element.__inline === !0;
+    editor.isTextBlock = (value) => types.isPortableTextTextBlock(value) && value._type === schemaTypes.block.name, editor.isTextSpan = (value) => types.isPortableTextSpan(value) && value._type === schemaTypes.span.name, editor.isListBlock = (value) => types.isPortableTextListBlock(value) && value._type === schemaTypes.block.name, editor.isVoid = (element) => schemaTypes.block.name !== element._type && (schemaTypes.blockObjects.map((obj) => obj.name).includes(element._type) || schemaTypes.inlineObjects.map((obj) => obj.name).includes(element._type)), editor.isInline = (element) => schemaTypes.inlineObjects.map((obj) => obj.name).includes(element._type) && "__inline" in element && element.__inline === !0;
     const { normalizeNode } = editor;
     return editor.normalizeNode = (entry) => {
       const [node, path] = entry;
       if (node._type === void 0 && path.length === 2) {
         debug$a("Setting span type on text node without a type");
         const span = node, key = span._key || keyGenerator();
-        slate.Transforms.setNodes(
+        editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(
           editor,
           { ...span, _type: schemaTypes.span.name, _key: key },
           { at: path }
-        );
+        ), editorActor.send({ type: "done normalizing" });
+        return;
       }
       if (node._key === void 0 && (path.length === 1 || path.length === 2)) {
         debug$a("Setting missing key on child node without a key");
         const key = keyGenerator();
-        slate.Transforms.setNodes(editor, { _key: key }, { at: path });
+        editorActor.send({ type: "normalizing" }), slate.Transforms.setNodes(editor, { _key: key }, { at: path }), editorActor.send({ type: "done normalizing" });
+        return;
       }
       normalizeNode(entry);
     }, editor;
@@ -3640,7 +3648,7 @@ function createWithUtils({
           return;
         }
         const { focus } = selection, focusOffset = focus.offset, charsBefore = textNode.text.slice(0, focusOffset), charsAfter = textNode.text.slice(focusOffset, -1), isEmpty = (str) => str.match(/\s/g), whiteSpaceBeforeIndex = charsBefore.split("").reverse().findIndex((str) => isEmpty(str)), newStartOffset = whiteSpaceBeforeIndex > -1 ? charsBefore.length - whiteSpaceBeforeIndex : 0, whiteSpaceAfterIndex = charsAfter.split("").findIndex((obj) => isEmpty(obj)), newEndOffset = charsBefore.length + (whiteSpaceAfterIndex > -1 ? whiteSpaceAfterIndex : charsAfter.length + 1);
-        if (!(newStartOffset === newEndOffset || isNaN(newStartOffset) || isNaN(newEndOffset))) {
+        if (!(newStartOffset === newEndOffset || Number.isNaN(newStartOffset) || Number.isNaN(newEndOffset))) {
           debug$9("pteExpandToWord: Expanding to focused word"), slate.Transforms.setSelection(editor, {
             anchor: { ...selection.anchor, offset: newStartOffset },
             focus: { ...selection.focus, offset: newEndOffset }
@@ -3926,22 +3934,6 @@ function validateValue(value, types$1, keyGenerator) {
           }
         }, !0;
       }
-      if (blk.markDefs && !Array.isArray(blk.markDefs))
-        return resolution = {
-          patches: [
-            patches.set({ ...textBlock, markDefs: EMPTY_MARKDEFS }, [
-              { _key: textBlock._key }
-            ])
-          ],
-          description: "Block has invalid required property 'markDefs'.",
-          action: "Add empty markDefs array",
-          item: textBlock,
-          i18n: {
-            description: "inputs.portable-text.invalid-value.missing-or-invalid-markdefs.description",
-            action: "inputs.portable-text.invalid-value.missing-or-invalid-markdefs.action",
-            values: { key: textBlock._key }
-          }
-        }, !0;
       const allUsedMarks = uniq__default.default(
         flatten__default.default(
           textBlock.children.filter((cld) => cld._type === types$1.span.name).map((cld) => cld.marks || [])
@@ -4086,7 +4078,7 @@ function validateValue(value, types$1, keyGenerator) {
   }) && (valid = !1), { valid, resolution, value });
 }
 const debug$7 = debugWithName("plugin:withInsertData");
-function createWithInsertData(change$, schemaTypes, keyGenerator) {
+function createWithInsertData(editorActor, schemaTypes, keyGenerator) {
   return function(editor) {
     const blockTypeName = schemaTypes.block.name, spanTypeName = schemaTypes.span.name, whitespaceOnPasteMode = schemaTypes.block.options.unstable_whitespaceOnPasteMode, toPlainText = (blocks) => blocks.map((block) => editor.isTextBlock(block) ? block.children.map((child) => child._type === spanTypeName ? child.text : `[${schemaTypes.inlineObjects.find((t) => t.name === child._type)?.title || "Object"}]`).join("") : `[${schemaTypes.blockObjects.find((t) => t.name === block._type)?.title || "Object"}]`).join(`
 
@@ -4140,9 +4132,8 @@ function createWithInsertData(change$, schemaTypes, keyGenerator) {
           ), validation = validateValue(parsed, schemaTypes, keyGenerator);
           if (!validation.valid && !validation.resolution?.autoResolve) {
             const errorDescription = `${validation.resolution?.description}`;
-            return change$.next({
+            return editorActor.send({
               type: "error",
-              level: "warning",
               name: "pasteError",
               description: errorDescription,
               data: validation
@@ -4155,7 +4146,6 @@ function createWithInsertData(change$, schemaTypes, keyGenerator) {
     }, editor.insertTextOrHTMLData = (data) => {
       if (!editor.selection)
         return debug$7("No selection, not inserting"), !1;
-      change$.next({ type: "loading", isLoading: !0 });
       const html = data.getData("text/html"), text = data.getData("text/plain");
       if (html || text) {
         debug$7("Inserting data", data);
@@ -4186,9 +4176,8 @@ function createWithInsertData(change$, schemaTypes, keyGenerator) {
           const errorDescription = `Could not validate the resulting portable text to insert.
 ${validation.resolution?.description}
 Try to insert as plain text (shift-paste) instead.`;
-          return change$.next({
+          return editorActor.send({
             type: "error",
-            level: "warning",
             name: "pasteError",
             description: errorDescription,
             data: validation
@@ -4196,9 +4185,9 @@ Try to insert as plain text (shift-paste) instead.`;
         }
         return debug$7(
           `Inserting ${insertedType} fragment at ${JSON.stringify(editor.selection)}`
-        ), _insertFragment(editor, fragment, schemaTypes), change$.next({ type: "loading", isLoading: !1 }), !0;
+        ), _insertFragment(editor, fragment, schemaTypes), !0;
       }
-      return change$.next({ type: "loading", isLoading: !1 }), !1;
+      return !1;
     }, editor.insertData = (data) => {
       editor.insertPortableTextData(data) || editor.insertTextOrHTMLData(data);
     }, editor.insertFragmentData = (data) => {
@@ -4242,10 +4231,7 @@ function _regenerateKeys(editor, fragment, keyGenerator, spanTypeName, editorTyp
         return newNode.children = newNode.children.map(
           (child) => child._type === spanTypeName && editor.isTextSpan(child) ? {
             ...child,
-            marks: child.marks && child.marks.includes(oldKey) ? (
-              // eslint-disable-next-line max-nested-callbacks
-              [...child.marks].filter((mark) => mark !== oldKey).concat(newKey)
-            ) : child.marks
+            marks: child.marks && child.marks.includes(oldKey) ? [...child.marks].filter((mark) => mark !== oldKey).concat(newKey) : child.marks
           } : child
         ), { ...def, _key: newKey };
       });
@@ -4288,18 +4274,26 @@ function _insertFragment(editor, fragment, schemaTypes) {
   }), editor.onChange();
 }
 const originalFnMap = /* @__PURE__ */ new WeakMap(), withPlugins = (editor, options) => {
-  const e = editor, { keyGenerator, portableTextEditor, patches$, readOnly, maxBlocks } = options, { schemaTypes, change$ } = portableTextEditor;
+  const e = editor, { keyGenerator, portableTextEditor, patches$, readOnly, maxBlocks } = options, { editorActor, schemaTypes } = portableTextEditor;
   e.subscriptions = [], e.destroy ? e.destroy() : originalFnMap.set(e, {
     apply: e.apply,
     onChange: e.onChange,
     normalizeNode: e.normalizeNode
   });
-  const operationToPatches = createOperationToPatches(schemaTypes), withObjectKeys = createWithObjectKeys(schemaTypes, keyGenerator), withSchemaTypes = createWithSchemaTypes({ schemaTypes, keyGenerator }), withEditableAPI = createWithEditableAPI(
+  const operationToPatches = createOperationToPatches(schemaTypes), withObjectKeys = createWithObjectKeys(
+    editorActor,
+    schemaTypes,
+    keyGenerator
+  ), withSchemaTypes = createWithSchemaTypes({
+    editorActor,
+    schemaTypes,
+    keyGenerator
+  }), withEditableAPI = createWithEditableAPI(
     portableTextEditor,
     schemaTypes,
     keyGenerator
   ), withPatches = createWithPatches({
-    change$,
+    editorActor,
     keyGenerator,
     patches$,
     patchFunctions: operationToPatches,
@@ -4310,15 +4304,18 @@ const originalFnMap = /* @__PURE__ */ new WeakMap(), withPlugins = (editor, opti
     patches$,
     blockSchemaType: schemaTypes.block
   }), withPortableTextMarkModel = createWithPortableTextMarkModel(
+    editorActor,
     schemaTypes,
-    change$,
     keyGenerator
-  ), withPortableTextBlockStyle = createWithPortableTextBlockStyle(schemaTypes), withPlaceholderBlock = createWithPlaceholderBlock(), withInsertBreak = createWithInsertBreak(schemaTypes, keyGenerator), withUtils = createWithUtils({
+  ), withPortableTextBlockStyle = createWithPortableTextBlockStyle(
+    editorActor,
+    schemaTypes
+  ), withPlaceholderBlock = createWithPlaceholderBlock(), withInsertBreak = createWithInsertBreak(schemaTypes, keyGenerator), withUtils = createWithUtils({
     keyGenerator,
     schemaTypes,
     portableTextEditor
   }), withPortableTextSelections = createWithPortableTextSelections(
-    change$,
+    editorActor,
     schemaTypes
   );
   return e.destroy = () => {
@@ -4435,7 +4432,7 @@ const defaultKeyGenerator = () => content.randomKey(12), PortableTextEditorKeyGe
   return readOnly;
 }, debug$5 = debugWithName("hook:useSyncValue"), CURRENT_VALUE = /* @__PURE__ */ new WeakMap();
 function useSyncValue(props) {
-  const { portableTextEditor, readOnly, keyGenerator } = props, { change$, schemaTypes } = portableTextEditor, previousValue = react.useRef(), slateEditor = slateReact.useSlate(), updateValueFunctionRef = react.useRef(), updateFromCurrentValue = react.useCallback(() => {
+  const { editorActor, portableTextEditor, readOnly, keyGenerator } = props, { schemaTypes } = portableTextEditor, previousValue = react.useRef(), slateEditor = slateReact.useSlate(), updateValueFunctionRef = react.useRef(), updateFromCurrentValue = react.useCallback(() => {
     const currentValue = CURRENT_VALUE.get(portableTextEditor);
     if (previousValue.current === currentValue) {
       debug$5("Value is the same object as previous, not need to sync");
@@ -4506,7 +4503,7 @@ function useSyncValue(props) {
                       !validation.valid && validation.resolution?.autoResolve && validation.resolution?.patches.length > 0 && !readOnly && previousValue.current && previousValue.current !== value && (console.warn(
                         `${validation.resolution.action} for block with _key '${validationValue[0]._key}'. ${validation.resolution?.description}`
                       ), validation.resolution.patches.forEach((patch) => {
-                        change$.next({ type: "patch", patch });
+                        editorActor.send({ type: "patch", patch });
                       })), validation.valid || validation.resolution?.autoResolve ? (oldBlock._key === currentBlock._key ? (debug$5.enabled && debug$5("Updating block", oldBlock, currentBlock), _updateBlock(
                         slateEditor,
                         currentBlock,
@@ -4516,8 +4513,8 @@ function useSyncValue(props) {
                         slateEditor,
                         currentBlock,
                         currentBlockIndex
-                      )), isChanged = !0) : (change$.next({
-                        type: "invalidValue",
+                      )), isChanged = !0) : (editorActor.send({
+                        type: "invalid value",
                         resolution: validation.resolution,
                         value
                       }), isValid = !1);
@@ -4533,8 +4530,8 @@ function useSyncValue(props) {
                         currentBlock
                       ), validation.valid || validation.resolution?.autoResolve ? slate.Transforms.insertNodes(slateEditor, currentBlock, {
                         at: [currentBlockIndex]
-                      }) : (debug$5("Invalid", validation), change$.next({
-                        type: "invalidValue",
+                      }) : (debug$5("Invalid", validation), editorActor.send({
+                        type: "invalid value",
                         resolution: validation.resolution,
                         value
                       }), isValid = !1);
@@ -4555,8 +4552,8 @@ function useSyncValue(props) {
         try {
           slateEditor.onChange();
         } catch (err) {
-          console.error(err), change$.next({
-            type: "invalidValue",
+          console.error(err), editorActor.send({
+            type: "invalid value",
             resolution: null,
             value
           });
@@ -4565,14 +4562,14 @@ function useSyncValue(props) {
         hadSelection && !slateEditor.selection && (slate.Transforms.select(slateEditor, {
           anchor: { path: [0, 0], offset: 0 },
           focus: { path: [0, 0], offset: 0 }
-        }), slateEditor.onChange()), change$.next({ type: "value", value });
+        }), slateEditor.onChange()), editorActor.send({ type: "value changed", value });
       } else
         debug$5("Server value and editor value is equal, no need to sync.");
       previousValue.current = value;
     };
     return updateValueFunctionRef.current = updateFunction, updateFunction;
   }, [
-    change$,
+    editorActor,
     keyGenerator,
     portableTextEditor,
     readOnly,
@@ -4641,9 +4638,9 @@ function _updateBlock(slateEditor, currentBlock, oldBlock, currentBlockIndex) {
 }
 const debug$4 = debugWithName("component:PortableTextEditor:Synchronizer"), debugVerbose$1 = debug$4.enabled && !1, FLUSH_PATCHES_THROTTLED_MS = process.env.NODE_ENV === "test" ? 500 : 1e3;
 function Synchronizer(props) {
-  const portableTextEditor = usePortableTextEditor(), keyGenerator = usePortableTextEditorKeyGenerator(), readOnly = usePortableTextEditorReadOnlyStatus(), { change$, getValue, onChange, value } = props, pendingPatches = react.useRef([]), syncValue = useSyncValue({
+  const portableTextEditor = usePortableTextEditor(), keyGenerator = usePortableTextEditorKeyGenerator(), readOnly = usePortableTextEditorReadOnlyStatus(), { editorActor, getValue, onChange, value } = props, pendingPatches = react.useRef([]), syncValue = useSyncValue({
+    editorActor,
     keyGenerator,
-    onChange,
     portableTextEditor,
     readOnly
   }), slateEditor = slateReact.useSlate();
@@ -4655,14 +4652,14 @@ function Synchronizer(props) {
       debug$4("Flushing pending patches"), debugVerbose$1 && debug$4(`Patches:
 ${JSON.stringify(pendingPatches.current, null, 2)}`);
       const snapshot = getValue();
-      change$.next({
+      editorActor.send({
         type: "mutation",
         patches: pendingPatches.current,
         snapshot
       }), pendingPatches.current = [];
     }
     IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !1);
-  }, [slateEditor, getValue, change$]), onFlushPendingPatchesThrottled = react.useMemo(() => throttle__default.default(
+  }, [editorActor, slateEditor, getValue]), onFlushPendingPatchesThrottled = react.useMemo(() => throttle__default.default(
     () => {
       if (slate.Editor.isNormalizing(slateEditor)) {
         onFlushPendingPatches();
@@ -4679,34 +4676,174 @@ ${JSON.stringify(pendingPatches.current, null, 2)}`);
   react.useEffect(() => () => {
     onFlushPendingPatches();
   }, [onFlushPendingPatches]), react.useEffect(() => {
-    debug$4("Subscribing to editor changes$");
-    const sub = change$.subscribe((next) => {
-      switch (next.type) {
+    debug$4("Subscribing to editor changes");
+    const sub = editorActor.on("*", (event) => {
+      switch (event.type) {
         case "patch":
-          IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !0), pendingPatches.current.push(next.patch), onFlushPendingPatchesThrottled(), onChange(next);
+          IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !0), pendingPatches.current.push(event.patch), onFlushPendingPatchesThrottled(), onChange(event);
+          break;
+        case "loading": {
+          onChange({ type: "loading", isLoading: !0 });
+          break;
+        }
+        case "done loading": {
+          onChange({ type: "loading", isLoading: !1 });
+          break;
+        }
+        case "offline": {
+          onChange({ type: "connection", value: "offline" });
+          break;
+        }
+        case "online": {
+          onChange({ type: "connection", value: "online" });
+          break;
+        }
+        case "value changed": {
+          onChange({ type: "value", value: event.value });
+          break;
+        }
+        case "invalid value": {
+          onChange({
+            type: "invalidValue",
+            resolution: event.resolution,
+            value: event.value
+          });
           break;
+        }
+        case "error": {
+          onChange({
+            ...event,
+            level: "warning"
+          });
+          break;
+        }
         default:
-          onChange(next);
+          onChange(event);
       }
     });
     return () => {
-      debug$4("Unsubscribing to changes$"), sub.unsubscribe();
+      debug$4("Unsubscribing to changes"), sub.unsubscribe();
     };
-  }, [change$, onChange, onFlushPendingPatchesThrottled, slateEditor]);
+  }, [editorActor, onFlushPendingPatchesThrottled, slateEditor]);
   const handleOnline = react.useCallback(() => {
-    debug$4("Editor is online, syncing from props.value"), change$.next({ type: "connection", value: "online" }), syncValue(value);
-  }, [change$, syncValue, value]), handleOffline = react.useCallback(() => {
-    debug$4("Editor is offline"), change$.next({ type: "connection", value: "offline" });
-  }, [change$]);
-  react.useEffect(() => (portableTextEditor.props.patches$ && (window.addEventListener("online", handleOnline), window.addEventListener("offline", handleOffline)), () => {
-    portableTextEditor.props.patches$ && (window.removeEventListener("online", handleOnline), window.removeEventListener("offline", handleOffline));
-  }));
+    debug$4("Editor is online, syncing from props.value"), syncValue(value);
+  }, [syncValue, value]);
+  react.useEffect(() => {
+    const subscription = editorActor.on("online", () => {
+      portableTextEditor.props.patches$ && handleOnline();
+    });
+    return () => {
+      subscription.unsubscribe();
+    };
+  }, [editorActor]);
   const isInitialValueFromProps = react.useRef(!0);
   return react.useEffect(() => {
-    debug$4("Value from props changed, syncing new value"), syncValue(value), isInitialValueFromProps.current && (change$.next({ type: "loading", isLoading: !1 }), change$.next({ type: "ready" }), isInitialValueFromProps.current = !1);
-  }, [change$, syncValue, value]), null;
+    debug$4("Value from props changed, syncing new value"), syncValue(value), isInitialValueFromProps.current && (editorActor.send({ type: "ready" }), isInitialValueFromProps.current = !1);
+  }, [editorActor, syncValue, value]), null;
 }
-const PortableTextEditorSelectionContext = react.createContext(null), usePortableTextEditorSelection = () => {
+const networkLogic = xstate.fromCallback(({ sendBack }) => {
+  const onlineHandler = () => {
+    sendBack({ type: "online" });
+  }, offlineHandler = () => {
+    sendBack({ type: "offline" });
+  };
+  return window.addEventListener("online", onlineHandler), window.addEventListener("offline", offlineHandler), () => {
+    window.removeEventListener("online", onlineHandler), window.removeEventListener("offline", offlineHandler);
+  };
+}), editorMachine = xstate.setup({
+  types: {
+    context: {},
+    events: {},
+    emitted: {}
+  },
+  actions: {
+    "emit patch event": xstate.emit(({ event }) => (xstate.assertEvent(event, "patch"), event)),
+    "emit mutation event": xstate.emit(({ event }) => (xstate.assertEvent(event, "mutation"), event)),
+    "defer event": xstate.assign({
+      pendingEvents: ({ context, event }) => (xstate.assertEvent(event, ["patch", "mutation"]), [...context.pendingEvents, event])
+    }),
+    "emit pending events": xstate.enqueueActions(({ context, enqueue }) => {
+      for (const event of context.pendingEvents)
+        enqueue(xstate.emit(event));
+    }),
+    "clear pending events": xstate.assign({
+      pendingEvents: []
+    })
+  },
+  actors: {
+    networkLogic
+  }
+}).createMachine({
+  id: "editor",
+  context: {
+    pendingEvents: []
+  },
+  invoke: {
+    id: "networkLogic",
+    src: "networkLogic"
+  },
+  on: {
+    ready: { actions: xstate.emit(({ event }) => event) },
+    unset: { actions: xstate.emit(({ event }) => event) },
+    "value changed": { actions: xstate.emit(({ event }) => event) },
+    "invalid value": { actions: xstate.emit(({ event }) => event) },
+    error: { actions: xstate.emit(({ event }) => event) },
+    selection: { actions: xstate.emit(({ event }) => event) },
+    blur: { actions: xstate.emit(({ event }) => event) },
+    focus: { actions: xstate.emit(({ event }) => event) },
+    online: { actions: xstate.emit({ type: "online" }) },
+    offline: { actions: xstate.emit({ type: "offline" }) },
+    loading: { actions: xstate.emit({ type: "loading" }) },
+    "done loading": { actions: xstate.emit({ type: "done loading" }) }
+  },
+  initial: "pristine",
+  states: {
+    pristine: {
+      initial: "idle",
+      states: {
+        idle: {
+          on: {
+            normalizing: {
+              target: "normalizing"
+            },
+            patch: {
+              actions: "defer event",
+              target: "#editor.dirty"
+            },
+            mutation: {
+              actions: "defer event",
+              target: "#editor.dirty"
+            }
+          }
+        },
+        normalizing: {
+          on: {
+            "done normalizing": {
+              target: "idle"
+            },
+            patch: {
+              actions: "defer event"
+            },
+            mutation: {
+              actions: "defer event"
+            }
+          }
+        }
+      }
+    },
+    dirty: {
+      entry: ["emit pending events", "clear pending events"],
+      on: {
+        patch: {
+          actions: "emit patch event"
+        },
+        mutation: {
+          actions: "emit mutation event"
+        }
+      }
+    }
+  }
+}), PortableTextEditorSelectionContext = react.createContext(null), usePortableTextEditorSelection = () => {
   const selection = react.useContext(PortableTextEditorSelectionContext);
   if (selection === void 0)
     throw new Error(
@@ -4715,21 +4852,26 @@ const PortableTextEditorSelectionContext = react.createContext(null), usePortabl
   return selection;
 }, debug$3 = debugWithName("component:PortableTextEditor:SelectionProvider"), debugVerbose = debug$3.enabled && !1;
 function PortableTextEditorSelectionProvider(props) {
-  const { change$ } = props, [selection, setSelection] = react.useState(null);
+  const [selection, setSelection] = react.useState(null);
   return react.useEffect(() => {
-    debug$3("Subscribing to selection changes$");
-    const subscription = change$.subscribe((next) => {
-      next.type === "selection" && react.startTransition(() => {
-        debugVerbose && debug$3("Setting selection"), setSelection(next.selection);
+    debug$3("Subscribing to selection changes");
+    const subscription = props.editorActor.on("selection", (event) => {
+      react.startTransition(() => {
+        debugVerbose && debug$3("Setting selection"), setSelection(event.selection);
       });
     });
     return () => {
-      debug$3("Unsubscribing to selection changes$"), subscription.unsubscribe();
+      debug$3("Unsubscribing to selection changes"), subscription.unsubscribe();
     };
-  }, [change$]), /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorSelectionContext.Provider, { value: selection, children: props.children });
+  }, [props.editorActor]), /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorSelectionContext.Provider, { value: selection, children: props.children });
 }
 const debug$2 = debugWithName("component:PortableTextEditor");
 class PortableTextEditor extends react.Component {
+  /**
+   * @internal
+   * Don't use this API directly. It's subject to change.
+   */
+  editorActor;
   /**
    * An observable of all the editor changes.
    */
@@ -4747,7 +4889,7 @@ class PortableTextEditor extends react.Component {
       throw new Error('PortableTextEditor: missing "schemaType" property');
     props.incomingPatches$ && console.warn(
       "The prop 'incomingPatches$' is deprecated and renamed to 'patches$'"
-    ), this.change$.next({ type: "loading", isLoading: !0 }), this.schemaTypes = getPortableTextMemberSchemaTypes(
+    ), this.editorActor = xstate.createActor(editorMachine), this.editorActor.start(), this.schemaTypes = getPortableTextMemberSchemaTypes(
       props.schemaType.hasOwnProperty("jsonType") ? props.schemaType : compileType(props.schemaType)
     );
   }
@@ -4764,7 +4906,7 @@ class PortableTextEditor extends react.Component {
       return this.editable.getValue();
   };
   render() {
-    const { onChange, value, children, patches$, incomingPatches$ } = this.props, { change$ } = this, _patches$ = incomingPatches$ || patches$, maxBlocks = typeof this.props.maxBlocks > "u" ? void 0 : parseInt(this.props.maxBlocks.toString(), 10) || void 0, readOnly = !!this.props.readOnly, keyGenerator = this.props.keyGenerator || defaultKeyGenerator;
+    const { value, children, patches$, incomingPatches$ } = this.props, _patches$ = incomingPatches$ || patches$, maxBlocks = typeof this.props.maxBlocks > "u" ? void 0 : Number.parseInt(this.props.maxBlocks.toString(), 10) || void 0, readOnly = !!this.props.readOnly, keyGenerator = this.props.keyGenerator || defaultKeyGenerator;
     return /* @__PURE__ */ jsxRuntime.jsx(
       SlateContainer,
       {
@@ -4773,18 +4915,26 @@ class PortableTextEditor extends react.Component {
         patches$: _patches$,
         portableTextEditor: this,
         readOnly,
-        children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorKeyGeneratorContext.Provider, { value: keyGenerator, children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorContext.Provider, { value: this, children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorReadOnlyContext.Provider, { value: readOnly, children: /* @__PURE__ */ jsxRuntime.jsxs(PortableTextEditorSelectionProvider, { change$, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            Synchronizer,
-            {
-              change$,
-              getValue: this.getValue,
-              onChange,
-              value
-            }
-          ),
-          children
-        ] }) }) }) })
+        children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorKeyGeneratorContext.Provider, { value: keyGenerator, children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorContext.Provider, { value: this, children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorReadOnlyContext.Provider, { value: readOnly, children: /* @__PURE__ */ jsxRuntime.jsxs(
+          PortableTextEditorSelectionProvider,
+          {
+            editorActor: this.editorActor,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                Synchronizer,
+                {
+                  editorActor: this.editorActor,
+                  getValue: this.getValue,
+                  onChange: (change) => {
+                    this.props.onChange(change), this.change$.next(change);
+                  },
+                  value
+                }
+              ),
+              children
+            ]
+          }
+        ) }) }) })
       }
     );
   }
@@ -4894,20 +5044,19 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
   react.useEffect(() => {
     if (!shouldTrackSelectionAndFocus)
       return;
-    const sub = portableTextEditor.change$.subscribe((next) => {
-      if (next.type === "blur") {
-        setFocused(!1), setSelected(!1);
-        return;
+    const onBlur = portableTextEditor.editorActor.on("blur", () => {
+      setFocused(!1), setSelected(!1);
+    }), onFocus = portableTextEditor.editorActor.on("focus", () => {
+      const sel = PortableTextEditor.getSelection(portableTextEditor);
+      sel && isEqual__default.default(sel.focus.path, path) && PortableTextEditor.isCollapsedSelection(portableTextEditor) && setFocused(!0), setSelectedFromRange();
+    }), onSelection = portableTextEditor.editorActor.on(
+      "selection",
+      (event) => {
+        event.selection && isEqual__default.default(event.selection.focus.path, path) && PortableTextEditor.isCollapsedSelection(portableTextEditor) ? setFocused(!0) : setFocused(!1), setSelectedFromRange();
       }
-      if (next.type === "focus") {
-        const sel = PortableTextEditor.getSelection(portableTextEditor);
-        sel && isEqual__default.default(sel.focus.path, path) && PortableTextEditor.isCollapsedSelection(portableTextEditor) && setFocused(!0), setSelectedFromRange();
-        return;
-      }
-      next.type === "selection" && (next.selection && isEqual__default.default(next.selection.focus.path, path) && PortableTextEditor.isCollapsedSelection(portableTextEditor) ? setFocused(!0) : setFocused(!1), setSelectedFromRange());
-    });
+    );
     return () => {
-      sub.unsubscribe();
+      onBlur.unsubscribe(), onFocus.unsubscribe(), onSelection.unsubscribe();
     };
   }, [
     path,
@@ -5058,9 +5207,9 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
     forwardedRef,
     () => ref.current
   );
-  const rangeDecorationsRef = react.useRef(rangeDecorations), { change$, schemaTypes } = portableTextEditor, slateEditor = slateReact.useSlate(), blockTypeName = schemaTypes.block.name, withInsertData = react.useMemo(
-    () => createWithInsertData(change$, schemaTypes, keyGenerator),
-    [change$, keyGenerator, schemaTypes]
+  const rangeDecorationsRef = react.useRef(rangeDecorations), { editorActor, schemaTypes } = portableTextEditor, slateEditor = slateReact.useSlate(), blockTypeName = schemaTypes.block.name, withInsertData = react.useMemo(
+    () => createWithInsertData(editorActor, schemaTypes, keyGenerator),
+    [editorActor, keyGenerator, schemaTypes]
   ), withHotKeys = react.useMemo(
     () => createWithHotkeys(schemaTypes, portableTextEditor, hotkeys),
     [hotkeys, portableTextEditor, schemaTypes]
@@ -5133,10 +5282,13 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
           `Normalized selection from props ${JSON.stringify(normalizedSelection)}`
         );
         const slateRange = toSlateRange(normalizedSelection, slateEditor);
-        slateRange && (slate.Transforms.select(slateEditor, slateRange), slateEditor.operations.some((o) => o.type === "set_selection") || change$.next({ type: "selection", selection: normalizedSelection }), slateEditor.onChange());
+        slateRange && (slate.Transforms.select(slateEditor, slateRange), slateEditor.operations.some((o) => o.type === "set_selection") || editorActor.send({
+          type: "selection",
+          selection: normalizedSelection
+        }), slateEditor.onChange());
       }
     }
-  }, [propsSelection, slateEditor, blockTypeName, change$]), syncRangeDecorations = react.useCallback(
+  }, [editorActor, propsSelection, slateEditor]), syncRangeDecorations = react.useCallback(
     (operation) => {
       if (rangeDecorations && rangeDecorations.length > 0) {
         const newSlateRanges = [];
@@ -5175,28 +5327,22 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
           return;
         }
       }
-      setRangeDecorationsState([]);
+      rangeDecorationState.length > 0 && setRangeDecorationsState([]);
     },
     [portableTextEditor, rangeDecorations, schemaTypes, slateEditor]
   );
   react.useEffect(() => {
-    const sub = change$.subscribe((next) => {
-      switch (next.type) {
-        case "ready":
-          restoreSelectionFromProps();
-          break;
-        case "invalidValue":
-          setHasInvalidValue(!0);
-          break;
-        case "value":
-          setHasInvalidValue(!1);
-          break;
-      }
+    const onReady = editorActor.on("ready", () => {
+      restoreSelectionFromProps();
+    }), onInvalidValue = editorActor.on("invalid value", () => {
+      setHasInvalidValue(!0);
+    }), onValueChanged = editorActor.on("value changed", () => {
+      setHasInvalidValue(!1);
     });
     return () => {
-      sub.unsubscribe();
+      onReady.unsubscribe(), onInvalidValue.unsubscribe(), onValueChanged.unsubscribe();
     };
-  }, [change$, restoreSelectionFromProps]), react.useEffect(() => {
+  }, [editorActor, restoreSelectionFromProps]), react.useEffect(() => {
     propsSelection && !hasInvalidValue && restoreSelectionFromProps();
   }, [hasInvalidValue, propsSelection, restoreSelectionFromProps]);
   const originalApply = react.useMemo(() => slateEditor.apply, [slateEditor]), [syncedRangeDecorations, setSyncedRangeDecorations] = react.useState(!1);
@@ -5227,7 +5373,7 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
         slateEditor.selection,
         schemaTypes
       )?.focus.path || [], onPasteResult = onPaste({ event, value, path, schemaTypes });
-      onPasteResult === void 0 ? (debug("No result from custom paste handler, pasting normally"), slateEditor.insertData(event.clipboardData)) : (change$.next({ type: "loading", isLoading: !0 }), Promise.resolve(onPasteResult).then((result) => {
+      onPasteResult === void 0 ? (debug("No result from custom paste handler, pasting normally"), slateEditor.insertData(event.clipboardData)) : (editorActor.send({ type: "loading" }), Promise.resolve(onPasteResult).then((result) => {
         debug("Custom paste function from client resolved", result), !result || !result.insert ? (debug("No result from custom paste handler, pasting normally"), slateEditor.insertData(event.clipboardData)) : result.insert ? slateEditor.insertFragment(
           toSlateValue(result.insert, {
             schemaTypes
@@ -5237,23 +5383,23 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
           result
         );
       }).catch((error) => (console.error(error), error)).finally(() => {
-        change$.next({ type: "loading", isLoading: !1 });
+        editorActor.send({ type: "done loading" });
       }));
     },
-    [change$, onPaste, portableTextEditor, schemaTypes, slateEditor]
+    [onPaste, portableTextEditor, schemaTypes, slateEditor]
   ), handleOnFocus = react.useCallback(
     (event) => {
       if (onFocus && onFocus(event), !event.isDefaultPrevented()) {
         const selection = PortableTextEditor.getSelection(portableTextEditor);
-        selection === null && (slate.Transforms.select(slateEditor, slate.Editor.start(slateEditor, [])), slateEditor.onChange()), change$.next({ type: "focus", event });
+        selection === null && (slate.Transforms.select(slateEditor, slate.Editor.start(slateEditor, [])), slateEditor.onChange()), editorActor.send({ type: "focus", event });
         const newSelection = PortableTextEditor.getSelection(portableTextEditor);
-        selection === newSelection && change$.next({
+        selection === newSelection && editorActor.send({
           type: "selection",
           selection
         });
       }
     },
-    [onFocus, portableTextEditor, change$, slateEditor]
+    [editorActor, onFocus, portableTextEditor, slateEditor]
   ), handleClick = react.useCallback(
     (event) => {
       if (onClick && onClick(event), slateEditor.selection && event.target === event.currentTarget) {
@@ -5270,9 +5416,9 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
     [onClick, slateEditor]
   ), handleOnBlur = react.useCallback(
     (event) => {
-      onBlur && onBlur(event), event.isPropagationStopped() || change$.next({ type: "blur", event });
+      onBlur && onBlur(event), event.isPropagationStopped() || editorActor.send({ type: "blur", event });
     },
-    [change$, onBlur]
+    [editorActor, onBlur]
   ), handleOnBeforeInput = react.useCallback(
     (event) => {
       onBeforeInput && onBeforeInput(event);
@@ -5377,6 +5523,7 @@ const debug$1 = debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (prop
 });
 exports.PortableTextEditable = PortableTextEditable;
 exports.PortableTextEditor = PortableTextEditor;
+exports.editorMachine = editorMachine;
 exports.keyGenerator = defaultKeyGenerator;
 exports.usePortableTextEditor = usePortableTextEditor;
 exports.usePortableTextEditorSelection = usePortableTextEditorSelection;