@panphora/clayjs 1.15.1 → 1.16.0

package/src/live/local-lane.js

@@ -18,8 +18,9 @@
 // where in the log it starts, the moves after that go back on top, and the
 // merge itself is logged as a diff so a later file stamped before it keeps it.
 
+import { localChannel } from "./local-channel.js";
 import { applyOp, applyTracked, checkOp, cloneJson, undoTracked, validateOp, serializeLive, textHash, diffOps } from "./ops.js";
-import { HyperMorph } from "../vendor/hyper-morph.vendor.js";
+import { parseJsonRelaxed } from "../vendor/hyper-morph-json.vendor.js";
 import { movesSince } from "./moves.js";
 
 const VERSION = 4;
@@ -52,6 +53,16 @@ function applyAll(value, ops) {
 
 const encoder = new TextEncoder();
 
+// Floor 1 moves the durable lane to its own channel scope: a tab that cannot read
+// floor 1 never receives future-format updates, and its writes are refused by the
+// host floor. The message protocol inside the scope is unchanged.
+export const FORMAT_SCOPE = "page-format:1";
+
+export function localLaneKey(floor = 0, path = window.location.pathname) {
+  const base = "clay-live:" + path;
+  return floor >= 1 ? `${base}:${FORMAT_SCOPE}` : base;
+}
+
 export function localLaneSupported() {
   return typeof BroadcastChannel === "function" && typeof navigator !== "undefined" && typeof navigator.locks?.request === "function";
 }
@@ -66,10 +77,16 @@ function randomId() {
  * @param {() => Map<string, {value: any, ephemeral: boolean}>} options.seed -
  *   what this tab holds for each live tag, used for stores the room does not have yet
  * @param {string} [options.key]
+ * @param {object} [options.channel] - the document's channel, when a presence
+ *   service in this tab already owns one: the two share it rather than open a second
  */
-export function localTransport({ seed, key = "clay-live:" + window.location.pathname }) {
+// `key` is the room's channel without a floor suffix; `floor` scopes it.
+export function localTransport({ seed, key = "clay-live:" + window.location.pathname, channel: shared = null, floor = 0 }) {
   const clientId = randomId();
+  let scopeFloor = floor >= 1 ? 1 : 0;
+  let laneKey = scopeFloor ? `${key}:${FORMAT_SCOPE}` : key;
   let channel = null;
+  let unsubscribe = null;
   let handlers = null;
   let room = null;
   let stopped = false;
@@ -101,7 +118,7 @@ export function localTransport({ seed, key = "clay-live:" + window.location.path
   let mirror = { epoch: null, seq: 0, sequencer: null, closedBy: null, stale: false, seen: new Map(), stores: new Map() };
 
   function post(message) {
-    channel?.postMessage({ v: VERSION, ...message });
+    channel?.post(message);
   }
 
   // Over either cap the oldest entries go, and a file older than them can no
@@ -164,7 +181,7 @@ export function localTransport({ seed, key = "clay-live:" + window.location.path
   function alreadyMerged(m, frame) {
     if (!m?.file) return false;
     if (frame.seq != null && m.file.seq != null) return frame.seq <= m.file.seq;
-    return m.file.hash === textHash(serializeLive(HyperMorph.parseJsonRelaxed(frame.text)));
+    return m.file.hash === textHash(serializeLive(parseJsonRelaxed(frame.text)));
   }
 
   function dropMerged() {
@@ -319,7 +336,7 @@ export function localTransport({ seed, key = "clay-live:" + window.location.path
     if (lockRequested || stopped) return;
     lockRequested = true;
     navigator.locks
-      .request(key, async () => {
+      .request(laneKey, async () => {
         if (stopped) return undefined;
         const ordered = await closedFor(mirror.sequencer);
         if (stopped) return undefined;
@@ -393,7 +410,7 @@ export function localTransport({ seed, key = "clay-live:" + window.location.path
     if (!m || m.ephemeral) return null;
     let value;
     try {
-      value = cloneJson(HyperMorph.parseJsonRelaxed(text));
+      value = cloneJson(parseJsonRelaxed(text));
     } catch {
       return null;
     }
@@ -559,12 +576,45 @@ export function localTransport({ seed, key = "clay-live:" + window.location.path
     handlers.open({ clientId, lane: "live" });
   }
 
+  // The floor rose and an accepted receipt covers the pending work: close this
+  // scope's room (its closed state carries every store and the position the
+  // receipt covers), then join the new one. An interrupted switch leaves this tab
+  // where it was, on floor 0's scope, with every store and its pending work
+  // intact; the caller retries it from the receipt.
+  function switchScope(next, { covered = false } = {}) {
+    const want = next >= 1 ? 1 : 0;
+    const held = { floor: scopeFloor, scope: laneKey };
+    if (want <= scopeFloor) return { status: "already", ...held };
+    if (stopped || !channel) return { status: "refused", code: "lane-stopped", ...held };
+    if (shared) return { status: "refused", code: "shared-channel", ...held };
+    if (!covered) return { status: "refused", code: "uncovered", ...held };
+    closeRoom();
+    unsubscribe?.();
+    laneKey = want ? `${key}:${FORMAT_SCOPE}` : key;
+    scopeFloor = want;
+    channel = localChannel(laneKey);
+    unsubscribe = channel.subscribe("durable", (data) => onMessage({ data }));
+    mirror.sequencer = mirror.closedBy = null;
+    lockRequested = false;
+    requestLock();
+    handlers.close();
+    handlers.open({ clientId, lane: "live" });
+    return { status: "switched", floor: scopeFloor, scope: laneKey };
+  }
+
   return {
     clientId,
+    get scope() {
+      return laneKey;
+    },
+    get floor() {
+      return scopeFloor;
+    },
+    switchScope,
     start(next) {
       handlers = next;
-      channel = new BroadcastChannel(key);
-      channel.onmessage = onMessage;
+      channel = shared ?? localChannel(laneKey);
+      unsubscribe = channel.subscribe("durable", (data) => onMessage({ data }));
       window.addEventListener("pagehide", onPageHide);
       window.addEventListener("pageshow", onPageShow);
       requestLock();
@@ -576,7 +626,8 @@ export function localTransport({ seed, key = "clay-live:" + window.location.path
         window.removeEventListener("pagehide", onPageHide);
         window.removeEventListener("pageshow", onPageShow);
         for (const resolve of waiting.values()) resolve(null);
-        channel?.close();
+        unsubscribe?.();
+        unsubscribe = null;
         channel = null;
       };
     },

package/src/live/server-lane.js

@@ -1,8 +1,11 @@
 import { onStream } from "./stream-bridge.js";
+import { PAGE_FORMAT, PAGE_FORMAT_HEADER } from "../core/page-format.js";
 
 // The host side of clay.live's fast lane on a host that advertises `live-data`:
 // one POST per frame of ops, one GET for the room's whole state. Both name the
-// document with Document-URL, as the sync relay and presence do.
+// document with Document-URL, as the sync relay and presence do, and both declare
+// the page format this client writes: registration, operation and checkpoint are
+// page-writing paths, so each one carries the capability the floor decides on.
 
 const DATA_PATH = "/_/sync/data";
 
@@ -21,7 +24,7 @@ export async function relayData(clientId, frame) {
     const response = await fetch(url.href, {
       method: "POST",
       credentials: "same-origin",
-      headers: { "Content-Type": "application/json", "Document-URL": window.location.href },
+      headers: { "Content-Type": "application/json", "Document-URL": window.location.href, [PAGE_FORMAT_HEADER]: String(PAGE_FORMAT) },
       body: JSON.stringify(frame),
     });
     let body = null;
@@ -47,7 +50,7 @@ export async function fetchLiveState(clientId, since = null, { signal } = {}) {
     const response = await fetch(url.href, {
       credentials: "same-origin",
       cache: "no-store",
-      headers: { "Document-URL": window.location.href },
+      headers: { "Document-URL": window.location.href, [PAGE_FORMAT_HEADER]: String(PAGE_FORMAT) },
       signal,
     });
     if (!response.ok) {

package/src/loader-logic.js

@@ -1,9 +1,14 @@
 export const CORE_WAVES = {
   always: [
     "lib/mutation.js",     // first: everything hangs off the hub; cms/sync need it in view mode too
+    // Second: records what the served file wrote for the attributes edit mode rewrites,
+    // and the authored contents of [freeze] regions, while the page is still in view.
+    // Read-only, and the one thing a view to edit to view cycle has to hand back.
+    "core/preserve-authored.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
+    "core/mode-key.js",    // the way into edit for a document with no toggle of its own
     // 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.
@@ -11,13 +16,16 @@ export const CORE_WAVES = {
     "core/page-data.js",
   ],
   editOnly: [
-    "vendor/hyper-morph.vendor.js",
     "core/snapshot.js",
     // Before save.js: it takes the boot baseline as it evaluates, and a snapshot
     // transform registered after that made an untouched page read as unsaved.
     "core/persist.js", "core/admin-attrs.js",
     "core/save-core.js", "core/save.js",
     "core/conflict-notice.js",
+    // The recovery facade: a queue and a status, no storage of its own. It imports
+    // the IndexedDB store and the identity only when an adapter registers, which is
+    // why neither is in a plan's static graph.
+    "core/recovery.js",
     "core/unsaved-warning.js", "core/autosave.js",
     "attrs/save-freeze.js", "attrs/onaftersave.js", "attrs/refetch-on-save.js", "attrs/add-from.js",
     "lib/cache-bust.js",
@@ -32,8 +40,12 @@ export const PLUGIN_PATHS = {
   // tab still shows the game, and its writes stay in that tab.
   live:      { path: "plugins/live.js",           editOnly: false, default: false },
   page:      { path: "plugins/page.js",           editOnly: true,  default: false },
+  // The reader half of `page`, added by resolveModules for a Document in view mode
+  // and never named in a URL: the reader's article follows each saved file.
+  "page-view": { path: "plugins/page-view.js", editOnly: false, default: false, internal: true },
   sortable:  { path: "plugins/sortable.js",        editOnly: true,  default: false },
   undo:      { path: "plugins/undo.js",            editOnly: true,  default: false },
+  unsent:    { path: "plugins/unsent.js",          editOnly: true,  default: false },
   cms:       { path: "plugins/cms.js",             editOnly: false, default: false },
   quickcrop: { path: "plugins/quickcrop.js",       editOnly: false, default: false },
   // editOnly, because a file picker only ever appears in edit mode: the cms
@@ -42,6 +54,10 @@ export const PLUGIN_PATHS = {
   upload:    { path: "plugins/upload.js",          editOnly: true,  default: false },
   // Who is editing and who wrote what. Not editOnly: a reader still sees names.
   people:    { path: "plugins/people.js",          editOnly: false, default: false },
+  // An Edit switch and claygoo in the top right, for anyone who can edit. Not
+  // editOnly: an owner who opens a document in view needs the switch that gets
+  // them into edit, and the group draws nothing for a reader who cannot edit.
+  menu:      { path: "plugins/menu.js",            editOnly: false, default: false },
   wire:      { path: "plugins/wire.js",            editOnly: false, default: false },
   // A visitor's contact form to the document's owner. Not editOnly: visitors are
   // who send messages.
@@ -59,10 +75,19 @@ export const PLUGIN_PATHS = {
   // verify is sent as the ordinary full serialization, so the floor is the behaviour
   // it replaces. `exclude=source` turns it off.
   source:    { path: "plugins/source.js",          editOnly: true,  default: true },
-  "visitor-drafts": { path: "plugins/visitor-drafts.js", editOnly: false, default: false },
+  // Only draft mode loads the draft store and its UI. Everyone else, readers and the
+  // owner editing the original, gets the owner module: the chip when it applies and
+  // the inert `clay.visitorDrafts`, without the drafts UI's 24 KB.
+  "visitor-drafts": { path: "plugins/visitor-drafts.js", ownerPath: "plugins/visitor-drafts-owner.js", editOnly: false, default: false },
+  // An editor textarea outside the saved records, bound to one record's text
+  // element. Edit mode only: the page that asks for it is the page whose owner
+  // writes in it.
+  "bind-text": { path: "plugins/bind-text.js",       editOnly: true,  default: false },
   // The sapjs core. Loaded for any page with a [sap] root at boot (resolveModules'
   // hasSap), in view mode too: a reader's tab paints the same totals.
   derive:    { path: "plugins/derive.js",          editOnly: false, default: false },
+  // The update check a starter template copy gets from its own hyper-source meta.
+  upgrade:   { path: "plugins/upgrade.js",         editOnly: false, default: false },
 };
 
 // One literal import per module the loader can ask for, so a bundler can see the
@@ -80,12 +105,15 @@ export const MODULES = {
   "lib/region-policy.js":       () => import("./lib/region-policy.js"),
   "lib/mutation.js":            () => import("./lib/mutation.js"),
   "core/edit-mode.js":          () => import("./core/edit-mode.js"),
+  "core/mode-key.js":           () => import("./core/mode-key.js"),
   "core/stale-host-notice.js":  () => import("./core/stale-host-notice.js"),
   "core/page-data.js":          () => import("./core/page-data.js"),
+  "core/preserve-authored.js":  () => import("./core/preserve-authored.js"),
   "core/snapshot.js":           () => import("./core/snapshot.js"),
   "core/save-core.js":          () => import("./core/save-core.js"),
   "core/save.js":               () => import("./core/save.js"),
   "core/conflict-notice.js":     () => import("./core/conflict-notice.js"),
+  "core/recovery.js":           () => import("./core/recovery.js"),
   "core/unsaved-warning.js":    () => import("./core/unsaved-warning.js"),
   "core/persist.js":            () => import("./core/persist.js"),
   "core/admin-attrs.js":        () => import("./core/admin-attrs.js"),
@@ -95,30 +123,35 @@ export const MODULES = {
   "attrs/refetch-on-save.js":   () => import("./attrs/refetch-on-save.js"),
   "attrs/add-from.js":          () => import("./attrs/add-from.js"),
   "lib/cache-bust.js":          () => import("./lib/cache-bust.js"),
-  "vendor/hyper-morph.vendor.js": () => import("./vendor/hyper-morph.vendor.js"),
   "plugins/richclay.js":        () => import("./plugins/richclay.js"),
   "plugins/indicator.js":       () => import("./plugins/indicator.js"),
   "sync/live-sync.js":          () => import("./sync/live-sync.js"),
   "plugins/live.js":            () => import("./plugins/live.js"),
   "plugins/page.js":            () => import("./plugins/page.js"),
+  "plugins/page-view.js":       () => import("./plugins/page-view.js"),
   "plugins/sortable.js":        () => import("./plugins/sortable.js"),
   "plugins/undo.js":            () => import("./plugins/undo.js"),
+  "plugins/unsent.js":          () => import("./plugins/unsent.js"),
   "plugins/cms.js":             () => import("./plugins/cms.js"),
   "plugins/quickcrop.js":       () => import("./plugins/quickcrop.js"),
   "plugins/upload.js":          () => import("./plugins/upload.js"),
   "plugins/people.js":          () => import("./plugins/people.js"),
+  "plugins/menu.js":            () => import("./plugins/menu.js"),
   "plugins/wire.js":            () => import("./plugins/wire.js"),
   "plugins/message.js":         () => import("./plugins/message.js"),
   "plugins/ai-edit.js":         () => import("./plugins/ai-edit.js"),
   "plugins/demo.js":            () => import("./plugins/demo.js"),
   "plugins/visitor-drafts.js": () => import("./plugins/visitor-drafts.js"),
+  "plugins/visitor-drafts-owner.js": () => import("./plugins/visitor-drafts-owner.js"),
+  "plugins/bind-text.js":       () => import("./plugins/bind-text.js"),
   "plugins/source.js":          () => import("./plugins/source.js"),
   "plugins/derive.js":          () => import("./plugins/derive.js"),
+  "plugins/upgrade.js":         () => import("./plugins/upgrade.js"),
 };
 
 // `source` is last on purpose: its install captures a save clone, so it wants every
 // plugin that registers a document transform to have registered it first.
-const PLUGIN_ORDER = ["visitor-drafts", "richclay", "indicator", "sortable", "undo", "quickcrop", "upload", "people", "cms", "sync", "live", "page", "message", "wire", "ai-edit", "demo", "derive", "source"];
+const PLUGIN_ORDER = ["visitor-drafts", "richclay", "indicator", "sortable", "undo", "unsent", "quickcrop", "upload", "people", "menu", "upgrade", "cms", "page-view", "sync", "live", "page", "message", "wire", "ai-edit", "demo", "derive", "bind-text", "source"];
 
 // A plugin that cannot do its whole job alone. hypercms reads the cropper through
 // a capability lookup (`clay.quickcrop`) and silently uploads the raw file when it
@@ -147,13 +180,21 @@ const PLUGIN_ORDER = ["visitor-drafts", "richclay", "indicator", "sortable", "un
 // files answers `unsupported` and the editor offers to embed the file instead.
 const IMPLIES = { cms: ["quickcrop", "upload"], "ai-edit": ["wire"], page: ["live", "sync", "upload"] };
 
+// A Document's editor owns its article's rich text, so richclay (for [editable]) has
+// nothing to do there; plugins=page,richclay still loads it.
+const DISPLACES = { page: ["richclay"] };
+// No first paint or keystroke waits for these. source keeps the file's bytes outside
+// the edited parts stable; a save before it installs is the ordinary full serialization.
+// upgrade only asks the host for a newer version once `clay.ready` resolves.
+const LATE = new Set(["source", "sortable", "menu", "upgrade"]);
+
 function parseCsv(params, key, enabled, apply) {
   const raw = params.get(key);
   if (!raw) return;
   for (const token of raw.split(",")) {
     const name = token.trim();
     if (!name) continue;
-    if (!PLUGIN_PATHS[name]) {
+    if (!PLUGIN_PATHS[name] || PLUGIN_PATHS[name].internal) {
       console.warn(`clayjs: unknown plugin "${name}"`);
       continue;
     }
@@ -163,13 +204,17 @@ function parseCsv(params, key, enabled, apply) {
 
 // Each of these talks to the host or writes outside the visitor's own record, so a
 // page that keeps its edits in this browser cannot carry them.
-const DRAFT_DROPS = ["sync", "live", "page", "upload", "quickcrop", "cms", "people", "wire", "ai-edit", "demo", "source"];
+const DRAFT_DROPS = ["sync", "live", "page", "upload", "quickcrop", "cms", "people", "menu", "upgrade", "wire", "ai-edit", "demo", "source"];
 
 // [refetch-on-save] swaps its element for a fresh GET of the same URL after every
-// save, which on a visitor's own draft is a request to the host.
-const DRAFT_DROPS_CORE = ["attrs/refetch-on-save.js"];
+// save, which on a visitor's own draft is a request to the host. The conflict notice
+// answers a host's 412, which a save into this browser never returns.
+const DRAFT_DROPS_CORE = ["attrs/refetch-on-save.js", "core/conflict-notice.js"];
+
+// Only that host's copies auto-add the update check; another source names it.
+const TEMPLATE_SOURCE_PREFIX = "https://hyperclay.com/templates/";
 
-export function resolveModules(params, isEditMode, { isDraftMode = false, hasSap = false } = {}) {
+export function resolveModules(params, isEditMode, { isDraftMode = false, hasSap = false, canEdit = false, templateSource = null } = {}) {
   const core = [...CORE_WAVES.always];
   if (isEditMode) core.push(...CORE_WAVES.editOnly);
 
@@ -185,11 +230,16 @@ export function resolveModules(params, isEditMode, { isDraftMode = false, hasSap
   if (hasSap) enabled.add("derive");
   // ai-edit cannot run without the wire, so excluding the wire excludes it too.
   if (excluded.has("wire")) enabled.delete("ai-edit");
-  // A default-on plugin that this mode drops brings nothing with it. An explicitly
-  // asked for plugin still brings what it implies.
+  if (!isEditMode && !isDraftMode && enabled.has("page")) enabled.add("page-view");
+  // A plugin this mode does not load brings nothing with it, whether a default put
+  // it in the set or the tag named it. A page that wants what an edit-only plugin
+  // implies in view mode names that plugin too. `page` is the case that matters
+  // most: a reader loads its reader half and no generic sync, live data service or
+  // upload, so `plugins=page` in view mode resolves to page-view alone and the
+  // saved transport page-view owns is the only stream.
   for (const name of [...enabled]) {
     if (excluded.has(name)) continue;
-    if (!explicit.has(name) && PLUGIN_PATHS[name].editOnly && !isEditMode) continue;
+    if (PLUGIN_PATHS[name].editOnly && !isEditMode) continue;
     for (const implied of IMPLIES[name] || []) enabled.add(implied);
   }
   for (const name of excluded) enabled.delete(name);
@@ -202,13 +252,24 @@ export function resolveModules(params, isEditMode, { isDraftMode = false, hasSap
     enabled.add("visitor-drafts");
   }
 
+  // A copy of a starter template upgrades with no authored tag, so copies shipped
+  // between the metas and this plugin upgrade too.
+  if (!isDraftMode && canEdit && !excluded.has("upgrade") && templateSource &&
+      templateSource.startsWith(TEMPLATE_SOURCE_PREFIX)) {
+    enabled.add("upgrade");
+  }
+
+  for (const [owner, names] of Object.entries(DISPLACES)) {
+    if (enabled.has(owner)) for (const name of names) if (!explicit.has(name)) enabled.delete(name);
+  }
+
   const plugins = [];
+  const late = [];
   for (const name of PLUGIN_ORDER) {
     if (!enabled.has(name)) continue;
     const spec = PLUGIN_PATHS[name];
     if (spec.editOnly && !isEditMode) continue;
-    plugins.push(spec.path);
+    (LATE.has(name) ? late : plugins).push(spec.ownerPath && !isDraftMode ? spec.ownerPath : spec.path);
   }
-
-  return { core, plugins };
+  return { core, plugins, late };
 }