@lovek4d/kickflip 0.3.1 → 0.5.0

package/board/public/dialogs.js

@@ -1,18 +1,56 @@
 // Every confirmation and notice is the browser's own window.confirm or window.alert; no page imitates a native dialog.
-// Load before any page script that asks (docs/adr/0146-confirmations-are-the-browsers-own.md).
+// Load before any page script that asks (docs/adr/2026-11-03-0259-confirmations-are-the-browsers-own.md).
 (function () {
   // linear: Hub's /_hub/api/linear answer, else loadLinear() fetches it once Linear is the source. Linear is picked only
-  // while Hub's key works; tapping it without one opens Hub's key modal over the page (linear-key.js,
-  // docs/adr/0117-a-board-picks-linear-only-while-hubs-key-works.md). A New board's "New project…" reads as
+  // while Hub's key works; tapping it without one opens Hub's key modal over the page, or with keyState the key field
+  // inline (linear-key.js,
+  // docs/adr/2026-11-02-1712-a-board-picks-linear-only-while-hubs-key-works.md). A New board's "New project…" reads as
   // new_project, which the hub creates on Start; Board Settings creates it with createProject. change(value, valid,
   // {loaded, typing}) follows each change: loaded when only Linear's lists arrived, typing while a text field is being typed in.
   // GitHub issues needs repo(), the board's GitHub owner/name: without one, as on a board whose repo is another git
-  // remote, it can't be picked and says why (docs/adr/0127-a-board-can-work-on-any-git-remote.md).
-  function ticketsControl(root, { value = { source: 'internal', prefix: 'INT' }, repo = () => '', title = () => '', linear = null, loadLinear, isNew = false, change = () => {}, createProject } = {}) {
+  // remote, it can't be picked and says why (docs/adr/2026-11-02-1850-a-board-can-work-on-any-git-remote.md).
+  // With keyState(), Hub's /_hub/api/settings `linear`, as Board Settings passes it, the source row reads its live state
+  // as a status word, and Linear tapped without a working key opens Hub's key field in keySlot, an element outside any
+  // form, since the key field is a form of its own; keyBusy(on) follows each save of the key
+  // (docs/adr/2026-11-04-0227-every-new-card-gets-a-ticket-in-the-boards-current-source.md).
+  function ticketsControl(root, { value = { source: 'internal', prefix: 'INT' }, repo = () => '', title = () => '', linear = null, loadLinear, isNew = false, change = () => {}, createProject, keyState, keySlot, keyBusy = () => {} } = {}) {
     const { esc } = BoardUI;
     const draft = { prefix: 'INT', ...value };
-    let creating = false, createError = '', destroyed = false, asking = false, noGithub = false;
+    let creating = false, createError = '', destroyed = false, asking = false, noGithub = false, key = null, inline = null;
     const works = () => Boolean(linear?.set && !linear.refused);
+    const keyWorks = () => Boolean(key?.set && !key.refused);
+    const keyWord = () => (keyWorks() ? 'linear key saved' : key.refused ? 'Linear refused the key' : 'no Linear key');
+    const statusWord = () => (draft.source === 'linear' && keyWorks() ? 'linear · connected' : `${draft.source} · ${keyWord()}`);
+    function status() {
+      if (!key) return '';
+      const on = draft.source === 'linear' && keyWorks();
+      return `<div class="tk-status${on ? ' on' : ''}" data-tk-status role="status"><span class="dot" aria-hidden="true"></span><b>${esc(statusWord())}</b></div>`;
+    }
+    // Hub's key field in keySlot. Once a key works, Linear is picked.
+    function openInline() {
+      if (!inline) {
+        keySlot.innerHTML = '<p class="tk-ask">Linear needs a key. Paste one here.</p><div class="hub-view"><main></main></div>';
+        inline = LinearKey.mount(keySlot.querySelector('main'), { linear: key, busy: keyBusy,
+          saved: (out) => { key = out.linear; render(); },
+          worked: async () => {
+            closeInline();
+            draft.source = 'linear';
+            await load();
+            if (destroyed) return;
+            pickDefaults();
+            render(); root.querySelector('[data-tk-source="linear"]').focus(); change(read(), valid());
+          } });
+        keySlot.hidden = false;
+      }
+      keySlot.querySelector('#linearKey')?.focus({ preventScroll: true });
+    }
+    function closeInline() {
+      if (!inline) return;
+      inline.destroy();
+      inline = null;
+      keySlot.hidden = true;
+      keySlot.innerHTML = '';
+    }
     async function load() {
       linear = { loading: true };
       render();
@@ -49,7 +87,7 @@
       const note = draft.project === '__new'
         ? (isNew ? `<p class="muted small">Start creates the project in the ${team} team on Linear.</p>` : `<p class="muted small">Creates the project in the ${team} team on Linear.</p>`)
         : `<p class="muted small">A new card gets a ${team} issue in ${esc(project?.name || draft.project || '')}, in the ${esc(linear.workspace || workspace())} workspace from Hub’s key. Its badge opens it in Linear.</p>`;
-      return `<div class="tk-grid"><label class="tk-field"><span>Team</span><select data-tk="team">${(linear.teams || []).map((t) => `<option value="${esc(t.key)}"${t.key === draft.team ? ' selected' : ''}>${esc(t.key)} · ${esc(t.name)}</option>`).join('')}</select></label><label class="tk-field"><span>Project</span><select data-tk="project">${(linear.projects || []).filter((p) => p.team === draft.team).map((p) => `<option value="${esc(p.id)}"${p.id === draft.project ? ' selected' : ''}>${esc(p.name)}</option>`).join('')}<option value="__new"${draft.project === '__new' ? ' selected' : ''}>New project…</option></select></label></div>${draft.project === '__new' ? `<div class="tk-new"><input data-tk="newName" value="${esc(draft.newName ?? title())}" aria-label="New Linear project name" placeholder="Project name" maxlength="80" autocomplete="off">${isNew ? '' : `<button type="button" data-tk-create${creating ? ' disabled' : ''}>${creating ? 'Creating…' : 'Create'}</button>`}</div>` : ''}${createError ? `<p class="muted small" role="alert">${esc(createError)}</p>` : ''}${note}`;
+      return `<div class="tk-grid"><label class="tk-field"><span>Team</span><select data-tk="team">${(linear.teams || []).map((t) => `<option value="${esc(t.key)}"${t.key === draft.team ? ' selected' : ''}>${esc(t.key)} · ${esc(t.name)}</option>`).join('')}</select></label><label class="tk-field"><span>Project</span><select data-tk="project">${(linear.projects || []).filter((p) => p.team === draft.team).map((p) => `<option value="${esc(p.id)}"${p.id === draft.project ? ' selected' : ''}>${esc(p.name)}</option>`).join('')}<option value="__new"${draft.project === '__new' ? ' selected' : ''}>New project…</option></select></label></div>${draft.project === '__new' ? `<div class="tk-new"><input data-tk="newName" value="${esc(draft.newName ?? title())}" aria-label="New Linear project name" placeholder="Project name" maxlength="80" autocomplete="off">${isNew ? '' : `<button type="button" data-tk-create${creating ? BoardUI.BUSY : ''}>Create</button>`}</div>` : ''}${createError ? `<p class="muted small" role="alert">${esc(createError)}</p>` : ''}${note}`;
     }
     function render() {
       const off = !repo();
@@ -60,7 +98,7 @@
       else if (draft.source === 'internal') detail = `<label class="tk-field"><span>Prefix</span><input data-tk="prefix" value="${esc(draft.prefix)}" placeholder="INT" maxlength="6" pattern="[A-Z]{2,6}" title="2–6 uppercase letters" autocapitalize="characters" autocomplete="off" spellcheck="false"></label><p class="muted small" data-tk-example>Cards number ${esc(draft.prefix || 'INT')}-1, ${esc(draft.prefix || 'INT')}-2… on this board. The badge opens the card.</p>`;
       else if (draft.source === 'github') detail = `<div class="who tk-static"><span>Issues in ${esc(repo())}<span class="muted small sub">${isNew ? 'The repo chosen above' : 'The board’s repo, set above'}. A new card opens an issue there${draft.account ? ` as gh account ${esc(draft.account)}` : ''}; its badge reads #41.</span></span></div>`;
       else detail = linearDetail();
-      root.innerHTML = `${segment}<div class="tk-detail">${noGithub && off && draft.source !== 'github' ? why : ''}${detail}</div>`;
+      root.innerHTML = `${status()}${segment}<div class="tk-detail">${noGithub && off && draft.source !== 'github' ? why : ''}${detail}</div>`;
       if (draft.source === 'linear' && ready()) {
         root.querySelector('[data-tk="team"]').value = draft.team || '';
         root.querySelector('[data-tk="project"]').value = draft.project || '';
@@ -76,6 +114,9 @@
       if (!works()) {
         draft.source = before;
         render();
+        await keyed;
+        if (destroyed) return;
+        if (key) { openInline(); return; }
         asking = true;
         const added = await LinearKey.open();
         asking = false;
@@ -108,6 +149,7 @@
       noGithub = button.dataset.tkSource === 'github' && !repo();
       if (noGithub) { render(); root.querySelector('[data-tk-source="github"]').focus(); return; }
       if (button.dataset.tkSource === 'linear') { pickLinear(); return; }
+      closeInline();
       draft.source = button.dataset.tkSource;
       render(); root.querySelector(`[data-tk-source="${draft.source}"]`).focus(); change(read(), valid());
     };
@@ -126,11 +168,13 @@
     root.addEventListener('change', input);
     render();
     if (draft.source === 'linear' && !linear) load().then(() => { if (destroyed) return; pickDefaults(); render(); change(read(), valid(), { loaded: true }); });
+    // Without an answer the row has no status word, and Linear without a key opens Hub's key modal as on New board.
+    const keyed = keyState ? keyState().then((state) => { if (destroyed) return; key = state; render(); }, () => {}) : null;
     return { read, valid, render, nameChanged() {
         const field = root.querySelector('[data-tk="newName"]');
         if (field && draft.newName === undefined) field.value = title();
       },
-      destroy() { destroyed = true; root.removeEventListener('click', click); root.removeEventListener('input', input); root.removeEventListener('change', input); } };
+      destroy() { destroyed = true; closeInline(); root.removeEventListener('click', click); root.removeEventListener('input', input); root.removeEventListener('change', input); } };
   }
   function fitSheet(sheet) {
     const vv = window.visualViewport;
@@ -193,16 +237,16 @@
       return d;
     };
     const fail = (e) => { if (!closed) { error.textContent = e.message; error.hidden = false; } };
-    // A repo already on the host joins from its folder instead (docs/adr/0143-kickflip-join-adds-the-current-repository-as-a-board.md).
+    // A repo already on the host joins from its folder instead (docs/adr/2026-11-03-0248-kickflip-join-adds-the-current-repository-as-a-board.md).
     const joinHint = current ? '' : '<p class="nb-help" data-join-hint>A repo already on the host running Kickflip? Run <code>kickflip join</code> in its folder.</p>';
     function sync() { start.disabled = sending || !(draft.github || draft.remote) || !draft.branch || (!current && (!draft.name.trim() || !tickets?.valid())); }
     // A repo row's id is its GitHub owner/name, or the git link of a repo on another host, which the row names by
     // host/path and labels with its host where a GitHub row says Private or Public
-    // (docs/adr/0127-a-board-can-work-on-any-git-remote.md).
+    // (docs/adr/2026-11-02-1850-a-board-can-work-on-any-git-remote.md).
     const idOf = (r) => r.github || r.remote;
     const nameOf = (r) => r.github || r.name;
     const access = (r) => (r.remote ? r.host : r.private ? 'Private' : 'Public');
-    const row = (r, highlighted = false) => `<button type="button" class="nb-repo${highlighted ? ' nb-repo-highlight' : ''}" data-repo="${esc(idOf(r))}"><strong>${esc(nameOf(r))}</strong>${r.listed === false ? '<span class="nb-repo-tag">Not in your list</span>' : ''}<span class="nb-help">${esc(access(r))} · <time datetime="${esc(r.pushedAt)}">${r.pushedAt ? `Pushed ${esc(new Date(r.pushedAt).toLocaleString())}` : r.listed === false ? 'Last push unknown' : 'No pushes yet'}</time></span><span class="nb-help">${esc(r.description)}</span><span class="nb-local">${r.cloned ? `✓ In .repos${r.shared.length ? ` · shared with ${esc(r.shared.map((b) => b.title).join(', '))}` : ' · already cloned'}` : 'Not cloned in .repos'}</span></button>`;
+    const row = (r, highlighted = false) => `<button type="button" class="nb-repo${highlighted ? ' nb-repo-highlight' : ''}" data-repo="${esc(idOf(r))}"><strong>${esc(nameOf(r))}</strong>${r.listed === false ? '<span class="nb-repo-tag">Not in your list</span>' : ''}<span class="nb-help">${esc(access(r))} · <time datetime="${esc(r.pushedAt)}">${r.pushedAt ? `Pushed ${esc(new Date(r.pushedAt).toLocaleString())}` : r.listed === false ? 'Last push unknown' : 'No pushes yet'}</time></span><span class="nb-help">${esc(r.description)}</span><span class="nb-local">${r.cloned ? `✓ Cloned${r.shared.length ? ` · shared with ${esc(r.shared.map((b) => b.title).join(', '))}` : ' · already cloned'}` : 'Not cloned yet'}</span></button>`;
     const results = (html) => { el.querySelector('[data-repo-results]').innerHTML = html; };
     function rows(query = '') {
       if (!signedIn) { results(''); return; }
@@ -278,7 +322,7 @@
       if (!edited) draft.name = nameOf(selected).split('/').at(-1);
       error.hidden = true;
       const shared = selected.shared.map((b) => b.title).join(', ');
-      content.innerHTML = `<button type="button" data-back-repos>‹ Back</button><p class="nb-next">${current ? 'Repo details' : '2 · Board details'}</p><div class="nb-selected"><strong>${esc(nameOf(selected))}</strong><span class="nb-help">${esc(access(selected))}</span><p>${selected.cloned ? shared ? `Shared with ${esc(shared)}` : 'Already cloned in .repos' : 'Clones to'}<code class="nb-clone">${esc(selected.clone)}</code></p></div><label class="nb-field"><span>Default branch for this board</span><select name="branch" disabled><option value="">Loading branches…</option></select><span class="nb-help" data-branch-help></span></label><p class="nb-next">Each board’s implementers work in separate worktrees off this clone. Sharing the clone doesn’t share their working files.</p>${current ? '<p class="nb-next">New implementers and GitHub links will use the selected repo.</p>' : `<label class="nb-field"><span>Name</span><input name="name" type="text" value="${esc(draft.name)}" required maxlength="60" autocomplete="off"></label><label class="nb-field"><span>What it’s for</span><input name="purpose" type="text" value="${esc(draft.purpose)}" maxlength="240"><span class="nb-help">One line to get the board started. Optional.</span></label><p class="nb-next">The hub ${selected.cloned ? 'reuses the clone' : 'clones the repo'} and starts your board. You can keep using your other boards.</p>`}`;
+      content.innerHTML = `<button type="button" data-back-repos>‹ Back</button><p class="nb-next">${current ? 'Repo details' : '2 · Board details'}</p><div class="nb-selected"><strong>${esc(nameOf(selected))}</strong><span class="nb-help">${esc(access(selected))}</span><p>${selected.cloned ? shared ? `Shared with ${esc(shared)}` : 'Already cloned' : 'Clones to'}<code class="nb-clone">${esc(selected.clone)}</code></p></div><label class="nb-field"><span>Default branch for this board</span><select name="branch" disabled><option value="">Loading branches…</option></select><span class="nb-help" data-branch-help></span></label><p class="nb-next">Each board’s implementers work in separate worktrees off this clone. Sharing the clone doesn’t share their working files.</p>${current ? '<p class="nb-next">New implementers and GitHub links will use the selected repo.</p>' : `<label class="nb-field"><span>Name</span><input name="name" type="text" value="${esc(draft.name)}" required maxlength="60" autocomplete="off"></label><label class="nb-field"><span>What it’s for</span><input name="purpose" type="text" value="${esc(draft.purpose)}" maxlength="240"><span class="nb-help">One line to get the board started. Optional.</span></label><p class="nb-next">The hub ${selected.cloned ? 'reuses the clone' : 'clones the repo'} and starts your board. You can keep using your other boards.</p>`}`;
       if (!current) {
         content.querySelectorAll('.nb-next')[content.querySelectorAll('.nb-next').length - 1].insertAdjacentHTML('beforebegin', '<div class="nb-field tk-section" role="group" aria-labelledby="nbTicketsLabel"><span id="nbTicketsLabel">Tickets</span><span class="nb-help">Where this board’s cards get their tickets. You can change it in Board settings.</span><div data-board-tickets></div></div>');
         tickets = ticketsControl(content.querySelector('[data-board-tickets]'), { value: draft.tickets, linear, loadLinear: async () => (linear = await request('/_hub/api/linear')),
@@ -327,7 +371,8 @@
       error.hidden = true;
       try {
         const repo = draft.remote ? { remote: draft.remote } : { github: draft.github };
-        await save(current ? { ...repo, branch: draft.branch } : { name: draft.name.trim(), purpose: draft.purpose.trim(), ...repo, branch: draft.branch, tickets: tickets.read() }, selected);
+        // Start, or Use repo, waits (ui.js waitOn) until the hub answers; a new board's own start then shows in the sidebar.
+        await BoardUI.waitOn(start, save(current ? { ...repo, branch: draft.branch } : { name: draft.name.trim(), purpose: draft.purpose.trim(), ...repo, branch: draft.branch, tickets: tickets.read() }, selected));
         sending = false;
         el.close();
       } catch (e) { sending = false; fail(e); sync(); }

package/board/public/hub-kit.js

@@ -52,6 +52,8 @@
   // the hub's answer, fail(message) a refusal. A checkbox marked data-submit saves on change, and a time input marked
   // data-autosave once its picker closes, so turning an iOS wheel doesn't save each value it passes. accepts(action, form)
   // limits it to some of those forms, since the Hub page and its hub settings each wire their own over one root.
+  // While a post is out its control waits (ui.js waitOn): the tapped button, or else the form's toggle or field, with
+  // the form's other buttons, the setting's other choices, disabled.
   // → {busy()}, true while a post is out
   function forms(B, { answer, fail, accepts = () => true }) {
     let sending = false;
@@ -65,9 +67,10 @@
       const body = new URLSearchParams(new FormData(form));
       if (e.submitter?.name) body.append(e.submitter.name, e.submitter.value);
       sending = true;
+      const post = fetch(action, { method: 'POST', headers: { accept: 'application/json', 'content-type': 'application/x-www-form-urlencoded' }, body })
+        .then(async (r) => [r, await r.json().catch(() => null)]);
       try {
-        const r = await fetch(action, { method: 'POST', headers: { accept: 'application/json', 'content-type': 'application/x-www-form-urlencoded' }, body });
-        const out = await r.json().catch(() => null);
+        const [r, out] = await BoardUI.waitOn(e.submitter || form.querySelector('input:not([type="hidden"]), select'), post, { group: form.querySelectorAll('button') });
         if (!B.alive()) return;
         if (r.ok && out) answer(out, action); else fail(out?.error || FAILED);
       } catch {
@@ -106,7 +109,7 @@
     const show = (next, isOn = false) => { if (!B.alive()) return; state = next; on = isOn; paint(); };
     // The endpoint this device last gave the hub, kept in this browser, so that once the subscription goes (the
     // browser dropped or replaced it, or notifications were blocked) the page tells the hub to forget it
-    // (docs/adr/0149-the-hub-reads-healthy-degraded-or-a-site-down.md).
+    // (docs/adr/2026-11-03-0501-the-hub-reads-healthy-degraded-or-a-site-down.md).
     const KEPT = 'kickflip.push.endpoint';
     const kept = () => { try { return localStorage.getItem(KEPT); } catch { return null; } };
     const keep = (endpoint) => { try { if (endpoint) localStorage.setItem(KEPT, endpoint); else localStorage.removeItem(KEPT); } catch { /* storage blocked here */ } };
@@ -138,7 +141,7 @@
     }
     async function enable() {
       busy = true;
-      show({ ...state, action: { ...state.action, disabled: true } }, on);
+      show({ ...state, action: { ...state.action, busy: true } }, on);
       try {
         if (await Notification.requestPermission() !== 'granted') { await render(); return; }
         const reg = await navigator.serviceWorker.register('/sw.js', { scope: '/' });
@@ -152,9 +155,9 @@
       finally { busy = false; }
     }
     async function test() {
-      show({ ...state, action: { ...state.action, disabled: true } }, true);
+      show({ ...state, action: { ...state.action, busy: true } }, true);
       const r = await post('/_hub/push/test').catch(() => null);
-      show({ ...state, action: { ...state.action, label: r?.sent ? 'Sent' : 'Could not send' } }, true);
+      show({ ...state, action: { ...state.action, busy: false, label: r?.sent ? 'Sent' : 'Could not send' } }, true);
     }
     B.on(B.root, 'click', (e) => {
       const act = e.target.closest?.('[data-device]')?.dataset.device;

package/board/public/hub.css

@@ -1,4 +1,4 @@
-/* The hub page and settings modals (view-hub.js, view-hub-settings.js, view-polling.js), whose root carries .hub-view, and the hub's
+/* The hub page and settings modals (view-hub.js, view-hub-settings.js), whose root carries .hub-view, and the hub's
    down page (hub/hub.mjs), whose <html> does, and the board's Hold sheet picker (ui-cards.js holdPicker), which shares the
    duration picker's rules; served as /_hub/app/hub.css and /_hub/hub.css. Every rule is under
    .hub-view, since style.css uses the same short class names. The app shell links it after style.css, so a rule here
@@ -47,22 +47,7 @@
 .hub-view .chips form { display:contents; }
 .hub-view .chips form.field { display:inline-flex; gap:6px; }
 .hub-view .chips .field input { min-height:0; padding:.2rem .5rem; width:7.5rem; }
-.hub-view .split { display:flex; gap:8px; justify-content:flex-end; }
-.hub-view .day { position:relative; padding:18px 0 20px; }
-.hub-view .day .bar { position:relative; height:40px; border-radius:8px; overflow:hidden; background:var(--chip); }
-.hub-view .day .seg { position:absolute; top:0; bottom:0; display:grid; place-items:center; overflow:hidden; border-right:2px solid var(--panel);
-  background:color-mix(in srgb, var(--muted) var(--k), var(--chip)); }
-.hub-view .day .seg.held { background-image:repeating-linear-gradient(135deg, transparent 0 5px, color-mix(in srgb, var(--text) 22%, transparent) 5px 8px); }
-.hub-view .day .seg.sel { box-shadow:inset 0 0 0 3px var(--text); z-index:2; }
-.hub-view .day .seg span { font-size:11px; font-weight:600; line-height:1.5; color:var(--text); background:color-mix(in srgb, var(--panel) 85%, transparent); border-radius:4px; padding:0 4px; }
-.hub-view .day .pin { position:absolute; top:2px; transform:translateX(-50%); color:var(--color-notice); font-size:11px; line-height:1; }
-.hub-view .day .now { position:absolute; top:14px; height:48px; width:2px; margin-left:-1px; background:var(--text); z-index:3; pointer-events:none; }
-.hub-view .day .ticks { position:absolute; left:0; right:0; bottom:0; height:16px; font-size:10px; color:var(--muted); }
-.hub-view .day .ticks span { position:absolute; transform:translateX(-50%); }
-.hub-view .day .ticks span:first-child { transform:none; } .hub-view .day .ticks span:last-child { transform:translateX(-100%); }
-.hub-view .legend { display:flex; gap:4px 12px; flex-wrap:wrap; font-size:11px; color:var(--muted); }
-.hub-view .legend i { display:inline-block; width:10px; height:10px; border-radius:2px; vertical-align:-1px; margin-right:4px; }
-.hub-view #day, .hub-view #window, .hub-view #quiet, .hub-view #wakes { scroll-margin-top:64px; }
+.hub-view .quiet-hint { margin:6px 14px 0; color:var(--muted); font-size:12px; }
 .hub-view .field input { flex:none; font:inherit; font-size:16px; color:var(--text); background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:.3rem .6rem; min-height:2.2rem; width:8.75rem; min-width:0; text-align:right; }
 .hub-view .field input[type=number] { width:5rem; }
 .hub-view .field input.toggle { width:1.4rem; height:1.4rem; min-height:0; padding:0; accent-color:var(--accent); }
@@ -102,6 +87,7 @@
 .hub-view .remembered { padding:0 12px 10px; color:var(--muted); font-size:12px; }
 .hub-view .remembered p { margin:0; }
 .hub-view .remembered ul { margin:4px 0 0; padding-left:18px; }
+.hub-view :is(.hub-modal, .sheet) code { white-space: pre-wrap; overflow-wrap: anywhere; }
 .hub-view .remembered code { white-space:pre-wrap; overflow-wrap:anywhere; }
 
 @media (max-width: 899px) {
@@ -167,4 +153,6 @@
 .hub-view .rd-fix button.link { padding: 0; font-size: inherit; }
 .hub-view .site-row > .site-link { flex:1; min-width:0; display:flex; align-items:center; gap:10px; color:inherit; }
 .hub-view .restart-btn { min-width:76px; min-height:34px; display:inline-flex; align-items:center; justify-content:center; gap:6px; }
-.hub-view .restart-btn .try-spin { width:9px; height:9px; }
+/* A waiting button keeps its own look (style.css button[aria-busy="true"]), over .btn's and a step's disabled dimming. */
+.hub-view button[aria-busy="true"]:disabled { opacity:1; }
+.hub-view .ub-step button[aria-busy="true"]:disabled { color:var(--text); }

package/board/public/linear-key.js

@@ -1,6 +1,6 @@
 // Hub's Linear key slot. Hub settings › Linear mounts it, and the Tickets control (dialogs.js) opens it over Board
 // settings or New board when Linear is tapped without a working key
-// (docs/adr/0117-a-board-picks-linear-only-while-hubs-key-works.md). A key saves on paste, change or Enter through
+// (docs/adr/2026-11-02-1712-a-board-picks-linear-only-while-hubs-key-works.md). A key saves on paste, change or Enter through
 // POST /_hub/settings/linear, which checks it with Linear; linear is hub/views.mjs settingsView's `linear`.
 (function () {
   const FAILED = 'Could not save. Is the host awake?';
@@ -68,7 +68,7 @@
     };
     const onClick = async (e) => {
       if (!e.target.closest?.('[data-linear-remove]') || pending) return;
-      if (await BoardDialogs.confirm('Boards on Linear can’t create issues or move tickets until you add a key again. Remove the Linear key?') && !destroyed) post(new URLSearchParams({ remove: '1' }));
+      if (await BoardDialogs.confirm('Boards on Linear fall back to internal tickets, and their cards keep the Linear tickets they have. Remove the Linear key?') && !destroyed) post(new URLSearchParams({ remove: '1' }));
     };
     const listeners = [['paste', onPaste], ['change', onChange], ['submit', onSubmit], ['click', onClick]];
     for (const [type, fn] of listeners) root.addEventListener(type, fn);
@@ -82,11 +82,13 @@
     };
   }
 
-  // Done's spinner while a save is out (style.css .settings-footer [aria-busy]).
+  // The footer's Done waits, disabled with a spinner in place of its word (style.css button[aria-busy="true"]), while a
+  // save is out; ✕, Escape and the backdrop close once it lands.
   function doneBusy(buttons, busy) {
     for (const b of buttons) {
+      if (!b.closest('.settings-footer')) continue;
+      b.disabled = busy;
       if (busy) b.setAttribute('aria-busy', 'true'); else b.removeAttribute('aria-busy');
-      if (b.closest('.settings-footer')) b.innerHTML = `${busy ? SPIN : ''}Done`;
     }
   }
 

package/board/public/log.html

@@ -0,0 +1,48 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
+<title>Log</title>
+<link rel="stylesheet" href="colors.css">
+<link rel="stylesheet" href="style.css">
+</head>
+<body>
+<!--header {"lead":"back","title":"Log","titleId":"ref","backHref":"./","controls":false}-->
+<main>
+  <p class="muted" id="note"></p>
+  <pre class="log" id="log">Loading the log…</pre>
+</main>
+<style>
+  /* The tail of a builder's log (GET /api/log), newest at the bottom. */
+  pre.log { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; }
+</style>
+<script>
+// Shows the tail of the log named by ?file=, last lines in view, and re-reads it every 3 seconds while it grows;
+// the page stays where the reader scrolled to when they've left the bottom.
+(function () {
+  const name = new URLSearchParams(location.search).get('file') || '';
+  const log = document.getElementById('log');
+  const note = document.getElementById('note');
+  document.getElementById('ref').textContent = name || 'Log';
+  document.title = name || 'Log';
+  let size = -1;
+  async function read() {
+    try {
+      const r = await fetch('api/log?file=' + encodeURIComponent(name), { cache: 'no-store' });
+      const body = await r.json();
+      if (!r.ok) { log.textContent = body.error || 'Could not load this log.'; return; }
+      if (body.size === size) return;
+      const atEnd = size === -1 || innerHeight + scrollY >= document.documentElement.scrollHeight - 40;
+      size = body.size;
+      log.textContent = body.text || 'The log is empty so far.';
+      note.textContent = body.truncated ? 'Showing the last 256 KiB.' : '';
+      if (atEnd) scrollTo(0, document.documentElement.scrollHeight);
+    } catch { /* the next read tries again */ }
+  }
+  read();
+  setInterval(read, 3000);
+})();
+</script>
+</body>
+</html>

package/board/public/new-task.js

@@ -0,0 +1,121 @@
+// The + button and the sheet that sends a new task as an ask event, on every page of a board: the board view's markup
+// (app.js) and each other view of a board (shell.js) put BoardNewTask.markup() in their root and wire it with
+// BoardNewTask.wire(B) once mounted. A board's view sends through B.send, which lands the board the ask changed; any
+// other view sends through its site. B.newTaskKey(ev) is the n-twice handler, which a framed page's document also feeds.
+globalThis.BoardNewTask = (function () {
+  const markup = () => `<button id="compose" class="fab" type="button" aria-label="New task" title="New task (press n twice)" aria-haspopup="dialog" aria-expanded="false"><svg width="35" height="35" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg></button>
+<dialog id="sheet" class="sheet" aria-labelledby="sheetTitle">
+  <form id="askForm" data-composer="ask">
+    <div class="sheet-head"><h2 id="sheetTitle">New task</h2><button type="button" class="ghost" id="sheetClose" aria-label="Close">✕</button></div>
+    ${BoardUI.dropZone('<textarea id="askText" rows="4" placeholder="Ask a question or give me a task…" autofocus></textarea>')}
+    <div class="pending-files" data-files></div>
+    <div class="tk-seg ask-seg" role="group" aria-label="Before building"><button type="button" id="askDiscuss" aria-pressed="true">Discuss</button><button type="button" id="askQuick" aria-pressed="false">Quick build</button></div>
+    <p class="muted small ask-choice-help" id="askChoiceHelp" aria-live="polite"></p>
+    <div class="row">
+      <span class="muted small" id="askStatus"></span>
+      <button type="submit" class="primary">Send</button>
+    </div>
+  </form>
+</dialog>`;
+
+  function wire(B) {
+    const { $, store, toast, quieted, sendDraft } = B;
+    const { attachButton, waitOn } = BoardUI;
+    const send = (kind, data) => (B.send ? B.send(kind, data) : B.site.send(kind, data));
+    // The ask box is a bottom sheet: a <dialog> opened from the + button. Closing keeps the draft.
+    const sheet = $('#sheet');
+    const reduceMotion = matchMedia('(prefers-reduced-motion: reduce)');
+    if (!$('#askForm .row .attach')) $('#askForm .row').insertAdjacentHTML('afterbegin', attachButton());
+    // Files picked before the app shell switched away from this board are still attached, so they show again.
+    BoardAttach.paint('ask', B.site.root);
+    const isMac = /Mac|iPhone|iPad/.test(navigator.platform || navigator.userAgent);
+    if (!$('#askForm .send-hint')) $('#askForm button[type=submit]').insertAdjacentHTML('beforebegin', `<span class="send-hint" aria-hidden="true">${isMac ? '⌘↵' : 'Ctrl+↵'}</span>`);
+    // ⌘↵ (Ctrl+↵ off a Mac) sends the ask from its box.
+    B.on($('#askText'), 'keydown', (ev) => {
+      if (ev.key !== 'Enter' || !(ev.metaKey || ev.ctrlKey) || ev.isComposing) return;
+      ev.preventDefault();
+      $('#askForm').requestSubmit();
+    });
+    $('#askText').value = store.get('draft:ask', '');
+    B.on($('#askText'), 'input', (e) => { if (!quieted('draft:ask', e.target)) store.set('draft:ask', e.target.value); });
+    let stopFitting = null;
+    const stopFit = () => { stopFitting?.(); stopFitting = null; };
+    B.on(sheet, 'close', stopFit);
+    B.atUnmount(stopFit);
+    function openSheet() {
+      if (sheet.open) return;
+      stopFit();
+      stopFitting = BoardDialogs.fitSheet(sheet);
+      sheet.classList.remove('closing');
+      sheet.showModal();
+      $('#askText').focus();
+      $('#compose').setAttribute('aria-expanded', 'true');
+    }
+    function closeSheet() {
+      if (!sheet.open || sheet.classList.contains('closing')) return;
+      $('#compose').setAttribute('aria-expanded', 'false');
+      if (reduceMotion.matches) { sheet.close(); return; }
+      sheet.classList.add('closing');
+      B.later(180, () => { sheet.classList.remove('closing'); sheet.close(); });
+    }
+    B.on($('#compose'), 'click', openSheet);
+    // n pressed twice opens the sheet, as the + button's tooltip says, unless a field or another dialog has focus. With
+    // nothing focused the key goes to <body>, outside the view, so this listens on the document, and a framed page's
+    // own document is given to the same handler (view-frame.js). A key switch mode used (sidebar.js) comes
+    // defaultPrevented and doesn't count.
+    const TWICE_MS = 500;
+    let lastN = -Infinity;
+    const newTaskKey = (ev) => {
+      if (ev.defaultPrevented) { lastN = -Infinity; return; }
+      if (ev.key !== 'n' || ev.metaKey || ev.ctrlKey || ev.altKey || ev.repeat || ev.isComposing) return;
+      const field = ev.target.closest && ev.target.closest('input, textarea, select, [contenteditable]:not([contenteditable="false"])');
+      if (field || document.querySelector('dialog[open]') || B.root.classList.contains('offline')) { lastN = -Infinity; return; }
+      if (ev.timeStamp - lastN > TWICE_MS) { lastN = ev.timeStamp; return; }
+      lastN = -Infinity;
+      ev.preventDefault();
+      openSheet();
+    };
+    B.newTaskKey = newTaskKey;
+    B.on(document, 'keydown', newTaskKey);
+    B.on($('#sheetClose'), 'click', closeSheet);
+    B.on(sheet, 'click', (ev) => { if (ev.target === sheet) closeSheet(); });
+    B.on(sheet, 'cancel', (ev) => { ev.preventDefault(); closeSheet(); });
+    // Discuss or Quick build, above Send: Discuss, the default, has the session grill or prototype the task at once; Quick
+    // build sends the ask with quick: true, and the session marks the card ready. Each send goes back to Discuss
+    // (docs/adr/2026-11-04-0131-every-new-task-is-grilled-or-prototyped-at-once.md).
+    const CHOICE_HELP = {
+      discuss: 'Discuss: Claude grills or prototypes it first, then waits for you.',
+      quick: 'Quick build: for changes you’re sure about; Claude marks it ready and builds.',
+    };
+    let quick = false;
+    function choose(isQuick) {
+      quick = isQuick;
+      $('#askDiscuss').setAttribute('aria-pressed', String(!quick));
+      $('#askQuick').setAttribute('aria-pressed', String(quick));
+      $('#askChoiceHelp').textContent = CHOICE_HELP[quick ? 'quick' : 'discuss'];
+    }
+    choose(false);
+    B.on(B.root, 'click', (ev) => {
+      const b = ev.target.closest('#askDiscuss, #askQuick');
+      if (b) choose(b.id === 'askQuick');
+    });
+    B.on($('#askForm'), 'submit', async (ev) => {
+      ev.preventDefault();
+      $('#askText').blur();
+      const text = $('#askText').value.trim();
+      const files = BoardAttach.files('ask', B.site.root);
+      if ((!text && !files.length) || BoardAttach.busy('ask', B.site.root)) return;
+      $('#askStatus').textContent = '';
+      try {
+        await waitOn($('#askForm button[type="submit"]'), sendDraft('draft:ask', $('#askText'), () => $('#askText'), () => send('ask', { text, ...(files.length ? { files } : {}), ...(quick ? { quick: true } : {}) })));
+        BoardAttach.clear('ask', B.site.root);
+        choose(false);
+        $('#askStatus').textContent = '';
+        closeSheet();
+        toast('Sent');
+      } catch { $('#askStatus').textContent = 'Could not send'; }
+    });
+  }
+
+  return { markup, wire };
+})();

package/board/public/prompts.js

@@ -1,5 +1,5 @@
 // Answering pending prompts from their Needs you lines (ui-prompts.js promptItem), on a board view and the hub page,
-// through the hub's POST /_hub/prompts/<id>/answer (docs/adr/0060-background-sessions-prompts-come-to-the-phone.md).
+// through the hub's POST /_hub/prompts/<id>/answer (docs/adr/2026-10-30-1516-background-sessions-prompts-come-to-the-phone.md).
 // Allow once, Deny, Skip and a single question's option send on the tap. Always allow confirms first, naming its rule,
 // since it covers every later call like it until the session ends. Several questions, or one taking several picks,
 // send with Send once each has a pick.
@@ -8,13 +8,14 @@ globalThis.PromptAnswers = (function () {
   // short message; after() runs once an answer has gone. → {state(p) for promptItem, shows(p)}
   function wire(B, { list, paint, notify, after = () => {} }) {
     const picks = new Map();
-    const sending = new Set();
+    // Each prompt whose answer is out, to the button tapped (ui-prompts.js promptItem's sending).
+    const sending = new Map();
     // Answered here, hidden until the view's next load drops them.
     const answered = new Set();
     const picksOf = (id) => { if (!picks.has(id)) picks.set(id, {}); return picks.get(id); };
 
-    async function send(p, body) {
-      sending.add(p.id);
+    async function send(p, body, tapped) {
+      sending.set(p.id, tapped);
       paint();
       try {
         const r = await fetch(`/_hub/prompts/${encodeURIComponent(p.id)}/answer`, { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify(body) });
@@ -40,23 +41,23 @@ globalThis.PromptAnswers = (function () {
         const got = mine[i] || [];
         const label = opt.dataset.promptOpt;
         mine[i] = q.multiSelect ? (got.includes(label) ? got.filter((l) => l !== label) : [...got, label]) : [label];
-        if (BoardUI.oneTap(p)) send(p, BoardUI.promptAnswer(p, mine));
+        if (BoardUI.oneTap(p)) send(p, BoardUI.promptAnswer(p, mine), `${i}:${label}`);
         else paint();
         return;
       }
       if (ev.target.closest('button[data-prompt-send]')) {
         const body = BoardUI.promptAnswer(p, picksOf(p.id));
-        if (body) send(p, body);
+        if (body) send(p, body, 'send');
         return;
       }
       const choice = ev.target.closest('button[data-prompt-choice]')?.dataset.promptChoice;
       if (!choice) return;
       if (choice === 'always' && !(await BoardDialogs.confirm(`Always allow ${p.rule} for the rest of this session?`))) return;
-      send(p, { choice });
+      send(p, { choice }, choice);
     });
 
     return {
-      state: (p) => ({ picks: picks.get(p.id) || {}, sending: sending.has(p.id) }),
+      state: (p) => ({ picks: picks.get(p.id) || {}, sending: sending.get(p.id) ?? null }),
       shows: (p) => !answered.has(p.id),
     };
   }

package/board/public/prototype-kit.js

@@ -1,5 +1,5 @@
 // What a prototype's take files get, on the page board/server.mjs serves from prototype.html for each topic recorded
-// with board.mjs prototype add (docs/adr/0089-the-board-serves-every-prototype-from-one-template.md). A take file,
+// with board.mjs prototype add (docs/adr/2026-11-01-1448-the-board-serves-every-prototype-from-one-template.md). A take file,
 // public/prototypes/<topic>/<KEY>.js, is a module:
 //   export function render(stage, kit) { stage.innerHTML = kit.hub(); return () => {…} }   // the cleanup is optional
 // render runs on every switch to that take with a fresh, empty stage; it may be async. The stage contains its layout
@@ -39,13 +39,13 @@
       ...(claude === null ? {} : { claude: reading(...[claude, 61].flat().slice(0, 2), 2 * 60_000, 3.4, 2.6) }),
       ...(codex === null ? {} : { codex: reading(...[codex, 40].flat().slice(0, 2), 6 * 60_000, 1.2, 4.1) }),
     }),
-    sidebar: () => ({ total: 1, sites: fake.sites(), hub: { tone: 'ok', word: 'Healthy', detail: '3 of 3 sites up' }, notifications: { state: 'on' }, usage: fake.usage() }),
+    sidebar: () => ({ total: 1, sites: fake.sites(), hub: { tone: 'ok', word: 'healthy', detail: '3 of 3 sites up' }, notifications: { state: 'on' }, usage: fake.usage() }),
     hub: () => ({
       usage: fake.usage(),
-      hub: { tone: 'ok', word: 'Healthy', detail: '3 of 3 sites up' },
+      hub: { tone: 'ok', word: 'healthy', detail: '3 of 3 sites up' },
       sites: fake.sites(),
-      polling: { title: 'Checks every 15 min until 6:00pm', lines: ['Next check 12:00pm · last 11:45am, 8 PRs, no change', 'No pushes queued.'], count: 0 },
-      settings: [['notifications', 'Notifications', 'Pushes on · Off on weekends · This device on'], ['polling', 'Polling', '3 windows, 52 checks a day · held overnight'],
+      polling: { title: 'Checks every minute while you’re here', lines: ['Next check 12:00pm · last 11:45am, 8 PRs, no change', 'No pushes queued.'], count: 0 },
+      settings: [['notifications', 'Notifications', 'Pushes on · Off on weekends · This device on'], ['quiet', 'Quiet hours', '10:00pm – 8:00am · pushes held'],
         ['codex', 'Codex share', 'Auto'], ['rules', 'Rules for every board', '1 rule'], ['closed', 'Closed boards', 'No closed boards']],
     }),
     items: () => [
@@ -63,7 +63,7 @@
   function hub(data = {}) {
     const d = { ...fake.hub(), header: true, ...data };
     const { row, tile, nowRow, CHEVRON } = HubUI;
-    const site = (s) => row({ icon: s.icon, title: esc(s.title), sub: s.status ?? '<span class="st ok">Up · listening · every link passes</span>', wrap: true, trail: CHEVRON, href: `/${s.route}/` });
+    const site = (s) => row({ icon: s.icon, title: esc(s.title), sub: s.status ?? '<span class="st ok">up · listening · every link passes</span>', wrap: true, trail: CHEVRON, href: `/${s.route}/` });
     const settings = d.settings.map(([id, title, sub]) => `<button type="button" class="hub-setting" data-setting="${esc(id)}" data-kit-inert aria-haspopup="dialog"><span class="text"><span class="title">${esc(title)}</span><span class="sub">${esc(sub)}</span></span>${CHEVRON}</button>`).join('');
     const usage = d.usageCard ?? HubUI.usageCard(d.usage);
     const header = d.header ? BoardUI.header({ lead: 'logo', title: 'Hub', time: 'now', logoSrc: '/_hub/kickflip.png', logoHref: '/_hub/', settingsHref: null }) : '';

package/board/public/prototype-switcher.js

@@ -1,4 +1,4 @@
-// The floating ‹ take › pill every prototype page switches its takes with (docs/adr/0015-prototypes-come-on-request.md).
+// The floating ‹ take › pill every prototype page switches its takes with (docs/adr/2026-10-29-1639-prototypes-come-on-request.md).
 // Load it with a relative src after claude.js, on a page whose header leads with the back arrow, then call
 //   const sw = PrototypeSwitcher.mount({ takes: { A: 'A. Name', … }, initial: 'A', render(take) {…}, above: el? })
 // render runs at mount and on each switch; sw.take is the current key. ←/→ switch unless a field has focus, and the
@@ -8,7 +8,7 @@
 // PrototypeSwitcher.current is the mounted switcher, whose go(key) shows another take in place; Waiting on you uses it
 // to switch its full-width frame without a reload (view-questions.js inPlace).
 // With ?take=<key> the page shows that take alone, with no header or pill, as questions.html frames it
-// (docs/adr/0048-a-questions-takes-show-inline.md); a page hides its own extras under html.ps-embed. There main's
+// (docs/adr/2026-10-29-1639-a-questions-takes-show-inline.md); a page hides its own extras under html.ps-embed. There main's
 // bottom padding, kept clear for the pill, shrinks to 12px whatever the page sets, since questions.html sizes the frame
 // to the page's height.
 (function () {
@@ -120,6 +120,8 @@
     let take = startTake(keys, params.get('variant'), initial);
     let question = null;
     let topics = [];
+    // The board's cards, which name their own question topics (ui-questions.js cardTopics).
+    let cards = [];
     // A push opened this page (board/store.mjs pushUrl). Read once and dropped from the URL, so a pick made here or a
     // reload stays on the page; only the first load sends an already-picked question on to its card's thread.
     let fromPush = params.get('from') === 'push';
@@ -154,8 +156,14 @@
       let board = null;
       try {
         board = await (await fetch(site.url('api/board'), { cache: 'no-store' })).json();
-        question = (board.owner || []).find((q) => q.id === qid) || null;
-        topics = board.ownerTopics || [];
+        topics = board.ownerTopics;
+        cards = board.items || [];
+        // A resolved question is left out of /api/board, and its topic's resolved questions hold it
+        // (docs/adr/2026-11-04-0128-the-board-download-leaves-out-resolved-questions.md).
+        const topic = topics.find((t) => t.questions.includes(qid));
+        question = board.owner.find((q) => q.id === qid)
+          || (topic && (await (await fetch(site.url('api/questions?topic=' + encodeURIComponent(topic.id)), { cache: 'no-store' })).json()).questions.find((q) => q.id === qid))
+          || null;
         if (!question) note('This prototype’s question is gone, so there is nothing to pick.');
       } catch { /* keep the last question shown */ }
       if (fromPush && pickedChoice(question)) {
@@ -179,7 +187,7 @@
         ui = await sharedQuestions(site);
         pills = ui.topicRow(topics, answered.topic).pills;
         const topic = topics.find((t) => t.id === answered.topic);
-        name = topic ? ui.topicName(topic) : '';
+        name = topic ? ui.topicName(ui.cardTopics([topic], cards)[0]) : '';
         await site.send('owner-answer', { id: answered.id, question: answered.question, choice: state.option.id, label: answerLabel(state.option), note: text.value.trim() });
       } catch { busy = false; paint(); note('Could not send. Is the host awake?'); return; }
       try { localStorage.removeItem(draftKey(qid)); } catch { /* nothing kept */ }