@portabletext/editor 1.15.3 → 1.16.1

package/lib/index.cjs

@@ -11,11 +11,11 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
   return a;
 };
 Object.defineProperty(exports, "__esModule", { value: !0 });
-var schema = require("@sanity/schema"), types = require("@sanity/types"), startCase = require("lodash.startcase"), jsxRuntime = require("react/jsx-runtime"), react = require("@xstate/react"), isEqual = require("lodash/isEqual.js"), noop = require("lodash/noop.js"), React = require("react"), slate = require("slate"), slateReact = require("slate-react"), debug$m = require("debug"), reactCompilerRuntime = require("react-compiler-runtime"), styledComponents = require("styled-components"), uniq = require("lodash/uniq.js"), rxjs = require("rxjs"), useEffectEvent = require("use-effect-event"), throttle = require("lodash/throttle.js"), debounce = require("lodash/debounce.js"), patches = require("@portabletext/patches"), flatten = require("lodash/flatten.js"), isPlainObject = require("lodash/isPlainObject.js"), xstate = require("xstate"), get = require("lodash/get.js"), isUndefined = require("lodash/isUndefined.js"), omitBy = require("lodash/omitBy.js"), selectors = require("./_chunks-cjs/selectors.cjs"), behavior_core = require("./_chunks-cjs/behavior.core.cjs"), getRandomValues = require("get-random-values-esm"), blockTools = require("@sanity/block-tools");
+var schema = require("@sanity/schema"), types = require("@sanity/types"), startCase = require("lodash.startcase"), jsxRuntime = require("react/jsx-runtime"), react = require("@xstate/react"), isEqual = require("lodash/isEqual.js"), noop = require("lodash/noop.js"), React = require("react"), slate = require("slate"), slateReact = require("slate-react"), debug$m = require("debug"), reactCompilerRuntime = require("react-compiler-runtime"), styledComponents = require("styled-components"), uniq = require("lodash/uniq.js"), rxjs = require("rxjs"), useEffectEvent = require("use-effect-event"), xstate = require("xstate"), patches = require("@portabletext/patches"), flatten = require("lodash/flatten.js"), isPlainObject = require("lodash/isPlainObject.js"), get = require("lodash/get.js"), isUndefined = require("lodash/isUndefined.js"), omitBy = require("lodash/omitBy.js"), selector_isSelectionCollapsed = require("./_chunks-cjs/selector.is-selection-collapsed.cjs"), behavior_core = require("./_chunks-cjs/behavior.core.cjs"), getRandomValues = require("get-random-values-esm"), blockTools = require("@sanity/block-tools");
 function _interopDefaultCompat(e) {
   return e && typeof e == "object" && "default" in e ? e : { default: e };
 }
