@heycys/gallery 0.0.0-stage → 0.1.0

package/browser/editor/page/selection/delete.mjs

@@ -0,0 +1,59 @@
+import { keptAnyway, partsOf, removalTarget, withLeads } from "../core.mjs";
+import { alive, ordered, otherTabs } from "../block-info.mjs";
+import { caretAt } from "../caret.mjs";
+import { t } from "../../../shared/i18n/index.mjs";
+
+// Deleting whole blocks (docs/editor.md, "Deleting blocks"): the selected ones with Delete or
+// Backspace, the block menu's 删除, or Ctrl+X. Selected blocks go together, or none does (one of
+// them is referred to, data-ge-keep, or they are a row's last tabs), with the reason. A container
+// they leave empty goes too (core.mjs removalTarget); when a Sheet tab's Sheet was shown, the next
+// tab is clicked (undo clicks it back). One undo step, which selects the blocks again. A box that
+// always holds a block gets an empty paragraph once they are gone (core.mjs tidyEmptied), the caret
+// in it. That one empty paragraph stays (keptAnyway: it would be put back as it is), so deleting
+// only it does nothing and says nothing.
+
+/**
+ * info: block-info.mjs. selection: selection/index.mjs. struct(parents, touched, mutate): the
+ * editor's undoable structural change (history.mjs). say: the status line. closeMenu(): the block
+ * menu closes. forget(): the handle forgets the block it stood beside.
+ */
+export function createDelete({ info, selection, struct, say, closeMenu, forget }) {
+  const { kindOf, nameOf, keepText } = info;
+
+  return function remove(targets = selection.picked) {
+    closeMenu();
+    const list = ordered([targets].flat().filter(alive)).filter((target) => !keptAnyway(target));
+    if (list.length === 0) return;
+    const refused = list.map((target) => [target, keepText(target, list)]).find(([, reason]) => reason);
+    if (refused) {
+      selection.select(list, { quiet: true });
+      say(list.length > 1 ? t("其中的{0}不能删除：{1}", nameOf(refused[0]), refused[1]) : refused[1], "note", 6000);
+      return;
+    }
+    selection.clear();
+    forget();
+    // What goes: each block, or its container once nothing else is left in it.
+    const gone = new Set(list.flatMap(withLeads));
+    const nodes = [...new Set(list.map((target) => removalTarget(target, gone)))];
+    const parts = nodes.flatMap(partsOf);
+    // The Sheet shown moves to a tab still there.
+    const tabs = nodes.filter((node) => kindOf(node) === "tab");
+    const shownTab = tabs.find((tab) => tab.getAttribute("aria-selected") === "true");
+    // The one right of it shows instead, or left of it when it was the last (Notion's).
+    const row = shownTab ? [...shownTab.parentElement.children] : [];
+    const at = row.indexOf(shownTab);
+    const neighbour = shownTab && [...row.slice(at + 1), ...row.slice(0, at).reverse()].find((tab) => otherTabs(shownTab).includes(tab) && !tabs.includes(tab));
+    // After the area started again with its tabs as they are now (components/sheets/pills.mjs, on the
+    // same change: its observer's turn comes first).
+    const settle = shownTab ? (backwards) => queueMicrotask(() => (backwards ? shownTab : neighbour)?.click()) : null;
+    const done = struct([...new Set(parts.map((part) => part.parentNode))], [], () => {
+      parts.forEach((part) => part.remove());
+      settle?.(false);
+      return { touched: [], focus: null, select: list, settle };
+    });
+    if (done?.caret) caretAt(done.caret, "start");
+    const emptied = nodes.some((node) => !list.includes(node));
+    const name = list.length === 1 ? nameOf(nodes[0]) : t("{0} 块", list.length);
+    say(t("已删除{0}{1}{2} · Ctrl+Z 撤销", name, emptied ? t("（外层已空，一并删除）") : "", tabs.length > 0 ? t("，连同其中的内容") : ""));
+  };
+}

package/browser/editor/page/selection/index.mjs

