@panphora/clayjs 1.17.0 → 1.18.0

package/src/plugins/page.js

@@ -1,15 +1,15 @@
-import { FEATURES, featureForType } from "../page/features/registry.js";
+import { FEATURES, featureForNode, featureForType } from "../page/features/registry.js";
 import { mergeEngine } from "../sync/merge-engine.js";
 import { registerUnsavedState } from "../lib/unsaved-state.js";
 import { hostMeta } from "../core/host-meta.js";
-import { savePageForce, holdAllSaves, releaseAllSaves, suspendAutosave, resumeAutosave, getLastSavedBytes } from "../core/save.js";
-import { setSaveHeader } from "../core/save-core.js";
+import { savePageForce, holdAllSaves, releaseAllSaves, suspendAutosave, resumeAutosave, getLastSavedBytes, savesAdmitted } from "../core/save.js";
+import { setSaveHeader, onSaveAccepted } from "../core/save-core.js";
 import { lastSeenEtag, representedEtag, recordEtag } from "../core/etag.js";
 import { captureForSaveAndComparison } from "../core/snapshot.js";
-import { storeOf, stageStore, closeStore, checkpointWithin, requestCheckpoint, fastLane, pageLaneReady, pageWriterReady, registerPageCheckpoints } from "./live.js";
+import { storeOf, stageStore, closeStore, checkpointWithin, requestCheckpoint, requestExitCheckpoint, fastLane, localLane, lanePending, pageLaneReady, pageWriterReady, registerPageCheckpoints } from "./live.js";
 import { serializeLive } from "../live/ops.js";
 import { parseJsonRelaxed } from "../vendor/hyper-morph-json.vendor.js";
-import { saveStateFor, BLOCKED_TEXT, RETRY_TEXT, downloadPageCopy, downloadSnapshot, copyPageText } from "../page/save-states.js";
+import { saveStateFor, pageStateFor, BLOCKED_TEXT, RETRY_TEXT, downloadPageCopy, downloadSnapshot, copyPageText } from "../page/save-states.js";
 import toast, { toastPersistent, dismissPersistent } from "../ui/toast-lazy.js";
 import { claim } from "../page/runtime-owner.js";
 import { authorIdentity } from "../page/ybind/author.js";
@@ -22,11 +22,14 @@ import { style } from "../lib/hostile-css.js";
 const ARTICLE_SEL = "article[data-page]";
 const TAG_SEL = 'script[type="application/json"][merge="page"][clay~="live"]';
 const BLOCKED = { state: "blocked", code: "unsupported-host", message: "This host does not support page editing" };
+const STORE_TEXT = "Changes cannot be stored on this device. Download a copy to keep them.";
 const RETRY_BOUND_MS = 45000;
 const GENERIC_ERROR = "Couldn't save";
 const GENERIC_OFFLINE = "Offline, not saved";
 const REPLACED_TEXT = "This page was changed outside the editor. Reload to see it.";
 const TOO_LARGE_TEXT = "That change is too large to share, so it was not saved. Reload the page to keep editing.";
+const CLIENT_KEY = /^[ur][0-9a-z]+(-[0-9a-z]+){2}$/;
+export const PAGE_FULL_MESSAGE = "This document is full, though your changes are still here to download. To edit again, reload this tab after another editor, or the owner in another browser, deletes content.";
 const OVERWRITTEN_TEXT = "Some changes you made were replaced by a change made outside the editor.";
 const REPLACED_HOLD = "The page was changed outside the editor; reload to see it.";
 const LOADING_MS = 150;
