@panphora/clayjs 1.1.0 → 1.2.0

package/dist/clay.standalone.js

@@ -1,4 +1,4 @@
-/* clayjs 1.1.0 standalone build: every clayjs module in one file. https://clayjs.com/offline
+/* clayjs 1.2.0 standalone build: every clayjs module in one file. https://clayjs.com/offline
    Third-party code inside keeps its own license (Sortable MIT, Squire MIT, DOMPurify Apache-2.0 OR MPL-2.0, MicroModal MIT): https://clayjs.com/THIRD-PARTY-NOTICES.md */
 (() => {
   var __create = Object.create;
@@ -105,12 +105,17 @@
   function isTabLocalRootAttr(name, element) {
     return element === document.documentElement && TAB_LOCAL_ROOT_ATTRS.has(name);
   }
-  var SAVE_TOKEN_ATTRS, HOST_IDENTITY_ATTRS, HOST_TOKEN_ATTRS, ROOT_LIBRARY_ATTRS, TAB_LOCAL_ROOT_ATTRS;
+  var SAVE_TOKEN_ATTRS, LEGACY_SAVE_TOKEN_ATTRS, HOST_IDENTITY_ATTRS, HOST_TOKEN_ATTRS, ROOT_LIBRARY_ATTRS, TAB_LOCAL_ROOT_ATTRS;
   var init_root_attrs = __esm({
     "src/lib/root-attrs.js"() {
-      SAVE_TOKEN_ATTRS = ["savetoken", "htmlclaytoken"];
-      HOST_IDENTITY_ATTRS = ["htmlclayid"];
-      HOST_TOKEN_ATTRS = [...SAVE_TOKEN_ATTRS, ...HOST_IDENTITY_ATTRS];
+      SAVE_TOKEN_ATTRS = ["savetoken"];
+      LEGACY_SAVE_TOKEN_ATTRS = ["htmlclaytoken"];
+      HOST_IDENTITY_ATTRS = ["documentid", "htmlclayid"];
+      HOST_TOKEN_ATTRS = [
+        ...SAVE_TOKEN_ATTRS,
+        ...LEGACY_SAVE_TOKEN_ATTRS,
+        ...HOST_IDENTITY_ATTRS
+      ];
       ROOT_LIBRARY_ATTRS = ["savestatus", "editmode", "pageowner"];
       TAB_LOCAL_ROOT_ATTRS = /* @__PURE__ */ new Set([
         ...HOST_TOKEN_ATTRS,
@@ -120,20 +125,41 @@
   });
 
   // src/core/host-attrs.js
+  function warnAboutLegacyToken() {
+    if (warnedAboutLegacyToken) return;
+    const carries = LEGACY_SAVE_TOKEN_ATTRS.some(
+      (attr) => document.documentElement.getAttribute(attr)
+    );
+    if (!carries) return;
+    warnedAboutLegacyToken = true;
+    console.warn(
+      "[clay] This page was served with the pre-1.9.0 save token (" + LEGACY_SAVE_TOKEN_ATTRS.join(", ") + "), which this version no longer accepts. Saving will fail until the host is updated. If this is HTML Clay, upgrade it to 1.9.0 or newer."
+    );
+  }
   function saveToken() {
     if (typeof document === "undefined") return null;
     for (const attr of SAVE_TOKEN_ATTRS) {
       const value = document.documentElement.getAttribute(attr);
       if (value) return value;
     }
+    warnAboutLegacyToken();
     return null;
   }
   function hasSaveToken() {
     return saveToken() !== null;
   }
+  function servedStaleToken() {
+    if (typeof document === "undefined") return false;
+    if (saveToken() !== null) return false;
+    return LEGACY_SAVE_TOKEN_ATTRS.some(
+      (attr) => document.documentElement.getAttribute(attr)
+    );
+  }
+  var warnedAboutLegacyToken;
   var init_host_attrs = __esm({
     "src/core/host-attrs.js"() {
       init_root_attrs();
+      warnedAboutLegacyToken = false;
     }
   });
 
@@ -157,17 +183,17 @@
           forcedEditMode = Boolean(window.__hyperclayEditMode);
         }
       }
-      isEditMode = query_default.editmode ? query_default.editmode === "true" : forcedEditMode != null ? forcedEditMode : hasSaveToken() || Boolean(cookie_default.get("isAdminOfCurrentResource"));
+      isEditMode = query_default.editmode ? query_default.editmode === "true" : servedStaleToken() ? false : forcedEditMode != null ? forcedEditMode : hasSaveToken() || Boolean(cookie_default.get("isAdminOfCurrentResource"));
       isOwner = Boolean(cookie_default.get("isAdminOfCurrentResource"));
     }
   });
 
   // src/lib/extension-noise.js
