@portabletext/editor 1.44.6 → 1.44.8

package/lib/index.js

@@ -831,7 +831,14 @@ const slateOperationCallback = ({
           }
           newRange !== null && rangeDecorationState.push({
             ...newRange || slateRange,
-            rangeDecoration: decoratedRange.rangeDecoration
+            rangeDecoration: {
+              ...decoratedRange.rangeDecoration,
+              selection: slateRangeToSelection({
+                schema: context.schema,
+                editor: context.slateEditor,
+                range: newRange
+              })
+            }
           });
         }
         return rangeDecorationState;
@@ -841,19 +848,37 @@ const slateOperationCallback = ({
       readOnly: ({
         event
       }) => (assertEvent(event, "update read only"), event.readOnly)
+    }),
+    "increment update count": assign({
+      updateCount: ({
+        context
+      }) => context.updateCount + 1
     })
   },
   actors: {
     "slate operation listener": fromCallback(slateOperationCallback)
   },
   guards: {
+    "has pending range decorations": ({
+      context
+    }) => context.pendingRangeDecorations.length > 0,
     "has range decorations": ({
       context
     }) => context.decoratedRanges.length > 0,
     "has different decorations": ({
       context,
       event
-    }) => (assertEvent(event, "range decorations updated"), !isEqual(context.pendingRangeDecorations, event.rangeDecorations)),
+    }) => {
+      assertEvent(event, "range decorations updated");
+      const existingRangeDecorations = context.decoratedRanges.map((decoratedRange) => ({
+        anchor: decoratedRange.rangeDecoration.selection?.anchor,
+        focus: decoratedRange.rangeDecoration.selection?.focus
+      })), newRangeDecorations = event.rangeDecorations.map((rangeDecoration) => ({
+        anchor: rangeDecoration.selection?.anchor,
+        focus: rangeDecoration.selection?.focus
+      }));
+      return !isEqual(existingRangeDecorations, newRangeDecorations);
+    },
     "not read only": ({
       context
     }) => !context.readOnly
@@ -867,7 +892,8 @@ const slateOperationCallback = ({
     pendingRangeDecorations: input.rangeDecorations,
     decoratedRanges: [],
     schema: input.schema,
-    slateEditor: input.slateEditor
+    slateEditor: input.slateEditor,
+    updateCount: 0
   }),
   invoke: {
     src: "slate operation listener",
@@ -889,10 +915,13 @@ const slateOperationCallback = ({
         "range decorations updated": {
           actions: ["update pending range decorations"]
         },
-        ready: {
+        ready: [{
           target: "ready",
-          actions: ["set up initial range decorations"]
-        }
+          guard: "has pending range decorations",
+          actions: ["set up initial range decorations", "increment update count"]
+        }, {
+          target: "ready"
+        }]
       }
     },
     ready: {
@@ -901,7 +930,7 @@ const slateOperationCallback = ({
         "range decorations updated": {
           target: ".idle",
           guard: "has different decorations",
-          actions: ["update range decorations", "update pending range decorations"]
+          actions: ["update range decorations", "increment update count"]
         }
       },
       states: {
@@ -924,7 +953,7 @@ const slateOperationCallback = ({
   }
 });
 function createDecorate(rangeDecorationActor) {
-  return function([, path]) {
+  return function([node, path]) {
     if (isEqualToEmptyEditor(rangeDecorationActor.getSnapshot().context.slateEditor.children, rangeDecorationActor.getSnapshot().context.schema))
       return [{
         anchor: {
@@ -939,7 +968,10 @@ function createDecorate(rangeDecorationActor) {
       }];
     if (path.length === 0)
       return [];
-    const result = rangeDecorationActor.getSnapshot().context.decoratedRanges.filter((item) => Range.isCollapsed(item) ? path.length !== 2 ? !1 : Path.equals(item.focus.path, path) && Path.equals(item.anchor.path, path) : Range.intersection(item, {
+    if (!Element$2.isElement(node) || node.children.length === 0)
+      return [];
+    const blockIndex = path.at(0);
+    return blockIndex === void 0 ? [] : rangeDecorationActor.getSnapshot().context.decoratedRanges.filter((decoratedRange) => Range.isCollapsed(decoratedRange) ? node.children.some((_, childIndex) => Path.equals(decoratedRange.anchor.path, [blockIndex, childIndex]) && Path.equals(decoratedRange.focus.path, [blockIndex, childIndex])) : Range.intersection(decoratedRange, {
       anchor: {
         path,
         offset: 0
@@ -948,8 +980,7 @@ function createDecorate(rangeDecorationActor) {
         path,
         offset: 0
       }
-    }) || Range.includes(item, path));
-    return result.length > 0 ? result : [];
+    }) || Range.includes(decoratedRange, path));
   };
 }
 const debug = debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
@@ -998,7 +1029,9 @@ const debug = debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
       schema: schemaTypes,
       rangeDecorations: rangeDecorations ?? []
     }
-  }), decorate = useMemo(() => createDecorate(rangeDecorationsActor), [rangeDecorationsActor]);
+  });
+  useSelector(rangeDecorationsActor, (s_1) => s_1.context.updateCount);
+  const decorate = useMemo(() => createDecorate(rangeDecorationsActor), [rangeDecorationsActor]);
   useEffect(() => {
     rangeDecorationsActor.send({
       type: "update read only",