-var startCase__default = /* @__PURE__ */ _interopDefaultCompat(startCase), isEqual__default = /* @__PURE__ */ _interopDefaultCompat(isEqual), noop__default = /* @__PURE__ */ _interopDefaultCompat(noop), React__default = /* @__PURE__ */ _interopDefaultCompat(React), debug__default = /* @__PURE__ */ _interopDefaultCompat(debug$m), uniq__default = /* @__PURE__ */ _interopDefaultCompat(uniq), throttle__default = /* @__PURE__ */ _interopDefaultCompat(throttle), debounce__default = /* @__PURE__ */ _interopDefaultCompat(debounce), flatten__default = /* @__PURE__ */ _interopDefaultCompat(flatten), isPlainObject__default = /* @__PURE__ */ _interopDefaultCompat(isPlainObject), get__default = /* @__PURE__ */ _interopDefaultCompat(get), isUndefined__default = /* @__PURE__ */ _interopDefaultCompat(isUndefined), omitBy__default = /* @__PURE__ */ _interopDefaultCompat(omitBy), getRandomValues__default = /* @__PURE__ */ _interopDefaultCompat(getRandomValues);
+var startCase__default = /* @__PURE__ */ _interopDefaultCompat(startCase), isEqual__default = /* @__PURE__ */ _interopDefaultCompat(isEqual), noop__default = /* @__PURE__ */ _interopDefaultCompat(noop), React__default = /* @__PURE__ */ _interopDefaultCompat(React), debug__default = /* @__PURE__ */ _interopDefaultCompat(debug$m), uniq__default = /* @__PURE__ */ _interopDefaultCompat(uniq), flatten__default = /* @__PURE__ */ _interopDefaultCompat(flatten), isPlainObject__default = /* @__PURE__ */ _interopDefaultCompat(isPlainObject), get__default = /* @__PURE__ */ _interopDefaultCompat(get), isUndefined__default = /* @__PURE__ */ _interopDefaultCompat(isUndefined), omitBy__default = /* @__PURE__ */ _interopDefaultCompat(omitBy), getRandomValues__default = /* @__PURE__ */ _interopDefaultCompat(getRandomValues);
 function createEditorSchema(portableTextType) {
   var _a, _b, _c;
   if (!portableTextType)
@@ -71,12 +71,12 @@ function resolveEnabledListItems(blockType) {
 function findBlockType(type) {
   return type.type ? findBlockType(type.type) : type.name === "block" ? type : null;
 }
-var __defProp$p = Object.defineProperty, __defProps$j = Object.defineProperties, __getOwnPropDescs$j = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$p = Object.getOwnPropertySymbols, __hasOwnProp$p = Object.prototype.hasOwnProperty, __propIsEnum$p = Object.prototype.propertyIsEnumerable, __defNormalProp$p = (obj, key, value) => key in obj ? __defProp$p(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$p = (a, b) => {
+var __defProp$q = Object.defineProperty, __defProps$j = Object.defineProperties, __getOwnPropDescs$j = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$q = Object.getOwnPropertySymbols, __hasOwnProp$q = Object.prototype.hasOwnProperty, __propIsEnum$q = Object.prototype.propertyIsEnumerable, __defNormalProp$q = (obj, key, value) => key in obj ? __defProp$q(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$q = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$p.call(b, prop) && __defNormalProp$p(a, prop, b[prop]);
-  if (__getOwnPropSymbols$p)
-    for (var prop of __getOwnPropSymbols$p(b))
-      __propIsEnum$p.call(b, prop) && __defNormalProp$p(a, prop, b[prop]);
+    __hasOwnProp$q.call(b, prop) && __defNormalProp$q(a, prop, b[prop]);
+  if (__getOwnPropSymbols$q)
+    for (var prop of __getOwnPropSymbols$q(b))
+      __propIsEnum$q.call(b, prop) && __defNormalProp$q(a, prop, b[prop]);
   return a;
 }, __spreadProps$j = (a, b) => __defProps$j(a, __getOwnPropDescs$j(b));
 function defineSchema(definition) {
@@ -145,10 +145,10 @@ function compileSchemaDefinition(definition) {
   }), schema$1 = schema.Schema.compile({
     types: [portableTextSchema, ...blockObjects, ...inlineObjects]
   }).get("portable-text"), pteSchema = createEditorSchema(schema$1);
-  return __spreadProps$j(__spreadValues$p({}, pteSchema), {
-    blockObjects: pteSchema.blockObjects.map((blockObject) => blockObject.name === "tmp-image" ? __spreadProps$j(__spreadValues$p({}, blockObject), {
+  return __spreadProps$j(__spreadValues$q({}, pteSchema), {
+    blockObjects: pteSchema.blockObjects.map((blockObject) => blockObject.name === "tmp-image" ? __spreadProps$j(__spreadValues$q({}, blockObject), {
       name: "image",
-      type: __spreadProps$j(__spreadValues$p({}, blockObject.type), {
+      type: __spreadProps$j(__spreadValues$q({}, blockObject.type), {
         name: "image"
       })
     }) : blockObject)
@@ -287,20 +287,20 @@ function normalizeSelection(selection, value) {
     backward: selection.backward
   } : null;
 }
-var __defProp$o = Object.defineProperty, __defProps$i = Object.defineProperties, __getOwnPropDescs$i = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$o = Object.getOwnPropertySymbols, __hasOwnProp$o = Object.prototype.hasOwnProperty, __propIsEnum$o = Object.prototype.propertyIsEnumerable, __defNormalProp$o = (obj, key, value) => key in obj ? __defProp$o(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$o = (a, b) => {
+var __defProp$p = Object.defineProperty, __defProps$i = Object.defineProperties, __getOwnPropDescs$i = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$p = Object.getOwnPropertySymbols, __hasOwnProp$p = Object.prototype.hasOwnProperty, __propIsEnum$p = Object.prototype.propertyIsEnumerable, __defNormalProp$p = (obj, key, value) => key in obj ? __defProp$p(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$p = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$o.call(b, prop) && __defNormalProp$o(a, prop, b[prop]);
-  if (__getOwnPropSymbols$o)
-    for (var prop of __getOwnPropSymbols$o(b))
-      __propIsEnum$o.call(b, prop) && __defNormalProp$o(a, prop, b[prop]);
+    __hasOwnProp$p.call(b, prop) && __defNormalProp$p(a, prop, b[prop]);
+  if (__getOwnPropSymbols$p)
+    for (var prop of __getOwnPropSymbols$p(b))
+      __propIsEnum$p.call(b, prop) && __defNormalProp$p(a, prop, b[prop]);
   return a;
 }, __spreadProps$i = (a, b) => __defProps$i(a, __getOwnPropDescs$i(b)), __objRest$3 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    __hasOwnProp$o.call(source, prop) && exclude.indexOf(prop) < 0 && (target[prop] = source[prop]);
-  if (source != null && __getOwnPropSymbols$o)
-    for (var prop of __getOwnPropSymbols$o(source))
-      exclude.indexOf(prop) < 0 && __propIsEnum$o.call(source, prop) && (target[prop] = source[prop]);
+    __hasOwnProp$p.call(source, prop) && exclude.indexOf(prop) < 0 && (target[prop] = source[prop]);
+  if (source != null && __getOwnPropSymbols$p)
+    for (var prop of __getOwnPropSymbols$p(source))
+      exclude.indexOf(prop) < 0 && __propIsEnum$p.call(source, prop) && (target[prop] = source[prop]);
   return target;
 };
 const VOID_CHILD_KEY = "void-child";
@@ -343,7 +343,7 @@ function toSlateValue(value, {
           __inline: !0
         }, keyMap)) : child;
       });
-      return !hasMissingStyle && !hasMissingMarkDefs && !hasMissingChildren && !hasInlines && slate.Element.isElement(block) ? block : (hasMissingStyle && (rest.style = schemaTypes.styles[0].value), keepObjectEquality(__spreadProps$i(__spreadValues$o({
+      return !hasMissingStyle && !hasMissingMarkDefs && !hasMissingChildren && !hasInlines && slate.Element.isElement(block) ? block : (hasMissingStyle && (rest.style = schemaTypes.styles[0].value), keepObjectEquality(__spreadProps$i(__spreadValues$p({
         _type,
         _key
       }, rest), {
@@ -387,21 +387,21 @@ function fromSlateValue(value, textBlockType, keyMap = {}) {
             "__inline",
             "children"
           ]);
-          return keepObjectEquality(__spreadProps$i(__spreadValues$o(__spreadValues$o({}, rest), v), {
+          return keepObjectEquality(__spreadProps$i(__spreadValues$p(__spreadValues$p({}, rest), v), {
             _key: k,
             _type: t
           }), keyMap);
         }
         return child;
       });
-      return hasInlines ? keepObjectEquality(__spreadProps$i(__spreadValues$o({}, block), {
+      return hasInlines ? keepObjectEquality(__spreadProps$i(__spreadValues$p({}, block), {
         children,
         _key,
         _type
       }), keyMap) : block;
     }
     const blockValue = "value" in block && block.value;
-    return keepObjectEquality(__spreadValues$o({
+    return keepObjectEquality(__spreadValues$p({
       _key,
       _type
     }, typeof blockValue == "object" ? blockValue : {}), keyMap);
@@ -411,7 +411,7 @@ function isEqualToEmptyEditor(children, schemaTypes) {
   var _a;
   return children === void 0 || children && Array.isArray(children) && children.length === 0 || children && Array.isArray(children) && children.length === 1 && slate.Element.isElement(children[0]) && children[0]._type === schemaTypes.block.name && "style" in children[0] && children[0].style === schemaTypes.styles[0].value && !("listItem" in children[0]) && Array.isArray(children[0].children) && children[0].children.length === 1 && slate.Text.isText(children[0].children[0]) && children[0].children[0]._type === "span" && !((_a = children[0].children[0].marks) != null && _a.join("")) && children[0].children[0].text === "";
 }
-const IS_PROCESSING_REMOTE_CHANGES = /* @__PURE__ */ new WeakMap(), IS_PROCESSING_LOCAL_CHANGES = /* @__PURE__ */ new WeakMap(), IS_DRAGGING = /* @__PURE__ */ new WeakMap(), IS_DRAGGING_BLOCK_ELEMENT = /* @__PURE__ */ new WeakMap(), IS_DRAGGING_ELEMENT_TARGET = /* @__PURE__ */ new WeakMap(), IS_DRAGGING_BLOCK_TARGET_POSITION = /* @__PURE__ */ new WeakMap(), KEY_TO_SLATE_ELEMENT = /* @__PURE__ */ new WeakMap(), KEY_TO_VALUE_ELEMENT = /* @__PURE__ */ new WeakMap(), SLATE_TO_PORTABLE_TEXT_RANGE = /* @__PURE__ */ new WeakMap(), DefaultObject = (props) => {
+const IS_PROCESSING_REMOTE_CHANGES = /* @__PURE__ */ new WeakMap(), IS_DRAGGING = /* @__PURE__ */ new WeakMap(), IS_DRAGGING_BLOCK_ELEMENT = /* @__PURE__ */ new WeakMap(), IS_DRAGGING_ELEMENT_TARGET = /* @__PURE__ */ new WeakMap(), IS_DRAGGING_BLOCK_TARGET_POSITION = /* @__PURE__ */ new WeakMap(), KEY_TO_SLATE_ELEMENT = /* @__PURE__ */ new WeakMap(), KEY_TO_VALUE_ELEMENT = /* @__PURE__ */ new WeakMap(), SLATE_TO_PORTABLE_TEXT_RANGE = /* @__PURE__ */ new WeakMap(), DefaultObject = (props) => {
   const $ = reactCompilerRuntime.c(4);
   let t0;
   $[0] !== props.value ? (t0 = JSON.stringify(props.value, null, 2), $[0] = props.value, $[1] = t0) : t0 = $[1];
@@ -709,12 +709,12 @@ const debug$k = debugWithName("components:DraggableBlock"), DraggableBlock = (t0
   ] }), $[41] = children, $[42] = handleDrag, $[43] = handleDragEnd, $[44] = handleDragOver, $[45] = handleDragStart, $[46] = handleDrop, $[47] = isVoid, $[48] = t17, $[49] = t18, $[50] = t19) : t19 = $[50], t19;
 };
 DraggableBlock.displayName = "DraggableBlock";
-var __defProp$n = Object.defineProperty, __defProps$h = Object.defineProperties, __getOwnPropDescs$h = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$n = Object.getOwnPropertySymbols, __hasOwnProp$n = Object.prototype.hasOwnProperty, __propIsEnum$n = Object.prototype.propertyIsEnumerable, __defNormalProp$n = (obj, key, value) => key in obj ? __defProp$n(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$n = (a, b) => {
+var __defProp$o = Object.defineProperty, __defProps$h = Object.defineProperties, __getOwnPropDescs$h = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$o = Object.getOwnPropertySymbols, __hasOwnProp$o = Object.prototype.hasOwnProperty, __propIsEnum$o = Object.prototype.propertyIsEnumerable, __defNormalProp$o = (obj, key, value) => key in obj ? __defProp$o(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$o = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$n.call(b, prop) && __defNormalProp$n(a, prop, b[prop]);
-  if (__getOwnPropSymbols$n)
-    for (var prop of __getOwnPropSymbols$n(b))
-      __propIsEnum$n.call(b, prop) && __defNormalProp$n(a, prop, b[prop]);
+    __hasOwnProp$o.call(b, prop) && __defNormalProp$o(a, prop, b[prop]);
+  if (__getOwnPropSymbols$o)
+    for (var prop of __getOwnPropSymbols$o(b))
+      __propIsEnum$o.call(b, prop) && __defNormalProp$o(a, prop, b[prop]);
   return a;
 }, __spreadProps$h = (a, b) => __defProps$h(a, __getOwnPropDescs$h(b));
 debugWithName("components:Element");
@@ -753,7 +753,7 @@ const EMPTY_ANNOTATIONS = [], inlineBlockStyle = {
       }, "children", {
         _key: element._key
       }];
-      return /* @__PURE__ */ jsxRuntime.jsxs("span", __spreadProps$h(__spreadValues$n({}, attributes), { children: [
+      return /* @__PURE__ */ jsxRuntime.jsxs("span", __spreadProps$h(__spreadValues$o({}, attributes), { children: [
         children,
         /* @__PURE__ */ jsxRuntime.jsxs("span", { draggable: !readOnly, className: "pt-inline-object", "data-testid": "pt-inline-object", ref: inlineBlockObjectRef, style: inlineBlockStyle, contentEditable: !1, children: [
           renderChild && renderChild({
@@ -821,7 +821,7 @@ const EMPTY_ANNOTATIONS = [], inlineBlockStyle = {
         return console.warn("Property 'type' is deprecated, use 'schemaType' instead."), schemaTypes.block;
       }
     }), propsOrDefaultRendered = renderBlock ? renderBlock(renderProps) : children;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", __spreadProps$h(__spreadValues$n({}, attributes), { className, spellCheck, children: /* @__PURE__ */ jsxRuntime.jsx(DraggableBlock, { element, readOnly, blockRef, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref: blockRef, children: propsOrDefaultRendered }) }) }), element._key);
+    return /* @__PURE__ */ jsxRuntime.jsx("div", __spreadProps$h(__spreadValues$o({}, attributes), { className, spellCheck, children: /* @__PURE__ */ jsxRuntime.jsx(DraggableBlock, { element, readOnly, blockRef, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref: blockRef, children: propsOrDefaultRendered }) }) }), element._key);
   }
   const schemaType_0 = schemaTypes.blockObjects.find((_type_0) => _type_0.name === element._type);
   if (!schemaType_0)
@@ -846,7 +846,7 @@ const EMPTY_ANNOTATIONS = [], inlineBlockStyle = {
     });
     renderedBlockFromProps = renderBlock(_props);
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", __spreadProps$h(__spreadValues$n({}, attributes), { className, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", __spreadProps$h(__spreadValues$o({}, attributes), { className, children: [
     children,
     /* @__PURE__ */ jsxRuntime.jsxs(DraggableBlock, { element, readOnly, blockRef, children: [
       renderedBlockFromProps && /* @__PURE__ */ jsxRuntime.jsx("div", { ref: blockRef, contentEditable: !1, children: renderedBlockFromProps }),
@@ -880,12 +880,83 @@ function compileType(rawType) {
     types: [rawType]
   }).get(rawType.name);
 }
-var __defProp$m = Object.defineProperty, __defProps$g = Object.defineProperties, __getOwnPropDescs$g = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$m = Object.getOwnPropertySymbols, __hasOwnProp$m = Object.prototype.hasOwnProperty, __propIsEnum$m = Object.prototype.propertyIsEnumerable, __defNormalProp$m = (obj, key, value) => key in obj ? __defProp$m(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$m = (a, b) => {
+const FLUSH_PATCHES_THROTTLED_MS = process.env.NODE_ENV === "test" ? 500 : 1e3, mutationMachine = xstate.setup({
+  types: {
+    context: {},
+    events: {},
+    input: {},
+    emitted: {}
+  },
+  actions: {
+    "emit has pending patches": xstate.emit({
+      type: "has pending patches"
+    }),
+    "emit mutation": xstate.emit(({
+      context
+    }) => ({
+      type: "mutation",
+      patches: context.pendingPatches,
+      snapshot: fromSlateValue(context.slateEditor.children, context.schema.block.name, KEY_TO_VALUE_ELEMENT.get(context.slateEditor))
+    })),
+    "clear pending patches": xstate.assign({
+      pendingPatches: []
+    }),
+    "defer patch": xstate.assign({
+      pendingPatches: ({
+        context,
+        event
+      }) => [...context.pendingPatches, event.patch]
+    })
+  },
+  guards: {
+    "slate is normalizing": ({
+      context
+    }) => slate.Editor.isNormalizing(context.slateEditor)
+  }
+}).createMachine({
+  id: "mutation",
+  context: ({
+    input
+  }) => ({
+    pendingPatches: [],
+    schema: input.schema,
+    slateEditor: input.slateEditor
+  }),
+  initial: "idle",
+  states: {
+    idle: {
+      on: {
+        patch: {
+          actions: ["defer patch", "emit has pending patches"],
+          target: "has pending patches"
+        }
+      }
+    },
+    "has pending patches": {
+      after: {
+        [FLUSH_PATCHES_THROTTLED_MS]: [{
+          guard: "slate is normalizing",
+          target: "idle",
+          actions: ["emit mutation", "clear pending patches"]
+        }, {
+          reenter: !0
+        }]
+      },
+      on: {
+        patch: {
+          actions: ["defer patch"],
+          reenter: !0
+        }
+      }
+    }
+  }
+});
+var __defProp$n = Object.defineProperty, __defProps$g = Object.defineProperties, __getOwnPropDescs$g = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$n = Object.getOwnPropertySymbols, __hasOwnProp$n = Object.prototype.hasOwnProperty, __propIsEnum$n = Object.prototype.propertyIsEnumerable, __defNormalProp$n = (obj, key, value) => key in obj ? __defProp$n(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$n = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$m.call(b, prop) && __defNormalProp$m(a, prop, b[prop]);
-  if (__getOwnPropSymbols$m)
-    for (var prop of __getOwnPropSymbols$m(b))
-      __propIsEnum$m.call(b, prop) && __defNormalProp$m(a, prop, b[prop]);
+    __hasOwnProp$n.call(b, prop) && __defNormalProp$n(a, prop, b[prop]);
+  if (__getOwnPropSymbols$n)
+    for (var prop of __getOwnPropSymbols$n(b))
+      __propIsEnum$n.call(b, prop) && __defNormalProp$n(a, prop, b[prop]);
   return a;
 }, __spreadProps$g = (a, b) => __defProps$g(a, __getOwnPropDescs$g(b));
 function validateValue(value, types$1, keyGenerator) {
@@ -925,7 +996,7 @@ function validateValue(value, types$1, keyGenerator) {
       }, !0;
     if (!blk._key || typeof blk._key != "string")
       return resolution = {
-        patches: [patches.set(__spreadProps$g(__spreadValues$m({}, blk), {
+        patches: [patches.set(__spreadProps$g(__spreadValues$n({}, blk), {
           _key: keyGenerator()
         }), [index])],
         description: `Block at index ${index} is missing required _key.`,
@@ -943,7 +1014,7 @@ function validateValue(value, types$1, keyGenerator) {
       if (blk._type === "block") {
         const currentBlockTypeName = types$1.block.name;
         return resolution = {
-          patches: [patches.set(__spreadProps$g(__spreadValues$m({}, blk), {
+          patches: [patches.set(__spreadProps$g(__spreadValues$n({}, blk), {
             _type: currentBlockTypeName
           }), [{
             _key: blk._key
@@ -961,10 +1032,10 @@ function validateValue(value, types$1, keyGenerator) {
           }
         }, !0;
       }
-      return !blk._type && types.isPortableTextTextBlock(__spreadProps$g(__spreadValues$m({}, blk), {
+      return !blk._type && types.isPortableTextTextBlock(__spreadProps$g(__spreadValues$n({}, blk), {
         _type: types$1.block.name
       })) ? (resolution = {
-        patches: [patches.set(__spreadProps$g(__spreadValues$m({}, blk), {
+        patches: [patches.set(__spreadProps$g(__spreadValues$n({}, blk), {
           _type: types$1.block.name
         }), [{
           _key: blk._key
@@ -1126,7 +1197,7 @@ function validateValue(value, types$1, keyGenerator) {
             }
           }, !0;
         if (!child._key || typeof child._key != "string") {
-          const newChild = __spreadProps$g(__spreadValues$m({}, child), {
+          const newChild = __spreadProps$g(__spreadValues$n({}, child), {
             _key: keyGenerator()
           });
           return resolution = {
@@ -1148,7 +1219,7 @@ function validateValue(value, types$1, keyGenerator) {
           }, !0;
         }
         return child._type ? validChildTypes.includes(child._type) ? child._type === types$1.span.name && typeof child.text != "string" ? (resolution = {
-          patches: [patches.set(__spreadProps$g(__spreadValues$m({}, child), {
+          patches: [patches.set(__spreadProps$g(__spreadValues$n({}, child), {
             text: ""
           }), [{
             _key: blk._key
@@ -1218,9 +1289,6 @@ function withRemoteChanges(editor, fn) {
 function isChangingRemotely(editor) {
   return IS_PROCESSING_REMOTE_CHANGES.get(editor);
 }
-function isChangingLocally(editor) {
-  return IS_PROCESSING_LOCAL_CHANGES.get(editor);
-}
 const PATCHING = /* @__PURE__ */ new WeakMap();
 function withoutPatching(editor, fn) {
   const prev = isPatching(editor);
@@ -1943,15 +2011,15 @@ function isRedoing(editor) {
 function setIsRedoing(editor, isRedoing2) {
   IS_REDOING.set(editor, isRedoing2);
 }
-var __defProp$l = Object.defineProperty, __getOwnPropSymbols$l = Object.getOwnPropertySymbols, __hasOwnProp$l = Object.prototype.hasOwnProperty, __propIsEnum$l = Object.prototype.propertyIsEnumerable, __defNormalProp$l = (obj, key, value) => key in obj ? __defProp$l(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$l = (a, b) => {
+var __defProp$m = Object.defineProperty, __getOwnPropSymbols$m = Object.getOwnPropertySymbols, __hasOwnProp$m = Object.prototype.hasOwnProperty, __propIsEnum$m = Object.prototype.propertyIsEnumerable, __defNormalProp$m = (obj, key, value) => key in obj ? __defProp$m(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$m = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$l.call(b, prop) && __defNormalProp$l(a, prop, b[prop]);
-  if (__getOwnPropSymbols$l)
-    for (var prop of __getOwnPropSymbols$l(b))
-      __propIsEnum$l.call(b, prop) && __defNormalProp$l(a, prop, b[prop]);
+    __hasOwnProp$m.call(b, prop) && __defNormalProp$m(a, prop, b[prop]);
+  if (__getOwnPropSymbols$m)
+    for (var prop of __getOwnPropSymbols$m(b))
+      __propIsEnum$m.call(b, prop) && __defNormalProp$m(a, prop, b[prop]);
   return a;
 };
-const debug$j = debugWithName("plugin:withUndoRedo"), debugVerbose$4 = debug$j.enabled && !1, SAVING = /* @__PURE__ */ new WeakMap(), REMOTE_PATCHES = /* @__PURE__ */ new WeakMap(), UNDO_STEP_LIMIT = 1e3, isSaving = (editor) => {
+const debug$j = debugWithName("plugin:withUndoRedo"), debugVerbose$3 = debug$j.enabled && !1, SAVING = /* @__PURE__ */ new WeakMap(), REMOTE_PATCHES = /* @__PURE__ */ new WeakMap(), UNDO_STEP_LIMIT = 1e3, isSaving = (editor) => {
   const state = SAVING.get(editor);
   return state === void 0 ? !0 : state;
 }, getRemotePatches = (editor) => (REMOTE_PATCHES.get(editor) || REMOTE_PATCHES.set(editor, []), REMOTE_PATCHES.get(editor) || []);
@@ -1999,7 +2067,9 @@ function createWithUndoRedo(options) {
       apply: apply2
     } = editor;
     return editor.apply = (op) => {
-      if (editorActor.getSnapshot().context.readOnly) {
+      if (editorActor.getSnapshot().matches({
+        "edit mode": "read only"
+      })) {
         apply2(op);
         return;
       }
@@ -2034,7 +2104,9 @@ function createWithUndoRedo(options) {
       }
       apply2(op);
     }, editor.undo = () => {
-      if (editorActor.getSnapshot().context.readOnly)
+      if (editorActor.getSnapshot().matches({
+        "edit mode": "read only"
+      }))
         return;
       const {
         undos
@@ -2069,7 +2141,9 @@ function createWithUndoRedo(options) {
         }
       }
     }, editor.redo = () => {
-      if (editorActor.getSnapshot().context.readOnly)
+      if (editorActor.getSnapshot().matches({
+        "edit mode": "read only"
+      }))
         return;
       const {
         redos
@@ -2106,8 +2180,8 @@ function createWithUndoRedo(options) {
   };
 }
 function transformOperation(editor, patch, operation, snapshot, previousSnapshot) {
-  debugVerbose$4 && (debug$j(`Adjusting '${operation.type}' operation paths for '${patch.type}' patch`), debug$j(`Operation ${JSON.stringify(operation)}`), debug$j(`Patch ${JSON.stringify(patch)}`));
-  const transformedOperation = __spreadValues$l({}, operation);
+  debugVerbose$3 && (debug$j(`Adjusting '${operation.type}' operation paths for '${patch.type}' patch`), debug$j(`Operation ${JSON.stringify(operation)}`), debug$j(`Patch ${JSON.stringify(patch)}`));
+  const transformedOperation = __spreadValues$m({}, operation);
   if (patch.type === "insert" && patch.path.length === 1) {
     const insertBlockIndex = (snapshot || []).findIndex((blk) => isEqual__default.default({
       _key: blk._key
@@ -2118,7 +2192,7 @@ function transformOperation(editor, patch, operation, snapshot, previousSnapshot
     const unsetBlockIndex = (previousSnapshot || []).findIndex((blk) => isEqual__default.default({
       _key: blk._key
     }, patch.path[0]));
-    return "path" in transformedOperation && Array.isArray(transformedOperation.path) && transformedOperation.path[0] === unsetBlockIndex ? (debug$j("Skipping transformation that targeted removed block"), []) : (debugVerbose$4 && (debug$j(`Selection ${JSON.stringify(editor.selection)}`), debug$j(`Adjusting block path (-1) for '${transformedOperation.type}' operation and patch '${patch.type}'`)), [adjustBlockPath(transformedOperation, -1, unsetBlockIndex)]);
+    return "path" in transformedOperation && Array.isArray(transformedOperation.path) && transformedOperation.path[0] === unsetBlockIndex ? (debug$j("Skipping transformation that targeted removed block"), []) : (debugVerbose$3 && (debug$j(`Selection ${JSON.stringify(editor.selection)}`), debug$j(`Adjusting block path (-1) for '${transformedOperation.type}' operation and patch '${patch.type}'`)), [adjustBlockPath(transformedOperation, -1, unsetBlockIndex)]);
   }
   if (patch.type === "unset" && patch.path.length === 0)
     return debug$j(`Adjusting selection for unset everything patch and ${operation.type} operation`), [];
@@ -2136,7 +2210,7 @@ function transformOperation(editor, patch, operation, snapshot, previousSnapshot
         const [diffType, text] = diff2;
         diffType === DIFF_INSERT ? (adjustOffsetBy += text.length, changedOffset += text.length) : diffType === DIFF_DELETE ? (adjustOffsetBy -= text.length, changedOffset -= text.length) : diffType === DIFF_EQUAL && (diffs.slice(index).every(([dType]) => dType === DIFF_EQUAL) || (changedOffset += text.length));
       }), transformedOperation.type === "insert_text" && changedOffset < transformedOperation.offset && (transformedOperation.offset += adjustOffsetBy), transformedOperation.type === "remove_text" && changedOffset <= transformedOperation.offset - transformedOperation.text.length && (transformedOperation.offset += adjustOffsetBy), transformedOperation.type === "set_selection") {
-        const currentFocus = (_a = transformedOperation.properties) != null && _a.focus ? __spreadValues$l({}, transformedOperation.properties.focus) : void 0, currentAnchor = (_b = transformedOperation == null ? void 0 : transformedOperation.properties) != null && _b.anchor ? __spreadValues$l({}, transformedOperation.properties.anchor) : void 0, newFocus = (_c = transformedOperation == null ? void 0 : transformedOperation.newProperties) != null && _c.focus ? __spreadValues$l({}, transformedOperation.newProperties.focus) : void 0, newAnchor = (_d = transformedOperation == null ? void 0 : transformedOperation.newProperties) != null && _d.anchor ? __spreadValues$l({}, transformedOperation.newProperties.anchor) : void 0;
+        const currentFocus = (_a = transformedOperation.properties) != null && _a.focus ? __spreadValues$m({}, transformedOperation.properties.focus) : void 0, currentAnchor = (_b = transformedOperation == null ? void 0 : transformedOperation.properties) != null && _b.anchor ? __spreadValues$m({}, transformedOperation.properties.anchor) : void 0, newFocus = (_c = transformedOperation == null ? void 0 : transformedOperation.newProperties) != null && _c.focus ? __spreadValues$m({}, transformedOperation.newProperties.focus) : void 0, newAnchor = (_d = transformedOperation == null ? void 0 : transformedOperation.newProperties) != null && _d.anchor ? __spreadValues$m({}, transformedOperation.newProperties.anchor) : void 0;
         (currentFocus && currentAnchor || newFocus && newAnchor) && ([currentFocus, currentAnchor, newFocus, newAnchor].forEach((point) => {
           point && changedOffset < point.offset && (point.offset += adjustOffsetBy);
         }), currentFocus && currentAnchor && (transformedOperation.properties = {
@@ -2153,13 +2227,13 @@ function transformOperation(editor, patch, operation, snapshot, previousSnapshot
 }
 function adjustBlockPath(operation, level, blockIndex) {
   var _a, _b, _c, _d;
-  const transformedOperation = __spreadValues$l({}, operation);
+  const transformedOperation = __spreadValues$m({}, operation);
   if (blockIndex >= 0 && transformedOperation.type !== "set_selection" && Array.isArray(transformedOperation.path) && transformedOperation.path[0] >= blockIndex + level && transformedOperation.path[0] + level > -1) {
     const newPath = [transformedOperation.path[0] + level, ...transformedOperation.path.slice(1)];
     transformedOperation.path = newPath;
   }
   if (transformedOperation.type === "set_selection") {
-    const currentFocus = (_a = transformedOperation.properties) != null && _a.focus ? __spreadValues$l({}, transformedOperation.properties.focus) : void 0, currentAnchor = (_b = transformedOperation == null ? void 0 : transformedOperation.properties) != null && _b.anchor ? __spreadValues$l({}, transformedOperation.properties.anchor) : void 0, newFocus = (_c = transformedOperation == null ? void 0 : transformedOperation.newProperties) != null && _c.focus ? __spreadValues$l({}, transformedOperation.newProperties.focus) : void 0, newAnchor = (_d = transformedOperation == null ? void 0 : transformedOperation.newProperties) != null && _d.anchor ? __spreadValues$l({}, transformedOperation.newProperties.anchor) : void 0;
+    const currentFocus = (_a = transformedOperation.properties) != null && _a.focus ? __spreadValues$m({}, transformedOperation.properties.focus) : void 0, currentAnchor = (_b = transformedOperation == null ? void 0 : transformedOperation.properties) != null && _b.anchor ? __spreadValues$m({}, transformedOperation.properties.anchor) : void 0, newFocus = (_c = transformedOperation == null ? void 0 : transformedOperation.newProperties) != null && _c.focus ? __spreadValues$m({}, transformedOperation.newProperties.focus) : void 0, newAnchor = (_d = transformedOperation == null ? void 0 : transformedOperation.newProperties) != null && _d.anchor ? __spreadValues$m({}, transformedOperation.newProperties.anchor) : void 0;
     (currentFocus && currentAnchor || newFocus && newAnchor) && ([currentFocus, currentAnchor, newFocus, newAnchor].forEach((point) => {
       point && point.path[0] >= blockIndex + level && point.path[0] + level > -1 && (point.path = [point.path[0] + level, ...point.path.slice(1)]);
     }), currentFocus && currentAnchor && (transformedOperation.properties = {
@@ -2180,147 +2254,336 @@ function withoutSaving(editor, fn) {
 function createSelectOperation(editor) {
   return {
     type: "set_selection",
-    properties: __spreadValues$l({}, editor.selection),
-    newProperties: __spreadValues$l({}, editor.selection)
+    properties: __spreadValues$m({}, editor.selection),
+    newProperties: __spreadValues$m({}, editor.selection)
   };
 }
 function findOperationTargetBlock(editor, operation) {
   let block;
   return operation.type === "set_selection" && editor.selection ? block = editor.children[editor.selection.focus.path[0]] : "path" in operation && (block = editor.children[operation.path[0]]), block;
 }
-const debug$i = debugWithName("hook:useSyncValue"), CURRENT_VALUE = /* @__PURE__ */ new WeakMap();
-function useSyncValue(props) {
-  const {
-    editorActor,
-    portableTextEditor,
-    readOnly,
-    slateEditor
-  } = props, schemaTypes = editorActor.getSnapshot().context.schema, previousValue = React.useRef(void 0), updateValueFunctionRef = React.useRef(void 0), updateFromCurrentValue = React.useCallback(() => {
-    const currentValue = CURRENT_VALUE.get(portableTextEditor);
-    if (previousValue.current === currentValue) {
-      debug$i("Value is the same object as previous, not need to sync");
-      return;
+const syncValueCallback = ({
+  sendBack,
+  input
+}) => {
+  updateValue({
+    context: input.context,
+    sendBack,
+    slateEditor: input.slateEditor,
+    value: input.value
+  });
+}, syncValueLogic = xstate.fromCallback(syncValueCallback), syncMachine = xstate.setup({
+  types: {
+    context: {},
+    input: {},
+    events: {},
+    emitted: {}
+  },
+  actions: {
+    "assign readOnly": xstate.assign({
+      readOnly: ({
+        event
+      }) => (xstate.assertEvent(event, "update readOnly"), event.readOnly)
+    }),
+    "assign pending value": xstate.assign({
+      pendingValue: ({
+        event
+      }) => (xstate.assertEvent(event, "update value"), event.value)
+    }),
+    "clear pending value": xstate.assign({
+      pendingValue: void 0
+    }),
+    "assign previous value": xstate.assign({
+      previousValue: ({
+        event
+      }) => (xstate.assertEvent(event, "done syncing"), event.value)
+    }),
+    "emit done syncing": xstate.emit(({
+      event
+    }) => (xstate.assertEvent(event, "done syncing"), event))
+  },
+  guards: {
+    "is readOnly": ({
+      context
+    }) => context.readOnly,
+    "is processing local changes": ({
+      context
+    }) => context.isProcessingLocalChanges,
+    "is processing remote changes": ({
+      context
+    }) => {
+      var _a;
+      return (_a = isChangingRemotely(context.slateEditor)) != null ? _a : !1;
+    },
+    "is busy": xstate.and([xstate.not("is readOnly"), xstate.or(["is processing local changes", "is processing remote changes"])]),
+    "value changed while syncing": ({
+      context,
+      event
+    }) => (xstate.assertEvent(event, "done syncing"), context.pendingValue !== event.value),
+    "pending value equals previous value": ({
+      context
+    }) => !(context.previousValue === void 0 && context.pendingValue === void 0) && isEqual__default.default(context.pendingValue, context.previousValue)
+  },
+  actors: {
+    "sync value": syncValueLogic
+  }
+}).createMachine({
+  id: "sync",
+  context: ({
+    input
+  }) => ({
+    isProcessingLocalChanges: !1,
+    keyGenerator: input.keyGenerator,
+    schema: input.schema,
+    readOnly: input.readOnly,
+    slateEditor: input.slateEditor,
+    pendingValue: void 0,
+    previousValue: void 0
+  }),
+  initial: "idle",
+  on: {
+    "has pending patches": {
+      actions: xstate.assign({
+        isProcessingLocalChanges: !0
+      })
+    },
+    mutation: {
+      actions: xstate.assign({
+        isProcessingLocalChanges: !1
+      })
+    },
+    "update readOnly": {
+      actions: ["assign readOnly"]
     }
-    updateValueFunctionRef.current && currentValue && (debug$i("Updating the value debounced"), updateValueFunctionRef.current(currentValue));
-  }, [portableTextEditor]), updateValueDebounced = React.useMemo(() => debounce__default.default(updateFromCurrentValue, 1e3, {
-    trailing: !0,
-    leading: !1
-  }), [updateFromCurrentValue]);
-  return React.useMemo(() => {
-    const updateFunction = (value) => {
-      CURRENT_VALUE.set(portableTextEditor, value);
-      const isProcessingLocalChanges = isChangingLocally(slateEditor), isProcessingRemoteChanges = isChangingRemotely(slateEditor);
-      if (!readOnly) {
-        if (isProcessingLocalChanges) {
-          debug$i("Has local changes, not syncing value right now"), updateValueDebounced();
-          return;
+  },
+  states: {
+    idle: {
+      on: {
+        "update value": [{
+          guard: "is busy",
+          target: "busy",
+          actions: ["assign pending value"]
+        }, {
+          target: "syncing",
+          actions: ["assign pending value"]
+        }]
+      }
+    },
+    busy: {
+      after: {
+        1e3: {
+          target: "syncing"
         }
-        if (isProcessingRemoteChanges) {
-          debug$i("Has remote changes, not syncing value right now"), updateValueDebounced();
-          return;
+      },
+      on: {
+        "update value": [{
+          guard: "is busy",
+          actions: ["assign pending value"],
+          reenter: !0
+        }, {
+          target: "syncing",
+          actions: ["assign pending value"]
+        }]
+      }
+    },
+    syncing: {
+      invoke: {
+        src: "sync value",
+        id: "sync value",
+        input: ({
+          context
+        }) => {
+          var _a;
+          return {
+            context: {
+              keyGenerator: context.keyGenerator,
+              previousValue: context.previousValue,
+              readOnly: context.readOnly,
+              schema: context.schema
+            },
+            slateEditor: context.slateEditor,
+            value: (_a = context.pendingValue) != null ? _a : void 0
+          };
         }
+      },
+      always: {
+        guard: "pending value equals previous value",
+        actions: [xstate.emit(({
+          context
+        }) => ({
+          type: "done syncing",
+          value: context.previousValue
+        }))],
+        target: "idle"
+      },
+      on: {
+        "update value": {
+          actions: ["assign pending value"]
+        },
+        patch: {
+          actions: [xstate.emit(({
+            event
+          }) => event)]
+        },
+        "invalid value": {
+          actions: [xstate.emit(({
+            event
+          }) => event)]
+        },
+        "value changed": {
+          actions: [xstate.emit(({
+            event
+          }) => event)]
+        },
+        "done syncing": [{
+          guard: "value changed while syncing",
+          actions: ["assign previous value", "emit done syncing"],
+          reenter: !0
+        }, {
+          target: "idle",
+          actions: ["clear pending value", "assign previous value", "emit done syncing"]
+        }]
       }
-      let isChanged = !1, isValid = !0;
-      const hadSelection = !!slateEditor.selection;
-      if ((!value || value.length === 0) && (debug$i("Value is empty"), slate.Editor.withoutNormalizing(slateEditor, () => {
-        withoutSaving(slateEditor, () => {
-          withoutPatching(slateEditor, () => {
-            hadSelection && slate.Transforms.deselect(slateEditor);
-            const childrenLength = slateEditor.children.length;
-            slateEditor.children.forEach((_, index) => {
-              slate.Transforms.removeNodes(slateEditor, {
-                at: [childrenLength - 1 - index]
-              });
-            }), slate.Transforms.insertNodes(slateEditor, slateEditor.pteCreateTextBlock({
-              decorators: []
-            }), {
-              at: [0]
-            }), hadSelection && slate.Transforms.select(slateEditor, [0, 0]);
+    }
+  }
+}), debug$i = debugWithName("hook:useSyncValue");
+function updateValue({
+  context,
+  sendBack,
+  slateEditor,
+  value
+}) {
+  let isChanged = !1, isValid = !0;
+  const hadSelection = !!slateEditor.selection;
+  if ((!value || value.length === 0) && (debug$i("Value is empty"), slate.Editor.withoutNormalizing(slateEditor, () => {
+    withoutSaving(slateEditor, () => {
+      withoutPatching(slateEditor, () => {
+        hadSelection && slate.Transforms.deselect(slateEditor);
+        const childrenLength = slateEditor.children.length;
+        slateEditor.children.forEach((_, index) => {
+          slate.Transforms.removeNodes(slateEditor, {
+            at: [childrenLength - 1 - index]
           });
-        });
-      }), isChanged = !0), value && value.length > 0) {
-        const slateValueFromProps = toSlateValue(value, {
-          schemaTypes
-        });
-        slate.Editor.withoutNormalizing(slateEditor, () => {
-          withRemoteChanges(slateEditor, () => {
-            withoutSaving(slateEditor, () => {
-              withoutPatching(slateEditor, () => {
-                const childrenLength_0 = slateEditor.children.length;
-                if (slateValueFromProps.length < childrenLength_0) {
-                  for (let i = childrenLength_0 - 1; i > slateValueFromProps.length - 1; i--)
-                    slate.Transforms.removeNodes(slateEditor, {
-                      at: [i]
-                    });
-                  isChanged = !0;
-                }
-                slateValueFromProps.forEach((currentBlock, currentBlockIndex) => {
-                  var _a, _b, _c, _d, _e;
-                  const oldBlock = slateEditor.children[currentBlockIndex];
-                  if (oldBlock && !isEqual__default.default(currentBlock, oldBlock) && isValid) {
-                    const validationValue = [value[currentBlockIndex]], validation = validateValue(validationValue, schemaTypes, editorActor.getSnapshot().context.keyGenerator);
-                    !validation.valid && (_a = validation.resolution) != null && _a.autoResolve && ((_b = validation.resolution) == null ? void 0 : _b.patches.length) > 0 && !readOnly && previousValue.current && previousValue.current !== value && (console.warn(`${validation.resolution.action} for block with _key '${validationValue[0]._key}'. ${(_c = validation.resolution) == null ? void 0 : _c.description}`), validation.resolution.patches.forEach((patch) => {
-                      editorActor.send({
-                        type: "patch",
-                        patch
-                      });
-                    })), validation.valid || (_d = validation.resolution) != null && _d.autoResolve ? (oldBlock._key === currentBlock._key ? (debug$i.enabled && debug$i("Updating block", oldBlock, currentBlock), _updateBlock(slateEditor, currentBlock, oldBlock, currentBlockIndex)) : (debug$i.enabled && debug$i("Replacing block", oldBlock, currentBlock), _replaceBlock(slateEditor, currentBlock, currentBlockIndex)), isChanged = !0) : (editorActor.send({
-                      type: "invalid value",
-                      resolution: validation.resolution,
-                      value
-                    }), isValid = !1);
-                  }
-                  if (!oldBlock && isValid) {
-                    const validationValue_0 = [value[currentBlockIndex]], validation_0 = validateValue(validationValue_0, schemaTypes, editorActor.getSnapshot().context.keyGenerator);
-                    debug$i.enabled && debug$i("Validating and inserting new block in the end of the value", currentBlock), validation_0.valid || (_e = validation_0.resolution) != null && _e.autoResolve ? slate.Transforms.insertNodes(slateEditor, currentBlock, {
-                      at: [currentBlockIndex]
-                    }) : (debug$i("Invalid", validation_0), editorActor.send({
-                      type: "invalid value",
-                      resolution: validation_0.resolution,
-                      value
-                    }), isValid = !1);
-                  }
-                });
+        }), slate.Transforms.insertNodes(slateEditor, slateEditor.pteCreateTextBlock({
+          decorators: []
+        }), {
+          at: [0]
+        }), hadSelection && slate.Transforms.select(slateEditor, [0, 0]);
+      });
+    });
+  }), isChanged = !0), value && value.length > 0) {
+    const slateValueFromProps = toSlateValue(value, {
+      schemaTypes: context.schema
+    });
+    slate.Editor.withoutNormalizing(slateEditor, () => {
+      withRemoteChanges(slateEditor, () => {
+        withoutPatching(slateEditor, () => {
+          const childrenLength = slateEditor.children.length;
+          if (slateValueFromProps.length < childrenLength) {
+            for (let i = childrenLength - 1; i > slateValueFromProps.length - 1; i--)
+              slate.Transforms.removeNodes(slateEditor, {
+                at: [i]
               });
+            isChanged = !0;
+          }
+          for (const [currentBlockIndex, currentBlock] of slateValueFromProps.entries()) {
+            const {
+              blockChanged,
+              blockValid
+            } = syncBlock({
+              context,
+              sendBack,
+              block: currentBlock,
+              index: currentBlockIndex,
+              slateEditor,
+              value
             });
-          });
-        });
-      }
-      if (!isValid) {
-        debug$i("Invalid value, returning");
-        return;
-      }
-      if (isChanged) {
-        debug$i("Server value changed, syncing editor");
-        try {
-          slateEditor.onChange();
-        } catch (err) {
-          console.error(err), editorActor.send({
-            type: "invalid value",
-            resolution: null,
-            value
-          });
-          return;
-        }
-        hadSelection && !slateEditor.selection && (slate.Transforms.select(slateEditor, {
-          anchor: {
-            path: [0, 0],
-            offset: 0
-          },
-          focus: {
-            path: [0, 0],
-            offset: 0
+            isChanged = blockChanged || isChanged, isValid = isValid && blockValid;
           }
-        }), slateEditor.onChange()), editorActor.send({
-          type: "value changed",
-          value
         });
-      } else
-        debug$i("Server value and editor value is equal, no need to sync.");
-      previousValue.current = value;
-    };
-    return updateValueFunctionRef.current = updateFunction, updateFunction;
-  }, [editorActor, portableTextEditor, readOnly, schemaTypes, slateEditor, updateValueDebounced]);
+      });
+    });
+  }
+  if (!isValid) {
+    debug$i("Invalid value, returning"), sendBack({
+      type: "done syncing",
+      value
+    });
+    return;
+  }
+  if (isChanged) {
+    debug$i("Server value changed, syncing editor");
+    try {
+      slateEditor.onChange();
+    } catch (err) {
+      console.error(err), sendBack({
+        type: "invalid value",
+        resolution: null,
+        value
+      }), sendBack({
+        type: "done syncing",
+        value
+      });
+      return;
+    }
+    hadSelection && !slateEditor.selection && (slate.Transforms.select(slateEditor, {
+      anchor: {
+        path: [0, 0],
+        offset: 0
+      },
+      focus: {
+        path: [0, 0],
+        offset: 0
+      }
+    }), slateEditor.onChange()), sendBack({
+      type: "value changed",
+      value
+    });
+  } else
+    debug$i("Server value and editor value is equal, no need to sync.");
+  sendBack({
+    type: "done syncing",
+    value
+  });
+}
+function syncBlock({
+  context,
+  sendBack,
+  block,
+  index,
+  slateEditor,
+  value
+}) {
+  var _a, _b, _c, _d, _e;
+  let blockChanged = !1, blockValid = !0;
+  const currentBlock = block, currentBlockIndex = index, oldBlock = slateEditor.children[currentBlockIndex];
+  if (oldBlock && !isEqual__default.default(currentBlock, oldBlock) && blockValid) {
+    const validationValue = [value[currentBlockIndex]], validation = validateValue(validationValue, context.schema, context.keyGenerator);
+    !validation.valid && (_a = validation.resolution) != null && _a.autoResolve && ((_b = validation.resolution) == null ? void 0 : _b.patches.length) > 0 && !context.readOnly && context.previousValue && context.previousValue !== value && (console.warn(`${validation.resolution.action} for block with _key '${validationValue[0]._key}'. ${(_c = validation.resolution) == null ? void 0 : _c.description}`), validation.resolution.patches.forEach((patch) => {
+      sendBack({
+        type: "patch",
+        patch
+      });
+    })), validation.valid || (_d = validation.resolution) != null && _d.autoResolve ? (oldBlock._key === currentBlock._key ? (debug$i.enabled && debug$i("Updating block", oldBlock, currentBlock), _updateBlock(slateEditor, currentBlock, oldBlock, currentBlockIndex)) : (debug$i.enabled && debug$i("Replacing block", oldBlock, currentBlock), _replaceBlock(slateEditor, currentBlock, currentBlockIndex)), blockChanged = !0) : (sendBack({
+      type: "invalid value",
+      resolution: validation.resolution,
+      value
+    }), blockValid = !1);
+  }
+  if (!oldBlock && blockValid) {
+    const validationValue = [value[currentBlockIndex]], validation = validateValue(validationValue, context.schema, context.keyGenerator);
+    debug$i.enabled && debug$i("Validating and inserting new block in the end of the value", currentBlock), validation.valid || (_e = validation.resolution) != null && _e.autoResolve ? slate.Transforms.insertNodes(slateEditor, currentBlock, {
+      at: [currentBlockIndex]
+    }) : (debug$i("Invalid", validation), sendBack({
+      type: "invalid value",
+      resolution: validation.resolution,
+      value
+    }), blockValid = !1);
+  }
+  return {
+    blockChanged,
+    blockValid
+  };
 }
 function _replaceBlock(slateEditor, currentBlock, currentBlockIndex) {
   const currentSelection = slateEditor.selection, selectionFocusOnBlock = currentSelection && currentSelection.focus.path[0] === currentBlockIndex;
@@ -2377,89 +2640,105 @@ function _updateBlock(slateEditor, currentBlock, oldBlock, currentBlockIndex) {
     });
   }
 }
-const debug$h = debugWithName("component:PortableTextEditor:Synchronizer"), debugVerbose$3 = debug$h.enabled && !1, FLUSH_PATCHES_THROTTLED_MS = process.env.NODE_ENV === "test" ? 500 : 1e3;
+const debug$h = debugWithName("component:PortableTextEditor:Synchronizer");
 function Synchronizer(props) {
-  const $ = reactCompilerRuntime.c(26), readOnly = react.useSelector(props.editorActor, _temp), value = react.useSelector(props.editorActor, _temp2), {
+  const $ = reactCompilerRuntime.c(40), {
     editorActor,
-    getValue: getValue2,
-    portableTextEditor,
     slateEditor
-  } = props;
+  } = props, value = react.useSelector(props.editorActor, _temp), readOnly = react.useSelector(props.editorActor, _temp2);
   let t0;
-  $[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = [], $[0] = t0) : t0 = $[0];
-  const pendingPatches = React.useRef(t0);
-  let t1;
-  $[1] !== editorActor || $[2] !== portableTextEditor || $[3] !== readOnly || $[4] !== slateEditor ? (t1 = {
-    editorActor,
-    portableTextEditor,
-    readOnly,
-    slateEditor
-  }, $[1] = editorActor, $[2] = portableTextEditor, $[3] = readOnly, $[4] = slateEditor, $[5] = t1) : t1 = $[5];
-  const syncValue = useSyncValue(t1);
-  let t2, t3;
-  $[6] !== slateEditor ? (t2 = () => {
-    IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !1);
-  }, t3 = [slateEditor], $[6] = slateEditor, $[7] = t2, $[8] = t3) : (t2 = $[7], t3 = $[8]), React.useEffect(t2, t3);
+  $[0] !== props.editorActor ? (t0 = props.editorActor.getSnapshot(), $[0] = props.editorActor, $[1] = t0) : t0 = $[1];
+  const t1 = t0.context.keyGenerator;
+  let t2;
+  $[2] !== props.editorActor ? (t2 = props.editorActor.getSnapshot().matches({
+    "edit mode": "read only"
+  }), $[2] = props.editorActor, $[3] = t2) : t2 = $[3];
+  let t3;
+  $[4] !== props.editorActor ? (t3 = props.editorActor.getSnapshot(), $[4] = props.editorActor, $[5] = t3) : t3 = $[5];
   let t4;
-  $[9] !== editorActor || $[10] !== getValue2 || $[11] !== slateEditor ? (t4 = () => {
-    if (pendingPatches.current.length > 0) {
-      debug$h("Flushing pending patches"), debugVerbose$3 && debug$h(`Patches:
-${JSON.stringify(pendingPatches.current, null, 2)}`);
-      const snapshot = getValue2();
-      editorActor.send({
-        type: "mutation",
-        patches: pendingPatches.current,
-        snapshot
-      }), pendingPatches.current = [];
+  $[6] !== slateEditor || $[7] !== t0.context.keyGenerator || $[8] !== t2 || $[9] !== t3.context.schema ? (t4 = {
+    input: {
+      keyGenerator: t1,
+      readOnly: t2,
+      schema: t3.context.schema,
+      slateEditor
     }
-    IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !1);
-  }, $[9] = editorActor, $[10] = getValue2, $[11] = slateEditor, $[12] = t4) : t4 = $[12];
-  const onFlushPendingPatches = t4;
-  let t5, t6;
-  $[13] !== onFlushPendingPatches ? (t5 = () => () => {
-    onFlushPendingPatches();
-  }, t6 = [onFlushPendingPatches], $[13] = onFlushPendingPatches, $[14] = t5, $[15] = t6) : (t5 = $[14], t6 = $[15]), React.useEffect(t5, t6);
+  }, $[6] = slateEditor, $[7] = t0.context.keyGenerator, $[8] = t2, $[9] = t3.context.schema, $[10] = t4) : t4 = $[10];
+  const syncActorRef = react.useActorRef(syncMachine, t4);
+  let t5;
+  $[11] !== editorActor ? (t5 = editorActor.getSnapshot(), $[11] = editorActor, $[12] = t5) : t5 = $[12];
+  let t6;
+  $[13] !== slateEditor || $[14] !== t5.context.schema ? (t6 = {
+    input: {
+      schema: t5.context.schema,
+      slateEditor
+    }
+  }, $[13] = slateEditor, $[14] = t5.context.schema, $[15] = t6) : t6 = $[15];
+  const mutationActorRef = react.useActorRef(mutationMachine, t6);
   let t7, t8;
-  $[16] !== editorActor || $[17] !== onFlushPendingPatches || $[18] !== slateEditor ? (t7 = () => {
-    const onFlushPendingPatchesThrottled = throttle__default.default(() => {
-      if (slate.Editor.isNormalizing(slateEditor)) {
-        onFlushPendingPatches();
-        return;
-      }
-      onFlushPendingPatchesThrottled();
-    }, FLUSH_PATCHES_THROTTLED_MS, {
-      leading: !1,
-      trailing: !0
+  $[16] !== editorActor || $[17] !== mutationActorRef || $[18] !== syncActorRef ? (t7 = () => {
+    const subscription = mutationActorRef.on("*", (event) => {
+      event.type === "has pending patches" && syncActorRef.send({
+        type: "has pending patches"
+      }), event.type === "mutation" && (syncActorRef.send({
+        type: "mutation"
+      }), editorActor.send(event));
     });
+    return () => {
+      subscription.unsubscribe();
+    };
+  }, t8 = [mutationActorRef, syncActorRef, editorActor], $[16] = editorActor, $[17] = mutationActorRef, $[18] = syncActorRef, $[19] = t7, $[20] = t8) : (t7 = $[19], t8 = $[20]), React.useEffect(t7, t8);
+  let t10, t9;
+  $[21] !== props.editorActor || $[22] !== syncActorRef ? (t9 = () => {
+    const subscription_0 = syncActorRef.on("*", (event_0) => {
+      props.editorActor.send(event_0);
+    });
+    return () => {
+      subscription_0.unsubscribe();
+    };
+  }, t10 = [props.editorActor, syncActorRef], $[21] = props.editorActor, $[22] = syncActorRef, $[23] = t10, $[24] = t9) : (t10 = $[23], t9 = $[24]), React.useEffect(t9, t10);
+  let t11, t12;
+  $[25] !== readOnly || $[26] !== syncActorRef ? (t11 = () => {
+    syncActorRef.send({
+      type: "update readOnly",
+      readOnly
+    });
+  }, t12 = [syncActorRef, readOnly], $[25] = readOnly, $[26] = syncActorRef, $[27] = t11, $[28] = t12) : (t11 = $[27], t12 = $[28]), React.useEffect(t11, t12);
+  let t13, t14;
+  $[29] !== syncActorRef || $[30] !== value ? (t13 = () => {
+    debug$h("Value from props changed, syncing new value"), syncActorRef.send({
+      type: "update value",
+      value
+    });
+  }, t14 = [syncActorRef, value], $[29] = syncActorRef, $[30] = value, $[31] = t13, $[32] = t14) : (t13 = $[31], t14 = $[32]), React.useEffect(t13, t14);
+  let t15;
+  $[33] !== editorActor || $[34] !== mutationActorRef ? (t15 = () => {
     debug$h("Subscribing to patch events");
-    const sub = editorActor.on("patch", (event) => {
-      IS_PROCESSING_LOCAL_CHANGES.set(slateEditor, !0), pendingPatches.current.push(event.patch), onFlushPendingPatchesThrottled();
+    const sub = editorActor.on("patch", (event_1) => {
+      mutationActorRef.send(event_1);
     });
     return () => {
       debug$h("Unsubscribing to patch events"), sub.unsubscribe();
     };
-  }, t8 = [editorActor, onFlushPendingPatches, slateEditor], $[16] = editorActor, $[17] = onFlushPendingPatches, $[18] = slateEditor, $[19] = t7, $[20] = t8) : (t7 = $[19], t8 = $[20]), React.useEffect(t7, t8);
-  const isInitialValueFromProps = React.useRef(!0);
-  let t10, t9;
-  return $[21] !== editorActor || $[22] !== syncValue || $[23] !== value ? (t9 = () => {
-    debug$h("Value from props changed, syncing new value"), syncValue(value), isInitialValueFromProps.current && (editorActor.send({
-      type: "ready"
-    }), isInitialValueFromProps.current = !1);
-  }, t10 = [editorActor, syncValue, value], $[21] = editorActor, $[22] = syncValue, $[23] = value, $[24] = t10, $[25] = t9) : (t10 = $[24], t9 = $[25]), React.useEffect(t9, t10), null;
+  }, $[33] = editorActor, $[34] = mutationActorRef, $[35] = t15) : t15 = $[35];
+  let t16;
+  return $[36] !== editorActor || $[37] !== mutationActorRef || $[38] !== slateEditor ? (t16 = [editorActor, mutationActorRef, slateEditor], $[36] = editorActor, $[37] = mutationActorRef, $[38] = slateEditor, $[39] = t16) : t16 = $[39], React.useEffect(t15, t16), null;
 }
 function _temp2(s_0) {
-  return s_0.context.value;
+  return s_0.matches({
+    "edit mode": "read only"
+  });
 }
 function _temp(s) {
-  return s.context.readOnly;
+  return s.context.value;
 }
 Synchronizer.displayName = "Synchronizer";
-var __defProp$k = Object.defineProperty, __defProps$f = Object.defineProperties, __getOwnPropDescs$f = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$k = Object.getOwnPropertySymbols, __hasOwnProp$k = Object.prototype.hasOwnProperty, __propIsEnum$k = Object.prototype.propertyIsEnumerable, __defNormalProp$k = (obj, key, value) => key in obj ? __defProp$k(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$k = (a, b) => {
+var __defProp$l = Object.defineProperty, __defProps$f = Object.defineProperties, __getOwnPropDescs$f = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$l = Object.getOwnPropertySymbols, __hasOwnProp$l = Object.prototype.hasOwnProperty, __propIsEnum$l = Object.prototype.propertyIsEnumerable, __defNormalProp$l = (obj, key, value) => key in obj ? __defProp$l(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$l = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$k.call(b, prop) && __defNormalProp$k(a, prop, b[prop]);
-  if (__getOwnPropSymbols$k)
-    for (var prop of __getOwnPropSymbols$k(b))
-      __propIsEnum$k.call(b, prop) && __defNormalProp$k(a, prop, b[prop]);
+    __hasOwnProp$l.call(b, prop) && __defNormalProp$l(a, prop, b[prop]);
+  if (__getOwnPropSymbols$l)
+    for (var prop of __getOwnPropSymbols$l(b))
+      __propIsEnum$l.call(b, prop) && __defNormalProp$l(a, prop, b[prop]);
   return a;
 }, __spreadProps$f = (a, b) => __defProps$f(a, __getOwnPropDescs$f(b));
 const debug$g = debugWithName("operationToPatches");
@@ -2501,7 +2780,7 @@ function createOperationToPatches(types2) {
       const block = editor.children[operation.path[0]];
       if (typeof block._key != "string")
         throw new Error("Expected block to have a _key");
-      const setNode = omitBy__default.default(__spreadValues$k(__spreadValues$k({}, editor.children[operation.path[0]]), operation.newProperties), isUndefined__default.default);
+      const setNode = omitBy__default.default(__spreadValues$l(__spreadValues$l({}, editor.children[operation.path[0]]), operation.newProperties), isUndefined__default.default);
       return [patches.set(fromSlateValue([setNode], textBlockName)[0], [{
         _key: block._key
       }])];
@@ -2541,7 +2820,7 @@ function createOperationToPatches(types2) {
         _key: targetKey
       }])] : [patches.setIfMissing(beforeValue, []), patches.insert([fromSlateValue([operation.node], textBlockName)[0]], "before", [operation.path[0]])];
     } else if (isTextBlock && operation.path.length === 2 && editor.children[operation.path[0]]) {
-      const position = block.children.length === 0 || !block.children[operation.path[1] - 1] ? "before" : "after", node = __spreadValues$k({}, operation.node);
+      const position = block.children.length === 0 || !block.children[operation.path[1] - 1] ? "before" : "after", node = __spreadValues$l({}, operation.node);
       !node._type && slate.Text.isText(node) && (node._type = "span", node.marks = []);
       const child = fromSlateValue([{
         _key: "bogus",
@@ -2580,7 +2859,7 @@ function createOperationToPatches(types2) {
     if (operation.path.length === 2) {
       const splitSpan = splitBlock.children[operation.path[1]];
       if (editor.isTextSpan(splitSpan)) {
-        const targetSpans = fromSlateValue([__spreadProps$f(__spreadValues$k({}, splitBlock), {
+        const targetSpans = fromSlateValue([__spreadProps$f(__spreadValues$l({}, splitBlock), {
           children: splitBlock.children.slice(operation.path[1] + 1, operation.path[1] + 2)
         })], textBlockName)[0].children;
         patches$1.push(patches.insert(targetSpans, "after", [{
@@ -2891,7 +3170,9 @@ function createWithMaxBlocks(editorActor) {
     } = editor;
     return editor.apply = (operation) => {
       var _a;
-      if (editorActor.getSnapshot().context.readOnly) {
+      if (editorActor.getSnapshot().matches({
+        "edit mode": "read only"
+      })) {
         apply2(operation);
         return;
       }
@@ -2908,12 +3189,12 @@ function createWithMaxBlocks(editorActor) {
     }, editor;
   };
 }
-var __defProp$j = Object.defineProperty, __defProps$e = Object.defineProperties, __getOwnPropDescs$e = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$j = Object.getOwnPropertySymbols, __hasOwnProp$j = Object.prototype.hasOwnProperty, __propIsEnum$j = Object.prototype.propertyIsEnumerable, __defNormalProp$j = (obj, key, value) => key in obj ? __defProp$j(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$j = (a, b) => {
+var __defProp$k = Object.defineProperty, __defProps$e = Object.defineProperties, __getOwnPropDescs$e = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$k = Object.getOwnPropertySymbols, __hasOwnProp$k = Object.prototype.hasOwnProperty, __propIsEnum$k = Object.prototype.propertyIsEnumerable, __defNormalProp$k = (obj, key, value) => key in obj ? __defProp$k(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$k = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$j.call(b, prop) && __defNormalProp$j(a, prop, b[prop]);
-  if (__getOwnPropSymbols$j)
-    for (var prop of __getOwnPropSymbols$j(b))
-      __propIsEnum$j.call(b, prop) && __defNormalProp$j(a, prop, b[prop]);
+    __hasOwnProp$k.call(b, prop) && __defNormalProp$k(a, prop, b[prop]);
+  if (__getOwnPropSymbols$k)
+    for (var prop of __getOwnPropSymbols$k(b))
+      __propIsEnum$k.call(b, prop) && __defNormalProp$k(a, prop, b[prop]);
   return a;
 }, __spreadProps$e = (a, b) => __defProps$e(a, __getOwnPropDescs$e(b));
 function createWithObjectKeys(editorActor, schemaTypes) {
@@ -2932,16 +3213,16 @@ function createWithObjectKeys(editorActor, schemaTypes) {
         return;
       }
       if (operation.type === "split_node") {
-        apply2(__spreadProps$e(__spreadValues$j({}, operation), {
-          properties: __spreadProps$e(__spreadValues$j({}, operation.properties), {
+        apply2(__spreadProps$e(__spreadValues$k({}, operation), {
+          properties: __spreadProps$e(__spreadValues$k({}, operation.properties), {
             _key: editorActor.getSnapshot().context.keyGenerator()
           })
         }));
         return;
       }
       if (operation.type === "insert_node" && !slate.Editor.isEditor(operation.node)) {
-        apply2(__spreadProps$e(__spreadValues$j({}, operation), {
-          node: __spreadProps$e(__spreadValues$j({}, operation.node), {
+        apply2(__spreadProps$e(__spreadValues$k({}, operation), {
+          node: __spreadProps$e(__spreadValues$k({}, operation.node), {
             _key: editorActor.getSnapshot().context.keyGenerator()
           })
         }));
@@ -2981,20 +3262,20 @@ function createWithObjectKeys(editorActor, schemaTypes) {
     }, editor;
   };
 }
-var __defProp$i = Object.defineProperty, __defProps$d = Object.defineProperties, __getOwnPropDescs$d = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$i = Object.getOwnPropertySymbols, __hasOwnProp$i = Object.prototype.hasOwnProperty, __propIsEnum$i = Object.prototype.propertyIsEnumerable, __defNormalProp$i = (obj, key, value) => key in obj ? __defProp$i(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$i = (a, b) => {
+var __defProp$j = Object.defineProperty, __defProps$d = Object.defineProperties, __getOwnPropDescs$d = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$j = Object.getOwnPropertySymbols, __hasOwnProp$j = Object.prototype.hasOwnProperty, __propIsEnum$j = Object.prototype.propertyIsEnumerable, __defNormalProp$j = (obj, key, value) => key in obj ? __defProp$j(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$j = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$i.call(b, prop) && __defNormalProp$i(a, prop, b[prop]);
-  if (__getOwnPropSymbols$i)
-    for (var prop of __getOwnPropSymbols$i(b))
-      __propIsEnum$i.call(b, prop) && __defNormalProp$i(a, prop, b[prop]);
+    __hasOwnProp$j.call(b, prop) && __defNormalProp$j(a, prop, b[prop]);
+  if (__getOwnPropSymbols$j)
+    for (var prop of __getOwnPropSymbols$j(b))
+      __propIsEnum$j.call(b, prop) && __defNormalProp$j(a, prop, b[prop]);
   return a;
 }, __spreadProps$d = (a, b) => __defProps$d(a, __getOwnPropDescs$d(b)), __objRest$2 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    __hasOwnProp$i.call(source, prop) && exclude.indexOf(prop) < 0 && (target[prop] = source[prop]);
-  if (source != null && __getOwnPropSymbols$i)
-    for (var prop of __getOwnPropSymbols$i(source))
-      exclude.indexOf(prop) < 0 && __propIsEnum$i.call(source, prop) && (target[prop] = source[prop]);
+    __hasOwnProp$j.call(source, prop) && exclude.indexOf(prop) < 0 && (target[prop] = source[prop]);
+  if (source != null && __getOwnPropSymbols$j)
+    for (var prop of __getOwnPropSymbols$j(source))
+      exclude.indexOf(prop) < 0 && __propIsEnum$j.call(source, prop) && (target[prop] = source[prop]);
   return target;
 };
 const debug$f = debugWithName("applyPatches"), debugVerbose$2 = debug$f.enabled && !0;
@@ -3086,7 +3367,7 @@ function insertPatch(editor, patch, schemaTypes) {
   } = patch;
   if (!targetChild || !targetChildPath)
     return debug$f("Child not found"), !1;
-  const childrenToInsert = targetBlock && toSlateValue([__spreadProps$d(__spreadValues$i({}, targetBlock), {
+  const childrenToInsert = targetBlock && toSlateValue([__spreadProps$d(__spreadValues$j({}, targetBlock), {
     children: items
   })], {
     schemaTypes
@@ -3145,7 +3426,7 @@ function setPatch(editor, patch) {
     editor.apply({
       type: "set_node",
       path: blockPath,
-      properties: __spreadValues$i({}, prevRest),
+      properties: __spreadValues$j({}, prevRest),
       newProperties: nextRest
     }), debug$f("Setting children"), block.children.forEach((c, cIndex) => {
       editor.apply({
@@ -3162,7 +3443,7 @@ function setPatch(editor, patch) {
     });
   } else if (block && "value" in block) {
     const newVal = patches.applyAll([block.value], [patch])[0];
-    return slate.Transforms.setNodes(editor, __spreadProps$d(__spreadValues$i({}, block), {
+    return slate.Transforms.setNodes(editor, __spreadProps$d(__spreadValues$j({}, block), {
       value: newVal
     }), {
       at: blockPath
@@ -3255,12 +3536,12 @@ function findBlockAndChildFromPath(editor, path) {
     childPath: void 0
   };
 }
-var __defProp$h = Object.defineProperty, __defProps$c = Object.defineProperties, __getOwnPropDescs$c = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$h = Object.getOwnPropertySymbols, __hasOwnProp$h = Object.prototype.hasOwnProperty, __propIsEnum$h = Object.prototype.propertyIsEnumerable, __defNormalProp$h = (obj, key, value) => key in obj ? __defProp$h(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$h = (a, b) => {
+var __defProp$i = Object.defineProperty, __defProps$c = Object.defineProperties, __getOwnPropDescs$c = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$i = Object.getOwnPropertySymbols, __hasOwnProp$i = Object.prototype.hasOwnProperty, __propIsEnum$i = Object.prototype.propertyIsEnumerable, __defNormalProp$i = (obj, key, value) => key in obj ? __defProp$i(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$i = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$h.call(b, prop) && __defNormalProp$h(a, prop, b[prop]);
-  if (__getOwnPropSymbols$h)
-    for (var prop of __getOwnPropSymbols$h(b))
-      __propIsEnum$h.call(b, prop) && __defNormalProp$h(a, prop, b[prop]);
+    __hasOwnProp$i.call(b, prop) && __defNormalProp$i(a, prop, b[prop]);
+  if (__getOwnPropSymbols$i)
+    for (var prop of __getOwnPropSymbols$i(b))
+      __propIsEnum$i.call(b, prop) && __defNormalProp$i(a, prop, b[prop]);
   return a;
 }, __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
 const debug$e = debugWithName("plugin:withPatches");
@@ -3308,8 +3589,6 @@ function createWithPatches({
         debug$e("Unsubscribing to remote patches"), sub.unsubscribe();
       };
     }), editor.apply = (operation) => {
-      if (editorActor.getSnapshot().context.readOnly)
-        return apply2(operation), editor;
       let patches$1 = [];
       previousChildren = editor.children;
       const editorWasEmpty = isEqualToEmptyEditor(previousChildren, schemaTypes);
@@ -3349,7 +3628,7 @@ function createWithPatches({
       })), editorWasEmpty && patches$1.length > 0 && (patches$1 = [patches.setIfMissing([], []), ...patches$1]), patches$1.length > 0 && patches$1.forEach((patch) => {
         editorActor.send({
           type: "patch",
-          patch: __spreadProps$c(__spreadValues$h({}, patch), {
+          patch: __spreadProps$c(__spreadValues$i({}, patch), {
             origin: "local"
           })
         });
@@ -3364,7 +3643,9 @@ function createWithPlaceholderBlock(editorActor) {
       apply: apply2
     } = editor;
     return editor.apply = (op) => {
-      if (editorActor.getSnapshot().context.readOnly) {
+      if (editorActor.getSnapshot().matches({
+        "edit mode": "read only"
+      })) {
         apply2(op);
         return;
       }
@@ -3462,12 +3743,12 @@ function getNextSpan({
     }
   return nextSpan;
 }
-var __defProp$g = Object.defineProperty, __defProps$b = Object.defineProperties, __getOwnPropDescs$b = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$g = Object.getOwnPropertySymbols, __hasOwnProp$g = Object.prototype.hasOwnProperty, __propIsEnum$g = Object.prototype.propertyIsEnumerable, __defNormalProp$g = (obj, key, value) => key in obj ? __defProp$g(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$g = (a, b) => {
+var __defProp$h = Object.defineProperty, __defProps$b = Object.defineProperties, __getOwnPropDescs$b = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$h = Object.getOwnPropertySymbols, __hasOwnProp$h = Object.prototype.hasOwnProperty, __propIsEnum$h = Object.prototype.propertyIsEnumerable, __defNormalProp$h = (obj, key, value) => key in obj ? __defProp$h(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$h = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$g.call(b, prop) && __defNormalProp$g(a, prop, b[prop]);
-  if (__getOwnPropSymbols$g)
-    for (var prop of __getOwnPropSymbols$g(b))
-      __propIsEnum$g.call(b, prop) && __defNormalProp$g(a, prop, b[prop]);
+    __hasOwnProp$h.call(b, prop) && __defNormalProp$h(a, prop, b[prop]);
+  if (__getOwnPropSymbols$h)
+    for (var prop of __getOwnPropSymbols$h(b))
+      __propIsEnum$h.call(b, prop) && __defNormalProp$h(a, prop, b[prop]);
   return a;
 }, __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
 const debug$b = debugWithName("plugin:withPortableTextMarkModel");
@@ -3669,21 +3950,21 @@ function createWithPortableTextMarkModel(editorActor, types2) {
             spanPath: [op.path[0], op.path[1] - 1]
           }), nextSpanAnnotations = nextSpan ? (_d = nextSpan.marks) == null ? void 0 : _d.filter((mark) => !decorators.includes(mark)) : [], annotationsEnding = (_e = previousSpanAnnotations == null ? void 0 : previousSpanAnnotations.filter((annotation) => !(nextSpanAnnotations != null && nextSpanAnnotations.includes(annotation)))) != null ? _e : [], atTheEndOfAnnotation = annotationsEnding.length > 0;
           if (atTheEndOfAnnotation && isPortableTextSpan(op.node) && (_f = op.node.marks) != null && _f.some((mark) => annotationsEnding.includes(mark))) {
-            slate.Transforms.insertNodes(editor, __spreadProps$b(__spreadValues$g({}, op.node), {
+            slate.Transforms.insertNodes(editor, __spreadProps$b(__spreadValues$h({}, op.node), {
               marks: (_h = (_g = op.node.marks) == null ? void 0 : _g.filter((mark) => !annotationsEnding.includes(mark))) != null ? _h : []
             }));
             return;
           }
           const annotationsStarting = (_i = nextSpanAnnotations == null ? void 0 : nextSpanAnnotations.filter((annotation) => !(previousSpanAnnotations != null && previousSpanAnnotations.includes(annotation)))) != null ? _i : [], atTheStartOfAnnotation = annotationsStarting.length > 0;
           if (atTheStartOfAnnotation && isPortableTextSpan(op.node) && (_j = op.node.marks) != null && _j.some((mark) => annotationsStarting.includes(mark))) {
-            slate.Transforms.insertNodes(editor, __spreadProps$b(__spreadValues$g({}, op.node), {
+            slate.Transforms.insertNodes(editor, __spreadProps$b(__spreadValues$h({}, op.node), {
               marks: (_l = (_k = op.node.marks) == null ? void 0 : _k.filter((mark) => !annotationsStarting.includes(mark))) != null ? _l : []
             }));
             return;
           }
           const nextSpanDecorators = (_n = (_m = nextSpan == null ? void 0 : nextSpan.marks) == null ? void 0 : _m.filter((mark) => decorators.includes(mark))) != null ? _n : [];
           if (nextSpanDecorators.length > 0 && atTheEndOfAnnotation && !atTheStartOfAnnotation && isPortableTextSpan(op.node) && ((_o = op.node.marks) == null ? void 0 : _o.length) === 0) {
-            slate.Transforms.insertNodes(editor, __spreadProps$b(__spreadValues$g({}, op.node), {
+            slate.Transforms.insertNodes(editor, __spreadProps$b(__spreadValues$h({}, op.node), {
               marks: nextSpanDecorators
             }));
             return;
@@ -3801,7 +4082,7 @@ function createWithPortableTextMarkModel(editorActor, types2) {
               spanPath
             }), previousSpanHasSameAnnotation = previousSpan ? (_E = previousSpan.marks) == null ? void 0 : _E.some((mark) => !decorators.includes(mark) && marks.includes(mark)) : !1, nextSpanHasSameAnnotation = nextSpan ? (_F = nextSpan.marks) == null ? void 0 : _F.some((mark) => !decorators.includes(mark) && marks.includes(mark)) : !1;
             if (spanHasAnnotations && deletingAllText && !previousSpanHasSameAnnotation && !nextSpanHasSameAnnotation) {
-              const marksWithoutAnnotationMarks = (__spreadValues$g({}, slate.Editor.marks(editor) || {}).marks || []).filter((mark) => decorators.includes(mark));
+              const marksWithoutAnnotationMarks = (__spreadValues$h({}, slate.Editor.marks(editor) || {}).marks || []).filter((mark) => decorators.includes(mark));
               slate.Editor.withoutNormalizing(editor, () => {
                 apply2(op), slate.Transforms.setNodes(editor, {
                   marks: marksWithoutAnnotationMarks
@@ -3874,7 +4155,7 @@ const addDecoratorActionImplementation = ({
           match: (node) => editor.isTextSpan(node)
         });
       } else {
-        const existingMarks = __spreadValues$g({}, slate.Editor.marks(editor) || {}).marks || [], marks = __spreadProps$b(__spreadValues$g({}, slate.Editor.marks(editor) || {}), {
+        const existingMarks = __spreadValues$h({}, slate.Editor.marks(editor) || {}).marks || [], marks = __spreadProps$b(__spreadValues$h({}, slate.Editor.marks(editor) || {}), {
           marks: [...existingMarks, mark]
         });
         editor.marks = marks;
@@ -3920,7 +4201,7 @@ const addDecoratorActionImplementation = ({
           match: (node) => editor.isTextSpan(node)
         });
       } else {
-        const existingMarks = __spreadValues$g({}, slate.Editor.marks(editor) || {}).marks || [], marks = __spreadProps$b(__spreadValues$g({}, slate.Editor.marks(editor) || {}), {
+        const existingMarks = __spreadValues$h({}, slate.Editor.marks(editor) || {}).marks || [], marks = __spreadProps$b(__spreadValues$h({}, slate.Editor.marks(editor) || {}), {
           marks: existingMarks.filter((eMark) => eMark !== mark)
         });
         editor.marks = {
@@ -3944,7 +4225,7 @@ function isDecoratorActive({
     var _a;
     const [node] = n;
     return (_a = node.marks) == null ? void 0 : _a.includes(decorator);
-  }) : (__spreadValues$g({}, slate.Editor.marks(editor) || {}).marks || []).includes(decorator);
+  }) : (__spreadValues$h({}, slate.Editor.marks(editor) || {}).marks || []).includes(decorator);
 }
 const toggleDecoratorActionImplementation = ({
   context,
@@ -3998,16 +4279,18 @@ function createWithPortableTextSelections(editorActor, types2) {
     } = editor;
     return editor.onChange = () => {
       const hasChanges = editor.operations.length > 0;
-      onChange(), hasChanges && emitPortableTextSelection();
+      onChange(), hasChanges && !editorActor.getSnapshot().matches({
+        setup: "setting up"
+      }) && emitPortableTextSelection();
     }, editor;
   };
 }
-var __defProp$f = Object.defineProperty, __defProps$a = Object.defineProperties, __getOwnPropDescs$a = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$f = Object.getOwnPropertySymbols, __hasOwnProp$f = Object.prototype.hasOwnProperty, __propIsEnum$f = Object.prototype.propertyIsEnumerable, __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$f = (a, b) => {
+var __defProp$g = Object.defineProperty, __defProps$a = Object.defineProperties, __getOwnPropDescs$a = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$g = Object.getOwnPropertySymbols, __hasOwnProp$g = Object.prototype.hasOwnProperty, __propIsEnum$g = Object.prototype.propertyIsEnumerable, __defNormalProp$g = (obj, key, value) => key in obj ? __defProp$g(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$g = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$f.call(b, prop) && __defNormalProp$f(a, prop, b[prop]);
-  if (__getOwnPropSymbols$f)
-    for (var prop of __getOwnPropSymbols$f(b))
-      __propIsEnum$f.call(b, prop) && __defNormalProp$f(a, prop, b[prop]);
+    __hasOwnProp$g.call(b, prop) && __defNormalProp$g(a, prop, b[prop]);
+  if (__getOwnPropSymbols$g)
+    for (var prop of __getOwnPropSymbols$g(b))
+      __propIsEnum$g.call(b, prop) && __defNormalProp$g(a, prop, b[prop]);
   return a;
 }, __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
 const debug$9 = debugWithName("plugin:withSchemaTypes");
@@ -4027,7 +4310,7 @@ function createWithSchemaTypes({
         const span = node, key = span._key || editorActor.getSnapshot().context.keyGenerator();
         editorActor.send({
           type: "normalizing"
-        }), slate.Transforms.setNodes(editor, __spreadProps$a(__spreadValues$f({}, span), {
+        }), slate.Transforms.setNodes(editor, __spreadProps$a(__spreadValues$g({}, span), {
           _type: schemaTypes.span.name,
           _key: key
         }), {
@@ -4055,12 +4338,12 @@ function createWithSchemaTypes({
     }, editor;
   };
 }
-var __defProp$e = Object.defineProperty, __defProps$9 = Object.defineProperties, __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$e = Object.getOwnPropertySymbols, __hasOwnProp$e = Object.prototype.hasOwnProperty, __propIsEnum$e = Object.prototype.propertyIsEnumerable, __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$e = (a, b) => {
+var __defProp$f = Object.defineProperty, __defProps$9 = Object.defineProperties, __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$f = Object.getOwnPropertySymbols, __hasOwnProp$f = Object.prototype.hasOwnProperty, __propIsEnum$f = Object.prototype.propertyIsEnumerable, __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$f = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$e.call(b, prop) && __defNormalProp$e(a, prop, b[prop]);
-  if (__getOwnPropSymbols$e)
-    for (var prop of __getOwnPropSymbols$e(b))
-      __propIsEnum$e.call(b, prop) && __defNormalProp$e(a, prop, b[prop]);
+    __hasOwnProp$f.call(b, prop) && __defNormalProp$f(a, prop, b[prop]);
+  if (__getOwnPropSymbols$f)
+    for (var prop of __getOwnPropSymbols$f(b))
+      __propIsEnum$f.call(b, prop) && __defNormalProp$f(a, prop, b[prop]);
   return a;
 }, __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
 const debug$8 = debugWithName("plugin:withUtils");
@@ -4086,10 +4369,10 @@ function createWithUtils({
         } = 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 || Number.isNaN(newStartOffset) || Number.isNaN(newEndOffset))) {
           debug$8("pteExpandToWord: Expanding to focused word"), slate.Transforms.setSelection(editor, {
-            anchor: __spreadProps$9(__spreadValues$e({}, selection.anchor), {
+            anchor: __spreadProps$9(__spreadValues$f({}, selection.anchor), {
               offset: newStartOffset
             }),
-            focus: __spreadProps$9(__spreadValues$e({}, selection.focus), {
+            focus: __spreadProps$9(__spreadValues$f({}, selection.focus), {
               offset: newEndOffset
             })
           });
@@ -4097,7 +4380,7 @@ function createWithUtils({
         }
         debug$8("pteExpandToWord: Can't expand to word here");
       }
-    }, editor.pteCreateTextBlock = (options) => toSlateValue([__spreadProps$9(__spreadValues$e(__spreadValues$e({
+    }, editor.pteCreateTextBlock = (options) => toSlateValue([__spreadProps$9(__spreadValues$f(__spreadValues$f({
       _type: schemaTypes.block.name,
       _key: editorActor.getSnapshot().context.keyGenerator(),
       style: schemaTypes.styles[0].value || "normal"
@@ -4161,12 +4444,12 @@ function createSlateEditor(config) {
   };
   return slateEditors.set(config.editorActor, slateEditor), slateEditor;
 }
-var __defProp$d = Object.defineProperty, __defProps$8 = Object.defineProperties, __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$d = Object.getOwnPropertySymbols, __hasOwnProp$d = Object.prototype.hasOwnProperty, __propIsEnum$d = Object.prototype.propertyIsEnumerable, __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$d = (a, b) => {
+var __defProp$e = Object.defineProperty, __defProps$8 = Object.defineProperties, __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$e = Object.getOwnPropertySymbols, __hasOwnProp$e = Object.prototype.hasOwnProperty, __propIsEnum$e = Object.prototype.propertyIsEnumerable, __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$e = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$d.call(b, prop) && __defNormalProp$d(a, prop, b[prop]);
-  if (__getOwnPropSymbols$d)
-    for (var prop of __getOwnPropSymbols$d(b))
-      __propIsEnum$d.call(b, prop) && __defNormalProp$d(a, prop, b[prop]);
+    __hasOwnProp$e.call(b, prop) && __defNormalProp$e(a, prop, b[prop]);
+  if (__getOwnPropSymbols$e)
+    for (var prop of __getOwnPropSymbols$e(b))
+      __propIsEnum$e.call(b, prop) && __defNormalProp$e(a, prop, b[prop]);
   return a;
 }, __spreadProps$8 = (a, b) => __defProps$8(a, __getOwnPropDescs$8(b));
 const toggleListItemActionImplementation = ({
@@ -4178,12 +4461,12 @@ const toggleListItemActionImplementation = ({
     listItem: action.listItem
   }) ? removeListItemActionImplementation({
     context,
-    action: __spreadProps$8(__spreadValues$d({}, action), {
+    action: __spreadProps$8(__spreadValues$e({}, action), {
       type: "list item.remove"
     })
   }) : addListItemActionImplementation({
     context,
-    action: __spreadProps$8(__spreadValues$d({}, action), {
+    action: __spreadProps$8(__spreadValues$e({}, action), {
       type: "list item.add"
     })
   });
@@ -4193,7 +4476,7 @@ const toggleListItemActionImplementation = ({
 }) => {
   if (!action.editor.selection)
     return;
-  const guards = selectors.createGuards(context), selectedBlocks = [...slate.Editor.nodes(action.editor, {
+  const guards = selector_isSelectionCollapsed.createGuards(context), selectedBlocks = [...slate.Editor.nodes(action.editor, {
     at: action.editor.selection,
     match: (node) => guards.isListBlock(node)
   })];
@@ -4207,7 +4490,7 @@ const toggleListItemActionImplementation = ({
 }) => {
   if (!action.editor.selection)
     return;
-  const guards = selectors.createGuards(context), selectedBlocks = [...slate.Editor.nodes(action.editor, {
+  const guards = selector_isSelectionCollapsed.createGuards(context), selectedBlocks = [...slate.Editor.nodes(action.editor, {
     at: action.editor.selection,
     match: (node) => guards.isTextBlock(node)
   })];
@@ -4231,12 +4514,12 @@ function isListItemActive({
   })];
   return selectedBlocks.length > 0 ? selectedBlocks.every(([node]) => editor.isListBlock(node) && node.listItem === listItem) : !1;
 }
-var __defProp$c = Object.defineProperty, __defProps$7 = Object.defineProperties, __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$c = Object.getOwnPropertySymbols, __hasOwnProp$c = Object.prototype.hasOwnProperty, __propIsEnum$c = Object.prototype.propertyIsEnumerable, __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$c = (a, b) => {
+var __defProp$d = Object.defineProperty, __defProps$7 = Object.defineProperties, __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$d = Object.getOwnPropertySymbols, __hasOwnProp$d = Object.prototype.hasOwnProperty, __propIsEnum$d = Object.prototype.propertyIsEnumerable, __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$d = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$c.call(b, prop) && __defNormalProp$c(a, prop, b[prop]);
-  if (__getOwnPropSymbols$c)
-    for (var prop of __getOwnPropSymbols$c(b))
-      __propIsEnum$c.call(b, prop) && __defNormalProp$c(a, prop, b[prop]);
+    __hasOwnProp$d.call(b, prop) && __defNormalProp$d(a, prop, b[prop]);
+  if (__getOwnPropSymbols$d)
+    for (var prop of __getOwnPropSymbols$d(b))
+      __propIsEnum$d.call(b, prop) && __defNormalProp$d(a, prop, b[prop]);
   return a;
 }, __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
 const toggleStyleActionImplementation = ({
@@ -4248,12 +4531,12 @@ const toggleStyleActionImplementation = ({
     style: action.style
   }) ? removeStyleActionImplementation({
     context,
-    action: __spreadProps$7(__spreadValues$c({}, action), {
+    action: __spreadProps$7(__spreadValues$d({}, action), {
       type: "style.remove"
     })
   }) : addStyleActionImplementation({
     context,
-    action: __spreadProps$7(__spreadValues$c({}, action), {
+    action: __spreadProps$7(__spreadValues$d({}, action), {
       type: "style.add"
     })
   });
@@ -4263,7 +4546,7 @@ const toggleStyleActionImplementation = ({
 }) => {
   if (!action.editor.selection)
     return;
-  const defaultStyle = context.schema.styles[0].value, guards = selectors.createGuards(context), selectedBlocks = [...slate.Editor.nodes(action.editor, {
+  const defaultStyle = context.schema.styles[0].value, guards = selector_isSelectionCollapsed.createGuards(context), selectedBlocks = [...slate.Editor.nodes(action.editor, {
     at: action.editor.selection,
     match: (node) => guards.isTextBlock(node)
   })];
@@ -4279,7 +4562,7 @@ const toggleStyleActionImplementation = ({
 }) => {
   if (!action.editor.selection)
     return;
-  const guards = selectors.createGuards(context), selectedBlocks = [...slate.Editor.nodes(action.editor, {
+  const guards = selector_isSelectionCollapsed.createGuards(context), selectedBlocks = [...slate.Editor.nodes(action.editor, {
     at: action.editor.selection,
     match: (node) => guards.isTextBlock(node)
   })];
@@ -4302,12 +4585,12 @@ function isStyleActive({
   })];
   return selectedBlocks.length > 0 ? selectedBlocks.every(([node]) => node.style === style) : !1;
 }
-var __defProp$b = Object.defineProperty, __getOwnPropSymbols$b = Object.getOwnPropertySymbols, __hasOwnProp$b = Object.prototype.hasOwnProperty, __propIsEnum$b = Object.prototype.propertyIsEnumerable, __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$b = (a, b) => {
+var __defProp$c = Object.defineProperty, __getOwnPropSymbols$c = Object.getOwnPropertySymbols, __hasOwnProp$c = Object.prototype.hasOwnProperty, __propIsEnum$c = Object.prototype.propertyIsEnumerable, __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$c = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$b.call(b, prop) && __defNormalProp$b(a, prop, b[prop]);
-  if (__getOwnPropSymbols$b)
-    for (var prop of __getOwnPropSymbols$b(b))
-      __propIsEnum$b.call(b, prop) && __defNormalProp$b(a, prop, b[prop]);
+    __hasOwnProp$c.call(b, prop) && __defNormalProp$c(a, prop, b[prop]);
+  if (__getOwnPropSymbols$c)
+    for (var prop of __getOwnPropSymbols$c(b))
+      __propIsEnum$c.call(b, prop) && __defNormalProp$c(a, prop, b[prop]);
   return a;
 };
 const debug$6 = debugWithName("API:editable");
@@ -4372,7 +4655,7 @@ function createEditableAPI(editor, editorActor) {
         return console.warn(err), !1;
       }
     },
-    marks: () => __spreadValues$b({}, slate.Editor.marks(editor) || {}).marks || [],
+    marks: () => __spreadValues$c({}, slate.Editor.marks(editor) || {}).marks || [],
     undo: () => editor.undo(),
     redo: () => editor.redo(),
     select: (selection) => {
@@ -4420,7 +4703,7 @@ function createEditableAPI(editor, editorActor) {
       const child = toSlateValue([{
         _key: editorActor.getSnapshot().context.keyGenerator(),
         _type: types2.block.name,
-        children: [__spreadValues$b({
+        children: [__spreadValues$c({
           _key: editorActor.getSnapshot().context.keyGenerator(),
           _type: type.name
         }, value || {})]
@@ -4684,7 +4967,7 @@ const addAnnotationActionImplementation = ({
         continue;
       const annotationKey = context.keyGenerator(), markDefs = (_a = block.markDefs) != null ? _a : [];
       markDefs.find((markDef) => markDef._type === action.annotation.name && markDef._key === annotationKey) === void 0 && (slate.Transforms.setNodes(editor, {
-        markDefs: [...markDefs, __spreadValues$b({
+        markDefs: [...markDefs, __spreadValues$c({
           _type: action.annotation.name,
           _key: annotationKey
         }, action.annotation.value)]
@@ -4861,19 +5144,19 @@ function insertBlock({
     });
   }
 }
-var __defProp$a = Object.defineProperty, __getOwnPropSymbols$a = Object.getOwnPropertySymbols, __hasOwnProp$a = Object.prototype.hasOwnProperty, __propIsEnum$a = Object.prototype.propertyIsEnumerable, __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$a = (a, b) => {
+var __defProp$b = Object.defineProperty, __getOwnPropSymbols$b = Object.getOwnPropertySymbols, __hasOwnProp$b = Object.prototype.hasOwnProperty, __propIsEnum$b = Object.prototype.propertyIsEnumerable, __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$b = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$a.call(b, prop) && __defNormalProp$a(a, prop, b[prop]);
-  if (__getOwnPropSymbols$a)
-    for (var prop of __getOwnPropSymbols$a(b))
-      __propIsEnum$a.call(b, prop) && __defNormalProp$a(a, prop, b[prop]);
+    __hasOwnProp$b.call(b, prop) && __defNormalProp$b(a, prop, b[prop]);
+  if (__getOwnPropSymbols$b)
+    for (var prop of __getOwnPropSymbols$b(b))
+      __propIsEnum$b.call(b, prop) && __defNormalProp$b(a, prop, b[prop]);
   return a;
 };
 const insertBlockObjectActionImplementation = ({
   context,
   action
 }) => {
-  const block = toSlateValue([__spreadValues$a({
+  const block = toSlateValue([__spreadValues$b({
     _key: context.keyGenerator(),
     _type: action.blockObject.name
   }, action.blockObject.value ? action.blockObject.value : {})], {
@@ -4886,12 +5169,12 @@ const insertBlockObjectActionImplementation = ({
     schema: context.schema
   });
 };
-var __defProp$9 = Object.defineProperty, __defProps$6 = Object.defineProperties, __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$9 = Object.getOwnPropertySymbols, __hasOwnProp$9 = Object.prototype.hasOwnProperty, __propIsEnum$9 = Object.prototype.propertyIsEnumerable, __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$9 = (a, b) => {
+var __defProp$a = Object.defineProperty, __defProps$6 = Object.defineProperties, __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$a = Object.getOwnPropertySymbols, __hasOwnProp$a = Object.prototype.hasOwnProperty, __propIsEnum$a = Object.prototype.propertyIsEnumerable, __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$a = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$9.call(b, prop) && __defNormalProp$9(a, prop, b[prop]);
-  if (__getOwnPropSymbols$9)
-    for (var prop of __getOwnPropSymbols$9(b))
-      __propIsEnum$9.call(b, prop) && __defNormalProp$9(a, prop, b[prop]);
+    __hasOwnProp$a.call(b, prop) && __defNormalProp$a(a, prop, b[prop]);
+  if (__getOwnPropSymbols$a)
+    for (var prop of __getOwnPropSymbols$a(b))
+      __propIsEnum$a.call(b, prop) && __defNormalProp$a(a, prop, b[prop]);
   return a;
 }, __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
 const insertBreakActionImplementation = ({
@@ -4987,7 +5270,7 @@ const insertBreakActionImplementation = ({
           }
           const newMarkDefs = nextNode.markDefs.map((markDef) => {
             var _a3;
-            return __spreadProps$6(__spreadValues$9({}, markDef), {
+            return __spreadProps$6(__spreadValues$a({}, markDef), {
               _key: (_a3 = newMarkDefKeys.get(markDef._key)) != null ? _a3 : markDef._key
             });
           });
@@ -5011,17 +5294,17 @@ const insertBreakActionImplementation = ({
 }) => {
   insertBreakActionImplementation({
     context,
-    action: __spreadProps$6(__spreadValues$9({}, action), {
+    action: __spreadProps$6(__spreadValues$a({}, action), {
       type: "insert.break"
     })
   });
 };
-var __defProp$8 = Object.defineProperty, __getOwnPropSymbols$8 = Object.getOwnPropertySymbols, __hasOwnProp$8 = Object.prototype.hasOwnProperty, __propIsEnum$8 = Object.prototype.propertyIsEnumerable, __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$8 = (a, b) => {
+var __defProp$9 = Object.defineProperty, __getOwnPropSymbols$9 = Object.getOwnPropertySymbols, __hasOwnProp$9 = Object.prototype.hasOwnProperty, __propIsEnum$9 = Object.prototype.propertyIsEnumerable, __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$9 = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$8.call(b, prop) && __defNormalProp$8(a, prop, b[prop]);
-  if (__getOwnPropSymbols$8)
-    for (var prop of __getOwnPropSymbols$8(b))
-      __propIsEnum$8.call(b, prop) && __defNormalProp$8(a, prop, b[prop]);
+    __hasOwnProp$9.call(b, prop) && __defNormalProp$9(a, prop, b[prop]);
+  if (__getOwnPropSymbols$9)
+    for (var prop of __getOwnPropSymbols$9(b))
+      __propIsEnum$9.call(b, prop) && __defNormalProp$9(a, prop, b[prop]);
   return a;
 };
 const insertInlineObjectActionImplementation = ({
@@ -5048,7 +5331,7 @@ const insertInlineObjectActionImplementation = ({
   const block = toSlateValue([{
     _type: context.schema.block.name,
     _key: context.keyGenerator(),
-    children: [__spreadValues$8({
+    children: [__spreadValues$9({
       _type: action.inlineObject.name,
       _key: context.keyGenerator()
     }, (_b = action.inlineObject.value) != null ? _b : {})]
@@ -5061,12 +5344,12 @@ const insertInlineObjectActionImplementation = ({
   }
   slate.Transforms.insertNodes(action.editor, child);
 };
-var __defProp$7 = Object.defineProperty, __getOwnPropSymbols$7 = Object.getOwnPropertySymbols, __hasOwnProp$7 = Object.prototype.hasOwnProperty, __propIsEnum$7 = Object.prototype.propertyIsEnumerable, __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$7 = (a, b) => {
+var __defProp$8 = Object.defineProperty, __getOwnPropSymbols$8 = Object.getOwnPropertySymbols, __hasOwnProp$8 = Object.prototype.hasOwnProperty, __propIsEnum$8 = Object.prototype.propertyIsEnumerable, __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$8 = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$7.call(b, prop) && __defNormalProp$7(a, prop, b[prop]);
-  if (__getOwnPropSymbols$7)
-    for (var prop of __getOwnPropSymbols$7(b))
-      __propIsEnum$7.call(b, prop) && __defNormalProp$7(a, prop, b[prop]);
+    __hasOwnProp$8.call(b, prop) && __defNormalProp$8(a, prop, b[prop]);
+  if (__getOwnPropSymbols$8)
+    for (var prop of __getOwnPropSymbols$8(b))
+      __propIsEnum$8.call(b, prop) && __defNormalProp$8(a, prop, b[prop]);
   return a;
 };
 const insertSpanActionImplementation = ({
@@ -5086,7 +5369,7 @@ const insertSpanActionImplementation = ({
     console.error("Unable to perform action without focus block", action);
     return;
   }
-  const markDefs = (_b = focusBlock.markDefs) != null ? _b : [], annotations = action.annotations ? action.annotations.map((annotation) => __spreadValues$7({
+  const markDefs = (_b = focusBlock.markDefs) != null ? _b : [], annotations = action.annotations ? action.annotations.map((annotation) => __spreadValues$8({
     _type: annotation.name,
     _key: context.keyGenerator()
   }, annotation.value)) : void 0;
@@ -5099,12 +5382,12 @@ const insertSpanActionImplementation = ({
     marks: [...(_c = annotations == null ? void 0 : annotations.map((annotation) => annotation._key)) != null ? _c : [], ...(_d = action.decorators) != null ? _d : []]
   });
 };
-var __defProp$6 = Object.defineProperty, __getOwnPropSymbols$6 = Object.getOwnPropertySymbols, __hasOwnProp$6 = Object.prototype.hasOwnProperty, __propIsEnum$6 = Object.prototype.propertyIsEnumerable, __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$6 = (a, b) => {
+var __defProp$7 = Object.defineProperty, __getOwnPropSymbols$7 = Object.getOwnPropertySymbols, __hasOwnProp$7 = Object.prototype.hasOwnProperty, __propIsEnum$7 = Object.prototype.propertyIsEnumerable, __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$7 = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$6.call(b, prop) && __defNormalProp$6(a, prop, b[prop]);
-  if (__getOwnPropSymbols$6)
-    for (var prop of __getOwnPropSymbols$6(b))
-      __propIsEnum$6.call(b, prop) && __defNormalProp$6(a, prop, b[prop]);
+    __hasOwnProp$7.call(b, prop) && __defNormalProp$7(a, prop, b[prop]);
+  if (__getOwnPropSymbols$7)
+    for (var prop of __getOwnPropSymbols$7(b))
+      __propIsEnum$7.call(b, prop) && __defNormalProp$7(a, prop, b[prop]);
   return a;
 };
 const textBlockSetActionImplementation = ({
@@ -5120,7 +5403,7 @@ const textBlockSetActionImplementation = ({
       offset: 0
     }
   }, action.editor);
-  slate.Transforms.setNodes(action.editor, __spreadValues$6(__spreadValues$6(__spreadValues$6({}, action.style ? {
+  slate.Transforms.setNodes(action.editor, __spreadValues$7(__spreadValues$7(__spreadValues$7({}, action.style ? {
     style: action.style
   } : {}), action.listItem ? {
     listItem: action.listItem
@@ -5146,12 +5429,12 @@ const textBlockSetActionImplementation = ({
     at
   });
 };
-var __defProp$5 = Object.defineProperty, __defProps$5 = Object.defineProperties, __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$5 = Object.getOwnPropertySymbols, __hasOwnProp$5 = Object.prototype.hasOwnProperty, __propIsEnum$5 = Object.prototype.propertyIsEnumerable, __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$5 = (a, b) => {
+var __defProp$6 = Object.defineProperty, __defProps$5 = Object.defineProperties, __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$6 = Object.getOwnPropertySymbols, __hasOwnProp$6 = Object.prototype.hasOwnProperty, __propIsEnum$6 = Object.prototype.propertyIsEnumerable, __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$6 = (a, b) => {
   for (var prop in b || (b = {}))
-    __hasOwnProp$5.call(b, prop) && __defNormalProp$5(a, prop, b[prop]);
-  if (__getOwnPropSymbols$5)
-    for (var prop of __getOwnPropSymbols$5(b))
-      __propIsEnum$5.call(b, prop) && __defNormalProp$5(a, prop, b[prop]);
+    __hasOwnProp$6.call(b, prop) && __defNormalProp$6(a, prop, b[prop]);
+  if (__getOwnPropSymbols$6)
+    for (var prop of __getOwnPropSymbols$6(b))
+      __propIsEnum$6.call(b, prop) && __defNormalProp$6(a, prop, b[prop]);
   return a;
 }, __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
 const behaviorActionImplementations = {
@@ -5249,7 +5532,7 @@ const behaviorActionImplementations = {
       _type: context.schema.block.name,
       style: (_a = context.schema.styles[0].value) != null ? _a : "normal",
       markDefs: [],
-      children: (_d = (_c = (_b = action.textBlock) == null ? void 0 : _b.children) == null ? void 0 : _c.map((child) => __spreadProps$5(__spreadValues$5({}, child), {
+      children: (_d = (_c = (_b = action.textBlock) == null ? void 0 : _b.children) == null ? void 0 : _c.map((child) => __spreadProps$5(__spreadValues$6({}, child), {
         _key: context.keyGenerator()
       }))) != null ? _d : [{
         _type: context.schema.span.name,
@@ -5344,7 +5627,7 @@ const behaviorActionImplementations = {
     action
   }) => {
     const selection = action.editor.selection;
-    selection && (slate.Transforms.select(action.editor, __spreadValues$5({}, selection)), action.editor.selection = __spreadValues$5({}, selection));
+    selection && (slate.Transforms.select(action.editor, __spreadValues$6({}, selection)), action.editor.selection = __spreadValues$6({}, selection));
   },
   "style.toggle": toggleStyleActionImplementation,
   "style.add": addStyleActionImplementation,
@@ -5616,6 +5899,22 @@ function performDefaultAction({
       });
   }
 }
+var __defProp$5 = Object.defineProperty, __getOwnPropSymbols$5 = Object.getOwnPropertySymbols, __hasOwnProp$5 = Object.prototype.hasOwnProperty, __propIsEnum$5 = Object.prototype.propertyIsEnumerable, __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$5 = (a, b) => {
+  for (var prop in b || (b = {}))
+    __hasOwnProp$5.call(b, prop) && __defNormalProp$5(a, prop, b[prop]);
+  if (__getOwnPropSymbols$5)
+    for (var prop of __getOwnPropSymbols$5(b))
+      __propIsEnum$5.call(b, prop) && __defNormalProp$5(a, prop, b[prop]);
+  return a;
+};
+function getActiveDecorators({
+  schema: schema2,
+  slateEditorInstance
+}) {
+  var _a, _b;
+  const decorators = schema2.decorators.map((decorator) => decorator.value);
+  return ((_b = __spreadValues$5({}, (_a = slate.Editor.marks(slateEditorInstance)) != null ? _a : {}).marks) != null ? _b : []).filter((mark) => decorators.includes(mark));
+}
 var __defProp$4 = Object.defineProperty, __defProps$4 = Object.defineProperties, __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$4 = Object.getOwnPropertySymbols, __hasOwnProp$4 = Object.prototype.hasOwnProperty, __propIsEnum$4 = Object.prototype.propertyIsEnumerable, __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$4 = (a, b) => {
   for (var prop in b || (b = {}))
     __hasOwnProp$4.call(b, prop) && __defNormalProp$4(a, prop, b[prop]);
@@ -5648,6 +5947,12 @@ const editorMachine = xstate.setup({
     "emit mutation event": xstate.emit(({
       event
     }) => (xstate.assertEvent(event, "mutation"), event)),
+    "emit read only": xstate.emit({
+      type: "read only"
+    }),
+    "emit editable": xstate.emit({
+      type: "editable"
+    }),
     "defer event": xstate.assign({
       pendingEvents: ({
         context,
@@ -5661,6 +5966,9 @@ const editorMachine = xstate.setup({
       for (const event of context.pendingEvents)
         enqueue(xstate.emit(event));
     }),
+    "emit ready": xstate.emit({
+      type: "ready"
+    }),
     "clear pending events": xstate.assign({
       pendingEvents: []
     }),
@@ -5685,6 +5993,10 @@ const editorMachine = xstate.setup({
         return;
       }
       const value = fromSlateValue(event.editor.children, context.schema.block.name, KEY_TO_VALUE_ELEMENT.get(event.editor)), selection = toPortableTextRange(value, event.editor.selection, context.schema), editorContext = {
+        activeDecorators: getActiveDecorators({
+          schema: context.schema,
+          slateEditorInstance: event.editor
+        }),
         keyGenerator: context.keyGenerator,
         schema: context.schema,
         selection,
@@ -5736,89 +6048,12 @@ const editorMachine = xstate.setup({
       pendingEvents: [],
       schema: input.schema,
       selection: null,
-      readOnly: (_b = input.readOnly) != null ? _b : !1,
+      initialReadOnly: (_b = input.readOnly) != null ? _b : !1,
       maxBlocks: input.maxBlocks,
       value: input.value
     };
   },
   on: {
-    "annotation.add": {
-      actions: xstate.emit(({
-        event
-      }) => event),
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
-    "annotation.remove": {
-      actions: xstate.emit(({
-        event
-      }) => event),
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
-    "annotation.toggle": {
-      actions: xstate.emit(({
-        event
-      }) => event),
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
-    blur: {
-      actions: xstate.emit(({
-        event
-      }) => event),
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
-    "decorator.*": {
-      actions: xstate.emit(({
-        event
-      }) => event),
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
-    focus: {
-      actions: xstate.emit(({
-        event
-      }) => event),
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
-    "insert.*": {
-      actions: xstate.emit(({
-        event
-      }) => event),
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
-    "list item.*": {
-      actions: xstate.emit(({
-        event
-      }) => event),
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
-    "style.*": {
-      actions: xstate.emit(({
-        event
-      }) => event),
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
-    ready: {
-      actions: xstate.emit(({
-        event
-      }) => event)
-    },
     unset: {
       actions: xstate.emit(({
         event
@@ -5886,18 +6121,6 @@ const editorMachine = xstate.setup({
         }) => event.value
       })
     },
-    "toggle readOnly": {
-      actions: [xstate.assign({
-        readOnly: ({
-          context
-        }) => !context.readOnly
-      }), xstate.emit(({
-        context
-      }) => ({
-        type: "readOnly toggled",
-        readOnly: context.readOnly
-      }))]
-    },
     "update maxBlocks": {
       actions: xstate.assign({
         maxBlocks: ({
@@ -5905,12 +6128,6 @@ const editorMachine = xstate.setup({
         }) => event.maxBlocks
       })
     },
-    "behavior event": {
-      actions: "handle behavior event",
-      guard: ({
-        context
-      }) => !context.readOnly
-    },
     "behavior action intends": {
       actions: [({
         context,
@@ -5939,49 +6156,160 @@ const editorMachine = xstate.setup({
       })]
     }
   },
-  initial: "pristine",
+  type: "parallel",
   states: {
-    pristine: {
-      initial: "idle",
+    "edit mode": {
+      initial: "read only",
       states: {
-        idle: {
-          on: {
-            normalizing: {
-              target: "normalizing"
-            },
-            patch: {
-              actions: "defer event",
-              target: "#editor.dirty"
+        "read only": {
+          initial: "determine initial edit mode",
+          states: {
+            "determine initial edit mode": {
+              on: {
+                "done syncing": [{
+                  target: "#editor.edit mode.read only.read only",
+                  guard: ({
+                    context
+                  }) => context.initialReadOnly
+                }, {
+                  target: "#editor.edit mode.editable"
+                }]
+              }
             },
-            mutation: {
-              actions: "defer event",
-              target: "#editor.dirty"
+            "read only": {
+              on: {
+                "update readOnly": {
+                  guard: ({
+                    event
+                  }) => !event.readOnly,
+                  target: "#editor.edit mode.editable",
+                  actions: ["emit editable"]
+                }
+              }
             }
           }
         },
-        normalizing: {
+        editable: {
           on: {
-            "done normalizing": {
-              target: "idle"
+            "update readOnly": {
+              guard: ({
+                event
+              }) => event.readOnly,
+              target: "#editor.edit mode.read only.read only",
+              actions: ["emit read only"]
+            },
+            "behavior event": {
+              actions: "handle behavior event"
+            },
+            "annotation.add": {
+              actions: xstate.emit(({
+                event
+              }) => event)
+            },
+            "annotation.remove": {
+              actions: xstate.emit(({
+                event
+              }) => event)
+            },
+            "annotation.toggle": {
+              actions: xstate.emit(({
+                event
+              }) => event)
+            },
+            blur: {
+              actions: xstate.emit(({
+                event
+              }) => event)
             },
+            "decorator.*": {
+              actions: xstate.emit(({
+                event
+              }) => event)
+            },
+            focus: {
+              actions: xstate.emit(({
+                event
+              }) => event)
+            },
+            "insert.*": {
+              actions: xstate.emit(({
+                event
+              }) => event)
+            },
+            "list item.*": {
+              actions: xstate.emit(({
+                event
+              }) => event)
+            },
+            "style.*": {
+              actions: xstate.emit(({
+                event
+              }) => event)
+            }
+          }
+        }
+      }
+    },
+    setup: {
+      initial: "setting up",
+      states: {
+        "setting up": {
+          exit: ["emit ready"],
+          on: {
             patch: {
               actions: "defer event"
             },
             mutation: {
               actions: "defer event"
+            },
+            "done syncing": {
+              target: "pristine"
+            }
+          }
+        },
+        pristine: {
+          initial: "idle",
+          states: {
+            idle: {
+              on: {
+                normalizing: {
+                  target: "normalizing"
+                },
+                patch: {
+                  actions: "defer event",
+                  target: "#editor.setup.dirty"
+                },
+                mutation: {
+                  actions: "defer event",
+                  target: "#editor.setup.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"
+        dirty: {
+          entry: ["emit pending events", "clear pending events"],
+          on: {
+            patch: {
+              actions: "emit patch event"
+            },
+            mutation: {
+              actions: "emit mutation event"
+            }
+          }
         }
       }
     }
@@ -6109,11 +6437,13 @@ class PortableTextEditor extends React.Component {
     }), this.schemaTypes = this.editor._internal.editorActor.getSnapshot().context.schema, this.editable = this.editor._internal.editable;
   }
   componentDidUpdate(prevProps) {
+    var _a;
     !this.props.editor && !prevProps.editor && this.props.schemaType !== prevProps.schemaType && (this.schemaTypes = createEditorSchema(this.props.schemaType.hasOwnProperty("jsonType") ? this.props.schemaType : compileType(this.props.schemaType)), this.editor._internal.editorActor.send({
       type: "update schema",
       schema: this.schemaTypes
     })), !this.props.editor && !prevProps.editor && (this.props.readOnly !== prevProps.readOnly && this.editor._internal.editorActor.send({
-      type: "toggle readOnly"
+      type: "update readOnly",
+      readOnly: (_a = this.props.readOnly) != null ? _a : !1
     }), this.props.maxBlocks !== prevProps.maxBlocks && this.editor._internal.editorActor.send({
       type: "update maxBlocks",
       maxBlocks: this.props.maxBlocks === void 0 ? void 0 : Number.parseInt(this.props.maxBlocks.toString(), 10)
@@ -6130,7 +6460,7 @@ class PortableTextEditor extends React.Component {
       /* @__PURE__ */ jsxRuntime.jsx(RouteEventsToChanges, { editorActor: this.editor._internal.editorActor, onChange: (change) => {
         this.props.editor || this.props.onChange(change), this.change$.next(change);
       } }),
-      /* @__PURE__ */ jsxRuntime.jsx(Synchronizer, { editorActor: this.editor._internal.editorActor, getValue: this.editor._internal.editable.getValue, portableTextEditor: this, slateEditor: this.editor._internal.slateEditor.instance }),
+      /* @__PURE__ */ jsxRuntime.jsx(Synchronizer, { editorActor: this.editor._internal.editorActor, slateEditor: this.editor._internal.slateEditor.instance }),
       /* @__PURE__ */ jsxRuntime.jsx(EditorActorContext.Provider, { value: this.editor._internal.editorActor, children: /* @__PURE__ */ jsxRuntime.jsx(slateReact.Slate, { editor: this.editor._internal.slateEditor.instance, initialValue: this.editor._internal.slateEditor.initialValue, children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorContext.Provider, { value: this, children: /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorSelectionProvider, { editorActor: this.editor._internal.editorActor, children: this.props.children }) }) }) })
     ] });
   }
@@ -6315,7 +6645,8 @@ function RouteEventsToChanges(props) {
         case "list item.toggle":
         case "style.toggle":
         case "patches":
-        case "readOnly toggled":
+        case "editable":
+        case "read only":
           break bb5;
         default:
           handleChange(event);
@@ -6725,10 +7056,16 @@ function _insertFragment(editor, fragment, schemaTypes) {
     })) : editor.insertFragment(fragment);
   }), editor.onChange();
 }
-function withSyncRangeDecorations(slateEditor, syncRangeDecorations) {
+function withSyncRangeDecorations({
+  editorActor,
+  slateEditor,
+  syncRangeDecorations
+}) {
   const originalApply = slateEditor.apply;
   return slateEditor.apply = (op) => {
-    originalApply(op), op.type !== "set_selection" && syncRangeDecorations(op);
+    originalApply(op), !editorActor.getSnapshot().matches({
+      "edit mode": "read only"
+    }) && op.type !== "set_selection" && syncRangeDecorations(op);
   }, () => {
     slateEditor.apply = originalApply;
   };
@@ -6796,7 +7133,9 @@ const debug = debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
     "spellCheck"
   ]), portableTextEditor = usePortableTextEditor(), ref = React.useRef(null), [editableElement, setEditableElement] = React.useState(null), [hasInvalidValue, setHasInvalidValue] = React.useState(!1), [rangeDecorationState, setRangeDecorationsState] = React.useState([]);
   React.useImperativeHandle(forwardedRef, () => ref.current);
-  const rangeDecorationsRef = React.useRef(rangeDecorations), editorActor = React.useContext(EditorActorContext), readOnly = react.useSelector(editorActor, (s) => s.context.readOnly), schemaTypes = react.useSelector(editorActor, (s_0) => s_0.context.schema), slateEditor = slateReact.useSlate(), blockTypeName = schemaTypes.block.name;
+  const rangeDecorationsRef = React.useRef(rangeDecorations), editorActor = React.useContext(EditorActorContext), readOnly = react.useSelector(editorActor, (s) => s.matches({
+    "edit mode": "read only"
+  })), schemaTypes = react.useSelector(editorActor, (s_0) => s_0.context.schema), slateEditor = slateReact.useSlate(), blockTypeName = schemaTypes.block.name;
   React.useMemo(() => {
     const withInsertData = createWithInsertData(editorActor, schemaTypes);
     if (readOnly)
@@ -6865,7 +7204,7 @@ const debug = debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
   }, [portableTextEditor, rangeDecorations, schemaTypes, slateEditor]);
   React.useEffect(() => {
     const onReady = editorActor.on("ready", () => {
-      restoreSelectionFromProps();
+      syncRangeDecorations(), restoreSelectionFromProps();
     }), onInvalidValue = editorActor.on("invalid value", () => {
       setHasInvalidValue(!0);
     }), onValueChanged = editorActor.on("value changed", () => {
@@ -6874,7 +7213,7 @@ const debug = debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
     return () => {
       onReady.unsubscribe(), onInvalidValue.unsubscribe(), onValueChanged.unsubscribe();
     };
-  }, [editorActor, restoreSelectionFromProps]), React.useEffect(() => {
+  }, [editorActor, restoreSelectionFromProps, syncRangeDecorations]), React.useEffect(() => {
     propsSelection && !hasInvalidValue && restoreSelectionFromProps();
   }, [hasInvalidValue, propsSelection, restoreSelectionFromProps]);
   const [syncedRangeDecorations, setSyncedRangeDecorations] = React.useState(!1);
@@ -6883,9 +7222,13 @@ const debug = debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
   }, [syncRangeDecorations, syncedRangeDecorations]), React.useEffect(() => {
     isEqual__default.default(rangeDecorations, rangeDecorationsRef.current) || syncRangeDecorations(), rangeDecorationsRef.current = rangeDecorations;
   }, [rangeDecorations, syncRangeDecorations]), React.useEffect(() => {
-    const teardown = withSyncRangeDecorations(slateEditor, syncRangeDecorations);
+    const teardown = withSyncRangeDecorations({
+      editorActor,
+      slateEditor,
+      syncRangeDecorations
+    });
     return () => teardown();
-  }, [slateEditor, syncRangeDecorations]);
+  }, [editorActor, slateEditor, syncRangeDecorations]);
   const handleCopy = React.useCallback((event) => {
     onCopy ? onCopy(event) !== void 0 && event.preventDefault() : event.nativeEvent.clipboardData && editorActor.send({
       type: "behavior event",
@@ -7074,7 +7417,7 @@ const debug = debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
 PortableTextEditable.displayName = "ForwardRef(PortableTextEditable)";
 const EditorContext = React__default.default.createContext(void 0);
 function EditorProvider(props) {
-  const $ = reactCompilerRuntime.c(30), editor = useCreateEditor(props.initialConfig), editorActor = editor._internal.editorActor, slateEditor = editor._internal.slateEditor, editable = editor._internal.editable;
+  const $ = reactCompilerRuntime.c(28), editor = useCreateEditor(props.initialConfig), editorActor = editor._internal.editorActor, slateEditor = editor._internal.slateEditor;
   let t0, t1;
   $[0] !== editor ? (t1 = new PortableTextEditor({
     editor
@@ -7087,21 +7430,21 @@ function EditorProvider(props) {
   let t3;
   $[4] !== editorActor || $[5] !== t2 ? (t3 = /* @__PURE__ */ jsxRuntime.jsx(RouteEventsToChanges, { editorActor, onChange: t2 }), $[4] = editorActor, $[5] = t2, $[6] = t3) : t3 = $[6];
   let t4;
-  $[7] !== editable.getValue || $[8] !== editorActor || $[9] !== portableTextEditor || $[10] !== slateEditor.instance ? (t4 = /* @__PURE__ */ jsxRuntime.jsx(Synchronizer, { editorActor, getValue: editable.getValue, portableTextEditor, slateEditor: slateEditor.instance }), $[7] = editable.getValue, $[8] = editorActor, $[9] = portableTextEditor, $[10] = slateEditor.instance, $[11] = t4) : t4 = $[11];
+  $[7] !== editorActor || $[8] !== slateEditor.instance ? (t4 = /* @__PURE__ */ jsxRuntime.jsx(Synchronizer, { editorActor, slateEditor: slateEditor.instance }), $[7] = editorActor, $[8] = slateEditor.instance, $[9] = t4) : t4 = $[9];
   let t5;
-  $[12] !== editorActor || $[13] !== props.children ? (t5 = /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorSelectionProvider, { editorActor, children: props.children }), $[12] = editorActor, $[13] = props.children, $[14] = t5) : t5 = $[14];
+  $[10] !== editorActor || $[11] !== props.children ? (t5 = /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorSelectionProvider, { editorActor, children: props.children }), $[10] = editorActor, $[11] = props.children, $[12] = t5) : t5 = $[12];
   let t6;
-  $[15] !== portableTextEditor || $[16] !== t5 ? (t6 = /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorContext.Provider, { value: portableTextEditor, children: t5 }), $[15] = portableTextEditor, $[16] = t5, $[17] = t6) : t6 = $[17];
+  $[13] !== portableTextEditor || $[14] !== t5 ? (t6 = /* @__PURE__ */ jsxRuntime.jsx(PortableTextEditorContext.Provider, { value: portableTextEditor, children: t5 }), $[13] = portableTextEditor, $[14] = t5, $[15] = t6) : t6 = $[15];
   let t7;
-  $[18] !== slateEditor.initialValue || $[19] !== slateEditor.instance || $[20] !== t6 ? (t7 = /* @__PURE__ */ jsxRuntime.jsx(slateReact.Slate, { editor: slateEditor.instance, initialValue: slateEditor.initialValue, children: t6 }), $[18] = slateEditor.initialValue, $[19] = slateEditor.instance, $[20] = t6, $[21] = t7) : t7 = $[21];
+  $[16] !== slateEditor.initialValue || $[17] !== slateEditor.instance || $[18] !== t6 ? (t7 = /* @__PURE__ */ jsxRuntime.jsx(slateReact.Slate, { editor: slateEditor.instance, initialValue: slateEditor.initialValue, children: t6 }), $[16] = slateEditor.initialValue, $[17] = slateEditor.instance, $[18] = t6, $[19] = t7) : t7 = $[19];
   let t8;
-  $[22] !== editorActor || $[23] !== t7 ? (t8 = /* @__PURE__ */ jsxRuntime.jsx(EditorActorContext.Provider, { value: editorActor, children: t7 }), $[22] = editorActor, $[23] = t7, $[24] = t8) : t8 = $[24];
+  $[20] !== editorActor || $[21] !== t7 ? (t8 = /* @__PURE__ */ jsxRuntime.jsx(EditorActorContext.Provider, { value: editorActor, children: t7 }), $[20] = editorActor, $[21] = t7, $[22] = t8) : t8 = $[22];
   let t9;
-  return $[25] !== editor || $[26] !== t3 || $[27] !== t4 || $[28] !== t8 ? (t9 = /* @__PURE__ */ jsxRuntime.jsxs(EditorContext.Provider, { value: editor, children: [
+  return $[23] !== editor || $[24] !== t3 || $[25] !== t4 || $[26] !== t8 ? (t9 = /* @__PURE__ */ jsxRuntime.jsxs(EditorContext.Provider, { value: editor, children: [
     t3,
     t4,
     t8
-  ] }), $[25] = editor, $[26] = t3, $[27] = t4, $[28] = t8, $[29] = t9) : t9 = $[29], t9;
+  ] }), $[23] = editor, $[24] = t3, $[25] = t4, $[26] = t8, $[27] = t9) : t9 = $[27], t9;
 }
 function useEditor() {
   const editor = React__default.default.useContext(EditorContext);
@@ -7130,6 +7473,10 @@ function useEditorSelector(editor, selector, t0) {
   let t1;
   return $[0] !== editor || $[1] !== selector ? (t1 = (snapshot) => {
     const context = {
+      activeDecorators: getActiveDecorators({
+        schema: snapshot.context.schema,
+        slateEditorInstance: editor._internal.slateEditor.instance
+      }),
       keyGenerator: snapshot.context.keyGenerator,
       schema: snapshot.context.schema,
       selection: snapshot.context.selection,