-  function stripExtensionNoise(root2) {
-    if (!root2 || !root2.querySelectorAll) return;
+  function stripExtensionNoise(root3) {
+    if (!root3 || !root3.querySelectorAll) return;
     try {
-      for (const el3 of root2.querySelectorAll(EXTENSION_NODE_SELECTOR)) el3.remove();
-      for (const el3 of [root2, ...root2.querySelectorAll("*")]) {
+      for (const el3 of root3.querySelectorAll(EXTENSION_NODE_SELECTOR)) el3.remove();
+      for (const el3 of [root3, ...root3.querySelectorAll("*")]) {
         if (!el3.attributes) continue;
         for (const attr of [...el3.attributes]) {
           if (EXTENSION_ATTR_PATTERN.test(attr.name.toLowerCase())) el3.removeAttribute(attr.name);
@@ -1326,7 +1352,7 @@
     for (const name of TAB_LOCAL_ROOT_ATTRS) bareRoot.removeAttribute(name);
     const shell = bareRoot.outerHTML;
     const endTag = `</${bareRoot.localName}>`;
-    return shell.slice(0, shell.length - endTag.length) + clone.innerHTML + endTag;
+    return "<!DOCTYPE html>" + shell.slice(0, shell.length - endTag.length) + clone.innerHTML + endTag;
   }
   function captureBodyForSync() {
     const clone = captureSnapshot();
@@ -1391,6 +1417,108 @@
     }
   });
 
+  // src/lib/hostile-css.js
+  function style(el3, rules) {
+    for (const rule of rules) {
+      const at = rule.indexOf(":");
+      el3.style.setProperty(rule.slice(0, at).trim(), rule.slice(at + 1).trim(), "important");
+    }
+  }
+  function set(el3, prop, value) {
+    el3.style.setProperty(prop, value, "important");
+  }
+  function make(tag, rules, text) {
+    const el3 = document.createElement(tag);
+    style(el3, rules);
+    if (text) el3.textContent = text;
+    return el3;
+  }
+  var init_hostile_css = __esm({
+    "src/lib/hostile-css.js"() {
+    }
+  });
+
+  // src/core/stale-host-notice.js
+  var stale_host_notice_exports = {};
+  function place() {
+    if (!root) return;
+    const vv = window.visualViewport;
+    const lift = vv ? Math.max(0, window.innerHeight - vv.height - vv.offsetTop) : 0;
+    set(root, "bottom", `calc(${16 + lift}px + env(safe-area-inset-bottom,0px))`);
+  }
+  function dismiss() {
+    if (!root) return;
+    set(root, "display", "none");
+    window.visualViewport?.removeEventListener("resize", place);
+    window.visualViewport?.removeEventListener("scroll", place);
+  }
+  function build() {
+    root = make("div", [
+      "position:fixed",
+      "left:50%",
+      "transform:translateX(-50%)",
+      "z-index:2147483001",
+      "display:flex",
+      "align-items:center",
+      "gap:10px",
+      "max-width:calc(100vw - 24px)",
+      "flex-wrap:wrap",
+      "justify-content:center",
+      "padding:9px 12px",
+      "border-radius:10px",
+      `background:${BG}`,
+      `color:${INK}`,
+      `border:1px solid ${EDGE}`,
+      "box-shadow:0 6px 24px rgba(0,0,0,.32),0 1px 2px rgba(0,0,0,.24)",
+      `font:${FONT}`,
+      "text-align:left"
+    ]);
+    root.setAttribute("clay", "no-save no-watch no-snapshot");
+    root.setAttribute("data-clay-stale-host", "");
+    root.setAttribute("role", "alert");
+    root.append(make("span", ["margin-right:2px"], MESSAGE));
+    const close = make("button", [
+      "all:initial",
+      "box-sizing:border-box",
+      "cursor:pointer",
+      `font:${FONT}`,
+      "color:" + INK,
+      "opacity:.72",
+      "padding:2px 6px",
+      "border-radius:6px",
+      "flex:none"
+    ], "Dismiss");
+    close.type = "button";
+    close.setAttribute("aria-label", "Dismiss this message");
+    close.addEventListener("click", dismiss);
+    root.append(close);
+    document.body.appendChild(root);
+    place();
+    window.visualViewport?.addEventListener("resize", place);
+    window.visualViewport?.addEventListener("scroll", place);
+  }
+  function init2() {
+    if (!servedStaleToken()) return;
+    if (isEditMode) return;
+    build();
+  }
+  var BG, INK, EDGE, FONT, MESSAGE, root;
+  var init_stale_host_notice = __esm({
+    "src/core/stale-host-notice.js"() {
+      init_host_attrs();
+      init_is_edit_mode();
+      init_dom_ready();
+      init_hostile_css();
+      BG = "var(--clay-notice-bg,#222)";
+      INK = "var(--clay-notice-ink,#fff)";
+      EDGE = "var(--clay-notice-edge,rgba(255,255,255,.28))";
+      FONT = "14px/1.45 system-ui,-apple-system,'Segoe UI',sans-serif";
+      MESSAGE = "This page can't be edited: the app serving it is out of date. Update HTML Clay to 1.9.0 or newer.";
+      root = null;
+      dom_ready_default(init2);
+    }
+  });
+
   // src/core/host-meta.js
   function bareHost() {
     return { spec: null, extensions: [], document: null };
@@ -1499,6 +1627,7 @@
       if (isEditMode) {
         document.addEventListener("clay:sync-applied", (event) => {
           if (event.detail?.source !== "disk") return;
+          if (typeof event.detail.etag === "string" && event.detail.etag) return;
           forgetEtag();
           seedEtag({ fresh: true });
         });
@@ -1514,6 +1643,8 @@
     isSaveInProgress: () => isSaveInProgress,
     onSnapshot: () => onSnapshot,
     replacePageWith: () => replacePageWith,
+    resetSaveAttempts: () => resetSaveAttempts,
+    saveFateIsUnknown: () => saveFateIsUnknown,
     saveHtml: () => saveHtml
   });
   function isSaveInProgress() {
@@ -1528,9 +1659,34 @@
       etag: data.etag ?? null
     };
   }
+  function saveFateIsUnknown() {
+    return unknownAttempt !== null;
+  }
+  function mintSaveId() {
+    const uuid = window.crypto?.randomUUID?.();
+    if (uuid) return uuid;
+    if (window.crypto?.getRandomValues) {
+      const bytes = new Uint8Array(16);
+      window.crypto.getRandomValues(bytes);
+      return Array.from(bytes, (b) => b.toString(16).padStart(2, "0")).join("");
+    }
+    const segment = () => Math.random().toString(36).slice(2, 12).padEnd(10, "0");
+    return `${Date.now().toString(36)}-${segment()}${segment()}${segment()}`;
+  }
+  function rememberSentId(saveId) {
+    sentIds.push(saveId);
+    if (sentIds.length > SENT_ID_MEMORY) sentIds.shift();
+  }
+  function sentByThisTab(saveId) {
+    return typeof saveId === "string" && saveId !== "" && sentIds.includes(saveId);
+  }
+  function resetSaveAttempts() {
+    sentIds.length = 0;
+    unknownAttempt = null;
+  }
   function errorResult(err) {
     const timedOut = err.name === "AbortError";
-    const conflicted = !timedOut && (err.status === 412 || err.code === "conflict");
+    const conflicted = !timedOut && err.status === 412;
     return {
       ok: false,
       msg: timedOut ? "Server not responding" : err.message || "Save failed",
@@ -1538,13 +1694,17 @@
       // so this reports "we do not know" rather than asserting something false.
       msgType: timedOut ? "unknown" : conflicted ? "conflict" : "error",
       code: timedOut ? "timeout" : conflicted ? "conflict" : err.code ?? null,
+      changedBy: conflicted ? err.changedBy ?? null : null,
+      // A refusal that may be answering this tab's own timed-out write. Only the
+      // notice uses it, and only to word itself; nothing decides anything on it.
+      afterTimeout: conflicted && unknownAttempt !== null,
       etag: null
     };
   }
   function skippedResult(msg) {
     return { ok: false, msg, msgType: "skipped", code: null, etag: null };
   }
-  function buildSaveRequest(content, userDriven, signal) {
+  function buildSaveRequest(content, userDriven, signal, saveId, etag) {
     const token = saveToken();
     const path = token ? `${SAVE_PATH}/${token}` : SAVE_PATH;
     const options = {
@@ -1558,26 +1718,36 @@
         // Spec §9's name for the provenance bit. `X-Hyperclay-User-Driven` was the
         // pre-spec spelling; every host reads Save-Trigger first and falls back to
         // it, so stored documents running an older client keep working.
-        "Save-Trigger": userDriven ? "user" : "auto"
+        "Save-Trigger": userDriven ? "user" : "auto",
+        // Spec §6 (`receipts`): which attempt this is. Sent to every host, because a
+        // host that does not implement receipts ignores an unknown header, and
+        // gating it on discovery would mean holding the save until an async lookup
+        // resolved. Nothing is inferred from the header being accepted: only a host
+        // that ANSWERS with the id has said anything.
+        "Save-ID": saveId
       },
       body: content
     };
-    const etag = lastSeenEtag();
-    if (conditionalSaves() && etag) options.headers["If-Match"] = etag;
+    if (etag) options.headers["If-Match"] = etag;
     return { url: resolveSaveUrl(path), options };
   }
+  function stampToSend() {
+    const etag = lastSeenEtag();
+    return conditionalSaves() && etag ? etag : null;
+  }
   function resolveSaveUrl(path) {
     const origin = window.location.origin;
     if (!origin || origin === "null") return path;
     return new URL(path, origin).href;
   }
-  function sendSave(content) {
+  function sendOnce(content, saveId, etag) {
     const controller = new AbortController();
     const timeoutId = setTimeout(() => controller.abort(), SAVE_TIMEOUT_MS);
     const gestureDriven = consumeUserDriven();
     const explicitlyAsked = consumeExplicitSave();
     const userDriven = gestureDriven || explicitlyAsked;
-    const { url, options } = buildSaveRequest(content, userDriven, controller.signal);
+    const { url, options } = buildSaveRequest(content, userDriven, controller.signal, saveId, etag);
+    rememberSentId(saveId);
     return fetch(url, options).then((res) => res.text().then((text) => {
       let data = {};
       if (text) {
@@ -1591,19 +1761,68 @@
         const error = new Error(data.msg || data.error || `HTTP ${res.status}: ${res.statusText}`);
         error.code = data.code ?? null;
         error.status = res.status;
+        error.changedBy = data.changedBy ?? null;
+        error.etag = data.etag ?? null;
+        error.saveId = data.saveId ?? null;
         throw error;
       }
       recordEtag(data.etag ?? null);
+      unknownAttempt = null;
       return data;
     })).catch((err) => {
       console.error("Failed to save page:", err);
-      if (err.name === "AbortError") seedEtag({ fresh: true });
+      if (err.name === "AbortError") unknownAttempt = { saveId, etag };
       if (userDriven) markUserDriven();
       throw err;
     }).finally(() => {
       clearTimeout(timeoutId);
     });
   }
+  async function recoverUnknownSave() {
+    const attempt = unknownAttempt;
+    if (!attempt) return { landed: null, resend: false };
+    const meta = await hostMeta({ fresh: true });
+    const doc = meta.document;
+    const stored = typeof doc?.etag === "string" && doc.etag ? doc.etag : null;
+    if (!stored) return { landed: null, resend: false };
+    if (doc.saveId && doc.saveId === attempt.saveId) {
+      recordEtag(stored);
+      unknownAttempt = null;
+      return { landed: { msg: "Saved", msgType: "success", etag: stored }, resend: false };
+    }
+    if (doc.saveId) unknownAttempt = null;
+    return { landed: null, resend: !!attempt.etag, etag: attempt.etag };
+  }
+  async function sendSave(content) {
+    let saveId = mintSaveId();
+    let etag = stampToSend();
+    let reSent = false;
+    let duplicateResolved = false;
+    for (; ; ) {
+      try {
+        return await sendOnce(content, saveId, etag);
+      } catch (err) {
+        if (err.name === "AbortError") {
+          if (reSent) throw err;
+          const { landed, resend, etag: original } = await recoverUnknownSave();
+          if (landed) return landed;
+          if (!resend) throw err;
+          etag = original;
+          reSent = true;
+          continue;
+        }
+        if (err.status === 412 && !duplicateResolved && sentByThisTab(err.saveId)) {
+          recordEtag(err.etag ?? null);
+          unknownAttempt = null;
+          saveId = mintSaveId();
+          etag = stampToSend();
+          duplicateResolved = true;
+          continue;
+        }
+        throw err;
+      }
+    }
+  }
   function saveHtml(html, callback = () => {
   }) {
     return new Promise((resolve) => {
@@ -1651,17 +1870,21 @@
       });
     });
   }
-  var saveInProgress, SAVE_PATH, SAVE_TIMEOUT_MS;
+  var saveInProgress, SAVE_PATH, SAVE_TIMEOUT_MS, sentIds, SENT_ID_MEMORY, unknownAttempt;
   var init_save_core = __esm({
     "src/core/save-core.js"() {
       init_is_edit_mode();
       init_user_gesture();
       init_host_attrs();
       init_etag();
+      init_host_meta();
       init_snapshot();
       saveInProgress = false;
       SAVE_PATH = "/_/save";
       SAVE_TIMEOUT_MS = 12e3;
+      sentIds = [];
+      SENT_ID_MEMORY = 8;
+      unknownAttempt = null;
     }
   });
 
@@ -1954,7 +2177,7 @@
     getLastSavedDirty: () => getLastSavedDirty,
     getPageContents: () => getPageContents,
     getUnsavedChanges: () => getUnsavedChanges,
-    init: () => init2,
+    init: () => init3,
     initHyperclaySaveButton: () => initHyperclaySaveButton,
     initSaveKeyboardShortcut: () => initSaveKeyboardShortcut,
     isSaveConflicted: () => isSaveConflicted,
@@ -1969,14 +2192,14 @@
     setUnsavedChanges: () => setUnsavedChanges,
     suspendAutosave: () => suspendAutosave
   });