@@ -0,0 +1,157 @@
+import { unitElement, unitsOf, withLeads } from "../core.mjs";
+import { alive, ordered } from "../block-info.mjs";
+import { entersAfter } from "../beside.mjs";
+import { createFills } from "../fills.mjs";
+import { describe, note, report } from "../overlays.mjs";
+import { t } from "../../../shared/i18n/index.mjs";
+
+// Selected blocks (docs/editor.md, "Selecting blocks"): a set of blocks, none inside another, in
+// document order. A box selection drawn from empty space gives blocks of one container
+// (marquee.mjs), Shift can add others; Shift+↑/↓ widens or narrows a selection among the neighbours
+// of the block it started from. Each selected block is filled (fills.mjs: in the editor's own layer,
+// the page's, so a fill scrolls with its block natively, never inside the block, as the frame of what
+// is being edited is, frame.mjs); the fills hide while the blocks are dragged (drag/). Deleting
+// selected blocks is delete.mjs; what the keys do with a selection, blocks.mjs.
+//
+// A selection of text across blocks (text-select/) marks the blocks it takes whole (a code block, a
+// table, a file…): they are filled as selected ones are, without being selected (mark).
+//
+// The fills belong to their blocks (docs/editor.md, "Overlays"): one per selected block on the
+// page, made to match the selection the moment it changes (render), never on a later frame, so no
+// fill outlives its block's selection, and none is drawn while the block tools are off. The frames
+// only keep them where their blocks are (paint); a fill that cannot be drawn goes.
+
+/**
+ * info: block-info.mjs. active(): whether block tools may show. say(text, kind, hold): the status
+ * line. closeMenu(): the block menu closes. schedule(): the block tools' next frame (blocks.mjs),
+ * which keeps the fills where their blocks are.
+ */
+export function createSelection({ info, active, say, closeMenu, schedule }) {
+  const { nameOf } = info;
+  let picked = []; // the selected blocks, in document order, none inside another
+  let marked = []; // the blocks a text selection takes whole (text-select/): filled, not selected
+  let anchor = null; // the block Shift+↑/↓ widens the selection from
+  let hidden = false; // the fills hide while the blocks are dragged
+  const halos = createFills({ kind: "halo", className: "ge-halo", stands: (node) => (picked.includes(node) || marked.includes(node)) && active() });
+
+  /** Select a block, or several (none is clearing); `quiet`: without saying so. */
+  function select(targets, { quiet = false } = {}) {
+    closeMenu();
+    const next = ordered([targets].flat().filter(alive));
+    if (next.length === 0) return clear();
+    if (next.length !== picked.length || next.some((node, index) => node !== picked[index])) {
+      picked = next;
+      note("select", picked.map(describe).join(", "));
+    }
+    if (!picked.includes(anchor)) anchor = picked[0];
+    const focused = document.activeElement;
+    if (focused && focused !== document.body && focused.closest("main")) focused.blur();
+    getSelection()?.removeAllRanges();
+    if (!quiet) {
+      const [first] = picked;
+      say(picked.length > 1
+        ? t("已选中 {0} 块 · Delete 删除 · 拖动手柄一起移动 · Esc 取消", picked.length)
+        : t("已选中{0} · Delete 删除{1} · Esc 取消", nameOf(first), entersAfter(first) ? t(" · Enter 在下方新建文本") : t(" · Enter 编辑")));
+    }
+    render();
+    schedule();
+  }
+
+  function clear() {
+    if (picked.length > 0) note("clear", picked.map(describe).join(", "));
+    picked = [];
+    anchor = null;
+    render();
+    schedule();
+  }
+
+  // Blocks taken off the page (undo, a commit, the page's own script) leave the selection, and
+  // their fills go with them.
+  function prune() {
+    const gone = picked.filter((node) => !alive(node));
+    if (gone.length === 0) return;
+    note("prune", gone.map(describe).join(", "));
+    picked = picked.filter(alive);
+    if (!picked.includes(anchor)) anchor = picked[0] ?? null;
+    render();
+  }
+
+  // Shift+↑/↓: the selection widens (or narrows) by one block among the anchor's neighbours.
+  function extend(delta) {
+    const container = anchor?.parentElement;
+    const list = container ? unitsOf(container) : [];
+    const at = list.indexOf(anchor);
+    if (at < 0) return;
+    const inside = picked.map((node) => list.indexOf(node)).filter((index) => index >= 0);
+    const low = Math.min(...inside);
+    const high = Math.max(...inside);
+    const end = Math.max(0, Math.min(list.length - 1, (high > at ? high : low < at ? low : at) + delta));
+    select(list.slice(Math.min(at, end), Math.max(at, end) + 1), { quiet: true });
+    list[end].scrollIntoView({ block: "nearest", inline: "nearest" });
+  }
+
+  // The next or previous block in the same container.
+  function sibling(node, forward) {
+    for (let next = forward ? node.nextElementSibling : withLeads(node)[0].previousElementSibling; next; next = forward ? next.nextElementSibling : next.previousElementSibling) {
+      const unit = unitElement(next);
+      if (unit && unit.parentElement === node.parentElement && unit !== node) return unit;
+    }
+    return null;
+  }
+
+  // The fills made to match the selection now: those of blocks no longer selected (or no longer on
+  // the page) go at once; each selected block shown gets its fill where it is, reaching past it as
+  // reachOf says, never into a neighbour's (roomOf). One that cannot be drawn takes all the fills
+  // down (said once): better none than one in the wrong place.
+  function render() {
+    try {
+      halos.paint(hidden || !active() ? [] : [...picked, ...marked].filter(alive));
+    } catch (error) {
+      unpaint();
+      report("selection fills", error);
+    }
+  }
+
+  // Every fill taken down (the selection stays).
+  const unpaint = () => halos.clear();
+
+  // For the tests and DevTools: the selected blocks (the page carries no mark of the selection).
+  globalThis.__gallerySelected = () => [...picked];
+
+  return {
+    /** The selected blocks, in document order (the selection's own list: read it, never change it). */
+    get picked() { return picked; },
+    /**
+     * With several blocks selected, the one that is `target` or holds it (an item of a selected
+     * list: its handle's menu is the group's, as notion-lite's handle of a selected block), else null.
+     */
+    holderOf: (target) => (picked.length > 1 ? picked.find((node) => node === target || node.contains(target)) ?? null : null),
+    select,
+    clear,
+    /** Fill `targets` as selected ones without selecting them (a text selection's whole blocks; none: no more). */
+    mark(targets) {
+      const next = ordered([targets].flat().filter(alive));
+      if (next.length === marked.length && next.every((node, index) => node === marked[index])) return;
+      marked = next;
+      render();
+      schedule();
+    },
+    extend,
+    sibling,
+    prune,
+    /** A frame: the fills where their blocks are now; none while the blocks are dragged (`dragging`). */
+    paint(dragging) {
+      hidden = dragging;
+      render();
+    },
+    unpaint,
+    /** The editing stops: nothing selected, no fills. */
+    hide() {
+      marked = [];
+      clear();
+      unpaint();
+    },
+    /** The selection for the overlays' snapshot. */
+    state: () => ({ picked: picked.map(describe), offPage: picked.filter((node) => !node.isConnected).length, fills: halos.count, hidden }),
+  };
+}

