@portabletext/editor 1.16.0 → 1.16.2

package/lib/index.cjs

@@ -2262,6 +2262,19 @@ 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;
 }
+var __knownSymbol = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name), __await = function(promise, isYieldStar) {
+  this[0] = promise, this[1] = isYieldStar;
+}, __asyncGenerator = (__this, __arguments, generator) => {
+  var resume = (k, v, yes, no) => {
+    try {
+      var x = generator[k](v), isAwait = (v = x.value) instanceof __await, done = x.done;
+      Promise.resolve(isAwait ? v[0] : v).then((y) => isAwait ? resume(k === "return" ? k : "next", v[1] ? { done: y.done, value: y.value } : y, yes, no) : yes({ value: y, done })).catch((e) => resume("throw", e, yes, no));
+    } catch (e) {
+      no(e);
+    }
+  }, method = (k) => it[k] = (x) => new Promise((yes, no) => resume(k, x, yes, no)), it = {};
+  return generator = generator.apply(__this, __arguments), it[__knownSymbol("asyncIterator")] = () => it, method("next"), method("throw"), method("return"), it;
+}, __forAwait = (obj, it, method) => (it = obj[__knownSymbol("asyncIterator")]) ? it.call(obj) : (obj = obj[__knownSymbol("iterator")](), it = {}, method = (key, fn) => (fn = obj[key]) && (it[key] = (arg) => new Promise((yes, no, done) => (arg = fn.call(obj, arg), done = arg.done, Promise.resolve(arg.value).then((value) => yes({ value, done }), no)))), method("next"), method("return"), it);
 const syncValueCallback = ({
   sendBack,
   input
@@ -2270,7 +2283,8 @@ const syncValueCallback = ({
     context: input.context,
     sendBack,
     slateEditor: input.slateEditor,
-    value: input.value
+    value: input.value,
+    streamBlocks: input.streamBlocks
   });
 }, syncValueLogic = xstate.fromCallback(syncValueCallback), syncMachine = xstate.setup({
   types: {
@@ -2280,10 +2294,13 @@ const syncValueCallback = ({
     emitted: {}
   },
   actions: {
+    "assign initial value synced": xstate.assign({
+      initialValueSynced: !0
+    }),
     "assign readOnly": xstate.assign({
       readOnly: ({
-        context
-      }) => !context.readOnly
+        event
+      }) => (xstate.assertEvent(event, "update readOnly"), event.readOnly)
     }),
     "assign pending value": xstate.assign({
       pendingValue: ({
@@ -2332,6 +2349,7 @@ const syncValueCallback = ({
   context: ({
     input
   }) => ({
+    initialValueSynced: !1,
     isProcessingLocalChanges: !1,
     keyGenerator: input.keyGenerator,
     schema: input.schema,
@@ -2352,7 +2370,7 @@ const syncValueCallback = ({
         isProcessingLocalChanges: !1
       })
     },
-    "toggle readOnly": {
+    "update readOnly": {
       actions: ["assign readOnly"]
     }
   },
@@ -2402,6 +2420,7 @@ const syncValueCallback = ({
               schema: context.schema
             },
             slateEditor: context.slateEditor,
+            streamBlocks: !context.initialValueSynced,
             value: (_a = context.pendingValue) != null ? _a : void 0
           };
         }
@@ -2437,20 +2456,21 @@ const syncValueCallback = ({
         },
         "done syncing": [{
           guard: "value changed while syncing",
-          actions: ["assign previous value", "emit done syncing"],
+          actions: ["assign previous value", "emit done syncing", "assign initial value synced"],
           reenter: !0
         }, {
           target: "idle",
-          actions: ["clear pending value", "assign previous value", "emit done syncing"]
+          actions: ["clear pending value", "assign previous value", "emit done syncing", "assign initial value synced"]
         }]
       }
     }
   }
 }), debug$i = debugWithName("hook:useSyncValue");
-function updateValue({
+async function updateValue({
   context,
   sendBack,
   slateEditor,
+  streamBlocks,
   value
 }) {
   let isChanged = !1, isValid = !0;
@@ -2475,31 +2495,48 @@ function updateValue({
     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
-            });
-            isChanged = blockChanged || isChanged, isValid = isValid && blockValid;
-          }
+    await new Promise((resolve) => {
+      slate.Editor.withoutNormalizing(slateEditor, () => {
+        withRemoteChanges(slateEditor, () => {
+          withoutPatching(slateEditor, async () => {
+            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;
+            }
+            try {
+              for (var iter = __forAwait(getBlocks({
+                slateValue: slateValueFromProps,
+                streamBlocks
+              })), more, temp, error; more = !(temp = await iter.next()).done; more = !1) {
+                const [currentBlock, currentBlockIndex] = temp.value, {
+                  blockChanged,
+                  blockValid
+                } = syncBlock({
+                  context,
+                  sendBack,
+                  block: currentBlock,
+                  index: currentBlockIndex,
+                  slateEditor,
+                  value
+                });
+                isChanged = blockChanged || isChanged, isValid = isValid && blockValid;
+              }
+            } catch (temp2) {
+              error = [temp2];
+            } finally {
+              try {
+                more && (temp = iter.return) && await temp.call(iter);
+              } finally {
+                if (error)
+                  throw error[0];
+              }
+            }
+            resolve();
+          });
         });
       });
     });
@@ -2546,6 +2583,29 @@ function updateValue({
     value
   });
 }
+function getBlocks(_0) {
+  return __asyncGenerator(this, arguments, function* ({
+    slateValue,
+    streamBlocks
+  }) {
+    let index = 0;
+    try {
+      for (var iter = __forAwait(slateValue), more, temp, error; more = !(temp = yield new __await(iter.next())).done; more = !1) {
+        const block = temp.value;
+        streamBlocks && (yield new __await(new Promise((resolve) => setTimeout(resolve, 0)))), yield [block, index], index++;
+      }
+    } catch (temp2) {
+      error = [temp2];
+    } finally {
+      try {
+        more && (temp = iter.return) && (yield new __await(temp.call(iter)));
+      } finally {
+        if (error)
+          throw error[0];
+      }
+    }
+  });
+}
 function syncBlock({
   context,
   sendBack,
@@ -2554,33 +2614,38 @@ function syncBlock({
   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
+  const currentBlock = block, currentBlockIndex = index, oldBlock = slateEditor.children[currentBlockIndex], hasChanges = oldBlock && !isEqual__default.default(currentBlock, oldBlock);
+  return slate.Editor.withoutNormalizing(slateEditor, () => {
+    withRemoteChanges(slateEditor, () => {
+      withoutPatching(slateEditor, () => {
+        var _a, _b, _c, _d, _e;
+        if (hasChanges && 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);
+        }
       });
-    })), 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
   };
@@ -2642,7 +2707,7 @@ function _updateBlock(slateEditor, currentBlock, oldBlock, currentBlockIndex) {
 }
 const debug$h = debugWithName("component:PortableTextEditor:Synchronizer");
 function Synchronizer(props) {
-  const $ = reactCompilerRuntime.c(41), {
+  const $ = reactCompilerRuntime.c(40), {
     editorActor,
     slateEditor
   } = props, value = react.useSelector(props.editorActor, _temp), readOnly = react.useSelector(props.editorActor, _temp2);
@@ -2697,23 +2762,22 @@ function Synchronizer(props) {
       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;
-  $[25] !== syncActorRef ? (t11 = () => {
+  let t11, t12;
+  $[25] !== readOnly || $[26] !== syncActorRef ? (t11 = () => {
     syncActorRef.send({
-      type: "toggle readOnly"
+      type: "update readOnly",
+      readOnly
     });
-  }, $[25] = syncActorRef, $[26] = t11) : t11 = $[26];
-  let t12;
-  $[27] !== readOnly || $[28] !== syncActorRef ? (t12 = [syncActorRef, readOnly], $[27] = readOnly, $[28] = syncActorRef, $[29] = t12) : t12 = $[29], React.useEffect(t11, t12);
+  }, t12 = [syncActorRef, readOnly], $[25] = readOnly, $[26] = syncActorRef, $[27] = t11, $[28] = t12) : (t11 = $[27], t12 = $[28]), React.useEffect(t11, t12);
   let t13, t14;
-  $[30] !== syncActorRef || $[31] !== value ? (t13 = () => {
+  $[29] !== syncActorRef || $[30] !== value ? (t13 = () => {
     debug$h("Value from props changed, syncing new value"), syncActorRef.send({
       type: "update value",
       value
     });
-  }, t14 = [syncActorRef, value], $[30] = syncActorRef, $[31] = value, $[32] = t13, $[33] = t14) : (t13 = $[32], t14 = $[33]), React.useEffect(t13, t14);
+  }, t14 = [syncActorRef, value], $[29] = syncActorRef, $[30] = value, $[31] = t13, $[32] = t14) : (t13 = $[31], t14 = $[32]), React.useEffect(t13, t14);
   let t15;
-  $[34] !== editorActor || $[35] !== mutationActorRef ? (t15 = () => {
+  $[33] !== editorActor || $[34] !== mutationActorRef ? (t15 = () => {
     debug$h("Subscribing to patch events");
     const sub = editorActor.on("patch", (event_1) => {
       mutationActorRef.send(event_1);
@@ -2721,9 +2785,9 @@ function Synchronizer(props) {
     return () => {
       debug$h("Unsubscribing to patch events"), sub.unsubscribe();
     };
-  }, $[34] = editorActor, $[35] = mutationActorRef, $[36] = t15) : t15 = $[36];
+  }, $[33] = editorActor, $[34] = mutationActorRef, $[35] = t15) : t15 = $[35];
   let t16;
-  return $[37] !== editorActor || $[38] !== mutationActorRef || $[39] !== slateEditor ? (t16 = [editorActor, mutationActorRef, slateEditor], $[37] = editorActor, $[38] = mutationActorRef, $[39] = slateEditor, $[40] = t16) : t16 = $[40], React.useEffect(t15, t16), null;
+  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.matches({
@@ -6179,7 +6243,10 @@ const editorMachine = xstate.setup({
             },
             "read only": {
               on: {
-                "toggle readOnly": {
+                "update readOnly": {
+                  guard: ({
+                    event
+                  }) => !event.readOnly,
                   target: "#editor.edit mode.editable",
                   actions: ["emit editable"]
                 }
@@ -6189,7 +6256,10 @@ const editorMachine = xstate.setup({
         },
         editable: {
           on: {
-            "toggle readOnly": {
+            "update readOnly": {
+              guard: ({
+                event
+              }) => event.readOnly,
               target: "#editor.edit mode.read only.read only",
               actions: ["emit read only"]
             },
@@ -6432,11 +6502,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)