@@ -72,7 +75,7 @@ function pageCodeReady() {
 function docFeatureIds(doc) {
   const ids = new Set();
   doc.forEach((node) => {
-    const id = featureForType(node.type.name);
+    const id = featureForNode(node);
     if (id) ids.add(id);
   });
   return [...ids];
@@ -129,7 +132,7 @@ function scrollToHashBlock(view, loc = globalThis.location) {
   globalThis.requestAnimationFrame?.(() => view.nodeDOM(found)?.scrollIntoView?.({ block: "start" }));
 }
 
-function dispatchState(state, code, message) {
+function dispatchState(state, code = null, message = "") {
   document.dispatchEvent(new CustomEvent("clay:page-save-state", { detail: { state, code, message } }));
 }
 
@@ -160,11 +163,24 @@ function armRetry(inst, code, message) {
   }, RETRY_BOUND_MS);
 }
 
-function showBlocked(inst, code, message) {
+// The persistent save-state toasts a session raises, taken down together: at the page's
+// own teardown the fade plays, and at a session's end, where nobody is left to read it,
+// the nodes go now.
+function dismissSaveStateToasts(inst, now = false) {
+  if (inst.retryTimer) {
+    clearTimeout(inst.retryTimer);
+    inst.retryTimer = null;
+  }
+  dismissPersistent(RETRY_TEXT, { now });
+  dismissPersistent(BLOCKED_TEXT, { now });
+  dismissPersistent(STORE_TEXT, { now });
+}
+
+function showBlocked(inst, code, message, state = "blocked") {
   clearRetry(inst);
   dismissGeneric();
-  dispatchState("blocked", code, message);
-  toastPersistent(BLOCKED_TEXT, "error", {
+  dispatchState(state, code, message);
+  toastPersistent(state === "unavailable" ? STORE_TEXT : BLOCKED_TEXT, "error", {
     detail: message,
     actions: [
       { label: "Download a copy", onClick: downloadPageCopy },
@@ -176,6 +192,7 @@ function showBlocked(inst, code, message) {
 function showSaved(inst) {
   clearRetry(inst);
   dismissPersistent(BLOCKED_TEXT);
+  dismissPersistent(STORE_TEXT);
   dispatchState("saved", null, "");
 }
 
@@ -218,7 +235,7 @@ function stopEditing(inst) {
 // room refused it): the saved document with the article rendered from the tab's document.
 function downloadTabCopy(inst) {
   if (!inst.tabValue) return downloadPageCopy();
-  const { forSave } = captureForSaveAndComparison();
+  const { forSave } = captureForSaveAndComparison({ emitForSync: false });
   const doc = new DOMParser().parseFromString(forSave, "text/html");
   const articles = doc.querySelectorAll(ARTICLE_SEL);
   if (articles.length !== 1) return downloadPageCopy();
@@ -229,20 +246,23 @@ function downloadTabCopy(inst) {
   return downloadSnapshot(`<!DOCTYPE html>\n${doc.documentElement.outerHTML}`);
 }
 
-function stopWithNotice(inst, text) {
+function stopWithNotice(inst, text, { reload = true } = {}) {
   if (inst.replaced) return;
   inst.replaced = true;
   stopEditing(inst);
+  const download = { label: "Download your copy", onClick: () => downloadTabCopy(inst) };
   toastPersistent(text, "warning", {
-    actions: [
-      { label: "Reload", onClick: () => window.location.reload() },
-      { label: "Download your copy", onClick: () => downloadTabCopy(inst) },
-    ],
+    actions: reload ? [{ label: "Reload", onClick: () => window.location.reload() }, download] : [download],
   });
 }
 
 const showReplaced = (inst) => stopWithNotice(inst, REPLACED_TEXT);
 const showTooLarge = (inst) => stopWithNotice(inst, TOO_LARGE_TEXT);
+const showFull = (inst, code) => {
+  dispatchState("blocked", code, PAGE_FULL_MESSAGE);
+  // A reload replays the refused edit and is refused again, so the notice offers only the download.
+  stopWithNotice(inst, PAGE_FULL_MESSAGE, { reload: false });
+};
 
 function applySaveState(inst, state, code, message) {
   if (state === "saved") showSaved(inst);
@@ -290,8 +310,7 @@ function listenForSaves(inst) {
   });
 }
 
-// The page the host stores now, read once: the article a first write is offered to
-// again, and the version it is offered against.
+// The page the host stores now, including any merge state it keeps beside the file.
 async function readStoredArticle() {
   const response = await fetch(new URL(globalThis.location.href).href, { cache: "no-store" });
   if (!response?.ok) return null;
@@ -299,12 +318,17 @@ async function readStoredArticle() {
   const doc = new DOMParser().parseFromString(html, "text/html");
   const article = doc.querySelector(ARTICLE_SEL);
   if (!article) return null;
-  return { article, etag: response.headers?.get?.("etag") || null };
+  const tag = doc.querySelector(TAG_SEL);
+  // The served root attribute names the stored document (spec §4). A host may add a weak
+  // HTTP ETag of its own, which names the response, never the document.
+  const header = response.headers?.get?.("etag") || null;
+  const etag = doc.documentElement.getAttribute("documentetag") || (header && !/^W\//.test(header) ? header : null);
+  return { article, value: tag ? parseJsonRelaxed(tag.textContent) : null, etag };
 }
 
 // A refused first write: the stored document has moved on, or it does not descend
-// from the seed this tab staged. The stored document is read once, the seed is rebuilt
-// from its article, this tab's own pending edit replays over it, and the write goes
+// from the seed this tab staged. The stored document is read once, its merge state is
+// kept (or seeded from the article), this tab's pending edit replays over it, and the write goes
 // out once more against the version just read. A second refusal keeps the text in the
 // tab and shows the conflict, exactly as a lone refusal does.
 async function retryFirstWrite(inst, event) {
@@ -319,11 +343,11 @@ async function retryFirstWrite(inst, event) {
     if (!found || !isCurrent(inst)) return;
     const page = await pageCodeReady();
     if (!isCurrent(inst)) return;
-    const seed = page.seedPageFromArticle(found.article.cloneNode(true));
+    const seed = found.value ?? page.seedPageFromArticle(found.article.cloneNode(true));
     // This tab's next write is conditional on the version it has just read.
     const at = found.etag ?? event?.detail?.etag ?? null;
     if (at) recordEtag(at);
-    // The tab's own edit replays over the seed the stored article states; an op the
+    // The tab's own edit replays over the stored page state; an op the
     // stored article cannot hold is dropped by the store, never written over it.
     inst.store.rebase(seed, { source: "state" });
     await savePageForce();
@@ -413,12 +437,7 @@ function dispose() {
   registerPageCheckpoints(null);
   if (!inst) return;
   disposeInstall(inst);
-  if (inst.retryTimer) {
-    clearTimeout(inst.retryTimer);
-    inst.retryTimer = null;
-  }
-  dismissPersistent(RETRY_TEXT);
-  dismissPersistent(BLOCKED_TEXT);
+  dismissSaveStateToasts(inst);
   dismissPersistent(REPLACED_TEXT);
   for (const message of inst.notices?.values() ?? []) dismissPersistent(message);
   if (inst.savesHeld) {
@@ -446,8 +465,12 @@ let recoveryModules = null;
 
 function pageRecovery() {
   if (!recoveryModules) {
-    recoveryModules = Promise.all([import("../page/ybind/recovery-replay.js"), import("../page/checkpoint-proof.js")])
-      .then(([replay, proof]) => ({ replay, proof }))
+    recoveryModules = Promise.all([
+      import("../page/ybind/recovery-replay.js"),
+      import("../page/checkpoint-proof.js"),
+      import("../page/recovery-ui.js"),
+    ])
+      .then(([replay, proof, ui]) => ({ replay, proof, ui }))
       .catch((error) => {
         console.warn("clayjs: page journal could not load", error);
         return null;
@@ -485,11 +508,36 @@ async function replayJournal(inst) {
   const outcome = await modules.replay.replayInto({ journal, state: inst.store.value, into: inst.binding.ydoc });
   // The recovered page is this tab's page now: it is offered to the room exactly as an
   // edit would be, and it is not one more journal and not one giant undo step.
+  installJournalStatus(inst, modules);
   if (outcome.replayed.length) inst.binding.provider.settle();
   if (outcome.review.length) inst.recoveryReview = outcome.review;
+  installRecoveryReview(inst, modules.ui)?.update({ rows: modules.replay.describeReview(outcome.review) });
   return outcome;
 }
 
+// The review of what this page may not replay, drawn in the editor's own chrome once per
+// session, with the composition shadow that keeps typing which never became a
+// transaction: one object, alive exactly as long as the session that mounted it.
+function installRecoveryReview(inst, ui) {
+  if (inst.recoveryPanel) return inst.recoveryPanel;
+  const view = inst.view;
+  const mount = view?.dom.closest(".page-shell") ?? inst.article;
+  if (!mount) return null;
+  const review = ui.createRecoveryReview({
+    mount,
+    getView: () => (inst.view && !inst.view.isDestroyed ? inst.view : null),
+    getJournal: () => inst.binding?.journal ?? null,
+    isCurrent: () => isCurrent(inst) && inst.inputOpen && !!inst.view && !inst.view.isDestroyed,
+  });
+  const detach = review.watch(view?.dom ?? null);
+  addDisposer(inst, () => {
+    detach();
+    review.destroy();
+  });
+  inst.recoveryPanel = review;
+  return review;
+}
+
 // One accepted save retires the records a proof covers, and no others.
 function installCheckpointProof(inst) {
   registerPageCheckpoints(async ({ capture, state, article, etag }) => {
@@ -511,10 +559,28 @@ function installCheckpointProof(inst) {
       etag,
       href: await hostPageStateHref(),
     });
-    if (answer.ok) journal.retire(answer.retired);
+    if (!answer.ok) return;
+    journal.retire(answer.retired);
+    inst.pageStatus?.checkpoint();
+    await journal.rebase?.(modules.replay.journalBase(answer.proof.state));
   });
 }
 
+// Both live in the journal's module, which a page without a journal never loads.
+function installJournalStatus(inst, modules) {
+  const journal = inst.binding?.journal;
+  if (!journal || inst.pageStatus) return inst.pageStatus ?? null;
+  inst.pageStatus = modules.replay.watchJournal({
+    journal,
+    store: inst.store,
+    reduce: pageStateFor,
+    onState: (state) => dispatchState(state),
+    onUnavailable: (code) => showBlocked(inst, code, "", "unavailable"),
+  });
+  addDisposer(inst, () => inst.pageStatus?.dispose());
+  return inst.pageStatus;
+}
+
 export function createSteps(inst, options) {
   let meta = null;
   let binding = null;
@@ -552,6 +618,17 @@ export function createSteps(inst, options) {
           supported: host.supported,
           installed: () => identity?.token ?? null,
           revision: () => null,
+          // A floor rise moves this tab to the lane scope of the format it now
+          // writes, so a tab that cannot read that format never shares it. The
+          // transport is this tab's to create, on its own schedule, so the gate
+          // asks for it by the move rather than by the object.
+          lane: {
+            switchScope: (next, options) => {
+              const transport = localLane();
+              if (!transport) return { status: "refused", code: "lane-unavailable" };
+              return transport.switchScope(next, { ...options, covered: Boolean(options?.covered) || !lanePending() });
+            },
+          },
         });
         return formatGate;
       })
@@ -613,6 +690,81 @@ export function createSteps(inst, options) {
     });
     return toolsOpening;
   };
+
+  // The document's own switches travel with it: the gear panel writes them into the
+  // page's live store, and a document that never touched one opens no store at all.
+  // Turning a switch off hides a tag; the owner and due values stay in the file.
+  const SETTINGS_SEL = 'script[type="application/json"][merge="page.settings"][clay~="live"]';
+  const SETTING_KEYS = ["assignees", "dates"];
+  let settingsOpening = null;
+  let settingsValue = { assignees: true, dates: true };
+
+  // Both switches default to on, and anything but an explicit false leaves them on.
+  const settingsFrom = (value) => ({
+    assignees: value?.assignees !== false,
+    dates: value?.dates !== false,
+  });
+
+  function readSettings() {
+    const tag = document.querySelector(SETTINGS_SEL);
+    if (!tag) return settingsFrom(null);
+    let value = null;
+    try { value = JSON.parse(tag.textContent); } catch (error) { value = null; }
+    return settingsFrom(value);
+  }
+
+  function applySettings(next) {
+    settingsValue = settingsFrom(next);
+    const dom = inst.view && !inst.view.isDestroyed ? inst.view.dom : null;
+    if (!dom) return;
+    for (const key of SETTING_KEYS) {
+      if (settingsValue[key]) dom.removeAttribute(`data-${key}`);
+      else dom.setAttribute(`data-${key}`, "false");
+    }
+  }
+
+  const openSettings = () => {
+    if (settingsOpening) return settingsOpening;
+    settingsOpening = (async () => {
+      if (!document.querySelector(SETTINGS_SEL)) {
+        const tag = document.createElement("script");
+        tag.setAttribute("type", "application/json");
+        tag.setAttribute("merge", "page.settings");
+        tag.setAttribute("clay", "live");
+        tag.textContent = "{}";
+        document.head.appendChild(tag);
+      }
+      let handle = null;
+      try {
+        handle = window.clay.live("page.settings");
+        await handle.ready;
+      } catch (error) {
+        console.warn("clayjs: page plugin could not open the settings store", error);
+        settingsOpening = null;
+        return null;
+      }
+      if (!isCurrent(inst)) return null;
+      applySettings(handle.data);
+      // A peer's change hides or shows the tags here too, without the view remounting.
+      handle.on("change", () => applySettings(handle.data));
+      return handle;
+    })();
+    return settingsOpening;
+  };
+
+  // The gear panel's API: what the document shows now, and a switch that writes the
+  // document's store and takes effect here at once, without waiting for the change.
+  inst.settings = {
+    read: () => ({ ...settingsValue }),
+    set: async (key, on) => {
+      if (!SETTING_KEYS.includes(key)) throw new TypeError(`clayjs: "${key}" is not a page setting`);
+      const handle = await openSettings();
+      if (!handle) throw new Error("clayjs: the page settings store could not be opened");
+      const next = { ...settingsFrom(handle.data), [key]: on !== false };
+      handle.set([key], next[key]);
+      applySettings(next);
+    },
+  };
   // One notice per feature a person needed and that failed, until Retry succeeds.
   const notices = new Map();
   const notifyFailed = (id) => {
@@ -690,9 +842,29 @@ export function createSteps(inst, options) {
       const code = await pageCodeReady();
       if (!isCurrent(inst)) return { ok: false, cancelled: true };
       if (seeded) {
-        // The seed stays a value in memory: no tag and no write until someone edits.
         try {
-          value = source.seedValue = code.seedPageFromArticle(source.article.cloneNode(true));
+          const meta = await hostMeta();
+          const href = meta?.extensions?.includes("page-recovery-v1") && meta.document?.pageState?.href;
+          const etag = inst.context?.represented ? inst.context.represented.etag : representedEtag() ?? lastSeenEtag();
+          if (href && etag) {
+            const { readPageState } = await import("../page/checkpoint-proof.js");
+            const stored = await readPageState({ href, etag });
+            if (!isCurrent(inst)) return { ok: false, cancelled: true };
+            if (stored.ok) {
+              if (stored.etag !== etag) return { ok: false, reason: "etag-mismatch" };
+              value = parseJsonRelaxed(stored.tag);
+              source.persisted = true;
+            } else if (stored.code !== "no-page-state") {
+              return { ok: false, reason: stored.code };
+            }
+          } else if (href) {
+            const stored = await readStoredArticle();
+            if (!isCurrent(inst)) return { ok: false, cancelled: true };
+            if (!stored || !stored.article.isEqualNode(source.article)) return { ok: false, reason: "stale-document" };
+            value = stored.value;
+            source.persisted = value !== null;
+          }
+          value = source.seedValue = value ?? code.seedPageFromArticle(source.article.cloneNode(true));
         } catch (error) {
           console.warn("clayjs: page plugin could not rebuild the page it found, leaving the page as saved HTML", error);
           return { ok: false, reason: "invalid-page-source" };
@@ -816,6 +988,7 @@ function mergeRepresentedPage(store, value) {
         const staged = stageStore("page", {
           value: source.seedValue,
           represented: options.represented ?? { bytes: source.article.outerHTML, etag: representedEtag() ?? lastSeenEtag() },
+          persisted: source.persisted,
         });
         inst.staged = staged;
         handle = staged.handle;
@@ -876,6 +1049,8 @@ function mergeRepresentedPage(store, value) {
         if (reason === "lineage") {
           fastLane()?.abandon?.("page");
           showReplaced(inst);
+        } else if (reason === "page-full" || reason === "compaction-failed") {
+          showFull(inst, reason);
         } else {
           showTooLarge(inst);
         }
@@ -884,12 +1059,17 @@ function mergeRepresentedPage(store, value) {
       ownedTokens: identity.owned,
       checkpointWithin,
       requestCheckpoint,
+      requestExitCheckpoint: (options) => requestExitCheckpoint({ name: store.name, ...options }),
       journal,
+      // An exit holds admission closed, which is the only time this tab's own input
+      // still owing the file holds the leave: outside one, the binding reports what it
+      // always reported.
+      exitClosed: () => !savesAdmitted(),
       registerUnsavedState: (def) => {
         registered = registerUnsavedState({
           id: def.id,
           isPending: () => flushFailed || def.isPending(),
-          flush: () => trackFlush(() => def.flush()),
+          flush: (options) => trackFlush(() => def.flush(options)),
         });
         return registered;
       },
@@ -972,6 +1152,13 @@ function mountAndAttach(inst, source, loaded) {
     }
     editorView = view;
     inst.view = view;
+    applySettings(readSettings());
+    // A document that states settings opens their store so a peer's change reaches this
+    // tab; one that states none opens it when a switch is first written.
+    if (document.querySelector(SETTINGS_SEL)) openSettings().catch(() => null);
+    else listen(inst, "clay:sync-applied", () => {
+      if (!settingsOpening && document.querySelector(SETTINGS_SEL)) openSettings().catch(() => null);
+    });
     const shell = view.dom.closest(".page-shell");
     // A shell still waiting for its boot takes no input of any kind: a control inside
     // a non-editable editor would otherwise write before the boot says ready. It is
@@ -1062,7 +1249,8 @@ function mountAndAttach(inst, source, loaded) {
     // lane but no writer yet, this tab claims the room (a redundant set of an
     // existing Yjs update: a valid nonempty frame that changes nothing) and then
     // waits for the election, so exactly one tab adopts.
-    const found = code.classifyFile(source.article, source.tags);
+    // A seeded page was built from this article: nothing to adopt.
+    const found = source.seeded ? { kind: "untouched" } : code.classifyFile(source.article, source.tags);
     const needsAdoption = found.kind === "adopt";
     const awaitWriter = async () => {
       const lane = await pageLaneReady();
@@ -1071,8 +1259,13 @@ function mountAndAttach(inst, source, loaded) {
       if (lane.status.writer === null) {
         const y = inst.store.value.y;
         const keys = Object.keys(y);
-        const key = keys.length ? keys[0] : `claim-${binding.ydoc.clientID.toString(36)}`;
-        const value = keys.length ? y[keys[0]] : code.yValueOf(binding.ydoc).y.seed;
+        // A compacting room admits only whole client keys: an existing one again, or this
+        // tab's document under a fresh one.
+        const me = binding.ydoc.clientID.toString(36);
+        const key = inst.store.room?.compaction?.v === 1
+          ? keys.find((k) => CLIENT_KEY.test(k)) ?? `u${me}-claim-0`
+          : keys.length ? keys[0] : `claim-${me}`;
+        const value = Object.hasOwn(y, key) ? y[key] : code.yValueOf(binding.ydoc).y.seed;
         inst.store.handle.set(["y", key], value);
         // The session is not admitted until the commit, so its ops stay in the tab: the
         // claim alone is framed now, before adoption writes anything, or no election runs.
@@ -1095,8 +1288,9 @@ function mountAndAttach(inst, source, loaded) {
         return !lane || lane.status.writer === null ? true : lane.isWriter();
       },
       requestCheckpoint: () => checkpointWithin(0),
-      snapshot: () => captureForSaveAndComparison().forSave,
+      snapshot: () => captureForSaveAndComparison({ emitForSync: false }).forSave,
       mergeTagless: inst.mergeTagless,
+      seeded: source.seeded,
       writerReady: awaitWriter,
       adopted: (rev) => fastLane()?.adopted?.("page", rev, inst.store.mark),
       notice: (counts) => {
@@ -1184,7 +1378,7 @@ function mountAndAttach(inst, source, loaded) {
   // a `resume` puts the very same session back.
   function closeInput(inst) {
     if (!inst.inputOpen) return false;
-    setEditorActive?.(inst.view, false);
+    setEditorActive?.(inst.view, false, { quiesce: true });
     return true;
   }
 
@@ -1263,10 +1457,7 @@ function endSession(inst) {
   }
   setSaveHeader("Page-Write", null);
   disposeInstall(inst);
-  if (inst.retryTimer) {
-    clearTimeout(inst.retryTimer);
-    inst.retryTimer = null;
-  }
+  dismissSaveStateToasts(inst, true);
   inst.titleObserver?.dispose();
   inst.titleObserver = null;
   clearLoadingStatus(inst);
@@ -1399,8 +1590,22 @@ export const page = {
   get view() {
     return active?.view ?? null;
   },
+  // The document's settings, for the panel that switches them.
+  get settings() {
+    return active?.settings ?? null;
+  },
 };
 
+// The page's accepted bytes are the only thing that clears what this tab owes the file,
+// and one module-level observer is enough: the hook API has no unsubscribe, so a binding
+// registers none of its own and the current session's binding answers each save.
+onSaveAccepted((html) => {
+  const binding = active?.binding;
+  if (!binding?.filePending()) return;
+  const state = pageCode?.acceptedPageState(html);
+  if (state) binding.acceptFile(state);
+});
+
 // A live entry imports this module while the committed mode is still view: the install
 // belongs to the explicit edit boot alone, and a managed session starts its own.
 page.ready = startsAtImport() ? install() : null;

package/src/plugins/sortable.js

@@ -250,6 +250,7 @@ function makeSortable(sortableElem, Sortable, record = loose) {
   let press = null;
   let restoring = null;
   let started = false;
+  let native = false;
   let ends = [];
   // A press that ends without a drop (a click, a cancel) still has to hand the
   // gesture's exclusion back: the drop itself releases it once its entry is recorded.
@@ -271,7 +272,11 @@ function makeSortable(sortableElem, Sortable, record = loose) {
     ends = [];
     if (pending) later(record, () => restoreRuntimeAttrs(pending));
   };
-  const settleSoon = () => {
+  const settleSoon = (event) => {
+    // Chrome cancels the pointer as a native drag begins, just before Sortable's onStart:
+    // that press ends on the drop or dragend, not on the cancel.
+    if (native && event?.type === 'pointercancel') return;
+    native = false;
     // Only the press that became a drag holds: a click has nothing to keep out of
     // history, and its own handler's writes are the next entry.
     if (started) {
@@ -291,9 +296,11 @@ function makeSortable(sortableElem, Sortable, record = loose) {
     recorded = recordRuntimeAttrs(item);
     press = beginMove(item);
     started = false;
+    native = false;
     record.presses.add(recorded);
     pressed.add(recorded);
     ends = ENDS.map(type => track(record, document, type, settleSoon, true));
+    ends.push(track(record, document, 'dragstart', () => { native = true; }, true));
   }, true);
   options.onUnchoose = restoreSoon;
   // The one signal a click never makes: Sortable says the press became a drag, so this

package/src/plugins/source.js

@@ -191,6 +191,12 @@ export const source = {
   unpaired: () => (session ? session.unpaired() : null),
   /** The save pipeline's own ask: a promise to wait for before its capture, or null. */
   ensureForSave,
+  /**
+   * How many times this session's map has been rebuilt, or 0 before it installs.
+   */
+  get repairGeneration() {
+    return session ? session.repairGeneration() : 0;
+  },
 };
 
 /**