@shivaedev/work-board 0.2.0 → 0.3.0

package/dist/page/recordedEvidence.d.ts

@@ -0,0 +1,4 @@
+import type { MetadataModel } from "#metadata/model.ts";
+import type { ParsedMetadata } from "#metadata/parse.ts";
+export declare function recordedEvidence(parsed: ParsedMetadata, file: string, model: MetadataModel): string;
+//# sourceMappingURL=recordedEvidence.d.ts.map

package/dist/page/recordedEvidence.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"recordedEvidence.d.ts","sourceRoot":"","sources":["../../src/page/recordedEvidence.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAIzD,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,aAAa,GAAG,MAAM,CAMnG"}

package/dist/page/recordedEvidence.js

@@ -0,0 +1,10 @@
+import { escapeHtml } from "./escape.js";
+import { referenceHtml, sourceHtml, valueHtml } from "./metadataLinks.js";
+export function recordedEvidence(parsed, file, model) {
+    const records = parsed.fields.evidence ?? [];
+    if (records.length === 0) {
+        return "";
+    }
+    return `<h3>Recorded evidence</h3><p>Source claims — not independently verified. A recorded outcome does not establish human acceptance. Work Board does not check recorded revisions against the current workspace.</p><ul>${records.map((item, index) => `<li id="recorded-evidence-${index}" tabindex="-1">${sourceHtml(item.source, file, model)}<dl><dt>Recorded in</dt><dd>${escapeHtml(file)}:${parsed.lines[`evidence.${index}.source`] ?? parsed.lines.evidence ?? 1}</dd><dt>Criterion</dt><dd>${item.criterion ? referenceHtml(item.criterion, item.criterion, model) : "Not recorded"}</dd><dt>Checked revision</dt><dd>${valueHtml(item.checkedRevision)}</dd><dt>Observed time</dt><dd>${valueHtml(item.observedAt)}</dd><dt>Method</dt><dd>${valueHtml(item.method)}</dd><dt>Recorded outcome</dt><dd>${valueHtml(item.outcome)}</dd></dl></li>`).join("")}</ul>`;
+}
+//# sourceMappingURL=recordedEvidence.js.map

package/dist/page/recordedEvidence.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"recordedEvidence.js","sourceRoot":"","sources":["../../src/page/recordedEvidence.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE1E,MAAM,UAAU,gBAAgB,CAAC,MAAsB,EAAE,IAAY,EAAE,KAAoB;IAC1F,MAAM,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,IAAI,EAAE,CAAC;IAC7C,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC1B,OAAO,EAAE,CAAC;IACX,CAAC;IACD,OAAO,uNAAuN,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,6BAA6B,KAAK,mBAAmB,UAAU,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,CAAC,+BAA+B,UAAU,CAAC,IAAI,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,YAAY,KAAK,SAAS,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,8BAA8B,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,cAAc,qCAAqC,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC,kCAAkC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,2BAA2B,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,qCAAqC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC;AACl1B,CAAC"}

package/dist/page/searchDialog.d.ts

@@ -0,0 +1,3 @@
+export declare const searchDialog = "<dialog id=\"search-dialog\" aria-labelledby=\"search-title\">\n<div class=\"search-header\"><h2 id=\"search-title\">Find work</h2><button type=\"button\" id=\"search-close\" aria-label=\"Close search\">Close</button></div>\n<form id=\"search-form\"><label for=\"search-query\">Search documents, headings, and passages</label><input id=\"search-query\" type=\"search\" autocomplete=\"off\" maxlength=\"200\" role=\"combobox\" aria-autocomplete=\"list\" aria-expanded=\"true\" aria-controls=\"search-results\"><button type=\"submit\">Search</button></form>\n<p class=\"search-help\">Ctrl/Cmd+K to open \u00B7 \u2191/\u2193 to choose \u00B7 Enter to open \u00B7 Escape to close</p>\n<p id=\"search-status\" role=\"status\"></p><ul id=\"search-results\" role=\"listbox\" aria-label=\"Search results\"></ul>\n</dialog>";
+export declare const searchStyles = "\n#search-dialog{width:min(680px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:20px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text)}\n#search-dialog::backdrop{background:rgb(0 0 0 / .45)}\n.search-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.search-header h2{margin:0;font-size:1.3rem}\n#search-form{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:16px}#search-form label{grid-column:1/-1}#search-query{min-width:0;width:100%;padding:10px;border:1px solid var(--border);border-radius:6px;background:var(--card);color:var(--text);font:inherit}\n.search-help{margin-top:12px}.search-help,#search-status{font-size:.85rem;color:var(--muted)}#search-results{list-style:none;padding:0;margin:0}\n#search-results a{display:block;padding:12px;border-radius:6px;text-decoration:none;overflow-wrap:anywhere}#search-results a[aria-selected=\"true\"]{background:var(--surface);outline:2px solid var(--focus);outline-offset:-2px}\n#search-results strong,#search-results small,#search-results p{display:block}#search-results small{color:var(--muted);font-size:.8rem}#search-results p{margin:6px 0 0;font-size:.9rem}\n";
+//# sourceMappingURL=searchDialog.d.ts.map

package/dist/page/searchDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"searchDialog.d.ts","sourceRoot":"","sources":["../../src/page/searchDialog.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,mzBAKf,CAAC;AAEX,eAAO,MAAM,YAAY,gsCAQxB,CAAC"}

package/dist/page/searchDialog.js

@@ -0,0 +1,16 @@
+export const searchDialog = `<dialog id="search-dialog" aria-labelledby="search-title">
+<div class="search-header"><h2 id="search-title">Find work</h2><button type="button" id="search-close" aria-label="Close search">Close</button></div>
+<form id="search-form"><label for="search-query">Search documents, headings, and passages</label><input id="search-query" type="search" autocomplete="off" maxlength="200" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="search-results"><button type="submit">Search</button></form>
+<p class="search-help">Ctrl/Cmd+K to open · ↑/↓ to choose · Enter to open · Escape to close</p>
+<p id="search-status" role="status"></p><ul id="search-results" role="listbox" aria-label="Search results"></ul>
+</dialog>`;
+export const searchStyles = `
+#search-dialog{width:min(680px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:20px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text)}
+#search-dialog::backdrop{background:rgb(0 0 0 / .45)}
+.search-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.search-header h2{margin:0;font-size:1.3rem}
+#search-form{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:16px}#search-form label{grid-column:1/-1}#search-query{min-width:0;width:100%;padding:10px;border:1px solid var(--border);border-radius:6px;background:var(--card);color:var(--text);font:inherit}
+.search-help{margin-top:12px}.search-help,#search-status{font-size:.85rem;color:var(--muted)}#search-results{list-style:none;padding:0;margin:0}
+#search-results a{display:block;padding:12px;border-radius:6px;text-decoration:none;overflow-wrap:anywhere}#search-results a[aria-selected="true"]{background:var(--surface);outline:2px solid var(--focus);outline-offset:-2px}
+#search-results strong,#search-results small,#search-results p{display:block}#search-results small{color:var(--muted);font-size:.8rem}#search-results p{margin:6px 0 0;font-size:.9rem}
+`;
+//# sourceMappingURL=searchDialog.js.map

