toolroll 0.9.53 → 0.9.55

package/dist/mcp-oauth.js

@@ -4,6 +4,8 @@ import { hashSecret, mintApiToken } from "./api-tokens.js";
 import { limitWords } from "./request-budget.js";
 import { sourceKey } from "./source-key.js";
 import { PKCE_CHALLENGE, readOAuthRegistration, readOAuthTokenRequest } from "./contracts/mcp-oauth.js";
+import { html, htmlString, joinHtml, postForm, styleElement } from "./html.js";
+import { withFormToken } from "./server/request-context.js";
 /** How long each piece lives. A code is spent at once; a grant ends after 30 days and the person consents again. */
 export const OAUTH_TIMES = { requestMs: 10 * 60_000, codeMs: 60_000, accessSeconds: 3600, grantDays: 30 };
 /** The most sign-ins waiting at once, and registered clients kept. */
@@ -33,7 +35,6 @@ export function oauthTokenAllowed(store, tokenId, path, now) {
 export const oauthProjects = (store, tokenId) => store.oauthGrant(tokenId)?.projects ?? null;
 const sha256 = (text) => createHash("sha256").update(text, "utf8").digest("hex");
 const same = (a, b) => { const x = Buffer.from(a), y = Buffer.from(b); return x.length === y.length && timingSafeEqual(x, y); };
-const escape = (text) => text.replace(/[&<>"']/g, one => `&#${one.charCodeAt(0)};`);
 const clean = (text) => text.replace(/[\u0000-\u001f\u007f-\u009f\u200b-\u200f\u202a-\u202e\u2066-\u2069]+/g, " ").replace(/\s+/g, " ").trim();
 /**
  * A redirect a client may register: https anywhere, or http on 127.0.0.1 / [::1] (RFC 8252 §7.3), with no
@@ -80,10 +81,10 @@ export function createOAuthHttp(options) {
     };
     const oauthError = (response, status, error, description) => json(response, status, { error, error_description: description });
     /** A page of this sign-in: script-free, never framed, posting only to this console. */
-    const page = (response, status, html) => {
+    const page = (response, status, document) => {
         response.writeHead(status, { "content-type": "text/html; charset=utf-8", "cache-control": "no-store", "referrer-policy": "no-referrer", "x-content-type-options": "nosniff", "x-frame-options": "DENY",
             "content-security-policy": "default-src 'none'; style-src 'unsafe-inline'; form-action 'self'; frame-ancestors 'none'; base-uri 'none'" });
-        response.end(html);
+        response.end(htmlString(document));
     };
     /**
      * On to an address by a page that moves on by itself, never a redirect: a redirect answering a form is held to
@@ -93,9 +94,9 @@ export function createOAuthHttp(options) {
     const moveOn = (response, to, words) => {
         response.writeHead(200, { "content-type": "text/html; charset=utf-8", "cache-control": "no-store", "referrer-policy": "no-referrer", "x-content-type-options": "nosniff", "x-frame-options": "DENY",
             "content-security-policy": "default-src 'none'; style-src 'unsafe-inline'; frame-ancestors 'none'; base-uri 'none'; form-action 'none'" });
-        response.end(`<!doctype html><html lang="en"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta http-equiv="refresh" content="0;url=${escape(to)}"><title>Toolroll</title>${STYLE}<main><p>${escape(words)} <a href="${escape(to)}">Continue</a></p></main></html>`);
+        response.end(htmlString(html `<!doctype html><html lang="en"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta http-equiv="refresh" content="0;url=${to}"><title>Toolroll</title>${STYLE}<main><p>${words} <a href="${to}">Continue</a></p></main></html>`));
     };
-    const problemPage = (response, status, title, said) => page(response, status, shell(title, `<h1>${escape(title)}</h1><p>${escape(said)}</p>`));
+    const problemPage = (response, status, title, said) => page(response, status, shell(title, html `<h1>${title}</h1><p>${said}</p>`));
     /** Back to the client with an answer: the code, or an error, and its state; `iss` names this console (RFC 9207). */
     const backToClient = (response, origin, redirectUri, state, answer, words) => {
         const to = new URL(redirectUri);
@@ -234,34 +235,34 @@ export function createOAuthHttp(options) {
         const title = "Connect to Toolroll";
         const projectList = projects.length === 0 ? "" : projects.map(path => {
             const name = path.split("/").filter(part => part !== "").pop() ?? path;
-            return `<label class="pick"><input type="checkbox" name="project" value="${escape(path)}"${checked.has(path) ? " checked" : ""}><span><b>${escape(name)}</b><small>${escape(path)}</small></span></label>`;
-        }).join("");
+            return html `<label class="pick"><input type="checkbox" name="project" value="${path}"${checked.has(path) ? " checked" : ""}><span><b>${name}</b><small>${path}</small></span></label>`;
+        });
         const step = session.sso?.fresh === true
-            ? `<p class="meta">Confirmed with ${escape(session.sso.label)}.</p><input type="hidden" name="password" value="">`
-            : `<label class="field">Your Toolroll password<input type="password" name="password" autocomplete="current-password" required></label>${session.sso === null ? "" : `<p class="meta"><a href="/login/sso?reauth=1&amp;return=${escape(encodeURIComponent(`/oauth/authorize?request=${id}`))}">Confirm with ${escape(session.sso.label)}</a> instead.</p>`}`;
-        const body = [
-            `<h1>${escape(title)}</h1>`,
-            `<p class="client"><b>${escape(client.name)}</b> <span class="tag">unverified</span> <span class="meta">returns to ${escape(host)}</span></p>`,
-            problem === null ? "" : `<div class="problem" role="alert">${escape(problem)}</div>`,
+            ? html `<p class="meta">Confirmed with ${session.sso.label}.</p><input type="hidden" name="password" value="">`
+            : html `<label class="field">Your Toolroll password<input type="password" name="password" autocomplete="current-password" required></label>${session.sso === null ? "" : html `<p class="meta"><a href="/login/sso?reauth=1&amp;return=${encodeURIComponent(`/oauth/authorize?request=${id}`)}">Confirm with ${session.sso.label}</a> instead.</p>`}`;
+        // The consent form carries the console session's own CSRF token (checked against session.csrf on the post).
+        const consentForm = (body) => withFormToken(session.csrf, () => postForm("/oauth/authorize", body, { hidden: { request: id } }));
+        const body = joinHtml([
+            html `<h1>${title}</h1>`,
+            html `<p class="client"><b>${client.name}</b> <span class="tag">unverified</span> <span class="meta">returns to ${host}</span></p>`,
+            problem === null ? "" : html `<div class="problem" role="alert">${problem}</div>`,
             projects.length === 0
-                ? `<p>You don't have access to any projects. Ask your Toolroll administrator to add you to one.</p>`
-                    + `<form method="post" action="/oauth/authorize"><input type="hidden" name="request" value="${escape(id)}"><input type="hidden" name="csrf" value="${escape(session.csrf)}"><button name="decision" value="deny" class="secondary">Cancel</button></form>`
-                : [
-                    `<p>Connects as ${escape(session.name)} in your selected projects. It can't approve work or change people or policy.</p>`,
-                    `<form method="post" action="/oauth/authorize">`,
-                    `<input type="hidden" name="request" value="${escape(id)}"><input type="hidden" name="csrf" value="${escape(session.csrf)}">`,
-                    `<fieldset><legend>Access</legend>`,
-                    `<label class="pick"><input type="radio" name="access" value="read"${access === "read" ? " checked" : ""}><span><b>Read</b><small>See tasks, results and status.</small></span></label>`,
-                    mayAct ? `<label class="pick"><input type="radio" name="access" value="act"${access === "act" ? " checked" : ""}><span><b>Act</b><small>Also file tasks under your name.</small></span></label>` : "",
-                    `</fieldset>`,
-                    `<fieldset><legend>Projects</legend>${projectList}</fieldset>`,
-                    `<p class="meta">Access lasts up to 30 days. Revoke it anytime in Settings → Sessions &amp; tokens.</p>`,
-                    step,
-                    `<div class="actions"><button name="decision" value="allow">Allow access</button><button name="decision" value="deny" class="secondary" formnovalidate>Cancel</button></div>`,
-                    `</form>`,
-                ].join(""),
-            `<details><summary>Client details</summary><p class="meta">Client ID <code>${escape(client.id)}</code><br>Returns to <code>${escape(one.redirectUri)}</code><br>Toolroll doesn't know who made this client; its name is what it says about itself.</p></details>`,
-        ].join("");
+                ? html `<p>You don't have access to any projects. Ask your Toolroll administrator to add you to one.</p>${consentForm(html `<button name="decision" value="deny" class="secondary">Cancel</button>`)}`
+                : joinHtml([
+                    html `<p>Connects as ${session.name} in your selected projects. It can't approve work or change people or policy.</p>`,
+                    consentForm(joinHtml([
+                        html `<fieldset><legend>Access</legend>`,
+                        html `<label class="pick"><input type="radio" name="access" value="read"${access === "read" ? " checked" : ""}><span><b>Read</b><small>See tasks, results and status.</small></span></label>`,
+                        mayAct ? html `<label class="pick"><input type="radio" name="access" value="act"${access === "act" ? " checked" : ""}><span><b>Act</b><small>Also file tasks under your name.</small></span></label>` : "",
+                        html `</fieldset>`,
+                        html `<fieldset><legend>Projects</legend>${projectList}</fieldset>`,
+                        html `<p class="meta">Access lasts up to 30 days. Revoke it anytime in Settings → Sessions &amp; tokens.</p>`,
+                        step,
+                        html `<div class="actions"><button name="decision" value="allow">Allow access</button><button name="decision" value="deny" class="secondary" formnovalidate>Cancel</button></div>`,
+                    ])),
+                ]),
+            html `<details><summary>Client details</summary><p class="meta">Client ID <code>${client.id}</code><br>Returns to <code>${one.redirectUri}</code><br>Toolroll doesn't know who made this client; its name is what it says about itself.</p></details>`,
+        ]);
         return shell(title, body);
     };
     async function authorizeConsent(request, response, url, origin) {
@@ -449,8 +450,7 @@ export function createOAuthHttp(options) {
     };
 }
 /** The sign-in's pages stand alone: no stylesheet, script or font loads here, so the palette rides inline. */
-const STYLE = [
-    `<style>`,
+const STYLE = styleElement([
     `:root{color-scheme:light dark;--ground:#efefef;--paper:#fff;--ink:#171717;--muted:#666;--line:#e6e6e6;--soft:#f2f2f2;--accent:#171717;--on-accent:#fff;--problem:#b42318}`,
     `@media (prefers-color-scheme:dark){:root{--ground:#0b0b0b;--paper:#161616;--ink:#ededed;--muted:#a1a1a1;--line:#262626;--soft:#1f1f1f;--accent:#ededed;--on-accent:#0b0b0b;--problem:#ff8a80}}`,
     `*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:24px 16px;background:var(--ground);color:var(--ink);font:15px/1.55 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}`,
@@ -467,6 +467,5 @@ const STYLE = [
     `.problem{border:1px solid var(--problem);color:var(--problem);border-radius:8px;padding:10px 12px;margin-bottom:14px}a{color:inherit;text-underline-offset:3px}`,
     `details{border-top:1px solid var(--line)}summary{cursor:pointer;color:var(--muted);font-size:13px;min-height:44px;padding:12px 0}code{font:12.5px/1.5 ui-monospace,"SF Mono",Menlo,monospace;background:var(--soft);border-radius:5px;padding:1px 5px;overflow-wrap:anywhere}`,
     `@media (max-width:480px){main{padding:20px}.field input{font-size:16px}.actions button{flex:1 1 auto}}`,
-    `</style>`,
-].join("");
-const shell = (title, body) => `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="color-scheme" content="light dark"><title>${escape(title)}</title>${STYLE}</head><body><main>${body}</main></body></html>`;
+].join(""));
+const shell = (title, body) => html `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="color-scheme" content="light dark"><title>${title}</title>${STYLE}</head><body><main>${body}</main></body></html>`;

package/dist/models-ui.d.ts

@@ -1,5 +1,6 @@
 /** Settings → Models: the CLIs on this computer, the default agent for each
  * role picked from live lists, and the models that just arrived. */
+import { type Html } from "./html.js";
 import type { ModelOption, RuntimeState, SeenModel, WatchState } from "./model-catalog.js";
 export declare const MODELS_CSS = ".models{max-width:780px;min-width:0;overflow-wrap:anywhere}.models .card{padding:16px 20px;margin:12px 0;min-width:0}.models h2{margin:24px 0 8px}.models form{margin:0}.models label{display:grid;gap:6px}.models select,.models input[type=search]{box-sizing:border-box;width:100%;max-width:100%;min-width:0}.models button,.models summary,.models .button-link{min-height:44px}.models button{white-space:nowrap}.models summary{padding:12px 0;cursor:pointer}.models .tool{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.models .role{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.models .role-row{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.models .role-row select{flex:1 1 240px;width:auto;min-width:0}.models .role-name{font-weight:600}.models .new{font-weight:600}.models ul{padding-left:20px}.models .meta{font-size:.86rem}@media(max-width:600px){.models .card{padding:14px}}";
 export type RoleView = {
@@ -29,6 +30,6 @@ export type ModelsView = {
     said: string | null;
     problem: string | null;
 };
-export declare function modelsHtml(view: ModelsView): string;
+export declare function modelsHtml(view: ModelsView): Html;
 /** Filters one long picker as you type; the saved choice always stays listed. */
 export declare function modelsScript(): string;

package/dist/models-ui.js

@@ -1,60 +1,50 @@
+/** Settings → Models: the CLIs on this computer, the default agent for each
+ * role picked from live lists, and the models that just arrived. */
+import { html, postForm } from "./html.js";
 import { priceWords } from "./model-catalog.js";
 import { whenUtc } from "./when-html.js";
-const e = (s) => String(s ?? "").replace(/[&<>"']/g, c => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" }[c]));
-const hidden = (data) => Object.entries(data).map(([k, v]) => `<input type="hidden" name="${e(k)}" value="${e(v)}">`).join("");
 const when = (iso) => iso === null ? "never" : whenUtc(iso);
 export const MODELS_CSS = `.models{max-width:780px;min-width:0;overflow-wrap:anywhere}.models .card{padding:16px 20px;margin:12px 0;min-width:0}.models h2{margin:24px 0 8px}.models form{margin:0}.models label{display:grid;gap:6px}.models select,.models input[type=search]{box-sizing:border-box;width:100%;max-width:100%;min-width:0}.models button,.models summary,.models .button-link{min-height:44px}.models button{white-space:nowrap}.models summary{padding:12px 0;cursor:pointer}.models .tool{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.models .role{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.models .role-row{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.models .role-row select{flex:1 1 240px;width:auto;min-width:0}.models .role-name{font-weight:600}.models .new{font-weight:600}.models ul{padding-left:20px}.models .meta{font-size:.86rem}@media(max-width:600px){.models .card{padding:14px}}`;
-function toolRow(one, manage, csrf) {
+function toolRow(one, manage) {
     const state = one.installed === null ? "Version unknown"
-        : one.behind ? `${e(one.installed)} · <strong>${e(one.latest)} available</strong>`
-            : `${e(one.installed)} · Up to date`;
+        : one.behind ? html `${one.installed} · <strong>${one.latest} available</strong>`
+            : `${one.installed} · Up to date`;
     const action = manage && one.behind && one.updateCommand !== null
-        ? `<form method="post" action="/settings/models/update">${hidden({ csrf, tool: one.tool })}<button type="submit">Update ${e(one.name)}</button></form>`
-        : one.behind ? `<span class="meta">Update it the way you installed it</span>` : "";
-    return `<div class="card tool"><span><strong>${e(one.name)}</strong> ${state}${one.problem === null ? "" : `<br><span class="meta">${e(one.problem)}</span>`}</span>${action}</div>`;
+        ? postForm("/settings/models/update", html `<button type="submit">Update ${one.name}</button>`, { hidden: { tool: one.tool } })
+        : one.behind ? html `<span class="meta">Update it the way you installed it</span>` : "";
+    return html `<div class="card tool"><span><strong>${one.name}</strong> ${state}${one.problem === null ? "" : html `<br><span class="meta">${one.problem}</span>`}</span>${action}</div>`;
 }
-function roleForm(role, manage, csrf) {
+function roleForm(role, manage) {
     if (!manage)
-        return `<div class="card role"><strong>${e(role.label)}</strong><span>${e(role.words)}</span></div>`;
+        return html `<div class="card role"><strong>${role.label}</strong><span>${role.words}</span></div>`;
     const known = role.groups.some(group => group.options.some(option => `${group.provider}|${option.value}` === role.current));
-    const saved = !known && role.current !== "inherit" && role.current !== "" ? `<option value="${e(role.current)}" selected>${e(role.words)} · current</option>` : "";
-    const groups = role.groups.map(group => `<optgroup label="${e(group.label)}">${group.options.map(option => {
+    const saved = !known && role.current !== "inherit" && role.current !== "" ? html `<option value="${role.current}" selected>${role.words} · current</option>` : "";
+    const groups = role.groups.map(group => html `<optgroup label="${group.label}">${group.options.map(option => {
         const value = `${group.provider}|${option.value}`;
-        return `<option value="${e(value)}"${value === role.current ? " selected" : ""}>${e(option.label)}</option>`;
-    }).join("")}</optgroup>`).join("");
-    const inherit = role.inherit ? `<option value="inherit"${role.current === "inherit" ? " selected" : ""}>Same as the builder</option>` : "";
+        return html `<option value="${value}"${value === role.current ? html ` selected` : ""}>${option.label}</option>`;
+    })}</optgroup>`);
+    const inherit = role.inherit ? html `<option value="inherit"${role.current === "inherit" ? html ` selected` : ""}>Same as the builder</option>` : "";
     const long = role.groups.reduce((sum, group) => sum + group.options.length, 0) > 40;
     const count = role.groups.reduce((sum, group) => sum + group.options.length, 0);
     const id = `role-${role.phase}`;
-    return `<form method="post" action="/settings/models/agent" class="card role">${hidden({ csrf, phase: role.phase })}` +
-        `<label class="role-name" for="${id}">${e(role.label)}</label>` +
-        (long ? `<input type="search" data-model-filter hidden aria-label="Search ${e(role.label.toLowerCase())} models" placeholder="Search ${count} models" autocomplete="off">` : "") +
-        `<div class="role-row"><select id="${id}" name="agent">${inherit}${saved}${groups}</select><button type="submit" class="secondary">Save</button></div></form>`;
+    return postForm("/settings/models/agent", html `<label class="role-name" for="${id}">${role.label}</label>${long ? html `<input type="search" data-model-filter hidden aria-label="Search ${role.label.toLowerCase()} models" placeholder="Search ${count} models" autocomplete="off">` : ""}<div class="role-row"><select id="${id}" name="agent">${inherit}${saved}${groups}</select><button type="submit" class="secondary">Save</button></div>`, { attrs: { class: "card role" }, hidden: { phase: role.phase } });
 }
 export function modelsHtml(view) {
     const manage = view.canManage && view.csrf !== "";
-    const status = view.said === null ? "" : `<p role="status">${e(view.said)}</p>`;
-    const problem = view.problem === null ? "" : `<p class="problem" role="alert">${e(view.problem)}</p>`;
+    const status = view.said === null ? "" : html `<p role="status">${view.said}</p>`;
+    const problem = view.problem === null ? "" : html `<p class="problem" role="alert">${view.problem}</p>`;
     const tools = view.runtimes.length === 0
-        ? `<p class="meta">No Claude, Codex or Gemini CLI found on this computer yet.</p>`
-        : view.runtimes.map(one => toolRow(one, manage, view.csrf)).join("");
+        ? html `<p class="meta">No Claude, Codex or Gemini CLI found on this computer yet.</p>`
+        : view.runtimes.map(one => toolRow(one, manage));
     const check = manage
-        ? `<form method="post" action="/settings/models/check" class="inline">${hidden({ csrf: view.csrf })}<button type="submit" class="secondary">Check now</button></form>`
+        ? postForm("/settings/models/check", html `<button type="submit" class="secondary">Check now</button>`, { attrs: { class: "inline" } })
         : "";
     const fresh = view.fresh.length === 0 ? "" :
-        `<h2>New models</h2><ul>${view.fresh.map(model => `<li><span class="new">${e(model.name)}</span> <span class="meta">${e(priceWords(model))}${model.releasedAt === null ? "" : ` · released ${e(model.releasedAt.slice(0, 10))}`}</span></li>`).join("")}</ul>`;
+        html `<h2>New models</h2><ul>${view.fresh.map(model => html `<li><span class="new">${model.name}</span> <span class="meta">${priceWords(model)}${model.releasedAt === null ? "" : ` · released ${model.releasedAt.slice(0, 10)}`}</span></li>`)}</ul>`;
     const watch = manage
-        ? `<details><summary>Automatic checks · ${view.watch.enabled ? "On" : "Off"}</summary><form method="post" action="/settings/models/watch">${hidden({ csrf: view.csrf, enabled: view.watch.enabled ? "0" : "1" })}` +
-            `<p>Check every 6 hours and send a message when a new model or CLI update appears. It uses public lists and sends nothing about you or your projects.</p>` +
-            `<button type="submit" class="secondary">${view.watch.enabled ? "Turn off" : "Turn on"}</button></form></details>`
+        ? html `<details><summary>Automatic checks · ${view.watch.enabled ? "On" : "Off"}</summary>${postForm("/settings/models/watch", html `<p>Check every 6 hours and send a message when a new model or CLI update appears. It uses public lists and sends nothing about you or your projects.</p><button type="submit" class="secondary">${view.watch.enabled ? "Turn off" : "Turn on"}</button>`, { hidden: { enabled: view.watch.enabled ? "0" : "1" } })}</details>`
         : "";
-    return `<section class="models">${status}${problem}` +
-        `<h2>AI tools</h2>${tools}<p class="meta">Checked ${when(view.watch.checkedAt)} ${check}</p>` +
-        fresh +
-        `<h2>Default agents</h2><p class="meta">New tasks use these. Approved tasks keep the agents they were approved with.</p>` +
-        view.roles.map(role => roleForm(role, manage, view.csrf)).join("") +
-        (view.chat === null ? "" : `<h2>Chat</h2><p>${e(view.chat.words)} · <a href="/settings/lead">Change</a></p>`) +
-        watch + `</section>`;
+    return html `<section class="models">${status}${problem}<h2>AI tools</h2>${tools}<p class="meta">Checked ${when(view.watch.checkedAt)} ${check}</p>${fresh}<h2>Default agents</h2><p class="meta">New tasks use these. Approved tasks keep the agents they were approved with.</p>${view.roles.map(role => roleForm(role, manage))}${view.chat === null ? "" : html `<h2>Chat</h2><p>${view.chat.words} · <a href="/settings/lead">Change</a></p>`}${watch}</section>`;
 }
 /** Filters one long picker as you type; the saved choice always stays listed. */
 export function modelsScript() {

package/dist/modes.d.ts

@@ -13,6 +13,7 @@
  * owns the transactions; the tick owns the rails; serve owns the
  * ceremony screens.
  */
+import { type ChatProvider } from "./contracts/chat-tables.js";
 export type ModeName = "standard" | "hands-off";
 export type ModeTerms = {
     name: ModeName;
@@ -64,12 +65,16 @@ export type ModeTerms = {
      * `repairAuto` is also true — a mode may sign a cap without signing the
      * authority, but never the reverse. */
     repairMaxAttempts: number;
-    /** Explicit opt-in: the signer's paired Telegram chat may approve this
+    /** Explicit opt-in: the signer's paired chat may approve this
      * repository's plans and merge its ready pull requests with two taps,
      * for the mode's lifetime. A plan that widens permissions, exceeds the
      * per-attempt budget or touches protected paths still opens Toolroll.
      * Legacy modes read FALSE — never inherited, only freshly signed. */
     chatApprove: boolean;
+    /** The chat apps `chatApprove` names, signed with it. Absent on a mode signed before chat apps other than Telegram
+     * could approve: its words said "your paired Telegram chat", so it stays Telegram only (chatApproveChatsOf). A wider
+     * grant is only ever a fresh signature naming the apps. */
+    chatApproveChats?: readonly ChatProvider[];
     absoluteExpiry: string;
 };
 export declare const MODE_MAX_DAYS = 7;
@@ -82,6 +87,13 @@ export declare function modeTermsJson(terms: ModeTerms): string;
 export declare function modeDigestOf(terms: ModeTerms): string;
 /** Strict rehydration — anything unexpected is null, never a guess. */
 export declare function modeTermsFromJson(json: string | null): ModeTerms | null;
+/** The chat apps a mode lets its signer approve from: none without chatApprove; Telegram alone for a grant signed
+ * before it named its apps (that is what its words said); otherwise exactly the apps it names. */
+export declare function chatApproveChatsOf(terms: Pick<ModeTerms, "chatApprove" | "chatApproveChats">): readonly ChatProvider[];
+/** What a new chatApprove signature names: every chat app, said in its words. */
+export declare const CHAT_APPROVE_ALL: readonly ChatProvider[];
+/** "Telegram", "Telegram or Slack", "Telegram, Slack, Discord or Teams". */
+export declare const chatNames: (chats: readonly ChatProvider[]) => string;
 /** Every term in words — what the ceremony renders and the password
  * signs. The reversal sentence is verbatim from the chain (C1). */
 export declare function modeWords(terms: ModeTerms): string[];

package/dist/modes.js

@@ -14,6 +14,7 @@
  * ceremony screens.
  */
 import { createHash } from "node:crypto";
+import { CHAT_PROVIDERS, isChatProvider } from "./contracts/chat-tables.js";
 export const MODE_MAX_DAYS = 7;
 /** The presets are STARTING POINTS the ceremony renders in full — the
  * signature always covers the resolved terms, never a label. */
@@ -120,6 +121,10 @@ export function modeTermsFromJson(json) {
         (t["repairMaxAttempts"] === undefined ||
             (typeof t["repairMaxAttempts"] === "number" && Number.isInteger(t["repairMaxAttempts"]) && t["repairMaxAttempts"] >= 0 && t["repairMaxAttempts"] <= 3)) &&
         (t["chatApprove"] === undefined || typeof t["chatApprove"] === "boolean") &&
+        // chatApproveChats: absent (a Telegram-only grant, or none), or the apps a chatApprove term names, each once.
+        (t["chatApproveChats"] === undefined ||
+            (t["chatApprove"] === true && Array.isArray(t["chatApproveChats"]) && t["chatApproveChats"].length > 0 &&
+                t["chatApproveChats"].every(isChatProvider) && new Set(t["chatApproveChats"]).size === t["chatApproveChats"].length)) &&
         typeof t["absoluteExpiry"] === "string" &&
         !Number.isNaN(Date.parse(t["absoluteExpiry"]))) {
         return {
@@ -138,11 +143,22 @@ export function modeTermsFromJson(json) {
             repairAuto: t["repairAuto"] === true,
             repairMaxAttempts: typeof t["repairMaxAttempts"] === "number" ? t["repairMaxAttempts"] : 0,
             chatApprove: t["chatApprove"] === true,
+            ...(Array.isArray(t["chatApproveChats"]) ? { chatApproveChats: [...t["chatApproveChats"]] } : {}),
             absoluteExpiry: t["absoluteExpiry"],
         };
     }
     return null;
 }
+/** The chat apps a mode lets its signer approve from: none without chatApprove; Telegram alone for a grant signed
+ * before it named its apps (that is what its words said); otherwise exactly the apps it names. */
+export function chatApproveChatsOf(terms) {
+    return !terms.chatApprove ? [] : terms.chatApproveChats ?? ["telegram"];
+}
+/** What a new chatApprove signature names: every chat app, said in its words. */
+export const CHAT_APPROVE_ALL = CHAT_PROVIDERS;
+const CHAT_NAMES = { telegram: "Telegram", slack: "Slack", discord: "Discord", teams: "Teams" };
+/** "Telegram", "Telegram or Slack", "Telegram, Slack, Discord or Teams". */
+export const chatNames = (chats) => chats.length <= 1 ? chats.map(one => CHAT_NAMES[one]).join("") : `${chats.slice(0, -1).map(one => CHAT_NAMES[one]).join(", ")} or ${CHAT_NAMES[chats[chats.length - 1]]}`;
 /** Every term in words — what the ceremony renders and the password
  * signs. The reversal sentence is verbatim from the chain (C1). */
 export function modeWords(terms) {
@@ -178,7 +194,7 @@ export function modeWords(terms) {
         ...(terms.repairAuto
             ? ["historical automatic repair grants are retained on record but no longer schedule work"] : []),
         ...(terms.chatApprove
-            ? ["your paired Telegram chat may approve this repository's plans and merge its ready pull requests, two taps each, without your password; a plan that widens permissions, exceeds the per-attempt cap above or touches protected paths still opens Toolroll"] : []),
+            ? [`your paired ${chatNames(chatApproveChatsOf(terms))} chat may approve this repository's plans and merge its ready pull requests, two taps each, without your password; a plan that widens permissions, exceeds the per-attempt cap above or touches protected paths still opens Toolroll`] : []),
         `everything above ends at ${terms.absoluteExpiry.slice(0, 16).replace("T", " ")} — revoking it earlier is one click, and every act it covered falls back to its own ceremony`,
     ];
 }

package/dist/monitoring-ui.d.ts

@@ -3,6 +3,7 @@
  * the company's tools. One form, the status of each destination beside it,
  * and how Prometheus reads `/metrics`. The signing secret is shown once.
  */
+import { type Html } from "./html.js";
 import type { MonitoringStatus } from "./store.js";
 import type { MonitoringSettings } from "./monitoring-settings.js";
 export declare const MONITORING_CSS: string;
@@ -12,9 +13,9 @@ export type MonitoringView = {
     head: number;
     origin: string | null;
 };
-export declare function monitoringHtml(view: MonitoringView, csrf: string, notice: {
+export declare function monitoringHtml(view: MonitoringView, notice: {
     said?: string | null;
     problem?: string | null;
-}): string;
+}): Html;
 /** The webhook's signing secret, once: a focused page with no script. */
-export declare function signingSecretHtml(url: string, secret: string): string;
+export declare function signingSecretHtml(url: string, secret: string): Html;

package/dist/monitoring-ui.js

@@ -1,6 +1,11 @@
+/**
+ * Settings → Monitoring (v104): an instance operator points Toolroll at
+ * the company's tools. One form, the status of each destination beside it,
+ * and how Prometheus reads `/metrics`. The signing secret is shown once.
+ */
+import { html, postForm } from "./html.js";
 import { targetOf } from "./monitoring.js";
 import { whenUtc } from "./when-html.js";
-const e = (value) => String(value ?? "").replace(/[&<>"']/g, c => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[c]);
 const when = (at) => whenUtc(at);
 export const MONITORING_CSS = `.monitoring{max-width:720px;min-width:0}.monitoring fieldset{border:0;padding:0;margin:20px 0 0;min-width:0}` +
     `.monitoring legend{font-weight:600;font-size:.9375rem;margin-bottom:6px}.monitoring label{display:grid;gap:4px;margin:10px 0 0;font-size:.875rem}` +
@@ -15,38 +20,20 @@ function statusLine(view, sink, address) {
     // A status for another address (it just changed) says nothing about this one yet.
     const one = view.status.find(row => row.sink === sink && row.target === targetOf(address));
     if (one === undefined || (one.lastOkAt === null && one.lastError === null))
-        return `<p class="status meta" data-monitoring="${sink}" data-state="starting">Starting: the first delivery goes out within a few seconds.</p>`;
+        return html `<p class="status meta" data-monitoring="${sink}" data-state="starting">Starting: the first delivery goes out within a few seconds.</p>`;
     if (one.failures > 0 && one.lastError !== null) {
-        return `<p class="status problem" role="alert" data-monitoring="${sink}" data-state="failing">Failing: ${e(one.lastError)}${one.nextTryAt === null ? "" : ` · trying again ${when(one.nextTryAt)}`}</p>`;
+        return html `<p class="status problem" role="alert" data-monitoring="${sink}" data-state="failing">Failing: ${one.lastError}${one.nextTryAt === null ? "" : html ` · trying again ${when(one.nextTryAt)}`}</p>`;
     }
     const behind = Math.max(0, view.head - one.through);
-    return `<p class="status meta" data-monitoring="${sink}" data-state="ok">${sink === "traces" ? "Sending" : `Sent through entry #${one.through}`}${one.lastOkAt === null ? "" : ` · last ${when(one.lastOkAt)}`}${behind > 0 && sink !== "traces" ? ` · ${behind} to go` : ""}</p>`;
+    return html `<p class="status meta" data-monitoring="${sink}" data-state="ok">${sink === "traces" ? "Sending" : `Sent through entry #${one.through}`}${one.lastOkAt === null ? "" : html ` · last ${when(one.lastOkAt)}`}${behind > 0 && sink !== "traces" ? ` · ${behind} to go` : ""}</p>`;
 }
-export function monitoringHtml(view, csrf, notice) {
+export function monitoringHtml(view, notice) {
     const s = view.settings;
-    const note = notice.problem ? `<p class="problem" role="alert">${e(notice.problem)}</p>` : notice.said ? `<p role="status">${e(notice.said)}</p>` : "";
+    const note = notice.problem ? html `<p class="problem" role="alert">${notice.problem}</p>` : notice.said ? html `<p role="status">${notice.said}</p>` : "";
     const metrics = view.origin === null ? "/metrics" : `${view.origin}/metrics`;
-    return `<section class="monitoring">${note}` +
-        `<form method="post" action="/settings/monitoring"><input type="hidden" name="csrf" value="${e(csrf)}">` +
-        `<fieldset><legend>Audit stream</legend><p class="meta">Every ledger entry with its seal, as it happens, to your log system.</p>` +
-        `<label>Webhook<input type="url" name="webhook" value="${e(s.webhook?.url ?? "")}" placeholder="https://logs.example.com/standing-orders" spellcheck="false"></label>` +
-        statusLine(view, "webhook", s.webhook?.url ?? null) +
-        (s.webhook === null ? "" : `<label class="choice"><input type="checkbox" name="rotate" value="1"> Make a new signing secret</label>`) +
-        `<label>Folder (JSON Lines, a file per day)<input type="text" name="folder" value="${e(s.folder?.path ?? "")}" placeholder="/var/log/standing-orders" spellcheck="false"></label>` +
-        statusLine(view, "folder", s.folder?.path ?? null) + `</fieldset>` +
-        `<fieldset><legend>Traces</legend><p class="meta">Each run as an OpenTelemetry span: timings, model, tokens and cost. Never a prompt or code.</p>` +
-        `<label>Collector (OTLP over HTTP)<input type="url" name="traces" value="${e(s.traces?.endpoint ?? "")}" placeholder="https://otel.example.com:4318" spellcheck="false"></label>` +
-        statusLine(view, "traces", s.traces?.endpoint ?? null) +
-        `<label>Header name (optional)<input type="text" name="header-name" value="${e(s.traces?.header?.name ?? "")}" placeholder="x-honeycomb-team" spellcheck="false"></label>` +
-        `<label>Header value<input type="password" name="header-value" autocomplete="off" placeholder="${s.traces?.header ? "Saved; leave blank to keep" : "API key"}"></label></fieldset>` +
-        `<div class="step-up"><label>Your Toolroll password<input type="password" name="password" autocomplete="current-password"></label></div>` +
-        `<button type="submit">Save</button></form>` +
-        `<fieldset><legend>Metrics</legend><p class="meta">Prometheus reads <code>${e(metrics)}</code> with an instance operator's API token (<a href="/settings/sessions">Sessions &amp; tokens</a>).</p>` +
-        `<details><summary>Example</summary><pre>curl -H "Authorization: Bearer so_…" ${e(metrics)}</pre></details></fieldset></section>`;
+    return html `<section class="monitoring">${note}${postForm("/settings/monitoring", html `<fieldset><legend>Audit stream</legend><p class="meta">Every ledger entry with its seal, as it happens, to your log system.</p><label>Webhook<input type="url" name="webhook" value="${s.webhook?.url ?? ""}" placeholder="https://logs.example.com/standing-orders" spellcheck="false"></label>${statusLine(view, "webhook", s.webhook?.url ?? null)}${s.webhook === null ? "" : html `<label class="choice"><input type="checkbox" name="rotate" value="1"> Make a new signing secret</label>`}<label>Folder (JSON Lines, a file per day)<input type="text" name="folder" value="${s.folder?.path ?? ""}" placeholder="/var/log/standing-orders" spellcheck="false"></label>${statusLine(view, "folder", s.folder?.path ?? null)}</fieldset><fieldset><legend>Traces</legend><p class="meta">Each run as an OpenTelemetry span: timings, model, tokens and cost. Never a prompt or code.</p><label>Collector (OTLP over HTTP)<input type="url" name="traces" value="${s.traces?.endpoint ?? ""}" placeholder="https://otel.example.com:4318" spellcheck="false"></label>${statusLine(view, "traces", s.traces?.endpoint ?? null)}<label>Header name (optional)<input type="text" name="header-name" value="${s.traces?.header?.name ?? ""}" placeholder="x-honeycomb-team" spellcheck="false"></label><label>Header value<input type="password" name="header-value" autocomplete="off" placeholder="${s.traces?.header ? "Saved; leave blank to keep" : "API key"}"></label></fieldset><div class="step-up"><label>Your Toolroll password<input type="password" name="password" autocomplete="current-password"></label></div><button type="submit">Save</button>`)}<fieldset><legend>Metrics</legend><p class="meta">Prometheus reads <code>${metrics}</code> with an instance operator's API token (<a href="/settings/sessions">Sessions &amp; tokens</a>).</p><details><summary>Example</summary><pre>curl -H "Authorization: Bearer so_…" ${metrics}</pre></details></fieldset></section>`;
 }
 /** The webhook's signing secret, once: a focused page with no script. */
 export function signingSecretHtml(url, secret) {
-    return `<h1>Signing secret</h1><div class="card"><p>Give this to the receiver at <span class="mono">${e(url)}</span>. It's shown once.</p><p class="mono secret-value">${e(secret)}</p>` +
-        `<p class="meta">Each request carries <code>x-standing-orders-signature: t=&lt;time&gt;,v1=&lt;HMAC-SHA256 of "time.body"&gt;</code>. Check it, and that the time is recent.</p></div>` +
-        `<p class="meta"><a href="/settings/monitoring">Back to Monitoring</a></p>`;
+    return html `<h1>Signing secret</h1><div class="card"><p>Give this to the receiver at <span class="mono">${url}</span>. It's shown once.</p><p class="mono secret-value">${secret}</p><p class="meta">Each request carries <code>x-standing-orders-signature: t=&lt;time&gt;,v1=&lt;HMAC-SHA256 of "time.body"&gt;</code>. Check it, and that the time is recent.</p></div><p class="meta"><a href="/settings/monitoring">Back to Monitoring</a></p>`;
 }

package/dist/notification-rows.d.ts

@@ -0,0 +1,30 @@
+/** Saved notifications, read and told apart without a store: the row readers, the lifecycle key and the predicates
+ * the store and the chat core (chat-messages.ts) share. A leaf: it imports types only. */
+import type { MateProposal, Notification, NotificationReceipt } from "./store.js";
+/** The one task a card is about: a task its confirmation created (a new
+ * task, a revision), else the task it names (and, for feedback on a result,
+ * that result). Null for a card about no single task. A pointer for
+ * replies, never an authority. */
+export declare function proposalTaskOf(proposal: MateProposal | null): {
+    task: string;
+    run: number | null;
+} | null;
+/** Every lifecycle dedupe key starts here: `life:<kind>:<identity>:<ordinal>`. */
+export declare const LIFECYCLE_KEY_PREFIX = "life:";
+/**
+ * Task lifecycle updates (Telegram task updates, 2026-09-16): the CLOSED
+ * vocabulary of routine progress facts the shared mutations record beside
+ * the change that made them true. None carries a push class — they are
+ * digest-eligible progress, never a page — and every one is project-bound
+ * through the task it names. A decision, incident, gap, stall, publication
+ * or merge page keeps its own producer; nothing here repeats one.
+ */
+export declare const LIFECYCLE_KINDS: readonly ["task-filed", "scope-approved", "approval-withdrawn", "task-held", "task-released", "task-queued", "task-requeued", "task-cancelled", "run-started", "run-phase", "check-progress", "run-finished", "run-stopping", "run-stopped", "run-resumed", "review-requested", "review-finished", "acceptance-evidence", "acceptance-ready"];
+export type LifecycleKind = (typeof LIFECYCLE_KINDS)[number];
+/** A progress fact, told apart by its durable key — never by display text. */
+export declare function isLifecycleNotification(row: Pick<Notification, "dedupeKey">): boolean;
+/** Only known progress producers can repaint a card. Decisions and urgent
+ * incidents keep their own alerts; a routine retry updates its saved attempt. */
+export declare function isTelegramProgressNotification(row: Pick<Notification, "dedupeKey" | "kind" | "pushClass" | "run">): boolean;
+export declare function readNotification(row: Record<string, unknown>): Notification;
+export declare function readNotificationReceipt(row: Record<string, unknown>): NotificationReceipt;

package/dist/notification-rows.js

@@ -0,0 +1,102 @@
+/** The one task a card is about: a task its confirmation created (a new
+ * task, a revision), else the task it names (and, for feedback on a result,
+ * that result). Null for a card about no single task. A pointer for
+ * replies, never an authority. */
+export function proposalTaskOf(proposal) {
+    if (proposal === null)
+        return null;
+    const named = typeof proposal.payload["task"] === "string" && proposal.payload["task"] !== "" ? proposal.payload["task"] : null;
+    const creates = proposal.kind === "task" || (proposal.kind === "review" && proposal.payload["operation"] === "revise");
+    const made = creates && proposal.state === "confirmed" ? proposal.outcome?.["taskId"] : undefined;
+    if (typeof made === "string" && made !== "" && made !== named)
+        return { task: made, run: null };
+    if (named === null)
+        return null;
+    const run = proposal.kind === "review" ? proposal.payload["run"] : null;
+    return { task: named, run: typeof run === "number" && Number.isSafeInteger(run) ? run : null };
+}
+/** Every lifecycle dedupe key starts here: `life:<kind>:<identity>:<ordinal>`. */
+export const LIFECYCLE_KEY_PREFIX = "life:";
+/**
+ * Task lifecycle updates (Telegram task updates, 2026-09-16): the CLOSED
+ * vocabulary of routine progress facts the shared mutations record beside
+ * the change that made them true. None carries a push class — they are
+ * digest-eligible progress, never a page — and every one is project-bound
+ * through the task it names. A decision, incident, gap, stall, publication
+ * or merge page keeps its own producer; nothing here repeats one.
+ */
+export const LIFECYCLE_KINDS = [
+    "task-filed",
+    "scope-approved",
+    "approval-withdrawn",
+    "task-held",
+    "task-released",
+    "task-queued",
+    "task-requeued",
+    "task-cancelled",
+    "run-started",
+    "run-phase",
+    "check-progress",
+    "run-finished",
+    "run-stopping",
+    "run-stopped",
+    "run-resumed",
+    "review-requested",
+    "review-finished",
+    "acceptance-evidence",
+    "acceptance-ready",
+];
+/** A progress fact, told apart by its durable key — never by display text. */
+export function isLifecycleNotification(row) {
+    return row.dedupeKey.startsWith(LIFECYCLE_KEY_PREFIX);
+}
+/** Only known progress producers can repaint a card. Decisions and urgent
+ * incidents keep their own alerts; a routine retry updates its saved attempt. */
+export function isTelegramProgressNotification(row) {
+    if (row.kind === "check-progress" && row.pushClass === "progress" && row.run !== null)
+        return isLifecycleNotification(row);
+    if (row.pushClass !== null)
+        return false;
+    if (row.kind === "build-failed" && row.run !== null && row.dedupeKey === `run:${row.run}:failed`)
+        return true;
+    // The owner's lead took the attempt on, or let it lapse (lead-voice.ts): its card repaints in place.
+    if ((row.kind === "lead-on-it" || row.kind === "lead-lapsed") && row.run !== null)
+        return true;
+    return isLifecycleNotification(row) &&
+        ["run-started", "run-phase", "run-finished", "review-requested", "review-finished", "run-stopping", "run-stopped", "run-resumed", "task-held", "task-released"].includes(row.kind);
+}
+export function readNotification(row) {
+    return {
+        id: Number(row["id"]),
+        recipient: row["recipient"] == null ? null : String(row["recipient"]),
+        dedupeKey: String(row["dedupe_key"]),
+        scope: row["provenance_scope"],
+        project: row["project"] == null ? null : String(row["project"]),
+        taskRef: row["task_ref"] == null ? null : Number(row["task_ref"]),
+        taskId: row["task_id"] == null ? null : String(row["task_id"]),
+        run: row["source_run"] == null ? null : Number(row["source_run"]),
+        kind: String(row["kind"]),
+        subject: String(row["subject"]),
+        body: String(row["body"]),
+        createdAt: String(row["created_at"]),
+        resolvedAt: row["resolved_at"] === null || row["resolved_at"] === undefined
+            ? null
+            : String(row["resolved_at"]),
+        pushClass: (row["push_class"] === null || row["push_class"] === undefined) && String(row["kind"]) === "check-progress"
+            ? "progress"
+            : row["push_class"] === null || row["push_class"] === undefined
+                ? null
+                : String(row["push_class"]),
+        link: row["link"] === null || row["link"] === undefined ? null : String(row["link"]),
+    };
+}
+export function readNotificationReceipt(row) {
+    return {
+        ...readNotification(row),
+        attempts: Number(row["attempts"]),
+        lastAttemptAt: row["last_attempt_at"] == null ? null : String(row["last_attempt_at"]),
+        lastError: row["last_error"] == null ? null : String(row["last_error"]),
+        deliveredAt: row["delivered_at"] == null ? null : String(row["delivered_at"]),
+        receipt: row["receipt"] == null ? null : String(row["receipt"]),
+    };
+}

package/dist/openrouter-models.d.ts

@@ -1,3 +1,4 @@
+import { type Html } from "./html.js";
 export type OpenRouterModel = {
     id: string;
     name: string;
@@ -25,6 +26,6 @@ export declare function fetchOpenRouterModels(key: string | null, fetcher?: type
 /** One bounded cache per console. A changed/removed key cannot reuse another account's list. */
 export declare function openRouterModelsCache(fetcher?: typeof fetch): (key: string | null, refresh?: boolean) => Promise<OpenRouterModels>;
 export declare function modelDollars(amount: number | null): string;
-export declare function openRouterPicker(catalog: OpenRouterModels, selected: string | null, refreshUrl: string): string;
+export declare function openRouterPicker(catalog: OpenRouterModels, selected: string | null, refreshUrl: string): Html;
 /** Only filters already-rendered options; credentials never enter this script. */
 export declare function openRouterPickerScript(): string;