package/browser/editor/page/selection/marquee.mjs

@@ -0,0 +1,174 @@
+import { Z } from "../../../shared/layers.mjs";
+import { blankTarget, measure, pick } from "../geometry.mjs";
+import { DIALOG } from "../../components/kit.mjs";
+import { edgeFollower } from "../edge-scroll.mjs";
+import { cancelOnEscape, endsGesture, gestureLock } from "../gesture.mjs";
+import { note, own } from "../overlays.mjs";
+import { addStyle, element, mount } from "../ui.mjs";
+
+// A press on empty space (geometry.mjs blankTarget: the page around the report, a box between its
+// blocks): moved more than a few pixels, it draws a box selection (docs/editor.md, "Selecting
+// blocks"); released where it was, it is a click on empty space. The rectangle's start stays on
+// the content while the page scrolls (the wheel, or the pointer near the window's top or bottom
+// edge); the blocks it takes are geometry.mjs pick()'s. With Shift held (at any moment), what it
+// takes is added to or taken out of what was selected when it started. While a detail card is open,
+// one is drawn in the card's content alone, its own top as for Ctrl+A (select-all/): the press on
+// its empty space, the blocks it takes of that content, the rectangle's start staying on the content
+// as the content scrolls. Only a mouse draws one, and not where the pointer is on an edge that resizes (resize/) or in a
+// gap that does (between two columns, or two nodes of a flowchart's row: columns/, which takes that
+// press; its listener comes after this one, so it cannot keep the press from here).
+// Anything that ends the press another way (the capture lost, the window losing the focus, the
+// page hidden, Esc) cancels it: what it took is let go. The rectangle belongs to the press
+// (overlays.mjs); scrolling near the edges is a task of the editor's frames (edge-scroll.mjs), and the
+// ways a press gives up are gesture.mjs's.
+
+const STYLE = `
+  .ge-marquee { position: fixed; left: 0; top: 0; z-index: ${Z.marquee}; box-sizing: border-box; border: 1px solid transparent; background: var(--ge-halo); pointer-events: none; }
+  ${gestureLock("data-ge-marquee", { cursor: "default", select: true })}
+`;
+
+const START = 4; // how far the pointer moves before the press draws a box selection
+
+/**
+ * active(): whether block tools may show. selection: { get() -> blocks, set(blocks, { quiet }),
+ * clear() }. click(x, y, target): a click on empty space.
+ */
+export function createMarquee({ active, selection, click }) {
+  addStyle(STYLE);
+  let held = null; // { x, y, pageX, pageY, start, shift, target, tree, drawn, pointer }
+  const shape = own(element("div", { class: "ge-marquee" }), "box selection", { alive: () => Boolean(held?.drawn) });
+  // Near the top or bottom edge of what it is drawn in (the window, or the card's content) that
+  // scrolls, and the rectangle follows (a frame; again on the next one while the rectangle is drawn).
+  const scrolling = edgeFollower("box selection", { pointer: () => (held?.drawn ? held : null), scroller: () => held.scroller, scrolled: () => update(), fail: () => cancel() });
+
+  // Where a press may draw one: the page, or, while a detail card is open, the content of the card
+  // the press is in (its own top, as Ctrl+A's: select-all/), never the page behind it. null: nowhere.
+  function topOf(target) {
+    if (!document.querySelector(DIALOG.open)) return document.querySelector("main");
+    const content = target.closest(DIALOG.open)?.querySelector(DIALOG.openContent);
+    return content?.contains(target) ? content : null;
+  }
+
+  // What scrolls under the rectangle: a card's content scrolls by itself, the page with the window.
+  const scrolled = () => (held.scroller ? { x: held.scroller.scrollLeft, y: held.scroller.scrollTop } : { x: scrollX, y: scrollY });
+
+  /** A press on the page: takes it (true) when it is on empty space. */
+  function begin(event) {
+    if (held || event.button !== 0 || event.pointerType !== "mouse" || !active() || !blankTarget(event.target)) return false;
+    if (document.documentElement.hasAttribute("data-ge-resize") || document.documentElement.hasAttribute("data-ge-gap")) return false;
+    const root = topOf(event.target);
+    if (!root) return false;
+    // Not cancelled: the page still takes the focus, as a click on empty space always gave it (in a
+    // workbench, its keys then reach the page); text selection is off while the press lasts.
+    document.documentElement.setAttribute("data-ge-marquee", "");
+    const focused = document.activeElement;
+    if (focused?.isContentEditable && focused.closest("main")) focused.blur();
+    getSelection()?.removeAllRanges();
+    held = {
+      x: event.clientX, y: event.clientY, root, scroller: root.localName === "main" ? null : root, card: root.closest("dialog"),
+      start: selection.get(), shift: event.shiftKey, target: event.target, tree: null, drawn: false, pointer: event.pointerId,
+    };
+    // Its start, on the content: where it is as what scrolls under it moves (the tree's frame: from()).
+    const at = scrolled();
+    held.startX = event.clientX + at.x;
+    held.startY = event.clientY + at.y;
+    note("box selection", "press");
+    try {
+      document.documentElement.setPointerCapture(event.pointerId);
+    } catch {}
+    return true;
+  }
+
+  function draw() {
+    held.drawn = true;
+    held.tree = measure(held.root); // page coordinates, as what scrolls under it was then (held.at)
+    held.at = scrolled();
+    held.page = { x: scrollX, y: scrollY };
+    if (!held.shift) selection.clear();
+    // In the card's own top layer, over its content (the card on top when one was opened from another).
+    if (held.card) {
+      shape.dataset.docDev = "";
+      held.card.append(shape);
+    } else mount(shape);
+    scrolling.wake();
+  }
+
+  // The rectangle from where the press started (on the content) to the pointer, and what it takes:
+  // the window's rectangle in the tree's frame, moved by what has scrolled since it was measured.
+  function update() {
+    const now = scrolled();
+    const startX = held.startX - now.x;
+    const startY = held.startY - now.y;
+    const left = Math.min(startX, held.x);
+    const top = Math.min(startY, held.y);
+    const width = Math.abs(held.x - startX);
+    const height = Math.abs(held.y - startY);
+    Object.assign(shape.style, { transform: `translate(${Math.round(left)}px, ${Math.round(top)}px)`, width: `${Math.round(width)}px`, height: `${Math.round(height)}px` });
+    const dx = now.x - held.at.x + held.page.x;
+    const dy = now.y - held.at.y + held.page.y;
+    let taken = pick(held.tree, { left: left + dx, top: top + dy, right: left + width + dx, bottom: top + height + dy });
+    if (held.shift) taken = [...held.start.filter((node) => !taken.includes(node)), ...taken.filter((node) => !held.start.includes(node))];
+    selection.set(taken, { quiet: true });
+  }
+
+  function stop() {
+    if (!held) return;
+    const { pointer } = held;
+    held = null;
+    shape.remove();
+    document.documentElement.removeAttribute("data-ge-marquee");
+    try {
+      document.documentElement.releasePointerCapture(pointer);
+    } catch {}
+  }
+
+  /** Give up the press (Esc, the window losing focus): a box selection being drawn takes nothing. */
+  function cancel() {
+    if (!held) return;
+    note("box selection", "cancelled");
+    if (held.drawn) selection.clear();
+    stop();
+  }
+
+  addEventListener("pointermove", (event) => {
+    if (!held || event.pointerId !== held.pointer) return;
+    held.x = event.clientX;
+    held.y = event.clientY;
+    held.shift = event.shiftKey;
+    const at = scrolled();
+    if (!held.drawn && Math.hypot(event.clientX + at.x - held.startX, event.clientY + at.y - held.startY) > START) draw();
+    if (held.drawn) update();
+  }, true);
+  addEventListener("pointerup", (event) => {
+    if (!held || event.pointerId !== held.pointer) return;
+    const { drawn, target } = held;
+    stop();
+    if (!drawn) {
+      selection.clear();
+      click(event.clientX, event.clientY, target);
+      return;
+    }
+    const taken = selection.get();
+    if (taken.length > 0) selection.set(taken); // says what was taken
+  }, true);
+  // After pointerup the press is over already (stop() let the capture go); it ends any other way too.
+  endsGesture({ active: () => Boolean(held), cancel, owns: (event) => event.pointerId === held.pointer });
+  cancelOnEscape({ active: () => Boolean(held), cancel });
+  addEventListener("scroll", () => { if (held?.drawn) update(); }, { passive: true, capture: true });
+  const shiftKey = (event) => {
+    if (!held?.drawn || event.key !== "Shift") return;
+    held.shift = event.type === "keydown";
+    update();
+  };
+  addEventListener("keyup", shiftKey, true);
+  addEventListener("keydown", shiftKey, true);
+
+  return {
+    begin,
+    cancel,
+    /** A box selection is being drawn (the handle steps aside). */
+    get drawing() { return Boolean(held?.drawn); },
+    /** The editor's UI nodes to keep in the top layer when a modal dialog opens. */
+    get nodes() { return shape.isConnected ? [shape] : []; },
+  };
+}