package/dist/page/searchDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"searchDialog.js","sourceRoot":"","sources":["../../src/page/searchDialog.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;UAKlB,CAAC;AAEX,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;CAQ3B,CAAC"}

package/dist/page/searchResultsScript.d.ts

@@ -0,0 +1,2 @@
+export declare function searchResultsScript(): string;
+//# sourceMappingURL=searchResultsScript.d.ts.map

package/dist/page/searchResultsScript.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"searchResultsScript.d.ts","sourceRoot":"","sources":["../../src/page/searchResultsScript.ts"],"names":[],"mappings":"AAAA,wBAAgB,mBAAmB,IAAI,MAAM,CA8D5C"}

package/dist/page/searchResultsScript.js

@@ -0,0 +1,64 @@
+export function searchResultsScript() {
+    return `
+const results = document.getElementById("search-results");
+const input = document.getElementById("search-query");
+let selected = -1;
+const commands = [
+ { kind: "command", title: "Open workspace", href: "/" },
+ { kind: "command", title: "Show or hide files", command: "sidebar-toggle" },
+ { kind: "command", title: "Toggle compact density", command: "density" },
+ { kind: "command", title: "Toggle light or dark theme", command: "theme" },
+];
+export const matchingCommands = (query) => commands.filter(item => item.title.toLowerCase().includes(query.trim().toLowerCase()));
+export const choose = (index) => {
+ const options = [...results.querySelectorAll("a")];
+ selected = options.length ? (index + options.length) % options.length : -1;
+ options.forEach((option, at) => option.setAttribute("aria-selected", String(at === selected)));
+ if (selected >= 0) {
+  input.setAttribute("aria-activedescendant", options[selected].id);
+  options[selected].scrollIntoView({ block: "nearest" });
+ } else input.removeAttribute("aria-activedescendant");
+};
+export const move = (delta) => choose(selected + delta);
+export const activate = () => results.querySelector('a[aria-selected="true"]')?.click();
+export const showResults = (items) => {
+ results.replaceChildren();
+ items.forEach((item, index) => {
+  const li = document.createElement("li");
+  li.setAttribute("role", "presentation");
+  const link = document.createElement("a");
+  link.id = "search-result-" + index;
+  link.href = item.href ?? "#";
+  link.setAttribute("role", "option");
+  if (item.command) link.dataset.command = item.command;
+  const title = document.createElement("strong");
+  title.textContent = item.title;
+  const source = document.createElement("small");
+  source.textContent = item.kind + (item.file ? " · " + item.file + (item.line ? ":" + item.line : "") : "");
+  link.append(title, source);
+  if (item.snippet) {
+   const snippet = document.createElement("p");
+   snippet.textContent = item.snippet;
+   link.append(snippet);
+  }
+  li.append(link); results.append(li);
+ });
+ choose(0);
+};
+results.addEventListener("click", (event) => {
+ const link = event.target.closest("a");
+ if (!link) return;
+ const control = document.getElementById(link.dataset.command);
+ if (control) {
+  event.preventDefault();
+  if (control.id === "sidebar-toggle") control.click();
+  else {
+   control.value = control.id === "density" ? (control.value === "compact" ? "comfortable" : "compact") : (control.value === "dark" ? "light" : "dark");
+   control.dispatchEvent(new Event("change"));
+  }
+ }
+ document.getElementById("search-dialog").close(!control && event.button === 0 && !event.ctrlKey && !event.metaKey && !event.shiftKey && !event.altKey ? "navigate" : "");
+});
+`;
+}
+//# sourceMappingURL=searchResultsScript.js.map

package/dist/page/searchResultsScript.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"searchResultsScript.js","sourceRoot":"","sources":["../../src/page/searchResultsScript.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,mBAAmB;IAClC,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DP,CAAC;AACF,CAAC"}

package/dist/page/searchScript.d.ts

@@ -0,0 +1,2 @@
+export declare function searchScript(): string;
+//# sourceMappingURL=searchScript.d.ts.map

package/dist/page/searchScript.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"searchScript.d.ts","sourceRoot":"","sources":["../../src/page/searchScript.ts"],"names":[],"mappings":"AAAA,wBAAgB,YAAY,IAAI,MAAM,CAuErC"}

package/dist/page/searchScript.js

@@ -0,0 +1,73 @@
+export function searchScript() {
+    return `
+import { activate, matchingCommands, move, showResults } from "/_board/search-results.js";
+const dialog = document.getElementById("search-dialog");
+const input = document.getElementById("search-query");
+const status = document.getElementById("search-status");
+const open = document.getElementById("search-open");
+open.disabled = false;
+let previous;
+let version = 0;
+let timer;
+let controller;
+const invalidate = () => {
+ ++version;
+ clearTimeout(timer);
+ controller?.abort();
+};
+const search = async () => {
+ invalidate();
+ const mine = version;
+ const query = input.value.trim();
+ const commands = matchingCommands(query);
+ showResults(commands);
+ if (!query) { status.textContent = "Type to search this workspace, or choose a command."; return; }
+ status.textContent = "Searching…";
+ controller = new AbortController();
+ try {
+  const response = await fetch("/_board/search?q=" + encodeURIComponent(query), { cache: "no-store", signal: controller.signal });
+  if (!response.ok) throw new Error("Search unavailable");
+  const body = await response.json();
+  if (mine !== version || !dialog.open) return;
+  showResults([...commands, ...body.results]);
+  status.textContent = (body.total ? (body.total > body.results.length ? "Showing " + body.results.length + " of " : "") + body.total + " matches." : "No document matches.") + (body.unavailable.length ? " Could not read " + body.unavailable.length + " files; results are incomplete." : "");
+ } catch (error) {
+  if (mine !== version || error.name === "AbortError") return;
+  status.textContent = "Search could not be completed. Press Search to retry.";
+ }
+};
+open.addEventListener("click", () => {
+ previous = document.activeElement;
+ dialog.returnValue = "";
+ dialog.showModal();
+ input.focus();
+ input.select();
+ search();
+});
+document.getElementById("search-close").addEventListener("click", () => dialog.close());
+dialog.addEventListener("close", () => { invalidate(); if (dialog.returnValue !== "navigate") previous?.focus({ preventScroll: true }); });
+dialog.addEventListener("cancel", () => invalidate());
+dialog.addEventListener("keydown", (event) => {
+ if (event.key === "Escape") { event.preventDefault(); dialog.close(); }
+});
+input.addEventListener("input", () => {
+ invalidate();
+ showResults([]);
+ status.textContent = input.value.trim() ? "Searching…" : "Type to search this workspace.";
+ timer = setTimeout(search, 150);
+});
+document.getElementById("search-form").addEventListener("submit", (event) => { event.preventDefault(); search(); });
+input.addEventListener("keydown", (event) => {
+ if (event.key === "ArrowDown" || event.key === "ArrowUp") { event.preventDefault(); move(event.key === "ArrowDown" ? 1 : -1); }
+ if (event.key === "Enter" && document.querySelector('#search-results a[aria-selected="true"]')) { event.preventDefault(); activate(); }
+});
+document.addEventListener("keydown", (event) => {
+ if ((event.ctrlKey || event.metaKey) && !event.altKey && event.key.toLowerCase() === "k") {
+  event.preventDefault();
+  if (dialog.open) dialog.close(); else open.click();
+ }
+});
+document.addEventListener("board-index-change", () => { if (dialog.open) search(); });
+`;
+}
+//# sourceMappingURL=searchScript.js.map