-  function setSaveState(state, msg = "", msgType = "") {
+  function setSaveState(state, msg = "", msgType = "", extra = null) {
     if (savingTimeout) {
       clearTimeout(savingTimeout);
       savingTimeout = null;
     }
     document.documentElement.setAttribute("savestatus", state);
     const event = new CustomEvent(`clay:save-${state}`, {
-      detail: { msg, msgType, timestamp: Date.now() }
+      detail: { msg, msgType, timestamp: Date.now(), ...extra || {} }
     });
     document.dispatchEvent(event);
   }
@@ -2029,7 +2252,10 @@
       releaseConflictHold();
     } else if (result2.msgType === "conflict") {
       holdForConflict();
-      setSaveState("conflict", result2.msg, result2.msgType);
+      setSaveState("conflict", result2.msg, result2.msgType, {
+        changedBy: result2.changedBy ?? null,
+        afterTimeout: result2.afterTimeout === true
+      });
     } else if (result2.msgType !== "skipped") {
       if (!navigator.onLine) {
         setSaveState("offline", result2.msg);
@@ -2040,6 +2266,7 @@
   }
   function drainPendingSave() {
     if (!pendingSave) return;
+    if (saveFateIsUnknown()) return;
     pendingSave = false;
     savePage();
   }
@@ -2272,7 +2499,7 @@
       }
     });
   }
-  function init2() {
+  function init3() {
     if (!isEditMode) return;
     seedEtag();
     initUserGesture();
@@ -2324,34 +2551,19 @@
       } else {
         initBaselineCapture();
       }
-      init2();
+      init3();
       save_default = savePage;
     }
   });
 
   // src/core/save-conflict-notice.js
   var save_conflict_notice_exports = {};
