@tiptap/y-tiptap 3.0.5 → 3.0.7

package/dist/y-tiptap.js

@@ -18,6 +18,7 @@ import * as eventloop from 'lib0/eventloop';
 import * as map from 'lib0/map';
 import * as sha256 from 'lib0/hash/sha256';
 import * as buf from 'lib0/buffer';
+import { ReplaceStep } from 'prosemirror-transform';
 
 /**
  * The unique prosemirror plugin key for syncPlugin
@@ -280,12 +281,38 @@ const ySyncPlugin = (yXmlFragment, {
   return plugin
 };
 
+/**
+ * Resolves one text-selection endpoint after a remote update. Falls back to
+ * content-based matching when the Yjs resolution is missing or lands in the
+ * wrong block, and keeps the Yjs resolution when the fallback finds nothing.
+ *
+ * @param {import('prosemirror-model').Node} newDoc
+ * @param {import('prosemirror-model').Node} oldDoc
+ * @param {number|null|undefined} oldAbs
+ * @param {number|null} resolved
+ * @return {number|null}
+ */
+const recoverSelectionEndpoint = (newDoc, oldDoc, oldAbs, resolved) => {
+  if (oldAbs == null) {
+    return resolved
+  }
+  const misresolved = resolved === null ||
+    (oldAbs > 1 && resolved <= 1) ||
+    isMisresolvedAfterStructuralChange(oldDoc, newDoc, oldAbs, resolved);
+  if (!misresolved) {
+    return resolved
+  }
+  const recovered = findAbsolutePositionAfterStructuralChange(oldDoc, newDoc, oldAbs);
+  return recovered !== null ? recovered : resolved
+};
+
 /**
  * @param {import('prosemirror-state').Transaction} tr
  * @param {ReturnType<typeof getRelativeSelection>} relSel
  * @param {ProsemirrorBinding} binding
+ * @param {import('prosemirror-model').Node} [oldDoc]
  */