package/dist/page/searchScript.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"searchScript.js","sourceRoot":"","sources":["../../src/page/searchScript.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,YAAY;IAC3B,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqEP,CAAC;AACF,CAAC"}

package/dist/page/shell.d.ts

@@ -1,2 +1,2 @@
-export declare const shell: (title: string, nav: string, main: string) => string;
+export declare const shell: (title: string, nav: string, main: string, workspace: string, board: boolean, identity?: string, view?: boolean) => string;
 //# sourceMappingURL=shell.d.ts.map

package/dist/page/shell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shell.d.ts","sourceRoot":"","sources":["../../src/page/shell.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,KAAK,GAAI,OAAO,MAAM,EAAE,KAAK,MAAM,EAAE,MAAM,MAAM,KAAG,MAStD,CAAC"}
+{"version":3,"file":"shell.d.ts","sourceRoot":"","sources":["../../src/page/shell.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,KAAK,GAAI,OAAO,MAAM,EAAE,KAAK,MAAM,EAAE,MAAM,MAAM,EAAE,WAAW,MAAM,EAAE,OAAO,OAAO,EAAE,WAAW,MAAM,EAAE,cAAY,KAAG,MAmB1H,CAAC"}

package/dist/page/shell.js

@@ -1,11 +1,29 @@
+import { fileUrl } from "#files/url.ts";
 import { escapeHtml } from "./escape.js";
-export const shell = (title, nav, main) => [
-    '<!doctype html><html lang="en"><head><meta charset="utf-8">',
+import { searchDialog } from "./searchDialog.js";
+function location(file) {
+    return file
+        .split("/")
+        .map((part) => `<span>${escapeHtml(part)}</span>`)
+        .join('<span class="separator">/</span>');
+}
+export const shell = (title, nav, main, workspace, board, identity, view = false) => [
+    `<!doctype html><html lang="en" data-workspace="${escapeHtml(workspace)}"><head><meta charset="utf-8">`,
     '<meta name="viewport" content="width=device-width, initial-scale=1"><meta name="color-scheme" content="light dark">',
     `<title>${escapeHtml(title)}</title>`,
     '<link rel="stylesheet" href="/_board/style.css"><script type="module" src="/_board/client.js"></script>',
-    '</head><body><div class="page"><header class="bar">',
-    `<nav id="files" class="files">${nav}</nav><span id="live" class="live">connecting</span></header>`,
-    `<main id="doc">${main}</main></div></body></html>`,
+    '</head><body><a class="skip" href="#doc">Skip to content</a><div class="workspace">',
+    '<aside id="sidebar" class="sidebar"><a class="brand" href="/">work board<span>Local workspace</span></a>',
+    '<div id="reading-library" class="reading-library" hidden></div><h2 class="nav-heading">Project files</h2>',
+    `<nav id="files" class="files" aria-label="Project files">${nav}</nav></aside>`,
+    '<div class="page"><header class="bar"><button id="sidebar-toggle" type="button" aria-controls="sidebar" aria-expanded="true">Files</button>',
+    `<nav id="breadcrumbs" class="breadcrumbs" aria-label="File location"><a href="/">Workspace</a><span class="separator">/</span>${location(title)}</nav>`,
+    `<a id="work-open" class="work-open" href="/_board/work?view=board"${view ? ' aria-current="page"' : ""}>Work</a><button id="search-open" type="button" disabled aria-haspopup="dialog" aria-controls="search-dialog">Search <kbd>⌘/Ctrl K</kbd></button><span id="live" class="live" role="status">connecting</span><span id="navigation-status" role="status"></span></header>`,
+    '<div class="preferences" role="group" aria-label="Reading preferences">',
+    '<div class="preference"><label for="theme">Theme</label><select id="theme"><option value="system">System</option><option value="light">Light</option><option value="dark">Dark</option></select></div>',
+    '<div class="preference"><label for="density">Density</label><select id="density"><option value="comfortable">Comfortable</option><option value="compact">Compact</option></select></div>',
+    '<span id="preference-status" role="status"></span></div>',
+    `<main${view ? ' data-view="work"' : ""}${identity ? ` data-identity="${escapeHtml(identity)}"` : ""} id="doc" data-file="${escapeHtml(title)}" data-url="${escapeHtml(fileUrl(title))}" class="${board ? "board-view" : "document-view"}" tabindex="-1">${main}</main>`,
+    `</div></div>${searchDialog}</body></html>`,
 ].join("");
 //# sourceMappingURL=shell.js.map

package/dist/page/shell.js.map

@@ -1 +1 @@
-{"version":3,"file":"shell.js","sourceRoot":"","sources":["../../src/page/shell.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,KAAa,EAAE,GAAW,EAAE,IAAY,EAAU,EAAE,CACzE;IACC,6DAA6D;IAC7D,qHAAqH;IACrH,UAAU,UAAU,CAAC,KAAK,CAAC,UAAU;IACrC,yGAAyG;IACzG,qDAAqD;IACrD,iCAAiC,GAAG,+DAA+D;IACnG,kBAAkB,IAAI,6BAA6B;CACnD,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC"}
+{"version":3,"file":"shell.js","sourceRoot":"","sources":["../../src/page/shell.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,SAAS,QAAQ,CAAC,IAAY;IAC7B,OAAO,IAAI;SACT,KAAK,CAAC,GAAG,CAAC;SACV,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,SAAS,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC;SACjD,IAAI,CAAC,kCAAkC,CAAC,CAAC;AAC5C,CAAC;AAED,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,KAAa,EAAE,GAAW,EAAE,IAAY,EAAE,SAAiB,EAAE,KAAc,EAAE,QAAiB,EAAE,IAAI,GAAG,KAAK,EAAU,EAAE,CAC7I;IACC,kDAAkD,UAAU,CAAC,SAAS,CAAC,gCAAgC;IACvG,qHAAqH;IACrH,UAAU,UAAU,CAAC,KAAK,CAAC,UAAU;IACrC,yGAAyG;IACzG,qFAAqF;IACrF,0GAA0G;IAC1G,2GAA2G;IAC3G,4DAA4D,GAAG,gBAAgB;IAC/E,6IAA6I;IAC7I,iIAAiI,QAAQ,CAAC,KAAK,CAAC,QAAQ;IACxJ,qEAAqE,IAAI,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE,0QAA0Q;IACjX,yEAAyE;IACzE,wMAAwM;IACxM,0LAA0L;IAC1L,0DAA0D;IAC1D,QAAQ,IAAI,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,mBAAmB,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,wBAAwB,UAAU,CAAC,KAAK,CAAC,eAAe,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,YAAY,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,eAAe,mBAAmB,IAAI,SAAS;IACxQ,eAAe,YAAY,gBAAgB;CAC3C,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC"}

package/dist/page/stateScript.d.ts

@@ -0,0 +1,2 @@
+export declare function pageStateScript(): string;
+//# sourceMappingURL=stateScript.d.ts.map

package/dist/page/stateScript.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stateScript.d.ts","sourceRoot":"","sources":["../../src/page/stateScript.ts"],"names":[],"mappings":"AAAA,wBAAgB,eAAe,IAAI,MAAM,CA+CxC"}

package/dist/page/stateScript.js

@@ -0,0 +1,49 @@
+export function pageStateScript() {
+    return `
+import { remember, swap } from "/_board/swap.js";
+import { renderDiagrams } from "/_board/diagrams.js";
+import { captureReading, reportMissingPassage, restoreReading } from "/_board/reading-state.js";
+import { refreshLibrary } from "/_board/library.js";
+
+export const capturePage = () => {
+  const page = document.implementation.createHTMLDocument(document.title);
+  for (const id of ["files", "doc", "breadcrumbs"]) page.body.append(document.getElementById(id).cloneNode(true));
+  return { page, reading: captureReading() };
+};
+
+export const applyPage = (page, preserve = false) => {
+  const incoming = page.getElementById("doc");
+  const current = document.getElementById("doc");
+  if (!incoming || !page.getElementById("files")) return false;
+  const reading = preserve ? captureReading() : null;
+  const cachedScheme = incoming.dataset.scheme;
+  if (preserve && (current.dataset.file === incoming.dataset.file || (current.dataset.identity && current.dataset.identity === incoming.dataset.identity))) {
+    swap(current, incoming);
+  } else {
+    current.replaceWith(document.importNode(incoming, true));
+    remember(document.getElementById("doc"));
+  }
+  const doc = document.getElementById("doc");
+  doc.className = incoming.className;
+  doc.dataset.file = incoming.dataset.file;
+  if (incoming.dataset.identity) doc.dataset.identity = incoming.dataset.identity; else delete doc.dataset.identity;
+  doc.dataset.url = incoming.dataset.url;
+  if (incoming.dataset.view) doc.dataset.view = incoming.dataset.view; else delete doc.dataset.view;
+  document.getElementById("work-open")?.setAttribute("aria-current", doc.dataset.view === "work" ? "page" : "false");
+  doc.dataset.scheme = document.documentElement.dataset.scheme;
+  swap(document.getElementById("files"), page.getElementById("files"));
+  const crumbs = page.getElementById("breadcrumbs");
+  if (crumbs) document.getElementById("breadcrumbs").replaceChildren(...document.importNode(crumbs, true).childNodes);
+  if (!preserve) {
+    document.querySelector('#files a[aria-current="page"]')?.closest("details")?.setAttribute("open", "");
+  }
+  refreshLibrary(!preserve);
+  if (reading) restoreReading({ ...reading, selection: null }, false);
+  renderDiagrams(document, cachedScheme && cachedScheme !== doc.dataset.scheme ? "figure.diagram" : undefined);
+  reportMissingPassage();
+  document.dispatchEvent(new Event("board-page"));
+  return true;
+};
+`;
+}
+//# sourceMappingURL=stateScript.js.map

package/dist/page/stateScript.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stateScript.js","sourceRoot":"","sources":["../../src/page/stateScript.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,eAAe;IAC9B,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6CP,CAAC;AACF,CAAC"}

package/dist/page/style.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../src/page/style.ts"],"names":[],"mappings":"AA8EA,eAAO,MAAM,KAAK,QAA2C,CAAC"}
+{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../src/page/style.ts"],"names":[],"mappings":"AAyDA,eAAO,MAAM,KAAK,QAA4G,CAAC"}

package/dist/page/style.js

@@ -1,34 +1,11 @@
-const tokens = `
-:root {
-  color-scheme: light dark;
-  --sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
-  --mono: ui-monospace, SFMono-Regular, Menlo, monospace;
-  --bg: #ffffff; --surface: #f6f8fa; --text: #1f2328; --muted: #59636e; --border: #d1d9e0; --link: #0969da; --danger: #b3261e;
-}
-@media (prefers-color-scheme: dark) {
-  :root { --bg: #1e1e1e; --surface: #272727; --text: #e8e8e8; --muted: #a8a8a8; --border: #3d3d3d; --link: #58a6ff; --danger: #ff8a80; }
-}
-`;
-const page = `
-body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.65 var(--sans); }
-a { color: var(--link); }
-.page { box-sizing: content-box; max-width: 72ch; margin: 0 auto; padding: 0 16px 64px; }
-.bar { display: flex; align-items: flex-start; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--border); font-size: 14px; }
-.files { flex: 1; display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: baseline; }
-.files a { color: var(--text); text-decoration: none; }
-.files a:hover, .files a[aria-current="page"] { color: var(--link); text-decoration: underline; }
-.files details[open] { flex-basis: 100%; }
-.files summary { cursor: pointer; color: var(--muted); }
-.files ul { list-style: none; margin: 4px 0 8px; padding: 0 0 0 12px; border-left: 1px solid var(--border); }
-.age { color: var(--muted); font: 12px var(--mono); margin-left: 6px; }
-.live { color: var(--muted); font: 12px/1.9 var(--mono); }
-.live[data-state="down"], .live[data-state="stale"] { color: var(--danger); }
-.meta { color: var(--muted); font-size: 14px; margin: 0; }
-.meta .age { margin: 0; }
-`;
+import { workStyle } from "#views/workStyle.ts";
+import { metadataStyles } from "./metadata.js";
+import { readingStyles } from "./readingStyles.js";
+import { searchStyles } from "./searchDialog.js";
+import { layout, theme } from "./workspaceStyles.js";
 const prose = `
 h1, h2, h3, h4 { font-weight: 600; line-height: 1.25; margin: 1.6em 0 0.5em; }
-h1 { font-size: 1.9em; margin-top: 1em; }
+h1 { overflow-wrap: anywhere; font-size: 1.9em; margin-top: 1em; }
 h2 { font-size: 1.45em; }
 h3 { font-size: 1.15em; }
 h1 strong, h2 strong, h3 strong { font-weight: inherit; }
@@ -41,7 +18,8 @@ code { font: 0.875em var(--mono); background: var(--surface); padding: 0.1em 0.3
 pre { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 12px 14px; white-space: pre-wrap; overflow-wrap: anywhere; }
 pre code { background: none; padding: 0; font-size: 0.85em; }
 .shiki span { color: var(--shiki-light); }
-@media (prefers-color-scheme: dark) { .shiki span { color: var(--shiki-dark); } }
+@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .shiki span { color: var(--shiki-dark); } }
+:root[data-theme="dark"] .shiki span { color: var(--shiki-dark); }
 table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-size: 0.925em; }
 th, td { text-align: left; vertical-align: top; padding: 6px 10px; border: 1px solid var(--border); }
 tr:nth-child(2n) td { background: var(--surface); }
@@ -56,9 +34,11 @@ const board = `
 .board-head .intro { color: var(--muted); }
 .counts { margin: 0; }
 .counts b { font-variant-numeric: tabular-nums; }
-.board section { margin-top: 2.2em; }
-.board section > h2 { margin: 0 0 0.2em; }
-.item, .notes { padding: 0.9em 0 0.1em; border-top: 1px solid var(--border); }
+.board { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: var(--space); margin-top: 2em; align-items: start; }
+.board section { min-width: 0; }
+.board section > h2 { margin: 0 0 0.8em; font-size: 1.1em; overflow-wrap: anywhere; }
+.item, .notes { padding: var(--card-space); margin-bottom: 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--card); overflow-wrap: anywhere; }
+.item > :last-child, .notes > :last-child { margin-bottom: 0; }
 .item > h3 { margin: 0 0 0.4em; }
 .item > h3 > code:first-child { background: none; padding: 0; margin-right: 0.6em; color: var(--muted); font-weight: 400; }
 footer { margin-top: 2.5em; padding-top: 1em; border-top: 1px solid var(--border); color: var(--muted); font-size: 0.925em; }
@@ -71,5 +51,5 @@ figure.diagram[data-state="failed"] .diagram-source { display: block; }
 figure.diagram[data-state="failed"]::after { content: attr(data-error); color: var(--danger); font-size: 0.875em; }
 @media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
 `;
-export const style = tokens + page + prose + board + diagrams;
+export const style = theme + layout + prose + board + diagrams + readingStyles() + searchStyles + metadataStyles + workStyle();
 //# sourceMappingURL=style.js.map

package/dist/page/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sourceRoot":"","sources":["../../src/page/style.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,GAAG;;;;;;;;;;CAUd,CAAC;AAEF,MAAM,IAAI,GAAG;;;;;;;;;;;;;;;;CAgBZ,CAAC;AAEF,MAAM,KAAK,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;CAyBb,CAAC;AAEF,MAAM,KAAK,GAAG;;;;;;;;;;CAUb,CAAC;AAEF,MAAM,QAAQ,GAAG;;;;;;;CAOhB,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,MAAM,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,QAAQ,CAAC"}
+{"version":3,"file":"style.js","sourceRoot":"","sources":["../../src/page/style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAErD,MAAM,KAAK,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;CA0Bb,CAAC;AAEF,MAAM,KAAK,GAAG;;;;;;;;;;;;CAYb,CAAC;AAEF,MAAM,QAAQ,GAAG;;;;;;;CAOhB,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,KAAK,GAAG,KAAK,GAAG,QAAQ,GAAG,aAAa,EAAE,GAAG,YAAY,GAAG,cAAc,GAAG,SAAS,EAAE,CAAC"}

package/dist/page/swap.d.ts

@@ -1,2 +1,2 @@
-export declare const swap = "\nconst containers = new Set([\"DIV\", \"SECTION\", \"ARTICLE\", \"HEADER\", \"FOOTER\", \"MAIN\", \"NAV\"]);\n\nconst structural = (element) => [...element.childNodes].every((node) => node.nodeType === 1 || node.textContent.trim() === \"\");\n\nconst pristine = new WeakMap();\n\nexport const remember = (element) => {\n  pristine.set(element, element.outerHTML);\n  if (containers.has(element.tagName)) for (const child of element.children) remember(child);\n};\n\nconst normalized = (element) => {\n  const copy = element.cloneNode(true);\n  for (const node of [copy, ...copy.querySelectorAll(\"*\")]) {\n    if (node.tagName === \"DETAILS\") node.removeAttribute(\"open\");\n    if (node.matches(\"figure.diagram\")) {\n      node.querySelector(\".diagram-svg\")?.remove();\n      node.dataset.state = \"pending\";\n      delete node.dataset.error;\n    }\n    if (node.matches(\"[data-modified]\")) node.textContent = \"\";\n  }\n  return copy.outerHTML;\n};\n\nconst signature = (element) => {\n  if (!pristine.has(element)) pristine.set(element, normalized(element));\n  return pristine.get(element);\n};\n\nconst sameShell = (old, next) =>\n  old.tagName === next.tagName && containers.has(old.tagName) && old.cloneNode(false).outerHTML === next.cloneNode(false).outerHTML;\n\nconst matches = (a, b) => {\n  let start = 0;\n  while (start < a.length && start < b.length && a[start] === b[start]) start++;\n  let tail = 0;\n  while (tail < a.length - start && tail < b.length - start && a[a.length - 1 - tail] === b[b.length - 1 - tail]) tail++;\n  const n = a.length - start - tail;\n  const m = b.length - start - tail;\n  const table = Array.from({ length: n + 1 }, () => new Uint32Array(m + 1));\n  for (let i = n - 1; i >= 0; i--) {\n    for (let j = m - 1; j >= 0; j--) {\n      table[i][j] = a[start + i] === b[start + j] ? table[i + 1][j + 1] + 1 : Math.max(table[i + 1][j], table[i][j + 1]);\n    }\n  }\n  const pairs = Array.from({ length: start }, (_, index) => [index, index]);\n  for (let i = 0, j = 0; i < n && j < m; ) {\n    if (a[start + i] === b[start + j]) pairs.push([start + i++, start + j++]);\n    else if (table[i + 1][j] >= table[i][j + 1]) i++;\n    else j++;\n  }\n  for (let index = tail; index > 0; index--) pairs.push([a.length - index, b.length - index]);\n  return [...pairs, [a.length, b.length]];\n};\n\nconst patch = (current, incoming) => {\n  if (!structural(current) || !structural(incoming)) {\n    current.replaceChildren(...incoming.childNodes);\n    for (const child of current.children) remember(child);\n    return;\n  }\n  const olds = [...current.children];\n  const news = [...incoming.children];\n  const signatures = news.map((next) => next.outerHTML);\n  const arrive = (index) => {\n    remember(news[index]);\n    return news[index];\n  };\n  let i = 0;\n  let j = 0;\n  for (const [kept, arrived] of matches(olds.map(signature), signatures)) {\n    const anchor = olds[kept] ?? null;\n    for (; i < kept && j < arrived; i++, j++) {\n      if (sameShell(olds[i], news[j])) {\n        patch(olds[i], news[j]);\n        pristine.set(olds[i], signatures[j]);\n      } else olds[i].replaceWith(arrive(j));\n    }\n    for (; i < kept; i++) olds[i].remove();\n    for (; j < arrived; j++) current.insertBefore(arrive(j), anchor);\n    i++;\n    j++;\n  }\n};\n\nconst keysOf = (root) => {\n  const seen = new Map();\n  return [...root.querySelectorAll(\"details\")].map((details) => {\n    const base =\n      details.dataset.key ??\n      (details.closest(\".item\")?.querySelector(\"h3\")?.textContent ?? \"\") + \"|\" + (details.querySelector(\"summary\")?.textContent ?? \"\");\n    const count = seen.get(base) ?? 0;\n    seen.set(base, count + 1);\n    return [base + \"#\" + count, details];\n  });\n};\n\nconst carryDrawings = (drawings, figures) => {\n  if (drawings.length !== figures.length) return;\n  figures.forEach((figure, index) => {\n    const drawing = drawings[index];\n    if (figure.dataset.state !== \"pending\" || drawing === null || drawing.isConnected) return;\n    figure.prepend(drawing);\n    figure.dataset.state = \"redrawing\";\n  });\n};\n\nexport const swap = (current, incoming) => {\n  const before = keysOf(current);\n  const open = new Map(before.map(([key, details]) => [key, details.open]));\n  const existing = new Set(before.map(([, details]) => details));\n  const drawings = [...current.querySelectorAll(\"figure.diagram\")].map((figure) => figure.querySelector(\".diagram-svg\"));\n  patch(current, incoming);\n  carryDrawings(drawings, [...current.querySelectorAll(\"figure.diagram\")]);\n  for (const [key, details] of keysOf(current)) {\n    const was = open.get(key);\n    if (was !== undefined && !existing.has(details)) details.open = was;\n  }\n};\n";
+export declare const swap = "\nconst containers = new Set([\"DIV\", \"SECTION\", \"ARTICLE\", \"HEADER\", \"FOOTER\", \"MAIN\", \"NAV\", \"FORM\", \"SELECT\", \"LABEL\", \"ASIDE\"]);\n\nconst structural = (element) => [...element.childNodes].every((node) => node.nodeType === 1 || node.textContent.trim() === \"\");\n\nconst pristine = new WeakMap();\n\nexport const remember = (element) => {\n  pristine.set(element, element.outerHTML);\n  if (containers.has(element.tagName)) for (const child of element.children) remember(child);\n};\n\nconst normalized = (element) => {\n  const copy = element.cloneNode(true);\n  for (const node of [copy, ...copy.querySelectorAll(\"*\")]) {\n    if (node.tagName === \"DETAILS\") node.removeAttribute(\"open\");\n    if (node.matches(\"figure.diagram\")) {\n      node.querySelector(\".diagram-svg\")?.remove();\n      node.dataset.state = \"pending\";\n      delete node.dataset.error;\n    }\n    if (node.matches(\"[data-modified]\")) node.textContent = \"\";\n  }\n  return copy.outerHTML;\n};\n\nconst signature = (element) => {\n  if (!pristine.has(element)) pristine.set(element, normalized(element));\n  return pristine.get(element);\n};\n\nconst sameShell = (old, next) =>\n  old.tagName === next.tagName && containers.has(old.tagName) && old.cloneNode(false).outerHTML === next.cloneNode(false).outerHTML;\n\nconst matches = (a, b) => {\n  let start = 0;\n  while (start < a.length && start < b.length && a[start] === b[start]) start++;\n  let tail = 0;\n  while (tail < a.length - start && tail < b.length - start && a[a.length - 1 - tail] === b[b.length - 1 - tail]) tail++;\n  const n = a.length - start - tail;\n  const m = b.length - start - tail;\n  const table = Array.from({ length: n + 1 }, () => new Uint32Array(m + 1));\n  for (let i = n - 1; i >= 0; i--) {\n    for (let j = m - 1; j >= 0; j--) {\n      table[i][j] = a[start + i] === b[start + j] ? table[i + 1][j + 1] + 1 : Math.max(table[i + 1][j], table[i][j + 1]);\n    }\n  }\n  const pairs = Array.from({ length: start }, (_, index) => [index, index]);\n  for (let i = 0, j = 0; i < n && j < m; ) {\n    if (a[start + i] === b[start + j]) pairs.push([start + i++, start + j++]);\n    else if (table[i + 1][j] >= table[i][j + 1]) i++;\n    else j++;\n  }\n  for (let index = tail; index > 0; index--) pairs.push([a.length - index, b.length - index]);\n  return [...pairs, [a.length, b.length]];\n};\n\nconst patch = (current, incoming) => {\n  const selected = current.tagName === \"SELECT\" ? current.value : null;\n  const fallback = incoming.tagName === \"SELECT\" ? incoming.value : null;\n  if (!structural(current) || !structural(incoming)) {\n    current.replaceChildren(...incoming.childNodes);\n    for (const child of current.children) remember(child);\n    return;\n  }\n  const olds = [...current.children];\n  const news = [...incoming.children];\n  const signatures = news.map((next) => next.outerHTML);\n  const arrive = (index) => {\n    remember(news[index]);\n    return news[index];\n  };\n  let i = 0;\n  let j = 0;\n  for (const [kept, arrived] of matches(olds.map(signature), signatures)) {\n    const anchor = olds[kept] ?? null;\n    for (; i < kept && j < arrived; i++, j++) {\n      if (sameShell(olds[i], news[j])) {\n        patch(olds[i], news[j]);\n        pristine.set(olds[i], signatures[j]);\n      } else olds[i].replaceWith(arrive(j));\n    }\n    for (; i < kept; i++) olds[i].remove();\n    for (; j < arrived; j++) current.insertBefore(arrive(j), anchor);\n    i++;\n    j++;\n  }\n  if (selected !== null) current.value = [...current.options].some((option) => option.value === selected) ? selected : fallback;\n};\n\nconst keysOf = (root) => {\n  const seen = new Map();\n  return [...root.querySelectorAll(\"details\")].map((details) => {\n    const base =\n      details.dataset.key ??\n      (details.closest(\".item\")?.querySelector(\"h3\")?.textContent ?? \"\") + \"|\" + (details.querySelector(\"summary\")?.textContent ?? \"\");\n    const count = seen.get(base) ?? 0;\n    seen.set(base, count + 1);\n    return [base + \"#\" + count, details];\n  });\n};\n\nconst carryDrawings = (drawings, figures) => {\n  if (drawings.length !== figures.length) return;\n  figures.forEach((figure, index) => {\n    const drawing = drawings[index];\n    if (figure.dataset.state !== \"pending\" || drawing === null || drawing.isConnected) return;\n    figure.prepend(drawing);\n    figure.dataset.state = \"redrawing\";\n  });\n};\n\nexport const swap = (current, incoming) => {\n  const before = keysOf(current);\n  const open = new Map(before.map(([key, details]) => [key, details.open]));\n  const existing = new Set(before.map(([, details]) => details));\n  const drawings = [...current.querySelectorAll(\"figure.diagram\")].map((figure) => figure.querySelector(\".diagram-svg\"));\n  patch(current, incoming);\n  carryDrawings(drawings, [...current.querySelectorAll(\"figure.diagram\")]);\n  for (const [key, details] of keysOf(current)) {\n    const was = open.get(key);\n    if (was !== undefined && !existing.has(details)) details.open = was;\n  }\n};\n";
 //# sourceMappingURL=swap.d.ts.map

package/dist/page/swap.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"swap.d.ts","sourceRoot":"","sources":["../../src/page/swap.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,IAAI,0pJAyHhB,CAAC"}
+{"version":3,"file":"swap.d.ts","sourceRoot":"","sources":["../../src/page/swap.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,IAAI,g+JA4HhB,CAAC"}

package/dist/page/swap.js

@@ -1,5 +1,5 @@
 export const swap = `
-const containers = new Set(["DIV", "SECTION", "ARTICLE", "HEADER", "FOOTER", "MAIN", "NAV"]);
+const containers = new Set(["DIV", "SECTION", "ARTICLE", "HEADER", "FOOTER", "MAIN", "NAV", "FORM", "SELECT", "LABEL", "ASIDE"]);
 
 const structural = (element) => [...element.childNodes].every((node) => node.nodeType === 1 || node.textContent.trim() === "");
 
@@ -56,6 +56,8 @@ const matches = (a, b) => {
 };
 
 const patch = (current, incoming) => {
+  const selected = current.tagName === "SELECT" ? current.value : null;
+  const fallback = incoming.tagName === "SELECT" ? incoming.value : null;
   if (!structural(current) || !structural(incoming)) {
     current.replaceChildren(...incoming.childNodes);
     for (const child of current.children) remember(child);
@@ -83,6 +85,7 @@ const patch = (current, incoming) => {
     i++;
     j++;
   }
+  if (selected !== null) current.value = [...current.options].some((option) => option.value === selected) ? selected : fallback;
 };
 
 const keysOf = (root) => {

package/dist/page/swap.js.map

@@ -1 +1 @@
-{"version":3,"file":"swap.js","sourceRoot":"","sources":["../../src/page/swap.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,IAAI,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyHnB,CAAC"}
+{"version":3,"file":"swap.js","sourceRoot":"","sources":["../../src/page/swap.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,IAAI,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4HnB,CAAC"}

package/dist/page/workspaceStyles.d.ts

@@ -0,0 +1,3 @@
+export declare const layout = "\n* { box-sizing: border-box; }\nbody { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.65 var(--sans); }\na { color: var(--link); }\nbutton, select { font: inherit; color: inherit; }\nbutton, select, summary { cursor: pointer; }\nbutton, select { padding: 6px 10px; border: 1px solid var(--border); border-radius: 6px; background: var(--card); }\n:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }\n.skip { position: fixed; top: -100px; left: 16px; z-index: 5; padding: 8px 16px; background: var(--card); }\n.skip:focus { top: 8px; }\n.workspace { display: grid; grid-template-columns: 248px minmax(0, 1fr); min-height: 100vh; }\n:root[data-sidebar=\"closed\"] .workspace { grid-template-columns: minmax(0, 1fr); }\n.sidebar { --focus: #e2bc79; position: sticky; top: 0; align-self: start; height: 100vh; overflow-y: auto; padding: var(--space) 16px; background: var(--sidebar); color: var(--sidebar-text); }\n.sidebar[hidden] { display: none; }\n.brand { display: block; padding: 0 12px 28px; font-size: 24px; font-weight: 600; letter-spacing: -0.8px; text-decoration: none; color: var(--sidebar-text); }\n.brand span { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; letter-spacing: 0; color: var(--sidebar-muted); }\n.sidebar .nav-heading { margin: 0 12px 12px; font: 600 12px var(--sans); color: var(--sidebar-muted); }\n.files { font-size: 14px; }\n.files ul { list-style: none; margin: 0 0 10px; padding: 0; }\n.files li { display: flex; align-items: baseline; gap: 8px; margin: 0; padding: 4px 10px; border-radius: 5px; }\n.files li:has(a[aria-current=\"page\"]) { background: #385242; }\n.files a { flex: 1; min-width: 0; color: var(--sidebar-text); text-decoration: none; overflow-wrap: anywhere; }\n.files a:hover, .files a[aria-current=\"page\"] { text-decoration: underline; text-underline-offset: 4px; }\n.files details { margin: 8px 0; }\n.files summary { padding: 6px 10px; color: var(--sidebar-muted); overflow-wrap: anywhere; }\n.files details ul { margin-left: 14px; border-left: 1px solid var(--sidebar-border); }\n.age { color: var(--muted); font: 12px var(--mono); margin-left: 6px; white-space: nowrap; }\n.files .age { color: var(--sidebar-muted); margin: 0; flex-shrink: 0; }\n.page { min-width: 0; }\n.bar { display: flex; align-items: center; gap: 16px; padding: 16px var(--space); border-bottom: 1px solid var(--border); font-size: 13px; }\n.bar button { flex-shrink: 0; }\n.breadcrumbs { display: flex; flex-wrap: wrap; gap: 6px 10px; flex: 1; min-width: 0; overflow-wrap: anywhere; }\n.breadcrumbs > span:not(.separator) { min-width: 0; }\n.separator { color: var(--muted); }\n.live { color: var(--muted); font: 12px/1.9 var(--mono); }\n.live[data-state=\"down\"], .live[data-state=\"stale\"] { color: var(--danger); }\n.preferences { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px; align-items: center; padding: 14px var(--space) 0; color: var(--muted); font-size: 12px; }\n.preference { display: flex; gap: 8px; align-items: center; }\n#preference-status:empty { display: none; }\n#doc { padding: var(--space) var(--space) 64px; min-width: 0; }\n.document-view { max-width: calc(72ch + 2 * var(--space)); margin-inline: auto; }\n.board-view { max-width: 1600px; margin-inline: auto; }\n.meta { color: var(--muted); font-size: 13px; margin: 0; overflow-wrap: anywhere; }\n.meta .age { margin: 0; }\n@media (max-width: 760px) {\n  .workspace { grid-template-columns: minmax(0, 1fr); }\n  .sidebar { position: static; height: auto; max-height: 42vh; border-bottom: 1px solid var(--border); }\n  .brand { padding-bottom: 16px; }\n  .bar { flex-wrap: wrap; gap: 12px; }\n  .breadcrumbs { flex-basis: calc(100% - 100px); }\n  .live { margin-left: auto; }\n  .preferences { justify-content: flex-start; }\n  :root { --space: 18px; }\n}\n";
+export declare const theme = "\n:root {\n  --sans: system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif;\n  --mono: ui-monospace, SFMono-Regular, Menlo, monospace;\n  --space: 24px; --card-space: 20px;\n  \n  color-scheme: light;\n  --bg: #f7f8f4; --surface: #edf1e7; --card: #ffffff; --text: #263c34; --muted: #596957;\n  --border: #d5dfd0; --link: #315f45; --danger: #a03024; --focus: #976323;\n  --sidebar: #203a30; --sidebar-text: #e7eee2; --sidebar-muted: #b6c8ad; --sidebar-border: #4a624c;\n\n}\n@media (prefers-color-scheme: dark) { :root:not([data-theme=\"light\"]) { \n  color-scheme: dark;\n  --bg: #18251f; --surface: #26382d; --card: #203027; --text: #e7eee2; --muted: #b0c1a6;\n  --border: #455a48; --link: #b1d4a1; --danger: #ffafa2; --focus: #e2bc79;\n  --sidebar: #142219; --sidebar-text: #e7eee2; --sidebar-muted: #b6c8ad; --sidebar-border: #455a48;\n } }\n:root[data-theme=\"dark\"] { \n  color-scheme: dark;\n  --bg: #18251f; --surface: #26382d; --card: #203027; --text: #e7eee2; --muted: #b0c1a6;\n  --border: #455a48; --link: #b1d4a1; --danger: #ffafa2; --focus: #e2bc79;\n  --sidebar: #142219; --sidebar-text: #e7eee2; --sidebar-muted: #b6c8ad; --sidebar-border: #455a48;\n }\n:root[data-density=\"compact\"] { --space: 16px; --card-space: 12px; }\n";
+//# sourceMappingURL=workspaceStyles.d.ts.map

package/dist/page/workspaceStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"workspaceStyles.d.ts","sourceRoot":"","sources":["../../src/page/workspaceStyles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM,0wHAsDlB,CAAC;AAcF,eAAO,MAAM,KAAK,quCAUjB,CAAC"}

package/dist/page/workspaceStyles.js

@@ -0,0 +1,79 @@
+export const layout = `
+* { box-sizing: border-box; }
+body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.65 var(--sans); }
+a { color: var(--link); }
+button, select { font: inherit; color: inherit; }
+button, select, summary { cursor: pointer; }
+button, select { padding: 6px 10px; border: 1px solid var(--border); border-radius: 6px; background: var(--card); }
+:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
+.skip { position: fixed; top: -100px; left: 16px; z-index: 5; padding: 8px 16px; background: var(--card); }
+.skip:focus { top: 8px; }
+.workspace { display: grid; grid-template-columns: 248px minmax(0, 1fr); min-height: 100vh; }
+:root[data-sidebar="closed"] .workspace { grid-template-columns: minmax(0, 1fr); }
+.sidebar { --focus: #e2bc79; position: sticky; top: 0; align-self: start; height: 100vh; overflow-y: auto; padding: var(--space) 16px; background: var(--sidebar); color: var(--sidebar-text); }
+.sidebar[hidden] { display: none; }
+.brand { display: block; padding: 0 12px 28px; font-size: 24px; font-weight: 600; letter-spacing: -0.8px; text-decoration: none; color: var(--sidebar-text); }
+.brand span { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; letter-spacing: 0; color: var(--sidebar-muted); }
+.sidebar .nav-heading { margin: 0 12px 12px; font: 600 12px var(--sans); color: var(--sidebar-muted); }
+.files { font-size: 14px; }
+.files ul { list-style: none; margin: 0 0 10px; padding: 0; }
+.files li { display: flex; align-items: baseline; gap: 8px; margin: 0; padding: 4px 10px; border-radius: 5px; }
+.files li:has(a[aria-current="page"]) { background: #385242; }
+.files a { flex: 1; min-width: 0; color: var(--sidebar-text); text-decoration: none; overflow-wrap: anywhere; }
+.files a:hover, .files a[aria-current="page"] { text-decoration: underline; text-underline-offset: 4px; }
+.files details { margin: 8px 0; }
+.files summary { padding: 6px 10px; color: var(--sidebar-muted); overflow-wrap: anywhere; }
+.files details ul { margin-left: 14px; border-left: 1px solid var(--sidebar-border); }
+.age { color: var(--muted); font: 12px var(--mono); margin-left: 6px; white-space: nowrap; }
+.files .age { color: var(--sidebar-muted); margin: 0; flex-shrink: 0; }
+.page { min-width: 0; }
+.bar { display: flex; align-items: center; gap: 16px; padding: 16px var(--space); border-bottom: 1px solid var(--border); font-size: 13px; }
+.bar button { flex-shrink: 0; }
+.breadcrumbs { display: flex; flex-wrap: wrap; gap: 6px 10px; flex: 1; min-width: 0; overflow-wrap: anywhere; }
+.breadcrumbs > span:not(.separator) { min-width: 0; }
+.separator { color: var(--muted); }
+.live { color: var(--muted); font: 12px/1.9 var(--mono); }
+.live[data-state="down"], .live[data-state="stale"] { color: var(--danger); }
+.preferences { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px; align-items: center; padding: 14px var(--space) 0; color: var(--muted); font-size: 12px; }
+.preference { display: flex; gap: 8px; align-items: center; }
+#preference-status:empty { display: none; }
+#doc { padding: var(--space) var(--space) 64px; min-width: 0; }
+.document-view { max-width: calc(72ch + 2 * var(--space)); margin-inline: auto; }
+.board-view { max-width: 1600px; margin-inline: auto; }
+.meta { color: var(--muted); font-size: 13px; margin: 0; overflow-wrap: anywhere; }
+.meta .age { margin: 0; }
+@media (max-width: 760px) {
+  .workspace { grid-template-columns: minmax(0, 1fr); }
+  .sidebar { position: static; height: auto; max-height: 42vh; border-bottom: 1px solid var(--border); }
+  .brand { padding-bottom: 16px; }
+  .bar { flex-wrap: wrap; gap: 12px; }
+  .breadcrumbs { flex-basis: calc(100% - 100px); }
+  .live { margin-left: auto; }
+  .preferences { justify-content: flex-start; }
+  :root { --space: 18px; }
+}
+`;
+const light = `
+  color-scheme: light;
+  --bg: #f7f8f4; --surface: #edf1e7; --card: #ffffff; --text: #263c34; --muted: #596957;
+  --border: #d5dfd0; --link: #315f45; --danger: #a03024; --focus: #976323;
+  --sidebar: #203a30; --sidebar-text: #e7eee2; --sidebar-muted: #b6c8ad; --sidebar-border: #4a624c;
+`;
+const dark = `
+  color-scheme: dark;
+  --bg: #18251f; --surface: #26382d; --card: #203027; --text: #e7eee2; --muted: #b0c1a6;
+  --border: #455a48; --link: #b1d4a1; --danger: #ffafa2; --focus: #e2bc79;
+  --sidebar: #142219; --sidebar-text: #e7eee2; --sidebar-muted: #b6c8ad; --sidebar-border: #455a48;
+`;
+export const theme = `
+:root {
+  --sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  --mono: ui-monospace, SFMono-Regular, Menlo, monospace;
+  --space: 24px; --card-space: 20px;
+  ${light}
+}
+@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { ${dark} } }
+:root[data-theme="dark"] { ${dark} }
+:root[data-density="compact"] { --space: 16px; --card-space: 12px; }
+`;
+//# sourceMappingURL=workspaceStyles.js.map

package/dist/page/workspaceStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"workspaceStyles.js","sourceRoot":"","sources":["../../src/page/workspaceStyles.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsDrB,CAAC;AACF,MAAM,KAAK,GAAG;;;;;CAKb,CAAC;AACF,MAAM,IAAI,GAAG;;;;;CAKZ,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG;;;;;IAKjB,KAAK;;0EAEiE,IAAI;6BACjD,IAAI;;CAEhC,CAAC"}