-  function style(el3, rules) {
-    for (const rule of rules) {
-      const at = rule.indexOf(":");
-      el3.style.setProperty(rule.slice(0, at).trim(), rule.slice(at + 1).trim(), "important");
-    }
-  }
-  function set(el3, prop, value) {
-    el3.style.setProperty(prop, value, "important");
-  }
-  function make(tag, rules, text) {
-    const el3 = document.createElement(tag);
-    style(el3, rules);
-    if (text) el3.textContent = text;
-    return el3;
-  }
   function button(label, rules) {
     const b = make("button", [
       "all:initial",
       "box-sizing:border-box",
       "cursor:pointer",
-      `font:${FONT}`,
+      `font:${FONT2}`,
       "font-weight:500",
       "border-radius:6px",
       "padding:6px 12px",
@@ -2367,14 +2579,14 @@
     b.addEventListener("blur", () => set(b, "outline", "none"));
     return b;
   }
-  function place() {
-    if (!root) return;
+  function place2() {
+    if (!root2) return;
     const vv = window.visualViewport;
     const lift = vv ? Math.max(0, window.innerHeight - vv.height - vv.offsetTop) : 0;
-    set(root, "bottom", `calc(${16 + lift}px + env(safe-area-inset-bottom,0px))`);
+    set(root2, "bottom", `calc(${16 + lift}px + env(safe-area-inset-bottom,0px))`);
   }
-  function build() {
-    root = make("div", [
+  function build2() {
+    root2 = make("div", [
       "position:fixed",
       "left:50%",
       "transform:translateX(-50%)",
@@ -2387,31 +2599,31 @@
       "justify-content:center",
       "padding:9px 12px",
       "border-radius:10px",
-      `background:${BG}`,
-      `color:${INK}`,
-      `border:1px solid ${EDGE}`,
+      `background:${BG2}`,
+      `color:${INK2}`,
+      `border:1px solid ${EDGE2}`,
       "box-shadow:0 6px 24px rgba(0,0,0,.32),0 1px 2px rgba(0,0,0,.24)",
-      `font:${FONT}`,
+      `font:${FONT2}`,
       "text-align:left"
     ]);
-    root.setAttribute("clay", "no-save no-watch no-snapshot");
-    root.setAttribute("data-clay-conflict", "");
-    root.setAttribute("role", "alert");
+    root2.setAttribute("clay", "no-save no-watch no-snapshot");
+    root2.setAttribute("data-clay-conflict", "");
+    root2.setAttribute("role", "alert");
     line = make("span", ["margin-right:2px"]);
-    drop = button("Load theirs", [`color:${INK}`, "opacity:.72", "padding:6px 8px"]);
-    keep = button("Keep mine", [`background:${INK}`, `color:${BG}`, "font-weight:600"]);
+    drop = button("Load theirs", [`color:${INK2}`, "opacity:.72", "padding:6px 8px"]);
+    keep = button("Keep mine", [`background:${INK2}`, `color:${BG2}`, "font-weight:600"]);
     drop.addEventListener("click", onDrop);
     keep.addEventListener("click", onKeep);
-    root.append(line, drop, keep);
+    root2.append(line, drop, keep);
     if (!still()) {
-      set(root, "transition", "opacity .18s");
-      set(root, "opacity", "0");
+      set(root2, "transition", "opacity .18s");
+      set(root2, "opacity", "0");
     }
-    document.body.appendChild(root);
-    place();
-    window.visualViewport?.addEventListener("resize", place);
-    window.visualViewport?.addEventListener("scroll", place);
-    requestAnimationFrame(() => set(root, "opacity", "1"));
+    document.body.appendChild(root2);
+    place2();
+    window.visualViewport?.addEventListener("resize", place2);
+    window.visualViewport?.addEventListener("scroll", place2);
+    requestAnimationFrame(() => set(root2, "opacity", "1"));
   }
   function onDrop() {
     if (armed) {
@@ -2432,7 +2644,7 @@
     armed = false;
     drop.textContent = "Load theirs";
     set(drop, "opacity", ".72");
-    set(drop, "color", INK);
+    set(drop, "color", INK2);
     set(drop, "box-shadow", "none");
   }
   async function onKeep() {
@@ -2461,44 +2673,49 @@
     }
   }
   function show(e) {
-    if (!root) build();
-    set(root, "display", "flex");
-    const where = SOURCES[e?.detail?.changedBy] || "elsewhere";
-    line.textContent = `This page was updated ${where}. Saving is paused.`;
+    if (!root2) build2();
+    set(root2, "display", "flex");
+    const named = SOURCES[e?.detail?.changedBy];
+    if (!named && e?.detail?.afterTimeout) {
+      line.textContent = "This page changed elsewhere, possibly by your own save that timed out. Your edits here are safe, and nothing will be overwritten until you choose.";
+    } else {
+      line.textContent = `This page changed ${named || "elsewhere"}. Your edits here are safe, and nothing will be overwritten until you choose.`;
+    }
     keep.textContent = "Keep mine";
     set(keep, "opacity", "1");
     busy = false;
     disarm();
-    place();
+    place2();
   }
   function hide() {
-    if (!root) return;
+    if (!root2) return;
     disarm();
-    set(root, "display", "none");
+    set(root2, "display", "none");
   }
-  function init3() {
+  function init4() {
     if (!isEditMode) return;
     document.addEventListener("clay:save-conflict", show);
     document.addEventListener("clay:save-saved", hide);
     document.addEventListener("keydown", onKeydown);
   }
-  var BG, INK, EDGE, WARN, FONT, SOURCES, ARM_MS, root, line, keep, drop, armTimer, armed, busy, still;
+  var BG2, INK2, EDGE2, WARN, FONT2, SOURCES, ARM_MS, root2, line, keep, drop, armTimer, armed, busy, still;
   var init_save_conflict_notice = __esm({
     "src/core/save-conflict-notice.js"() {
       init_is_edit_mode();
       init_dom_ready();
-      BG = "var(--clay-conflict-bg,#222)";
-      INK = "var(--clay-conflict-ink,#fff)";
-      EDGE = "var(--clay-conflict-edge,rgba(255,255,255,.28))";
+      init_hostile_css();
+      BG2 = "var(--clay-conflict-bg,#222)";
+      INK2 = "var(--clay-conflict-ink,#fff)";
+      EDGE2 = "var(--clay-conflict-edge,rgba(255,255,255,.28))";
       WARN = "var(--clay-conflict-warn,#e3a33f)";
-      FONT = "14px/1.45 system-ui,-apple-system,'Segoe UI',sans-serif";
+      FONT2 = "14px/1.45 system-ui,-apple-system,'Segoe UI',sans-serif";
       SOURCES = {
         "another-tab": "in another tab",
         "another-person": "by someone else",
         "an-agent": "by an agent"
       };
       ARM_MS = 5e3;
-      root = null;
+      root2 = null;
       line = null;
       keep = null;
       drop = null;
@@ -2506,7 +2723,7 @@
       armed = false;
       busy = false;
       still = () => !!window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
-      dom_ready_default(init3);
+      dom_ready_default(init4);
     }
   });
 
@@ -2595,7 +2812,7 @@
   var persist_exports = {};
   __export(persist_exports, {
     default: () => enablePersistentFormInputValues,
-    init: () => init4
+    init: () => init5
   });
   function enablePersistentFormInputValues(filterBySelector = PERSIST2) {
     const inputSelector = `input${filterBySelector}:not([type="password"]):not([type="hidden"]):not([type="file"])`;
@@ -2628,7 +2845,7 @@
       finalize(selectSelector);
     });
   }
-  function init4() {
+  function init5() {
     enablePersistentFormInputValues(PERSIST2);
   }
   var init_persist = __esm({
@@ -2636,7 +2853,7 @@
       init_snapshot();
       init_control_serialize_vendor();
       init_attr_aliases();
-      init4();
+      init5();
     }
   });
 
@@ -2656,15 +2873,15 @@
       enableContentEditable();
     });
   }
-  function enableContentEditable(root2 = document) {
-    root2.querySelectorAll(SELECTOR).forEach((el3) => {
+  function enableContentEditable(root3 = document) {
+    root3.querySelectorAll(SELECTOR).forEach((el3) => {
       let val = el3.getAttribute("inert-contenteditable");
       if (!["false", "plaintext-only"].includes(val)) val = "true";
       el3.setAttribute("contenteditable", val);
       el3.removeAttribute("inert-contenteditable");
     });
   }
-  function init5() {
+  function init6() {
     disableContentEditableBeforeSave();
     enableContentEditableForAdminOnPageLoad();
   }
@@ -2695,15 +2912,15 @@
       enableAdminInputs();
     });
   }
-  function enableAdminInputs(root2 = document) {
-    root2.querySelectorAll(SELECTOR_DISABLED).forEach((input) => {
+  function enableAdminInputs(root3 = document) {
+    root3.querySelectorAll(SELECTOR_DISABLED).forEach((input) => {
       input.removeAttribute("disabled");
     });
-    root2.querySelectorAll(SELECTOR_READONLY).forEach((input) => {
+    root3.querySelectorAll(SELECTOR_READONLY).forEach((input) => {
       input.removeAttribute("readonly");
     });
   }
-  function init6() {
+  function init7() {
     disableAdminInputsBeforeSave();
     enableAdminInputsOnPageLoad();
   }
@@ -2734,8 +2951,8 @@
       enableOnClick();
     });
   }
-  function enableOnClick(root2 = document) {
-    root2.querySelectorAll(SELECTOR2).forEach((el3) => {
+  function enableOnClick(root3 = document) {
+    root3.querySelectorAll(SELECTOR2).forEach((el3) => {
       const val = el3.getAttribute("inert-onclick");
       if (val) {
         el3.setAttribute("onclick", val);
@@ -2743,7 +2960,7 @@
       }
     });
   }
-  function init7() {
+  function init8() {
     disableOnClickBeforeSave();
     enableOnClickForAdminOnPageLoad();
   }
@@ -2780,14 +2997,14 @@
       enableAdminResources();
     });
   }
-  function enableAdminResources(root2 = document) {
-    const live = (root2.ownerDocument || root2) === document;
-    root2.querySelectorAll(SELECTOR_INERT).forEach((resource) => {
+  function enableAdminResources(root3 = document) {
+    const live = (root3.ownerDocument || root3) === document;
+    root3.querySelectorAll(SELECTOR_INERT).forEach((resource) => {
       makeActive(resource);
       if (live) resource.replaceWith(resource.cloneNode(true));
     });
   }
-  function init8() {
+  function init9() {
     disableAdminResourcesBeforeSave();
     enableAdminResourcesOnPageLoad();
   }
@@ -2807,15 +3024,15 @@
   var admin_attrs_exports = {};
   __export(admin_attrs_exports, {
     default: () => admin_attrs_default,
-    init: () => init9
+    init: () => init10
   });
-  function init9() {
+  function init10() {
     if (initialized) return;
     initialized = true;
-    init5();
     init6();
     init7();
     init8();
+    init9();
   }
   var initialized, admin_attrs_default;
   var init_admin_attrs = __esm({
@@ -2825,8 +3042,8 @@
       init_admin_onclick();
       init_admin_resources();
       initialized = false;
-      init9();
-      admin_attrs_default = init9;
+      init10();
+      admin_attrs_default = init10;
     }
   });
 
@@ -2855,7 +3072,7 @@
       inputSaveTimer = setTimeout(savePageThrottled, 1500);
     }, true);
   }
-  function init10() {
+  function init11() {
     if (!document.documentElement.matches(AUTOSAVE)) return;
     if (!isEditMode) return;
     initSavePageOnChange();
@@ -2873,8 +3090,8 @@
       AUTOSAVE_DEBOUNCE_MS = 1500;
       AUTOSAVE_MAX_WAIT_MS = 1e4;
       inputSaveTimer = null;
-      init10();
-      autosave_default = init10;
+      init11();
+      autosave_default = init11;
     }
   });
 
@@ -2927,7 +3144,7 @@
       }
     }
   }
-  function init11() {
+  function init12() {
     log("init, isEditMode:", isEditMode);
     if (!isEditMode) return;
     captureAll();
@@ -2952,7 +3169,7 @@
       originals = /* @__PURE__ */ new WeakMap();
       saveFreeze = { debug: false };
       pending = /* @__PURE__ */ new WeakMap();
-      init11();
+      init12();
       save_freeze_default = saveFreeze;
     }
   });
@@ -2975,14 +3192,14 @@
       }
     });
   }