-const restoreRelativeSelection = (tr, relSel, binding) => {
+const restoreRelativeSelection = (tr, relSel, binding, oldDoc) => {
   if (relSel !== null && relSel.anchor !== null && relSel.head !== null) {
     if (relSel.type === 'all') {
       tr.setSelection(new AllSelection(tr.doc));
@@ -319,18 +346,30 @@ const restoreRelativeSelection = (tr, relSel, binding) => {
         tr.setSelection(selection);
       }
     } else {
-      const anchor = relativePositionToAbsolutePosition(
+      let anchor = relativePositionToAbsolutePosition(
         binding.doc,
         binding.type,
         relSel.anchor,
         binding.mapping
       );
-      const head = relativePositionToAbsolutePosition(
+      let head = relativePositionToAbsolutePosition(
         binding.doc,
         binding.type,
         relSel.head,
         binding.mapping
       );
+      if (oldDoc != null) {
+        anchor = recoverSelectionEndpoint(tr.doc, oldDoc, relSel.absAnchor, anchor);
+        head = recoverSelectionEndpoint(tr.doc, oldDoc, relSel.absHead, head);
+      }
+      // Collapse to the surviving endpoint instead of dropping the selection;
+      // an unset selection maps through the full-doc replace to the doc start.
+      if (anchor === null) {
+        anchor = head;
+      }
+      if (head === null) {
+        head = anchor;
+      }
       if (anchor !== null && head !== null) {
         tr.setSelection(TextSelection.between(tr.doc.resolve(anchor), tr.doc.resolve(head)));
       }
@@ -411,7 +450,9 @@ const getRelativeSelection = (pmbinding, state) => {
       state.selection.head,
       pmbinding.type,
       pmbinding.mapping
-    )
+    ),
+    absAnchor: state.selection.anchor,
+    absHead: state.selection.head
   }
 };
 
@@ -736,6 +777,9 @@ class ProsemirrorBinding {
       );
       transaction.changed.forEach(delType);
       transaction.changedParentTypes.forEach(delType);
+      // Rebuild the full Y↔PM mapping so relative cursor positions resolve against
+      // current node sizes after structural changes (e.g. drag-and-drop block moves).
+      this.mapping.clear();
       const fragmentContent = this.type.toArray().map((t) =>
         createNodeIfNotExists(
           /** @type {Y.XmlElement | Y.XmlHook} */ (t),
@@ -743,13 +787,14 @@ class ProsemirrorBinding {
           this
         )
       ).filter((n) => n !== null);
+      const oldDoc = this.prosemirrorView.state.doc;
       // @ts-ignore
       let tr = this._tr.replace(
         0,
         this.prosemirrorView.state.doc.content.size,
         new PModel.Slice(PModel.Fragment.from(fragmentContent), 0, 0)
       );
-      restoreRelativeSelection(tr, this.beforeTransactionSelection, this);
+      restoreRelativeSelection(tr, this.beforeTransactionSelection, this, oldDoc);
       tr = tr.setMeta(ySyncPluginKey, { isChangeOrigin: true, isUndoRedoOperation: transaction.origin instanceof Y.UndoManager });
       if (
         this.beforeTransactionSelection !== null && this._isLocalCursorInView()
@@ -1635,6 +1680,26 @@ const absolutePositionToRelativePosition = (pos, type, mapping) => {
   return Y.createRelativePositionFromTypeIndex(type, type._length, -1)
 };
 
+/**
+ * Item-id based relative positions can misresolve to the document start after
+ * block reorder during collaborative drag-and-drop.
+ *
+ * @param {Y.Doc} y
+ * @param {Y.RelativePosition} relPos
+ * @param {number|null} absPos
+ * @return {boolean}
+ */
+const isMisresolvedTextPosition = (y, relPos, absPos) => {
+  if (absPos === null) {
+    return false
+  }
+  const decoded = Y.createAbsolutePositionFromRelativePosition(relPos, y);
+  return decoded !== null &&
+    decoded.type instanceof Y.XmlText &&
+    relPos.item !== null &&
+    absPos <= 1
+};
+
 const createRelativePosition = (type, item) => {
   let typeid = null;
   let tname = null;
@@ -1712,7 +1777,279 @@ const relativePositionToAbsolutePosition = (y, documentType, relPos, mapping) =>
     }
     type = /** @type {Y.AbstractType} */ (parent);
   }
-  return pos - 1 // we don't count the most outer tag, because it is a fragment
+  const absPos = pos - 1; // we don't count the most outer tag, because it is a fragment
+  if (isMisresolvedTextPosition(y, relPos, absPos)) {
+    return null
+  }
+  return absPos
+};
+
+/**
+ * Shallow attrs comparison. Attr values are primitives in most schemas;
+ * non-primitive values fail the check and callers fall back to text matching.
+ *
+ * @param {Object<string, any>} a
+ * @param {Object<string, any>} b
+ * @return {boolean}
+ */
+const attrsEqual = (a, b) => {
+  if (a === b) {
+    return true
+  }
+  const aKeys = Object.keys(a);
+  return aKeys.length === Object.keys(b).length && aKeys.every((k) => a[k] === b[k])
+};
+
+/**
+ * Returns true when any attr deviates from its spec default or has none.
+ * Default-only attrs cannot tell same-type siblings apart.
+ *
+ * @param {import('prosemirror-model').Node} node
+ * @return {boolean}
+ */
+const hasDistinctiveAttrs = (node) => {
+  const specAttrs = node.type.spec.attrs || {};
+  return Object.keys(node.attrs).some((key) => {
+    const spec = specAttrs[key];
+    return spec == null ||
+      !Object.prototype.hasOwnProperty.call(spec, 'default') ||
+      spec.default !== node.attrs[key]
+  })
+};
+
+/**
+ * Remaps a position into a matched block by walking the same child-index path
+ * it had in the old block. A raw byte offset would overshoot into a sibling
+ * inner textblock when the old block contains local keystrokes that are not
+ * yet part of the rebuilt document.
+ *
+ * @param {import('prosemirror-model').ResolvedPos} $oldPos
+ * @param {number} newBlockStart
+ * @param {import('prosemirror-model').Node} newBlock
+ * @return {number|null}
+ */
+const remapIntoBlock = ($oldPos, newBlockStart, newBlock) => {
+  let pos = newBlockStart + 1;
+  let node = newBlock;
+  for (let depth = 1; depth < $oldPos.depth; depth++) {
+    const idx = $oldPos.index(depth);
+    if (idx >= node.childCount) {
+      return null
+    }
+    for (let i = 0; i < idx; i++) {
+      pos += node.child(i).nodeSize;
+    }
+    pos += 1;
+    node = node.child(idx);
+    if (node.type !== $oldPos.node(depth + 1).type) {
+      return null
+    }
+  }
+  if (!node.isTextblock) {
+    return null
+  }
+  return pos + Math.min($oldPos.parentOffset, node.content.size)
+};
+
+/**
+ * @param {import('prosemirror-model').Node} oldDoc
+ * @param {import('prosemirror-model').Node} newDoc
+ * @param {number} absPos
+ * @return {number|null}
+ */
+const findAbsolutePositionAfterStructuralChange = (oldDoc, newDoc, absPos) => {
+  let pos = 0;
+  let targetIdx = 0;
+  for (; targetIdx < oldDoc.childCount; targetIdx++) {
+    const child = oldDoc.child(targetIdx);
+    if (pos + child.nodeSize > absPos) {
+      break
+    }
+    pos += child.nodeSize;
+  }
+  if (targetIdx >= oldDoc.childCount) {
+    return null
+  }
+  const targetChild = oldDoc.child(targetIdx);
+  const $oldPos = oldDoc.resolve(absPos);
+
+  /**
+   * @param {number} newBlockStart
+   * @param {import('prosemirror-model').Node} newBlock
+   * @return {number|null}
+   */
+  const place = (newBlockStart, newBlock) => {
+    // Positions between top-level blocks carry no inner path; clamp them just
+    // inside the matched block like the previous raw-offset remap did.
+    if ($oldPos.depth === 0) {
+      const remapped = newBlockStart + (absPos - pos);
+      const contentStart = newBlockStart + 1;
+      const contentEnd = newBlockStart + newBlock.nodeSize - 1;
+      return Math.max(contentStart, Math.min(remapped, contentEnd))
+    }
+    return remapIntoBlock($oldPos, newBlockStart, newBlock)
+  };
+
+  /**
+   * Finds the Nth block in newDoc matching `pred`, where N is the number of
+   * matching blocks in oldDoc up to and including the target block.
+   *
+   * @param {function(import('prosemirror-model').Node): boolean} pred
+   * @param {boolean} requireUnique
+   * @return {number|null}
+   */
+  const findByPredicate = (pred, requireUnique = false) => {
+    let occurrence = 0;
+    for (let i = 0; i <= targetIdx; i++) {
+      if (pred(oldDoc.child(i))) {
+        occurrence++;
+      }
+    }
+    let matchCount = 0;
+    let matchStart = -1;
+    let matchBlock = null;
+    let newPos = 0;
+    for (let i = 0; i < newDoc.childCount; i++) {
+      const child = newDoc.child(i);
+      if (pred(child)) {
+        matchCount++;
+        if (matchCount === occurrence) {
+          matchStart = newPos;
+          matchBlock = child;
+        }
+      }
+      newPos += child.nodeSize;
+    }
+    if (matchBlock === null || (requireUnique && (occurrence !== 1 || matchCount !== 1))) {
+      return null
+    }
+    return place(matchStart, matchBlock)
+  };
+
+  /**
+   * @param {import('prosemirror-model').Node} child
+   * @return {boolean}
+   */
+  const sameTypeAndAttrs = (child) =>
+    child.type === targetChild.type && attrsEqual(child.attrs, targetChild.attrs);
+  const oldText = targetChild.textContent;
+
+  const byAll = findByPredicate((child) => sameTypeAndAttrs(child) && child.textContent === oldText);
+  if (byAll !== null) {
+    return byAll
+  }
+
+  // Text must be matched before attrs: after a remote attr-only edit, the
+  // attrs pass would steer the cursor into a sibling that kept the old attrs.
+  const byText = findByPredicate(
+    (child) => child.type === targetChild.type && child.textContent === oldText
+  );
+  if (byText !== null) {
+    return byText
+  }
+
+  // In-flight local typing diverges the text between both docs. Distinctive
+  // attrs still identify the block; default-only attrs match every sibling.
+  if (hasDistinctiveAttrs(targetChild)) {
+    const byAttrs = findByPredicate(sameTypeAndAttrs, true);
+    if (byAttrs !== null) {
+      return byAttrs
+    }
+  }
+
+  // Trailing in-flight keystrokes leave a prefix relation between old and new
+  // text. Empty text is a prefix of everything and must never match.
+  return findByPredicate(
+    (child) => sameTypeAndAttrs(child) &&
+      oldText !== '' && child.textContent !== '' &&
+      (oldText.startsWith(child.textContent) || child.textContent.startsWith(oldText)),
+    true
+  )
+};
+
+/**
+ * Returns true when a transaction changes block structure rather than only
+ * editing inline content inside existing blocks.
+ *
+ * @param {import('prosemirror-state').Transaction} tr
+ * @param {import('prosemirror-model').Node} oldDoc
+ * @return {boolean}
+ */
+const isStructuralTransaction = (tr, oldDoc) => {
+  if (!tr.docChanged) {
+    return false
+  }
+  if (tr.doc.childCount !== oldDoc.childCount) {
+    return true
+  }
+  for (const step of tr.steps) {
+    if (step instanceof ReplaceStep) {
+      if (step.from === 0 && step.to === oldDoc.content.size) {
+        return true
+      }
+      if (step.slice.content.size > 0) {
+        let hasBlock = false;
+        step.slice.content.forEach((node) => {
+          if (node.isBlock) {
+            hasBlock = true;
+          }
+        });
+        if (hasBlock) {
+          return true
+        }
+      } else if (step.to > step.from) {
+        const $from = oldDoc.resolve(step.from);
+        const $to = oldDoc.resolve(step.to);
+        if ($from.depth === 0 && $to.depth === 0 && $from.index() !== $to.index()) {
+          return true
+        }
+      }
+    }
+  }
+  return false
+};
+
+/**
+ * Detect stale relative positions after structural changes that resolve to the
+ * wrong text block or to the start of the correct block.
+ *
+ * @param {import('prosemirror-model').Node} oldDoc
+ * @param {import('prosemirror-model').Node} newDoc
+ * @param {number} oldAbs
+ * @param {number|null} resolvedAbs
+ * @return {boolean}
+ */
+const isMisresolvedAfterStructuralChange = (oldDoc, newDoc, oldAbs, resolvedAbs) => {
+  if (resolvedAbs === null) {
+    return false
+  }
+  const $old = oldDoc.resolve(oldAbs);
+  const $new = newDoc.resolve(resolvedAbs);
+  if (!$old.parent.isTextblock) {
+    return false
+  }
+  // A textblock cursor cannot legitimately resolve into a non-textblock;
+  // a structural reorder replaced the block via delete + insert.
+  if (!$new.parent.isTextblock) {
+    return true
+  }
+  if ($old.parent.textContent !== $new.parent.textContent) {
+    return true
+  }
+  if ($old.parentOffset !== 0 && $new.parentOffset === 0) {
+    return true
+  }
+  const bothAtStart = $old.parentOffset === 0 && $new.parentOffset === 0;
+  // A changed offset, type or attrs hints at a same-text sibling. When all
+  // of them agree there is no signal left and the Yjs resolution must win.
+  const suspicious = $old.parentOffset !== $new.parentOffset ||
+    $old.parent.type !== $new.parent.type ||
+    !attrsEqual($old.parent.attrs, $new.parent.attrs);
+  if (bothAtStart || suspicious) {
+    const expected = findAbsolutePositionAfterStructuralChange(oldDoc, newDoc, oldAbs);
+    return expected !== null && expected !== resolvedAbs
+  }
+  return false
 };
 
 /**
@@ -2131,11 +2468,21 @@ const yCursorPlugin = (
           selectionBuilder
         )
       },
-      apply (tr, prevState, _oldState, newState) {
+      apply (tr, prevState, oldState, newState) {
         const ystate = ySyncPluginKey.getState(newState);
         const yCursorState = tr.getMeta(yCursorPluginKey);
+        const isRemoteChange = ystate && ystate.isChangeOrigin;
         if (
-          (ystate && ystate.isChangeOrigin) ||
+          tr.docChanged &&
+          !isRemoteChange &&
+          isStructuralTransaction(tr, oldState.doc)
+        ) {
+          // The ProseMirror document leads the Yjs mapping during local moves.
+          // Hide stale awareness until the collaborator publishes its new cursor.
+          return DecorationSet.empty
+        }
+        if (
+          isRemoteChange ||
           (yCursorState && yCursorState.awarenessUpdated)
         ) {
           return createDecorations(
@@ -2146,7 +2493,10 @@ const yCursorPlugin = (
             selectionBuilder
           )
         }
-        return prevState.map(tr.mapping, tr.doc)
+        if (tr.docChanged) {
+          return prevState.map(tr.mapping, tr.doc)
+        }
+        return prevState
       }
     },
     props: {
@@ -2161,15 +2511,19 @@ const yCursorPlugin = (
           setMeta(view, yCursorPluginKey, { awarenessUpdated: true });
         }
       };
-      const updateCursorInfo = () => {
-        const ystate = ySyncPluginKey.getState(view.state);
+      /**
+       * @param {import('prosemirror-view').EditorView} editorView
+       * @param {{ force?: boolean }} [opts]
+       */
+      const updateCursorInfo = (editorView, opts = {}) => {
+        const ystate = ySyncPluginKey.getState(editorView.state);
         // `ystate` is undefined during sync-plugin init and Y.Doc transitions;
         // reading from it here would throw and break cursor tracking for the view.
         if (!ystate || !ystate.binding) return
         // @note We make implicit checks when checking for the cursor property
         const current = awareness.getLocalState() || {};
-        if (view.hasFocus()) {
-          const selection = getSelection(view.state);
+        if (editorView.hasFocus()) {
+          const selection = getSelection(editorView.state);
           /**
            * @type {Y.RelativePosition}
            */
@@ -2187,6 +2541,7 @@ const yCursorPlugin = (
             ystate.binding.mapping
           );
           if (
+            opts.force ||
             current.cursor == null ||
             !Y.compareRelativePositions(
               Y.createRelativePositionFromJSON(current.cursor.anchor),
@@ -2215,14 +2570,23 @@ const yCursorPlugin = (
           awareness.setLocalStateField(cursorStateField, null);
         }
       };
+      const onFocusChange = () => updateCursorInfo(view);
       awareness.on('change', awarenessListener);
-      view.dom.addEventListener('focusin', updateCursorInfo);
-      view.dom.addEventListener('focusout', updateCursorInfo);
+      view.dom.addEventListener('focusin', onFocusChange);
+      view.dom.addEventListener('focusout', onFocusChange);
       return {
-        update: updateCursorInfo,
+        update: (editorView, prevState) => {
+          const ystate = ySyncPluginKey.getState(editorView.state);
+          const forceAwarenessUpdate = !!(
+            ystate?.isChangeOrigin &&
+            prevState?.doc &&
+            !prevState.doc.eq(editorView.state.doc)
+          );
+          updateCursorInfo(editorView, { force: forceAwarenessUpdate });
+        },
         destroy: () => {
-          view.dom.removeEventListener('focusin', updateCursorInfo);
-          view.dom.removeEventListener('focusout', updateCursorInfo);
+          view.dom.removeEventListener('focusin', onFocusChange);
+          view.dom.removeEventListener('focusout', onFocusChange);
           awareness.off('change', awarenessListener);
           awareness.setLocalStateField(cursorStateField, null);
         }
@@ -2344,5 +2708,5 @@ const yUndoPlugin = ({ protectedNodes = defaultProtectedNodes, trackedOrigins =
   }
 });
 
-export { ProsemirrorBinding, absolutePositionToRelativePosition, createDecorations, defaultAwarenessStateFilter, defaultCursorBuilder, defaultDeleteFilter, defaultProtectedNodes, defaultSelectionBuilder, getRelativeSelection, initProseMirrorDoc, isVisible, prosemirrorJSONToYDoc, prosemirrorJSONToYXmlFragment, prosemirrorToYDoc, prosemirrorToYXmlFragment, redo, relativePositionToAbsolutePosition, setMeta, undo, updateYFragment, yCursorPlugin, yCursorPluginKey, yDocToProsemirror, yDocToProsemirrorJSON, ySyncPlugin, ySyncPluginKey, yUndoPlugin, yUndoPluginKey, yXmlFragmentToProseMirrorFragment, yXmlFragmentToProseMirrorRootNode, yXmlFragmentToProsemirror, yXmlFragmentToProsemirrorJSON };
+export { ProsemirrorBinding, absolutePositionToRelativePosition, createDecorations, defaultAwarenessStateFilter, defaultCursorBuilder, defaultDeleteFilter, defaultProtectedNodes, defaultSelectionBuilder, findAbsolutePositionAfterStructuralChange, getRelativeSelection, initProseMirrorDoc, isMisresolvedAfterStructuralChange, isMisresolvedTextPosition, isStructuralTransaction, isVisible, prosemirrorJSONToYDoc, prosemirrorJSONToYXmlFragment, prosemirrorToYDoc, prosemirrorToYXmlFragment, redo, relativePositionToAbsolutePosition, setMeta, undo, updateYFragment, yCursorPlugin, yCursorPluginKey, yDocToProsemirror, yDocToProsemirrorJSON, ySyncPlugin, ySyncPluginKey, yUndoPlugin, yUndoPluginKey, yXmlFragmentToProseMirrorFragment, yXmlFragmentToProseMirrorRootNode, yXmlFragmentToProsemirror, yXmlFragmentToProsemirrorJSON };
 //# sourceMappingURL=y-tiptap.js.map