@panphora/clayjs 1.23.0 → 1.24.1

package/src/plugins/sortable.js

@@ -188,6 +188,13 @@ function makeSortable(sortableElem, Sortable, record = loose) {
   let options = {};
   options.draggable = draggableSelector(sortableElem);
 
+  // A reorder is not a text drag. SortableJS writes the item's text onto the drag by
+  // default, and a rich text field under the drop pastes it in, duplicating the text.
+  options.setData = (dataTransfer) => {
+    dataTransfer.clearData();
+    dataTransfer.setData('application/x-clay-sortable', '');
+  };
+
   // Check if Sortable instance already exists
   if (Sortable.get(sortableElem)) return;
 

package/src/plugins/upgrade.js

@@ -154,7 +154,8 @@ async function showVersion(status, version) {
   const clay = window.clay;
   await whenMenuReady(clay);
   if (!menuReady(clay) || !version) return;
-  const label = status === "current" ? `This doc is at latest version (${version})` : `Version ${version}`;
+  // Short enough for one line in a phone menu (David, Nov 11); the number stays in the plain line.
+  const label = status === "current" ? "File at latest version" : `Version ${version}`;
   clay.menu.addItem({ id: "upgrade", label, text: true });
 }
 

package/src/plugins/visitor-drafts/commit.js

@@ -0,0 +1,303 @@
+/**
+ * The one change a visitor draft's stored state ever takes.
+ *
+ * IndexedDB holds one record per draft key K, and only `transact()` changes it: one
+ * readwrite transaction reads what is stored, runs `commit()` over it, and writes the
+ * result. IndexedDB runs readwrite transactions on a store one after another across every
+ * tab of the origin, so this is the single writer, with no lock and no leader tab.
+ *
+ * What it applies:
+ *
+ *   - operations: for each top-level key a tab changed, the value before (`b`) and after
+ *     (`m`), a missing one meaning the key was absent. Each carries its own merge base, so
+ *     the store's `merge3` lays it over whatever is stored. A tab's operations are a
+ *     chain `{tab, reset, acked, ops: [{seq, savedAt, keys, unit?}]}`, where `reset` is
+ *     the Start over marker of the generation the tab shows (a tab knows that before its
+ *     first transaction; it does not know the number). An operation applies only when
+ *     its chain's `reset` is the stored one and its `seq` is the next for its tab, so
+ *     each applies exactly once and in order, whichever tab delivers it;
+ *   - Start over: "end generation g", given explicitly or as a marker `<g+1>~<random>`
+ *     in `localStorage`; an unverified marker starts empty and keeps recovery copies;
+ *   - the move: the full version 1 record in `localStorage`, taken in as the first record
+ *     when nothing is stored yet;
+ *   - another writer's record: a version 1 record in `localStorage` without the cache's
+ *     `w` field, written by a tab on a released ClayJS or by a page load of this one that
+ *     had no database. It is taken in once: merged when the copy it was built on is held
+ *     here, kept whole as a recovery copy when it is not. Nothing is merged on a guess.
+ *
+ * Stored rows (JSON text): K (the record, today's format), `K:meta`
+ * `{gen, rev, reset, ended?, tabs: {tab: {seq, at}}, foreign, unit, recovery?}`, `K:v1base` (the
+ * last record of another writer that was merged), `K:op:<tab>` (a chain a tab left at a
+ * hide), `K:conflict:<id>` with `K:conflict` naming the latest, and `K:recovery:<mark>`.
+ * `meta.unit` is the mark of the Block editor page the record holds (`unitMark`). A record
+ * id or ancestry identifies another writer's held base or the reset its copy follows.
+ * Operations of this ClayJS never read one. Recovery rows can also hold exact ended chains.
+ *
+ * This module imports nothing: the page fetches it with the database, after the boot, and
+ * the store that is already on the page hands it `merge3` and `unitMark`.
+ */
+
+export const LINEAGE = 32;
+// Recovery copies kept per draft, newest first.
+export const RECOVERY_KEEP = 8;
+// A tab not heard from in this long is forgotten; a chain it still sends carries `acked`.
+export const TAB_TTL_MS = 30 * 24 * 60 * 60 * 1000;
+
+const clone = (value) => (value === undefined ? undefined : JSON.parse(JSON.stringify(value)));
+const isPlain = (value) => value !== null && typeof value === "object" && !Array.isArray(value);
+
+export const metaKey = (key) => key + ":meta";
+export const rowKey = (key, tab) => `${key}:op:${tab}`;
+export const conflictKey = (key, id) => (id === undefined ? key + ":conflict" : `${key}:conflict:${id}`);
+export const recoveryKey = (key, mark) => `${key}:recovery:${mark}`;
+
+// A version 1 record without the cache's `w` field is another writer's.
+export const isForeign = (value) => isPlain(value) && value.v === 1 && value.w === undefined && isPlain(value.data);
+// What names one: its id, or its time for a record from before ids (ClayJS 1.22.0 and earlier).
+export const foreignMark = (record) => (typeof record.id === "string" ? record.id : "at:" + record.savedAt);
+
+export const markerFor = (gen, nonce) => `${gen}~${nonce}`;
+export function markerGen(marker) {
+  const match = /^(\d+)~/.exec(marker ?? "");
+  return match ? Number(match[1]) : null;
+}
+
+// One operation's keys laid over `data` with the store's three-way merge.
+export function applyKeys(data, keys, merge3) {
+  const base = { ...data };
+  const mine = { ...data };
+  for (const [name, pair] of Object.entries(keys)) {
+    if ("b" in pair) base[name] = pair.b; else delete base[name];
+    if ("m" in pair) mine[name] = pair.m; else delete mine[name];
+  }
+  return merge3(base, mine, data);
+}
+
+export const isChain = (value) => isPlain(value) && typeof value.tab === "string" && typeof value.reset === "string" && Array.isArray(value.ops);
+export const recoveryMark = (copy) => isChain(copy) ? `op:${copy.tab}:${copy.ops.at(-1)?.seq ?? copy.acked ?? 0}` : foreignMark(copy);
+
+// Cleanup needs proof for this exact chain, even when its generation has ended.
+export function settled(chain, meta) {
+  if (isPlain(chain) && meta.recovery?.includes(recoveryMark(chain))) return true;
+  if (!isChain(chain)) return false;
+  const at = Math.max(chain.acked ?? 0, chain.reset === meta.reset ? meta.tabs[chain.tab]?.seq ?? 0 : 0);
+  return chain.ops.every((op) => op.seq <= at);
+}
+
+export function emptyMeta(marker = null) {
+  return { gen: markerGen(marker) ?? 1, rev: 0, reset: marker ?? "", tabs: {}, foreign: null, unit: null };
+}
+
+const unitOf = (record) => (record && record.blockeditor ? { live: record.live, blockeditor: record.blockeditor } : null);
+
+// The ids a record built on `record` descends from, nearest first.
+function lineage(first, record, meta) {
+  const line = [...first, record?.id, ...(record?.ancestry ?? [])].filter((id) => typeof id === "string");
+  return line.length ? line.slice(0, LINEAGE) : ["root:" + meta.reset];
+}
+
+// The copy another writer's record was built on, when this side holds it and what it held
+// is in the stored record: the stored record itself, a cache copy of this generation, or
+// the last record of another writer that was merged. A record that descends from one of
+// them (its ancestry names it, or a storage event says it replaced that cache copy)
+// carries every change made since as its difference; the nearest one is the base.
+function foreignBase(line, { record, seen, direct, v1base, meta }) {
+  const cache = isPlain(seen) && seen.v === 1 && isPlain(seen.data) && seen.w?.reset === meta.reset ? seen : null;
+  const at = (held) => (held && typeof held.id === "string" ? line.indexOf(held.id) : -1);
+  const held = [[record, at(record)], [cache, cache && direct ? 0 : at(cache)], [v1base, at(v1base)]].filter(([, index]) => index >= 0);
+  return held.length ? held.reduce((nearest, next) => (next[1] < nearest[1] ? next : nearest))[0] : null;
+}
+
+/**
+ * @param {{meta: ?Object, record: ?Object, v1base: ?Object}} stored
+ * @param {Object} input
+ * @param {Object} input.seed - the data a generation starts from (the served page's)
+ * @param {() => string} input.newId
+ * @param {number} input.now - milliseconds
+ * @param {Function} input.merge3 - the store's three-way merge
+ * @param {Function} input.unitMark - the store's mark of a Block editor page
+ * @param {?string} [input.marker] - the Start over marker `localStorage` holds now
+ * @param {Array<{ends: number, marker: string}>} [input.resets]
+ * @param {Array<Object>} [input.chains] - oldest carriers first, the caller's own last
+ * @param {?Object} [input.local] - what `localStorage` holds at the draft's key now, parsed
+ * @param {?Object} [input.seen] - the latest cache copy the caller saw at the draft's key
+ * @param {boolean} [input.direct] - a storage event says `local` replaced exactly that copy
+ */
+export function commit(stored, { seed, newId, now, merge3, unitMark, marker = null, resets = [], chains = [], local = null, seen = null, direct = false }) {
+  const meta = stored.meta ? clone(stored.meta) : emptyMeta(marker);
+  // A database the browser cleared counts on from this ClayJS's cache, so the cache never
+  // reads as newer than the record.
+  if (!stored.meta && Number.isInteger(local?.w?.rev)) meta.rev = local.w.rev;
+  let record = stored.record ? clone(stored.record) : null;
+  let v1base = stored.v1base ? clone(stored.v1base) : null;
+  const out = { conflicts: [], recovered: [], released: [], dropped: [], stale: [], applied: {}, changed: !stored.meta };
+
+  function recover(copy, supersedes = []) {
+    const mark = recoveryMark(copy);
+    if (meta.recovery?.includes(mark)) return;
+    out.recovered.push(clone(copy));
+    const kept = [mark, ...(meta.recovery ?? []).filter((held) => held !== mark && !supersedes.includes(held))].slice(0, RECOVERY_KEEP);
+    out.dropped = [...new Set([...out.dropped, ...(meta.recovery ?? [])])].filter((held) => !kept.includes(held));
+    meta.recovery = kept;
+    out.changed = true;
+    return true;
+  }
+
+  const ends = [...resets];
+  if (marker && marker !== meta.reset) ends.push({ ends: markerGen(marker) === null ? null : markerGen(marker) - 1, marker });
+  for (const reset of ends) {
+    if (reset.marker === meta.reset || meta.ended?.includes(reset.marker) || (reset.ends !== null && reset.ends < meta.gen)) continue;
+    if (reset.ends !== meta.gen) {
+      if (record) recover(record);
+    }
+    const follows = typeof local?.reset === "string" ? local.reset === reset.marker
+      : reset.ends === null || (Array.isArray(local?.ancestry) && local.ancestry.includes("root:" + reset.marker));
+    if (isForeign(local) && foreignMark(local) !== meta.foreign && !follows) {
+      recover(local);
+      meta.foreign = foreignMark(local);
+    }
+    meta.ended = [...(meta.ended ?? []), meta.reset].slice(-LINEAGE);
+    Object.assign(meta, { gen: meta.gen + 1, reset: reset.marker, tabs: {}, unit: null });
+    meta.rev++;
+    record = null;
+    v1base = null;
+    out.changed = true;
+  }
+
+  // Nothing stored yet: the full copy in `localStorage` is the first record, whether a
+  // 1.23.0 tab wrote it (the move) or it is this ClayJS's cache, of this generation, of a
+  // database the browser has since cleared.
+  if (!stored.meta && !record && isPlain(local) && local.v === 1 && isPlain(local.data) && (local.w === undefined || local.w.reset === meta.reset)) {
+    const { w, ...copy } = local;
+    record = clone(copy);
+    if (w === undefined) {
+      v1base = clone(copy);
+      meta.foreign = foreignMark(local);
+      meta.rev++;
+    }
+  }
+  if (!stored.meta) meta.unit = unitMark(unitOf(record));
+
+  // Another writer's record met after the move, taken in once and before any chain.
+  if (stored.meta && isForeign(local) && foreignMark(local) !== meta.foreign) {
+    const mark = foreignMark(local);
+    const line = Array.isArray(local.ancestry) ? local.ancestry : [];
+    const base = record ? foreignBase(line, { record, seen, direct, v1base, meta }) : null;
+    if (typeof local.reset === "string" && meta.ended?.includes(local.reset)) {
+      if (recover(local, line)) out.released.push(clone(local));
+    } else if (!record) {
+      // Nothing is stored in this generation: its page is the draft, as it is between two
+      // tabs of that ClayJS.
+      record = clone(local);
+      v1base = clone(local);
+      meta.unit = unitMark(unitOf(record));
+      meta.rev++;
+    } else if (base) {
+      const merged = merge3(base.data, local.data, record.data);
+      // A page it carries counts as changed only when it differs from its base's.
+      const page = unitOf(local);
+      const paged = Boolean(page) && unitMark(page) !== unitMark(unitOf(base));
+      const pageMoved = paged && unitOf(record) && unitMark(unitOf(base)) !== meta.unit;
+      if (merged.conflict || pageMoved) out.conflicts.push(clone(record));
+      const unit = paged ? page : unitOf(record);
+      record = {
+        v: 1,
+        savedAt: local.savedAt ?? new Date(now).toISOString(),
+        id: newId(),
+        ancestry: lineage(typeof local.id === "string" ? [local.id] : [], record, meta),
+        data: merged.value,
+        ...(unit && { live: unit.live, blockeditor: unit.blockeditor }),
+      };
+      if (paged) meta.unit = unitMark(unit);
+      v1base = clone(local);
+      meta.rev++;
+    } else {
+      // The copy it was built on is not held here: it is kept whole, beside the draft. A
+      // later copy of the same line replaces the one it descends from.
+      if (recover(local, line)) out.released.push(clone(local));
+    }
+    meta.foreign = mark;
+    out.changed = true;
+  }
+
+  for (const chain of chains) {
+    if (!isChain(chain)) continue;
+    if (chain.reset !== meta.reset) {
+      const acked = chain.reset === stored.meta?.reset ? stored.meta.tabs[chain.tab]?.seq ?? 0 : 0;
+      if (chain.ops.some((op) => op.seq > Math.max(acked, chain.acked ?? 0))) {
+        recover(chain);
+      }
+      if (!out.stale.includes(chain.tab)) out.stale.push(chain.tab);
+      continue;
+    }
+    const before = meta.tabs[chain.tab]?.seq ?? 0;
+    let at = Math.max(before, Number.isInteger(chain.acked) ? chain.acked : 0);
+    for (const op of chain.ops) {
+      if (op.seq <= at) continue;
+      if (op.seq !== at + 1) break;
+      const merged = applyKeys(record ? record.data : seed, op.keys ?? {}, merge3);
+      const unitMoved = op.unit !== undefined && record && unitOf(record) && op.unit.seen !== meta.unit;
+      if (record && (merged.conflict || unitMoved)) out.conflicts.push(clone(record));
+      const unit = op.unit !== undefined ? op.unit.to : unitOf(record);
+      const id = newId();
+      record = {
+        v: 1,
+        savedAt: op.savedAt ?? new Date(now).toISOString(),
+        id,
+        ancestry: lineage([], record, meta),
+        data: merged.value,
+        ...(unit && { live: unit.live, blockeditor: unit.blockeditor }),
+      };
+      if (op.unit !== undefined) meta.unit = unitMark(unit);
+      meta.rev++;
+      at = op.seq;
+      out.changed = true;
+    }
+    if (at !== before || meta.tabs[chain.tab]) {
+      meta.tabs[chain.tab] = { seq: at, at: now };
+      out.changed = true;
+    }
+    out.applied[chain.tab] = at;
+  }
+
+  for (const [tab, entry] of Object.entries(meta.tabs)) {
+    if (now - (entry.at ?? 0) > TAB_TTL_MS) {
+      delete meta.tabs[tab];
+      out.changed = true;
+    }
+  }
+  return { meta, record, v1base, ...out };
+}
+
+const parse = (text) => {
+  if (text == null) return null;
+  try { return JSON.parse(text); } catch { return null; }
+};
+
+/**
+ * Run `commit()` in one readwrite transaction and write what it returns. `input` is a
+ * function, called inside the transaction once its reads are in, so what it reads from
+ * `localStorage` (journal slots, the marker, the cache) is read at that moment.
+ * Resolves on the transaction's `complete` event with `commit()`'s result.
+ */
+export function transact(drafts, key, input, options) {
+  return drafts.change(key, (raw) => {
+    const stored = { meta: parse(raw.meta), record: parse(raw.record), v1base: parse(raw.v1base) };
+    const rows = raw.rows.map(([name, text]) => [name, parse(text)]);
+    const given = input(stored);
+    const result = commit(stored, { ...given, chains: [...rows.map(([, chain]) => chain), ...(given.chains ?? [])] });
+    const puts = [];
+    const deletes = [];
+    if (result.changed) {
+      puts.push([metaKey(key), JSON.stringify(result.meta)]);
+      if (result.record) puts.push([key, JSON.stringify(result.record)]); else if (stored.record) deletes.push(key);
+      if (result.v1base) puts.push([key + ":v1base", JSON.stringify(result.v1base)]); else if (stored.v1base) deletes.push(key + ":v1base");
+    }
+    for (const copy of result.conflicts) puts.push([conflictKey(key, foreignMark(copy)), JSON.stringify(copy)]);
+    if (result.conflicts.length) puts.push([conflictKey(key), JSON.stringify(result.conflicts[result.conflicts.length - 1])]);
+    for (const copy of result.recovered) puts.push([recoveryKey(key, recoveryMark(copy)), JSON.stringify(copy)]);
+    for (const mark of result.dropped) deletes.push(recoveryKey(key, mark));
+    for (const [name, chain] of rows) if (settled(chain, result.meta)) deletes.push(name);
+    return { puts, deletes, result };
+  }, options);
+}

package/src/plugins/visitor-drafts/idb.js

@@ -0,0 +1,221 @@
+/**
+ * The IndexedDB half of the visitor draft store.
+ *
+ * One database per origin (`clay-visitor-drafts`), two stores:
+ *
+ *   records  key: the draft's text key (`clay:visitor-drafts:<slot>@<path>`) and its
+ *            siblings `<key>:<name>`; value: JSON text
+ *   parts    key: `[recordKey, regionKey, partId]`; value: `{ rev, text }`
+ *
+ * Every change to a draft goes through `change()`, one readwrite transaction that reads,
+ * merges (the caller's `build`) and writes; see `commit.js`. The only other write is
+ * `putRow()`, a tab's own chain left blind at a hide. A transaction resolves only once it
+ * completes. Every failure rejects with an Error whose `code` says what happened
+ * (`unavailable`, `blocked`, `quota`, `aborted`, `unknown-schema`, `closed`, `bad-op`,
+ * `error`).
+ */
+
+import { codeFor } from "../../lib/idb-error-code.js";
+
+export const DB_NAME = "clay-visitor-drafts";
+export const DB_VERSION = 1;
+export const RECORDS = "records";
+export const PARTS = "parts";
+const OPEN_TIMEOUT_MS = 2000;
+
+function failure(code, cause) {
+  const error = new Error(`visitor-drafts: the draft database failed (${code})`);
+  error.code = code;
+  if (cause !== undefined) error.cause = cause;
+  return error;
+}
+
+function cursorEntries(source, range) {
+  return new Promise((resolve, reject) => {
+    const out = [];
+    const req = source.openCursor(range);
+    req.onerror = () => reject(req.error);
+    req.onsuccess = () => {
+      const cursor = req.result;
+      if (!cursor) return resolve(out);
+      out.push([cursor.key, cursor.value]);
+      cursor.continue();
+    };
+  });
+}
+
+/**
+ * Open (and, the first time, create) the draft database.
+ *
+ * A database that does not open within `timeout` milliseconds (another tab holds an
+ * upgrade, or the browser never answers) rejects with `blocked`, so the caller can
+ * refuse to write over a draft it could not read rather than wait forever.
+ *
+ * @param {Object} [options]
+ * @param {?IDBFactory} [options.factory]
+ * @param {?typeof IDBKeyRange} [options.keyRange]
+ * @returns {Promise<{readAll: Function, readParts: Function, change: Function, putRow: Function, close: Function}>}
+ */
+export function openDrafts({ factory = globalThis.indexedDB, keyRange = globalThis.IDBKeyRange, name = DB_NAME, timeout = OPEN_TIMEOUT_MS } = {}) {
+  return new Promise((resolve, reject) => {
+    if (!factory || typeof factory.open !== "function" || !keyRange) return reject(failure("unavailable"));
+    let req;
+    try {
+      req = factory.open(name, DB_VERSION);
+    } catch (error) {
+      return reject(failure(codeFor(error), error));
+    }
+    let settled = false;
+    const finish = (fn, value) => {
+      if (settled) return false;
+      settled = true;
+      clearTimeout(timer);
+      fn(value);
+      return true;
+    };
+    const timer = setTimeout(() => finish(reject, failure("blocked")), timeout);
+    req.onupgradeneeded = () => {
+      const db = req.result;
+      if (!db.objectStoreNames.contains(RECORDS)) db.createObjectStore(RECORDS);
+      if (!db.objectStoreNames.contains(PARTS)) db.createObjectStore(PARTS);
+    };
+    req.onsuccess = () => {
+      const db = req.result;
+      // An open that answered after the timeout is closed again, or it would hold the
+      // database against another tab's upgrade for as long as this page stays open.
+      if (!finish(resolve, wrap(db, keyRange))) db.close();
+    };
+    req.onerror = () => finish(reject, failure(codeFor(req.error), req.error));
+    req.onblocked = () => finish(reject, failure("blocked"));
+  });
+}
+
+function wrap(db, keyRange) {
+  let closed = false;
+  // Another tab opening a newer version needs this connection to stand aside.
+  db.onversionchange = () => {
+    closed = true;
+    try { db.close(); } catch {}
+  };
+
+  function transaction(stores, mode) {
+    if (closed) throw failure("closed");
+    try {
+      return db.transaction(stores, mode);
+    } catch (error) {
+      throw failure(codeFor(error), error);
+    }
+  }
+
+  // The record named `recordKey` and its siblings (`<recordKey>:<anything>`), as a Map
+  // from key to stored text. A key that only starts with `recordKey`, such as another
+  // document whose path extends this one's, is not a sibling.
+  async function readAll(recordKey) {
+    const tx = transaction(RECORDS, "readonly");
+    const range = keyRange.bound(recordKey, recordKey + ":￿");
+    try {
+      const entries = await cursorEntries(tx.objectStore(RECORDS), range);
+      return new Map(entries.filter(([key]) => key === recordKey || key.startsWith(recordKey + ":")));
+    } catch (error) {
+      throw failure(codeFor(error), error);
+    }
+  }
+
+  // The parts of one region of one record, as a Map from part id to `{ rev, text }`.
+  // An array sorts after every string, so `[recordKey, regionKey, []]` bounds them all.
+  async function readParts(recordKey, regionKey) {
+    const tx = transaction(PARTS, "readonly");
+    const range = keyRange.bound([recordKey, regionKey], [recordKey, regionKey, []]);
+    try {
+      const entries = await cursorEntries(tx.objectStore(PARTS), range);
+      return new Map(entries.map(([key, value]) => [key[2], value]));
+    } catch (error) {
+      throw failure(codeFor(error), error);
+    }
+  }
+
+  // The one read-merge-write. Reads the record, `:meta`, `:v1base` and every `:op:` row of
+  // `key`, hands them to `build` inside the transaction, and writes the `puts` and
+  // `deletes` it returns before the transaction can complete. A `build` or a write that
+  // throws aborts it, so nothing lands. Resolves with `build`'s `result` on `complete`.
+  function change(key, build, { timeout = 0 } = {}) {
+    return new Promise((resolve, reject) => {
+      let tx;
+      try {
+        tx = transaction([RECORDS, PARTS], "readwrite");
+      } catch (error) {
+        return reject(error);
+      }
+      let thrown = null;
+      let result;
+      let settled = false;
+      let timer;
+      const finish = (fn, value) => {
+        if (settled) return;
+        settled = true;
+        clearTimeout(timer);
+        fn(value);
+      };
+      if (timeout > 0) timer = setTimeout(() => {
+        thrown = failure("blocked");
+        try { tx.abort(); } catch {}
+        finish(reject, thrown);
+      }, timeout);
+      tx.oncomplete = () => finish(resolve, result);
+      tx.onabort = () => finish(reject, thrown || failure(tx.error ? codeFor(tx.error) : "aborted", tx.error));
+      try {
+        const store = tx.objectStore(RECORDS);
+        const rows = keyRange.bound(key + ":op:", key + ":op:\uffff");
+        const reads = { record: store.get(key), meta: store.get(key + ":meta"), v1base: store.get(key + ":v1base"), names: store.getAllKeys(rows), values: store.getAll(rows) };
+        // Requests in one transaction answer in the order they were made: the last one in
+        // means every read is.
+        reads.values.onsuccess = () => {
+          if (settled) return;
+          try {
+            const raw = {
+              record: reads.record.result ?? null,
+              meta: reads.meta.result ?? null,
+              v1base: reads.v1base.result ?? null,
+              rows: reads.names.result.map((name, i) => [name, reads.values.result[i]]),
+            };
+            const planned = build(raw);
+            for (const [name, value] of planned.puts) store.put(value, name);
+            for (const name of planned.deletes) store.delete(name);
+            result = planned.result;
+          } catch (error) {
+            thrown = failure(codeFor(error), error);
+            try { tx.abort(); } catch {}
+          }
+        };
+      } catch (error) {
+        thrown = failure(codeFor(error), error);
+        try { tx.abort(); } catch {}
+      }
+    });
+  }
+
+  // A tab's own unconfirmed chain, written blind (no read) at a hide, with an explicit
+  // commit so it needs no callback in a page about to go away. `change()` applies it later.
+  function putRow(name, value) {
+    return new Promise((resolve, reject) => {
+      if (!/:op:[^:]+$/.test(name)) return reject(failure("bad-op"));
+      let tx;
+      try {
+        tx = transaction(RECORDS, "readwrite");
+        tx.objectStore(RECORDS).put(value, name);
+        tx.commit?.();
+      } catch (error) {
+        return reject(error instanceof Error && error.code ? error : failure(codeFor(error), error));
+      }
+      tx.oncomplete = () => resolve();
+      tx.onabort = () => reject(failure(tx.error ? codeFor(tx.error) : "aborted", tx.error));
+    });
+  }
+
+  function close() {
+    closed = true;
+    try { db.close(); } catch {}
+  }
+
+  return { readAll, readParts, change, putRow, close };
+}

package/src/plugins/visitor-drafts/intro-style.js

@@ -22,7 +22,7 @@ export const CLOSE_CSS = `:host { color: inherit !important; }
 .clay-intro__close svg { display: block; width: 12px; height: 12px; fill: currentColor; stroke: none; }
 @media (pointer: coarse) { .clay-intro__close { width: 44px; height: 44px; top: 4px; right: 4px; } }
 .clay-intro__close[data-manual] {
-  width: auto; height: 36px; padding: 0 14px;
+  width: auto; height: 36px; padding: 0 14px; opacity: 1;
   border-radius: 999px; font-size: 12px; font-weight: 500;
   text-transform: uppercase; letter-spacing: .04em; white-space: nowrap;
 }

package/src/plugins/visitor-drafts/intro.js

@@ -6,7 +6,6 @@ import { bootPhase } from "../../core/boot-phase.js";
 export const COPY = {
   close: "Hide this introduction",
   hide: "Hide intro",
-  show: "Show intro",
   label: (appName) => `About ${appName}`,
 };
 
@@ -86,7 +85,8 @@ export function mountIntro({ memory, template, appName, hadDraft }) {
   if (!template || !template.content.textContent.trim() && !template.content.querySelector("img, svg, video, canvas")) return null;
   if (template.getAttribute("visitor-intro") === "manual") {
     const printing = window.matchMedia && window.matchMedia("print").matches;
-    const open = forced() || !(memory.get().intro.done || hadDraft || bootPhase.servedHash || printing);
+    // A returning visitor keeps the intro until they hide it themselves; hiding it is remembered (David, Nov 11).
+    const open = forced() || !(memory.get().intro.done || bootPhase.servedHash || printing);
     return mountManual({ memory, template, appName, open });
   }
   if (!forced()) {
@@ -138,36 +138,19 @@ function mount({ memory, template, appName }) {
   return section;
 }
 
+// Hidden only by its own button, never by scrolling, and once hidden it stays hidden for this
+// visitor: there is no way back from a menu (David, Nov 11).
 function mountManual({ memory, template, appName, open }) {
-  let section = null;
-  const showRow = (wanted) => {
-    const menu = window.clay?.menu;
-    if (!menu) return;
-    if (wanted) menu.addItem({ id: "clay.intro", label: COPY.show, run: show });
-    else menu.removeItem("clay.intro");
-  };
-  function attach() {
-    section ??= buildSection({ template, appName, labelText: COPY.hide, onClose: hide });
-    document.body.prepend(section);
-    announceBottomUi();
-    showRow(false);
-  }
+  if (!open) return null;
+  const section = buildSection({ template, appName, labelText: COPY.hide, onClose: hide });
   function hide() {
     memory.get().intro.done = "closed";
     memory.save();
     section.remove();
     announceBottomUi();
-    showRow(true);
     focusApp();
   }
-  function show() {
-    memory.get().intro.done = null;
-    memory.save();
-    attach();
-    window.scrollTo(0, 0);
-  }
-  document.addEventListener("clay:menu-ready", () => showRow(!section?.isConnected));
-  if (open) attach();
-  else showRow(true);
+  document.body.prepend(section);
+  announceBottomUi();
   return section;
 }