-  function init12() {
+  function init13() {
     document.addEventListener("clay:save-saved", broadcast);
   }
   var onaftersave_default;
   var init_onaftersave = __esm({
     "src/attrs/onaftersave.js"() {
-      init12();
-      onaftersave_default = init12;
+      init13();
+      onaftersave_default = init13;
     }
   });
 
@@ -3023,7 +3240,7 @@
       mutation_default.resume();
     }
   }
-  function init13() {
+  function init14() {
     document.addEventListener("clay:save-saved", () => {
       document.querySelectorAll("[refetch-on-save]").forEach(swapElement);
     });
@@ -3033,8 +3250,8 @@
     "src/attrs/refetch-on-save.js"() {
       init_mutation();
       init_authored_url();
-      init13();
-      refetch_on_save_default = init13;
+      init14();
+      refetch_on_save_default = init14;
     }
   });
 
@@ -6975,7 +7192,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       node.style.opacity = "0";
     }, 2200);
   }
-  function init14() {
+  function init15() {
     if (!isEditMode) return;
     for (const state of Object.keys(LABELS)) {
       document.addEventListener("clay:save-" + state, () => show2(state));
@@ -6996,7 +7213,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       ALARMING = /* @__PURE__ */ new Set(["error", "offline"]);
       el = null;
       hideTimer = null;
-      dom_ready_default(init14);
+      dom_ready_default(init15);
     }
   });
 
@@ -8426,8 +8643,8 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
       fillCloneIds(liveKids[i], cloneKids[i], liveWeakMap, idOf);
     }
   }
-  function fillParsedIds(root2, identityMap, idOf) {
-    if (!root2 || !identityMap) return;
+  function fillParsedIds(root3, identityMap, idOf) {
+    if (!root3 || !identityMap) return;
     const visit = (el3, path) => {
       const id = identityMap[path];
       if (id) idOf.set(el3, id);
@@ -8436,7 +8653,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
         visit(kids[i], path === "" ? String(i) : `${path}.${i}`);
       }
     };
-    visit(root2, "");
+    visit(root3, "");
   }
   function protectPeerDoc({ newDoc, parsedWeakMap, baseHtml, baseIdentityMap, liveWeakMap }) {
     if (typeof baseHtml !== "string" || !baseHtml) {
@@ -8596,6 +8813,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
           this.resumeId = null;
           this.debounceMs = 150;
           this.debounceTimer = null;
+          this._savedSnapshot = null;
           this._sendInFlight = false;
           this._queuedSend = null;
           this._profile = null;
@@ -8611,6 +8829,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
           this._pendingHtml = null;
           this._pendingSeq = null;
           this._pendingIdentityMap = null;
+          this._pendingEtag = null;
           this._morphInFlight = false;
           this._rafHandle = null;
           this._pendingExternal = null;
@@ -8681,6 +8900,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
           }
           this.lastHtml = null;
           this._lastIdentityMap = null;
+          this._savedSnapshot = null;
           this._applyGen++;
           this.lastSeenSeq = 0;
           this._lastExternalSeq = 0;
@@ -8696,6 +8916,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
             this.listenForSnapshots();
             this._saveSavedHandler = () => {
               this._saveEpoch++;
+              this._relayCommit();
             };
             document.addEventListener("clay:save-saved", this._saveSavedHandler);
           }
@@ -8785,8 +9006,8 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
          * Paths use the same dot-segment scheme as _buildIdentityMap so the
          * receiver can look up IDs by the path the sender emitted.
          */