package/browser/editor/page/session.mjs

@@ -0,0 +1,117 @@
+import { OLD_PROTOCOL, PROTOCOL, PROTOCOLS, VERSION, keyCombo } from "../../shared/session.mjs";
+
+// The report page inside a workbench (an iframe of the same origin): it answers a few commands and
+// tells the workbench its state, never the report's content. Nothing happens when the page is not
+// embedded. The protocol is src/shared/session.mjs; how a workbench uses it, docs/workbench.md.
+//
+// A message counts only from the parent window, of this origin and protocol. A command names the
+// report it is meant for: one for another report (the iframe went to another page meanwhile) is
+// refused. Every command gets exactly one reply, once it is done. Besides the editor's commands the
+// session itself answers four: `theme` (show the report light or dark, or as the reader chose, without
+// storing it), `keys` (key combinations to hand to the workbench when the page does not use them),
+// `scroll-top` (back to the top when scrolled down) and `close-card` (the detail card on top closes as a
+// press on its backdrop closes it: the workbench asks on a press on its own bars, or Esc there, while
+// the page says a card is open, `card` in what it sends).
+
+/** A page opened in a frame on its own (?solo), not as the workbench's report: no session, its own notices. */
+export const SOLO = new URLSearchParams(location.search).has("solo");
+
+/**
+ * slug: the report's; snapshot(): { title, state } (state: STATE_FLAGS of src/shared/session.mjs);
+ * commands: name -> async (message) => result ({ ok, … }); modals: what stands open over the page
+ * (`modalOps`, page-objects.mjs: open(), listen(listener), closeTop()).
+ * Returns { update() (call it when the state may have changed), notice({ text, tone, hold, room }) (the
+ * workbench shows it: a toast, `room` px above the frame's bottom, what the page's bottom panels take;
+ * text "" takes it away), noticeRoom(room) (that room changed: the workbench's toasts stand above it),
+ * reload() (the workbench shows the report
+ * again in a new page, swapped in once drawn), annotationsRemoved(items) (批注 deleted in the page:
+ * the workbench says so and offers them back), open({ target, block } or { hash }) (the workbench
+ * goes to another document), jump({ block, place }) (a link goes to a block of this page: the
+ * workbench adds a history entry, `place` where the reader was, for the way back: `show-place`),
+ * workspace() (a page was made under this one: the sidebar reads the list
+ * again and opens this page's row) }, or null when not embedded, or opened on its own in a frame of the
+ * workbench (?solo: the 写作偏好 dialog's page, which talks to no session).
+ */
+export function connectWorkbench({ slug, snapshot, commands, modals }) {
+  if (window.parent === window || SOLO) return null;
+  // The id the workbench speaks (src/shared/session.mjs, OLD_PROTOCOL): null until its first command,
+  // and meanwhile every message goes under both, so that a workbench of either version hears it.
+  let spoken = null;
+  const send = (type, fields, protocols = spoken ? [spoken] : [PROTOCOL, OLD_PROTOCOL]) => {
+    for (const protocol of protocols) window.parent.postMessage({ protocol, v: VERSION, type, slug, ...fields }, location.origin);
+  };
+  let last = null;
+  const update = () => {
+    const now = { ...snapshot(), card: modals.open().length > 0 };
+    const key = JSON.stringify(now);
+    if (key === last) return;
+    last = key;
+    send("state", now);
+  };
+  modals.listen(update);
+
+  // A key combination the workbench asked for goes to it when nothing on the page took it (the
+  // editor's own keys, Ctrl+K for a link among them, are handled and prevented before this).
+  let keys = new Set();
+  addEventListener("keydown", (event) => {
+    if (event.defaultPrevented || event.isComposing || keys.size === 0) return;
+    const key = keyCombo(event);
+    if (!keys.has(key)) return;
+    event.preventDefault();
+    send("key", { key });
+  });
+  const own = {
+    async theme({ theme = null }) {
+      if (theme !== null && theme !== "light" && theme !== "dark") return { ok: false, reason: "theme" };
+      dispatchEvent(new CustomEvent("doc-theme-request", { detail: { theme } })); // the kit's ui.js
+      return { ok: true };
+    },
+    async keys({ keys: list }) {
+      if (!Array.isArray(list) || !list.every((key) => typeof key === "string")) return { ok: false, reason: "keys" };
+      keys = new Set(list);
+      return { ok: true };
+    },
+    // Scrolled down (10px or more, as Notion's breadcrumb asks), the page glides back to its top.
+    async "scroll-top"() {
+      if (Math.abs(scrollY) < 10) return { ok: true, scrolled: false };
+      scrollTo({ top: 0, behavior: "smooth" });
+      return { ok: true, scrolled: true };
+    },
+    // A press on the workbench's own bars, or Esc there, while a detail card is open.
+    async "close-card"() {
+      return { ok: true, closed: modals.closeTop() };
+    },
+  };
+  const all = { ...commands, ...own };
+
+  addEventListener("message", async (event) => {
+    const message = event.data;
+    if (event.source !== window.parent || event.origin !== location.origin) return;
+    if (!PROTOCOLS.includes(message?.protocol) || message.v !== VERSION || message.type !== "command") return;
+    spoken = message.protocol;
+    const run = Object.hasOwn(all, message.name) ? all[message.name] : null;
+    let result;
+    try {
+      result = message.slug !== slug ? { ok: false, reason: "slug" } : run ? await run(message) : { ok: false, reason: "unknown" };
+    } catch (error) {
+      result = { ok: false, reason: "error", message: String(error?.message ?? error) };
+    }
+    send("reply", { id: message.id, ...result }, [message.protocol]);
+    update();
+  });
+  const first = { ...snapshot(), card: modals.open().length > 0 };
+  last = JSON.stringify(first);
+  send("ready", { commands: Object.keys(all), ...first });
+  return {
+    update,
+    notice: (fields) => send("notice", fields),
+    noticeRoom: (room) => send("noticeRoom", { room }),
+    // Show the report again (the file changed): the workbench loads it out of sight and puts it in
+    // this page's place once drawn; this page does nothing more meanwhile.
+    reload: () => send("reload", {}),
+    annotationsRemoved: (items) => send("annotations-removed", { items }),
+    open: (place) => send("open", place),
+    jump: (fields) => send("jump", fields),
+    workspace: () => send("workspace", {}),
+  };
+}