-        _walkParsedTree(root2, cb) {
-          if (!root2) return;
+        _walkParsedTree(root3, cb) {
+          if (!root3) return;
           const visit = (el3, path) => {
             cb(el3, path);
             const kids = el3.children;
@@ -8794,7 +9015,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
               visit(kids[i], path === "" ? String(i) : `${path}.${i}`);
             }
           };
-          visit(root2, "");
+          visit(root3, "");
         }
         /**
          * Fill liveWeakMap entries for live elements that the matcher's
@@ -8900,31 +9121,32 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
           }));
         }
         /**
-         * Take a stamp that arrived with no document (spec §6).
+         * Drop a stamp that arrived with no document (spec §6).
          *
-         * The host sends one whenever the file on disk changes, because an editing tab
-         * never receives the saved document itself: that lane is for viewers, and
-         * pushing a saved document onto an editor would replace work in progress.
+         * ⚠️ This used to TAKE it, and taking it was wrong. A stamp says "disk is at this
+         * version"; adopting it says "and I hold those bytes". Only the second claim
+         * makes the next save safe, and a frame with no content is no evidence for it.
          *
-         * Taking it is what makes live sync and the conflict check agree. An editor
-         * whose peer frames are merging is already looking at the other tab's content,
-         * so refusing its next save would be a conflict about nothing.
+         * The race is real and it loses work. A peer's save and that peer's snapshot
+         * relay are two concurrent requests, so a stamp travelling on its own can arrive
+         * first. This tab would record it while its DOM still held the older content,
+         * and its next save would then pass If-Match and overwrite the save it had never
+         * received. The hold flags cannot cover that: a lane holds when an incoming
+         * change could NOT be merged, not when one has yet to arrive.
          *
-         * But only while this tab is in step. A held lane means live sync saw an
-         * incoming change, could not merge it into an unsaved local edit, and kept this
-         * tab's version instead, so the DOM here is knowingly missing what disk holds.
-         * Taking the new stamp there would let this tab's next save replace that change
-         * with nobody seeing it. That is the one loss live sync cannot prevent on its
-         * own: a held tab "converges through its own next save", and that convergence
-         * IS the overwrite. Refusing the stamp turns it into a conflict somebody is
-         * told about.
+         * So a stamp now rides on the snapshot the saving tab relays after its save
+         * returns, and `_doApplyUpdate` records it only once that content has merged.
+         * Nothing sends a bare stamp any more — hyperclay's was deleted, and it had
+         * never reached anyone, because the relay library refuses a payload with no
+         * document in it. This stays as the rule rather than as compatibility: if some
+         * host does send one, dropping it is correct.
          *
          * @param {Object} data - The decoded frame
-         * @returns {boolean} True when this was a stamp frame and nothing should morph
+         * @returns {boolean} True when this was a stamp-only frame and nothing should morph
          */
         _applyEtagFrame(data) {
           if (typeof data.etag !== "string" || typeof data.html === "string") return false;
-          if (!this._heldLive && !this._heldExt) recordEtag(data.etag);
+          this._log("Dropping a stamp that arrived with no document: nothing proves this tab holds those bytes");
           return true;
         }
         /**
@@ -8983,9 +9205,15 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
               console.error("[LiveSync] Received invalid html, ignoring");
               return;
             }
+            const etag = typeof data.etag === "string" && data.etag ? data.etag : null;
+            if (etag && html === this.lastHtml) {
+              this._log(`Taking the stamp from a peer save of content already applied (seq=${seq})`);
+              recordEtag(etag);
+              return;
+            }
             this._log(`Received update from: ${sender} (my clientId: ${this.clientId}, seq=${seq})`);
-            this.applyUpdate(html, seq, identityMap);
-            if (this.onUpdate) this.onUpdate({ html, sender, seq, identityMap });
+            this.applyUpdate(html, seq, identityMap, etag);
+            if (this.onUpdate) this.onUpdate({ html, sender, seq, identityMap, etag });
           };
           this.sse.onerror = () => {
             if (this.sse.readyState === EventSource.CONNECTING) {
@@ -9012,6 +9240,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
             this._log("snapshot-ready received, preparing to send");
             const html = serializeForSync(clone);
             const identityMap = this._buildIdentityMap(document.documentElement, clone);
+            this._savedSnapshot = { html, identityMap };
             this.sendUpdate(html, identityMap);
           };
           document.addEventListener("clay:snapshot-ready", this._snapshotHandler);
@@ -9049,6 +9278,59 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
           this._queuedSend = null;
           this._postUpdate(queued.html, queued.identityMap);
         }
+        /**
+         * Tell the other editors what this tab's save stored, and under which stamp.
+         *
+         * Runs on clay:save-saved, by which point the save response has already been
+         * recorded, so `lastSeenEtag()` is the stamp for the bytes that just landed.
+         *
+         * The content is `lastHtml`, the snapshot this tab most recently relayed, which
+         * is the state the save was taken from: the save pipeline dispatches
+         * clay:snapshot-ready on its way to capturing what to send, so that relay has
+         * already gone out. Re-sending those same bytes is not redundant, because the
+         * stamp is the new information and a stamp may never travel without the content
+         * it describes. A receiver whose baseline already matches takes the stamp and
+         * skips the morph.
+         */
+        _relayCommit() {
+          const etag = lastSeenEtag();
+          if (!etag) return;
+          if (this.isDestroyed || this.isPaused) return;
+          const pending2 = this._savedSnapshot;
+          this._savedSnapshot = null;
+          if (!pending2 || typeof pending2.html !== "string") return;
+          this._postCommit(pending2.html, etag, pending2.identityMap);
+        }
+        /**
+         * Post a snapshot whose point is the stamp attached to it.
+         *
+         * Deliberately not `_postUpdate`: that one returns early when the html matches
+         * `lastHtml`, and the whole point here is that the stamp is the new information
+         * even when the bytes are not. It also does not touch `lastHtml` or the
+         * single-flight queue, because it must not displace a real snapshot waiting to
+         * go out. It carries the identityMap captured with these bytes, so a receiver
+         * that morphs on this frame pairs elements the same way it would on the
+         * ordinary relay of the same content.
+         */
+        _postCommit(html, etag, identityMap) {
+          const profile = this._profile;
+          if (!profile) return;
+          fetch(new URL(profile.relayPath, window.location.origin).href, {
+            method: "POST",
+            headers: {
+              "Content-Type": "application/json",
+              [profile.documentHeader]: window.location.href
+            },
+            body: JSON.stringify({
+              [profile.snapshotKey]: html,
+              sender: this.clientId,
+              identityMap,
+              etag
+            })
+          }).catch((err) => {
+            this._log("Commit relay failed: " + (err && err.message));
+          });
+        }
         _postUpdate(html, identityMap) {
           if (html === this.lastHtml) {
             this._log("Skipping send - HTML unchanged");
@@ -9105,7 +9387,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
           const info = data.data;
           if (info && info.kind === "external-change") {
             if (typeof info.html === "string") {
-              this._enqueueExternal(info.html, data.seq);
+              this._enqueueExternal(info.html, data.seq, info.etag);
             } else {
               this._fetchExternalChange(data.seq);
             }
@@ -9117,7 +9399,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
           }
           return false;
         }
-        _enqueueExternal(html, seq) {
+        _enqueueExternal(html, seq, etag) {
           if (typeof seq === "number") {
             if (seq <= this._lastExternalSeq) {
               this._log(`Dropping replayed external change: seq=${seq}`);
@@ -9125,7 +9407,12 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
             }
             this._lastExternalSeq = seq;
           }
-          this._pendingExternal = { html, seq, saveEpoch: this._saveEpoch };
+          this._pendingExternal = {
+            html,
+            seq,
+            saveEpoch: this._saveEpoch,
+            etag: typeof etag === "string" && etag ? etag : null
+          };
           this._scheduleNextFrame();
         }
         /**
@@ -9165,7 +9452,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
               }
               return;
             }
-            this._pendingExternal = { html, seq, saveEpoch: epoch };
+            this._pendingExternal = { html, seq, saveEpoch: epoch, etag: null };
             this._scheduleNextFrame();
           }).catch((err) => {
             this._log("External-change fetch failed", err);
@@ -9188,11 +9475,12 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
          * @param {number} [seq] - Optional monotonic seq from the server
          * @param {Object} [identityMap] - Optional element-identity map from sender
          */
-        applyUpdate(html, seq, identityMap) {
+        applyUpdate(html, seq, identityMap, etag) {
           if (this.isDestroyed) return;
           this._pendingHtml = html;
           this._pendingSeq = seq;
           this._pendingIdentityMap = identityMap;
+          this._pendingEtag = etag ?? null;
           this._scheduleNextFrame();
         }
         /**
@@ -9236,7 +9524,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
             } else {
               this._morphInFlight = true;
               try {
-                await this._doApplyExternal(ext.html, ext.seq);
+                await this._doApplyExternal(ext.html, ext.seq, ext.etag);
               } catch (err) {
                 console.error("[LiveSync] applyExternal failed:", err);
               } finally {
@@ -9247,13 +9535,15 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
             const html = this._pendingHtml;
             const seq = this._pendingSeq;
             const identityMap = this._pendingIdentityMap;
+            const etag = this._pendingEtag;
             this._pendingHtml = null;
             this._pendingSeq = null;
             this._pendingIdentityMap = null;
+            this._pendingEtag = null;
             if (html == null) return;
             this._morphInFlight = true;
             try {
-              await this._doApplyUpdate(html, seq, identityMap);
+              await this._doApplyUpdate(html, seq, identityMap, etag);
             } catch (err) {
               console.error("[LiveSync] applyUpdate failed:", err);
             } finally {
@@ -9285,7 +9575,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
          * @param {Object} [identityMap]
          * @returns {Promise<void>}
          */
-        async _doApplyUpdate(html, seq, identityMap) {
+        async _doApplyUpdate(html, seq, identityMap, etag) {
           this._log("applyUpdate - pausing mutations and morphing");
           this.isPaused = true;
           const scrollX = window.scrollX;
@@ -9364,6 +9654,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
             this.lastHtml = html;
             this._lastIdentityMap = identityMap && typeof identityMap === "object" && !Array.isArray(identityMap) ? identityMap : null;
             this._applyGen++;
+            if (typeof etag === "string" && etag) recordEtag(etag);
             if (this.lane === "live" && retainedRoots === 0 && !pageMaybeDirty()) {
               setLastSavedBaselines(...pairedBaseline());
             }
@@ -9396,7 +9687,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
          * holds or a later dirty peer apply misclassifies this frame's content as
          * local edits.
          */
-        async _doApplyExternal(html, seq) {
+        async _doApplyExternal(html, seq, etag = null) {
           this._log(`applyExternal - external disk change (seq=${seq})`);
           this.isPaused = true;
           const scrollX = window.scrollX;
@@ -9417,7 +9708,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
                 this._holdRetryExt = setTimeout(() => {
                   this._holdRetryExt = null;
                   if (this.isDestroyed || this._pendingExternal != null) return;
-                  this._pendingExternal = { html, seq, saveEpoch: epochAtHold };
+                  this._pendingExternal = { html, seq, saveEpoch: epochAtHold, etag };
                   this._scheduleNextFrame();
                 }, 3e3);
                 return;
@@ -9443,6 +9734,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
               callbacks: { beforeAttributeUpdated }
             });
             window.scrollTo(scrollX, scrollY);
+            if (typeof etag === "string" && etag) recordEtag(etag);
             if (this.lane === "live" && retainedRoots === 0 && !pageMaybeDirty()) {
               setLastSavedBaselines(...pairedBaseline());
               setUnsavedChanges(false);
@@ -9452,7 +9744,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
               this._applyGen++;
             }
             document.dispatchEvent(new CustomEvent("clay:sync-applied", {
-              detail: { seq, source: "disk" }
+              detail: { seq, source: "disk", etag: typeof etag === "string" && etag ? etag : null }
             }));
           } finally {
             this._log("applyExternal - morph complete, resuming mutations");
@@ -10374,7 +10666,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
   var sortable_exports = {};
   __export(sortable_exports, {
     default: () => sortable_default,
-    init: () => init15,
+    init: () => init16,
     ready: () => ready
   });
   function makeSortable(sortableElem, Sortable) {
@@ -10425,7 +10717,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     };
     Sortable.create(sortableElem, options);
   }
-  async function init15() {
+  async function init16() {
     if (!isEditMode) return;
     const mod = await Promise.resolve().then(() => (init_Sortable_vendor(), Sortable_vendor_exports));
     const Sortable = window.Sortable || mod.default;
@@ -10446,8 +10738,8 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     "src/plugins/sortable.js"() {
       init_is_edit_mode();
       init_mutation();
-      ready = init15();
-      sortable_default = init15;
+      ready = init16();
+      sortable_default = init16;
     }
   });
 
@@ -10870,7 +11162,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     default: () => undo_default,
     undo: () => undo
   });
-  function init16() {
+  function init17() {
     if (!isEditMode) return;
     if (typeof document === "undefined") return;
     if (document.readyState === "loading") {
@@ -10884,7 +11176,7 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
     "src/plugins/undo.js"() {
       init_hyper_undo_vendor();
       init_is_edit_mode();
-      init16();
+      init17();
       undo_default = undo;
     }
   });
@@ -17919,9 +18211,9 @@ body.hcms-open.hcms-overlay { overflow: hidden; }
         })();
         window.clay = window.clay || {};
         window.clay.extractData = hyperHtmlApiData.extractData;
-        window.clay.applyData = function(root2, data, source) {
-          if (root2 && typeof root2.nodeType === "number") return hyperHtmlApiData.applyData(root2, data, source);
-          return hyperHtmlApiData.applyData(document, root2, data);
+        window.clay.applyData = function(root3, data, source) {
+          if (root3 && typeof root3.nodeType === "number") return hyperHtmlApiData.applyData(root3, data, source);
+          return hyperHtmlApiData.applyData(document, root3, data);
         };
         window.clay.loaded = window.clay.loaded || {};
         window.clay.loaded.data = Promise.resolve();
@@ -19491,9 +19783,9 @@ ${t}` : `"use strict"; return (${t});`;
   // src/dom/nearest.js
   function nearest(startElem, selector, elementFoundReturnValue = (x) => x) {
     const visited = /* @__PURE__ */ new Set();
-    function checkDeep(root2) {
-      if (!root2 || visited.has(root2)) return null;
-      const queue = [root2];
+    function checkDeep(root3) {
+      if (!root3 || visited.has(root3)) return null;
+      const queue = [root3];
       const localVisited = /* @__PURE__ */ new Set();
       while (queue.length > 0) {
         const node = queue.shift();
@@ -19551,9 +19843,9 @@ ${t}` : `"use strict"; return (${t});`;
   var dom_helpers_exports = {};
   __export(dom_helpers_exports, {
     default: () => dom_helpers_default,
-    init: () => init17
+    init: () => init18
   });
-  function init17() {
+  function init18() {
     if (HTMLElement.prototype.hasOwnProperty("nearest")) {
       return;
     }
@@ -19701,8 +19993,8 @@ ${t}` : `"use strict"; return (${t});`;
     "src/dom/dom-helpers.js"() {
       init_nearest();
       init_pipe();
-      init17();
-      dom_helpers_default = init17;
+      init18();
+      dom_helpers_default = init18;
     }
   });
 
@@ -20617,7 +20909,7 @@ ${t}` : `"use strict"; return (${t});`;
           for (const id in triggerMap) validateModalPresence(id);
           return true;
         };
-        const init27 = (config) => {
+        const init28 = (config) => {
           const options = Object.assign({}, { openTrigger: "data-micromodal-trigger" }, config);
           const triggers = [...document.querySelectorAll(`[${options.openTrigger}]`)];
           const triggerMap = generateTriggerMap(triggers, options.openTrigger);
@@ -20642,7 +20934,7 @@ ${t}` : `"use strict"; return (${t});`;
           targetModal ? activeModal.closeModalById(targetModal) : activeModal.closeModal();
           activeModal = null;
         };
-        return { init: init27, show: show3, close };
+        return { init: init28, show: show3, close };
       })();
       modalCss = `<style class="micromodal-css">
 .micromodal {
@@ -20968,7 +21260,7 @@ ${t}` : `"use strict"; return (${t});`;
             onNo = [];
             onOpen = [];
             let settled = false;
-            const dismiss = () => {
+            const dismiss2 = () => {
               if (settled) return;
               settled = true;
               myOnNo.forEach((cb) => cb());
@@ -20980,7 +21272,7 @@ ${t}` : `"use strict"; return (${t});`;
               this.isShowing = false;
               document.body.style.overflow = "";
             }
-            this._dismiss = dismiss;
+            this._dismiss = dismiss2;
             document.body.insertAdjacentHTML("afterbegin", "<div clay='no-save no-snapshot' class='micromodal-parent'>" + modalCss + modalHtml + "</div>");
             const modalOverlayElem = document.querySelector(".micromodal__overlay");
             const modalContentElem = document.querySelector(".micromodal__content");
@@ -21047,7 +21339,7 @@ ${t}` : `"use strict"; return (${t});`;
               // we use our own
               // reset everything on close
               onClose: (modal) => {
-                dismiss();
+                dismiss2();
                 document.querySelector(".micromodal-parent")?.remove();
                 html = "";
                 yes = "";
@@ -21281,7 +21573,7 @@ ${t}` : `"use strict"; return (${t});`;
     modal_default.open();
     return promise;
   }
-  function init18() {
+  function init19() {
     dom_ready_default(() => {
       const micromodalParentElem = document.querySelector(".micromodal-parent");
       if (micromodalParentElem) {
@@ -21299,7 +21591,7 @@ ${t}` : `"use strict"; return (${t});`;
       init_copy_to_clipboard();
       CLOSE_BUTTON_SVG = `<svg viewBox="0 0 134 134" fill="none" xmlns="http://www.w3.org/2000/svg"><path class="micromodal__close-bg" d="M132 132.5 1 1.5h131v131Z" /><path class="micromodal__close-x" fill-rule="evenodd" clip-rule="evenodd" d="M0 0h3v1.5h1.5V3H6v1.5h1.5V6H9v1.5h1.5V9H12v1.5h1.5V12H15v1.5h1.5V15H18v1.5h1.5V18H21v1.5h1.5V21H24v1.5h1.5V24H27v1.5h1.5V27H30v1.5h1.5V30H33v1.5h1.5V33H36v1.5h1.5V36H39v1.5h1.5V39H42v1.5h1.5V42H45v1.5h1.5V45H48v1.5h1.5V48H51v1.5h1.5V51H54v1.5h1.5V54H57v1.5h1.5V57H60v1.5h1.5V60H63v1.5h1.5V63H66v1.5h1.5V66H69v1.5h1.5V69H72v1.5h1.5V72H75v1.5h1.5V75H78v1.5h1.5V78H81v1.5h1.5V81H84v1.5h1.5V84H87v1.5h1.5V87H90v1.5h1.5V90H93v1.5h1.5V93H96v1.5h1.5V96H99v1.5h1.5V99h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v1.5h1.5v3h-3V132H129v-1.5h-1.5V129H126v-1.5h-1.5V126H123v-1.5h-1.5V123H120v-1.5h-1.5V120H117v-1.5h-1.5V117H114v-1.5h-1.5V114H111v-1.5h-1.5V111H108v-1.5h-1.5V108H105v-1.5h-1.5V105H102v-1.5h-1.5V102H99v-1.5h-1.5V99H96v-1.5h-1.5V96H93v-1.5h-1.5V93H90v-1.5h-1.5V90H87v-1.5h-1.5V87H84v-1.5h-1.5V84H81v-1.5h-1.5V81H78v-1.5h-1.5V78H75v-1.5h-1.5V75H72v-1.5h-1.5V72H69v-1.5h-1.5V69H66v-1.5h-1.5V66H63v-1.5h-1.5V63H60v-1.5h-1.5V60H57v-1.5h-1.5V57H54v-1.5h-1.5V54H51v-1.5h-1.5V51H48v-1.5h-1.5V48H45v-1.5h-1.5V45H42v-1.5h-1.5V42H39v-1.5h-1.5V39H36v-1.5h-1.5V36H33v-1.5h-1.5V33H30v-1.5h-1.5V30H27v-1.5h-1.5V27H24v-1.5h-1.5V24H21v-1.5h-1.5V21H18v-1.5h-1.5V18H15v-1.5h-1.5V15H12v-1.5h-1.5V12H9v-1.5H7.5V9H6V7.5H4.5V6H3V4.5H1.5V3H0V0ZM108.8 22h5.2v5.1h-2.6v2.6H109v2.6h-2.6v2.6h-2.6v2.5h-2.6v5.2h2.6V45h2.6v2.6h2.6v2.6h2.5v2.6h2.6V58h-5.1v-2.6h-2.6V53h-2.6v-2.6h-2.6v-2.6h-2.5v-2.6h-5.2v2.6H91v2.6h-2.6v2.6h-2.6v2.5h-2.6V58H78v-5.1h2.6v-2.6H83v-2.6h2.6v-2.6h2.6v-2.5h2.6v-5.2h-2.6V35h-2.6v-2.6h-2.6v-2.6h-2.5v-2.6H78V22h5.2v2.6h2.5V27h2.6v2.6h2.6v2.6h2.5v2.6h5.2v-2.6h2.5v-2.6h2.6v-2.6h2.6v-2.5h2.5V22Z" /></svg>`;
       CONFIRM_BUTTON_SVG = `<div style="width: 28px;"><svg viewBox="0 0 60 33" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M34.5 0.75H43.5V5.25H49V9.75H54.5V14.25H60V18.75H54.5V23.25H49V27.75H43.5V32.25H34.5V27.75H40V23.25H45.5V18.75H0V14.25H45.5V9.75H40V5.25H34.5V0.75Z" fill="white"/></svg></div>`;
-      init18();
+      init19();
     }
   });
 
@@ -21406,7 +21698,7 @@ ${t}` : `"use strict"; return (${t});`;
   var options_exports = {};
   __export(options_exports, {
     default: () => options_default,
-    init: () => init19,
+    init: () => init20,
     parseOptionAttribute: () => parseOptionAttribute
   });
   function parseOptionAttribute(attrName, attrValue) {
@@ -21423,7 +21715,7 @@ ${t}` : `"use strict"; return (${t});`;
     const values = rawValue.split("|");
     return { name, rawValue, values, kind: match.kind, prefix: match.prefix, negated: match.kind === "show-not" };
   }
-  function init19() {
+  function init20() {
     optionVisibility.start();
   }
   var STYLE_NAME, OPTION_PREFIXES, optionVisibility, options_default;
@@ -21557,12 +21849,12 @@ ${t}` : `"use strict"; return (${t});`;
       };
       window.clay.optionVisibility = optionVisibility;
       options_default = optionVisibility;
-      init19();
+      init20();
     }
   });
 
   // src/events/onclickaway.js
-  function init20() {
+  function init21() {
     document.addEventListener("click", function(event) {
       const elementsWithOnClickAway = document.querySelectorAll("[onclickaway]");
       elementsWithOnClickAway.forEach((element) => {
@@ -21583,7 +21875,7 @@ ${t}` : `"use strict"; return (${t});`;
   });
 
   // src/events/onclickchildren.js
-  function init21() {
+  function init22() {
     document.addEventListener("click", function(event) {
       const parent = event.target.closest("[onclickchildren]");
       if (parent && event.target !== parent) {
@@ -21598,7 +21890,7 @@ ${t}` : `"use strict"; return (${t});`;
   });
 
   // src/events/onclone.js
-  function init22() {
+  function init23() {
     if (Node.prototype.__hyperclayOnclone) {
       return;
     }
@@ -21651,7 +21943,7 @@ ${t}` : `"use strict"; return (${t});`;
       console.error("Error in onmutation execution:", error);
     }
   }
-  function init23() {
+  function init24() {
     mutation_default.onAnyChange({ require: "observed" }, (changes2) => {
       const toFire = /* @__PURE__ */ new Set();
       for (const change of changes2) {
@@ -21671,7 +21963,7 @@ ${t}` : `"use strict"; return (${t});`;
   });
 
   // src/events/onpagemutation.js
-  function init24() {
+  function init25() {
     const executeGlobalMutation = async (element) => {
       try {
         const code = element.getAttribute("onglobalmutation") || element.getAttribute("onpagemutation");
@@ -21711,7 +22003,7 @@ ${t}` : `"use strict"; return (${t});`;
   });
 
   // src/events/onrender.js
-  function init25() {
+  function init26() {
     const executeRender = async (element) => {
       try {
         const code = element.getAttribute("onrender");
@@ -21744,15 +22036,15 @@ ${t}` : `"use strict"; return (${t});`;
   var events_exports = {};
   __export(events_exports, {
     default: () => events_default,
-    init: () => init26
+    init: () => init27
   });
-  function init26() {
-    init20();
+  function init27() {
     init21();
     init22();
     init23();
     init24();
     init25();
+    init26();
   }
   var events_default;
   var init_events = __esm({
@@ -21763,8 +22055,8 @@ ${t}` : `"use strict"; return (${t});`;
       init_onmutation();
       init_onpagemutation();
       init_onrender();
-      init26();
-      events_default = init26;
+      init27();
+      events_default = init27;
     }
   });
 
@@ -21773,10 +22065,14 @@ ${t}` : `"use strict"; return (${t});`;
     always: [
       "lib/mutation.js",
       // first: everything hangs off the hub; cms/sync need it in view mode too
-      "core/edit-mode.js"
+      "core/edit-mode.js",
       // both modes — matches today: 'edit-mode' is NOT in EDIT_MODE_ONLY
       // (hyperclay.js:251-273 lists 'edit-mode-helpers', not 'edit-mode');
       // toggleEditMode must exist in view mode, it's the way IN
+      // always, deliberately: it speaks only when the host is too old to save to, which
+      // is exactly the case where edit mode is off, so the editOnly wave would never
+      // reach it. It draws nothing on any other page.
+      "core/stale-host-notice.js"
     ],
     editOnly: [
       "core/snapshot.js",
@@ -21813,6 +22109,7 @@ ${t}` : `"use strict"; return (${t});`;
     "lib/region-policy.js": () => Promise.resolve().then(() => (init_region_policy(), region_policy_exports)),
     "lib/mutation.js": () => Promise.resolve().then(() => (init_mutation(), mutation_exports)),
     "core/edit-mode.js": () => Promise.resolve().then(() => (init_edit_mode(), edit_mode_exports)),
+    "core/stale-host-notice.js": () => Promise.resolve().then(() => (init_stale_host_notice(), stale_host_notice_exports)),
     "core/snapshot.js": () => Promise.resolve().then(() => (init_snapshot(), snapshot_exports)),
     "core/save-core.js": () => Promise.resolve().then(() => (init_save_core(), save_core_exports)),
     "core/save.js": () => Promise.resolve().then(() => (init_save(), save_exports)),