create-pmos 0.86.0 → 0.88.0

package/workspace/public/pm/dest-board.js

@@ -29,8 +29,8 @@ import { currentProduct } from './board-read.js';
 import { pmGet } from './http.js';
 import { postEvents } from './breakdown-api.js';
 import { watchSig } from './sig-watch.js';
-import { ensureComponentsCss, layer, tabs, field, button, sheet, toast, empty, menu } from './primitives.js';
-import { ensureSprite } from './icons.js';
+import { ensureComponentsCss, layer, tabs, field, button, sheet, toast, empty, menu, badge } from './primitives.js';
+import { ensureSprite, icon } from './icons.js';
 import { COPY as BD } from './breakdown-copy.js';
 import { COPY } from './board-copy.js';
 import { hold, cancel, isHeld, flush, overlay, anyHeld } from './undo-hold.js';
@@ -119,6 +119,9 @@ function focusKeyIn(P) {
 function headOf(P) {
   const out = P.out;
   const inits = (out && out.initiatives) || [];
+  const n = out ? (out.counts.todo + out.counts.doing + out.counts.review + out.counts.done) : 0;
+  const productName = currentProduct();
+
   const f = tabs({
     variant: 'segmented', ariaLabel: COPY.filter, value: P.filter === 'init' ? null : P.filter,
     items: [{ id: 'active', label: COPY.filters.active }, { id: 'mine', label: COPY.filters.mine }],
@@ -134,10 +137,13 @@ function headOf(P) {
     label: COPY.addItem, variant: 'primary', icon: 'plus', onClick: () => P.actions.openAdd(),
     attrs: { 'data-bo-add': '', 'data-fk': 'add' },
   });
-  const n = out ? (out.counts.todo + out.counts.doing + out.counts.review + out.counts.done) : 0;
+
+  const title = el('h2', { class: 'td-count', 'data-bo-count': String(n) }, COPY.title(n, productName));
+
   return [
-    el('div', { class: 'bo-head__filters' }, f, el('div', { class: 'bo-head__pick' }, pick)),
-    el('div', { class: 'bo-head__end' }, el('span', { class: 'bo-head__n', 'data-bo-count': String(n) }, COPY.summary(n)), add),
+    el('div', { class: 'td-head' },
+      title,
+      el('div', { class: 'bo-head__end' }, f, el('div', { class: 'bo-head__pick' }, pick), add)),
   ];
 }
 
@@ -148,14 +154,14 @@ function render(P) {
     P.drags.destroy();
     const L = view(P);
     P.wide = (P.root.getBoundingClientRect().width || P.lastWidth || 0) >= WIDE_BOARD;
-    // as the Breakdown's Board: a wide Board with a fine pointer draws cards without the ⋯ button (the 33-control budget)
-    P.cardMenus = !P.wide || P.coarse;
+    // Always render menu buttons; they will be hidden with CSS opacity until hover
+    P.cardMenus = true;
     setChildren(P.headEl, headOf(P));
     let kids;
     if (!P.loaded) kids = [el('div', { class: 'bd-note' }, COPY.reading)];
     else if (!L) kids = [el('div', { class: 'bd-note bd-note--error', role: 'alert' }, COPY.readFailed(P.error || ''))];
     else {
-      kids = renderBoard({ P, L, A: P.actions, wide: P.wide, cardMenus: P.cardMenus });
+      kids = renderBoard({ P, L, A: P.actions, wide: P.wide, cardMenus: true, agenda: true });
       const rel = (P.out && P.out.releases) || [];
       if (rel.length) {
         grantScopes(() => bump(P));
@@ -381,7 +387,7 @@ function createPane(host, ws) {
   const P = {
     host, ws, root, headEl, bodyEl, slug: 'board', filter: 'active', init: null, out: null, raw: null, older: 0, error: null, loaded: false,
     loading: false, again: false, boardCol: 'todo', ver: 0, renderedVer: -1, drags: dragSet(), dragging: false, rendering: false,
-    disposed: false, sheet: null, wide: false, cardMenus: true, lastWidth: 0,
+    disposed: false, sheet: null, wide: false, cardMenus: true, lastWidth: 0, expandedCols: new Set(),
     coarse: typeof matchMedia === 'function' && matchMedia('(pointer: coarse)').matches,
   };
   P.actions = makeActions(P);

package/workspace/public/pm/dest-docs.js

@@ -178,7 +178,7 @@ export function mountDestination(host, ctx) {
   const ws = repo ? wsOf(repo) : null;
   if (ws !== inst.ws) {
     stopPoll(inst);
-    Object.assign(inst, { ws, loaded: false, error: null, view: null, last: '', open: null, adding: null, files: [], lib: null, libError: null, graph: null });
+    Object.assign(inst, { ws, repo, loaded: false, error: null, view: null, last: '', open: null, adding: null, files: [], lib: null, libError: null, graph: null });
     inst.openCats.clear(); inst.full.clear();
     if (ws) { ensureSprite(); refresh(inst); }
     draw(inst);
@@ -362,7 +362,7 @@ function fileLine(inst, f, q = '') {
     title: marked(f.title, q),
     meta: [ini ? el('span', { class: 'rp-docs-ini', title: ini.title }, marked(ini.short, q)) : el('span', { class: 'rp-docs-path' }, marked(f.path, q)), day(f.date)],
     lead: [el('span', { class: 'rp-docs-dot rp-docs-dot--none', 'aria-hidden': 'true' })],
-    trail: adding ? [] : [button({ label: COPY.addCopy, variant: 'outline', size: 'sm', attrs: { class: 'rp-docs-addcopy', 'data-docs-act': 'add-copy', 'data-docs-key': f.path }, onClick: start })],
+    trail: adding ? [] : [button({ label: COPY.addCopy, variant: 'outline', size: 'sm', icon: 'plus', attrs: { class: 'rp-docs-addcopy', 'data-docs-act': 'add-copy', 'data-docs-key': f.path }, onClick: start })],
     onOpen: inst.lib ? toggle : null,
     openLabel: `${f.title}: show the files it links to`,
     openAttrs: { 'aria-expanded': open ? 'true' : 'false', title: f.path, 'data-docs-file-toggle': f.path },
@@ -388,17 +388,48 @@ function fileLine(inst, f, q = '') {
 /* ── the page ────────────────────────────────────────────────────────────────────────────────────────────────────── */
 
 function header(inst) {
-  if (inst.head) return inst.head;
-  const find = field({ label: COPY.find, hideLabel: true, placeholder: COPY.find, attrs: { 'data-docs-find': '' } });
-  const q = find.control;
-  inst.findControl = q;
-  q.addEventListener('input', () => { inst.q = q.value; inst.open = null; inst.adding = null; inst.graph = null; inst.full.clear(); searchFiles(inst); draw(inst); });
-  // The field restores its last committed text on Escape; here Escape clears the search instead.
-  q.addEventListener('keydown', (e) => { if (e.key === 'Escape') { q.resetCommitted(''); inst.q = ''; inst.graph = null; searchFiles(inst); draw(inst); } });
-  inst.head = el('div', { class: 'rp-docs-top' }, el('h2', { class: 'rp-head__title' }, COPY.title), el('div', { class: 'rp-docs-find' }, find));
+  if (!inst.head) {
+    const find = field({ label: COPY.find, hideLabel: true, placeholder: COPY.find, attrs: { 'data-docs-find': '' } });
+    const q = find.control;
+    inst.findControl = q;
+    q.addEventListener('input', () => { inst.q = q.value; inst.open = null; inst.adding = null; inst.graph = null; inst.full.clear(); searchFiles(inst); draw(inst); });
+    // The field restores its last committed text on Escape; here Escape clears the search instead.
+    q.addEventListener('keydown', (e) => { if (e.key === 'Escape') { q.resetCommitted(''); inst.q = ''; inst.graph = null; searchFiles(inst); draw(inst); } });
+    inst.titleEl = el('h2', { class: 'rp-head__title' }, COPY.title);
+    inst.tabsSlot = el('div', { class: 'rp-docs-views' });
+    inst.whenEl = el('span', { class: 'rp-docs-when', 'data-docs-summary': '' });
+    inst.compareBtn = button({ label: COPY.compareAll, variant: 'primary', size: 'sm', icon: 'refresh-cw', attrs: { 'data-docs-act': 'check' }, onClick: () => compareAll(inst) });
+    inst.head = el('div', { class: 'rp-docs-head' },
+      el('div', { class: 'rp-docs-top' }, inst.titleEl, inst.tabsSlot),
+      el('div', { class: 'rp-docs-bar' }, inst.whenEl, el('div', { class: 'rp-docs-find' }, find), inst.compareBtn));
+  }
   return inst.head;
 }
 
+/** The parts of the header that follow the data: the title, the view tabs with their counts, when the copies were compared. */
+function updateHead(inst) {
+  const v = inst.view;
+  const lib = inst.lib;
+  const all = v ? v.docs.reduce((n, d) => n + d.links.length, 0) : 0;
+  const needs = v ? v.docs.reduce((n, d) => n + d.links.filter((l) => needsYou(inst, d, l)).length, 0) : 0;
+  const running = !!v && (!!(v.open || v.session) || inst.busy);
+  const repoName = inst.repo ? String(inst.repo).split('/').pop() : '';
+  inst.titleEl.textContent = needs > 0 ? COPY.needYou(needs) + (repoName ? ` in ${repoName}` : '') : COPY.title;
+  inst.tabsSlot.replaceChildren(tabs({ variant: 'segmented', items: [{ id: 'needs', label: COPY.needs, count: needs }, { id: 'copies', label: COPY.copies, count: all },
+    { id: 'files', label: COPY.files, count: lib ? lib.files.length.toLocaleString('en-US') : null }],
+  value: inst.filter, ariaLabel: 'Filter', attrs: { 'data-docs-filter': '' }, onChange: (val) => { inst.filter = val; inst.graph = null; draw(inst); } }));
+  inst.whenEl.replaceChildren(icon('refresh-cw'), el('span', null, !v ? '' : running ? COPY.comparing : (v.last ? COPY.compared(v.last.finished_at) : COPY.never)));
+  inst.compareBtn.disabled = running || !all;
+  inst.compareBtn.setAttribute('aria-label', COPY.compareAll);
+  inst.compareBtn.title = COPY.compareAll;
+}
+
+/** The body inside one card with a small label, like an Agenda panel. */
+function panel(inst, nodes) {
+  const label = inst.q.trim() ? 'Results' : inst.filter === 'files' ? COPY.files : inst.filter === 'copies' ? COPY.copies : COPY.needs;
+  return el('section', { class: 'rp-docs-panel' }, el('div', { class: 'rp-docs-panel__eyebrow' }, label), ...nodes);
+}
+
 const needsYou = (inst, d, l) => l.signal !== 'same' || !!l.syncing || inst.pending.has(keyOf(d, l));
 
 /**
@@ -467,14 +498,7 @@ function body(inst) {
   const all = v.docs.reduce((n, d) => n + d.links.length, 0);
   const needs = v.docs.reduce((n, d) => n + d.links.filter((l) => needsYou(inst, d, l)).length, 0);
   const running = !!(v.open || v.session) || inst.busy;
-  const out = [el('div', { class: 'rp-docs-views' },
-    tabs({ variant: 'line', items: [{ id: 'needs', label: COPY.needs, count: needs }, { id: 'copies', label: COPY.copies, count: all },
-      { id: 'files', label: COPY.files, count: lib ? lib.files.length.toLocaleString('en-US') : null }],
-    value: inst.filter, ariaLabel: 'Filter', attrs: { 'data-docs-filter': '' }, onChange: (val) => { inst.filter = val; inst.graph = null; draw(inst); } }),
-    el('span', { class: 'rp-docs-when', 'data-docs-summary': '' },
-      running ? COPY.comparing : (v.last ? COPY.compared(v.last.finished_at) : COPY.never),
-      button({ label: '↻', variant: 'ghost', size: 'sm', disabled: running || !all,
-        attrs: { 'data-docs-act': 'check', 'aria-label': COPY.compareAll, title: COPY.compareAll }, onClick: () => compareAll(inst) })))];
+  const out = [];
   if (inst.filter === 'files') {
     if (!lib) { out.push(el('p', { class: 'rp-section__empty' + (inst.libError ? ' rp-section__empty--bad' : '') }, inst.libError || COPY.readingFiles)); return out; }
     out.push(el('div', { class: 'rp-docs-folds' }, byCategory(allEntries(inst)).map(([k, es]) => section(inst, k, es, { foldable: true }))));
@@ -498,8 +522,9 @@ function draw(inst) {
   if (fp === inst.last && root.childNodes.length && root.contains(inst.body)) return;
   inst.last = fp;
   const head = header(inst);
+  updateHead(inst);
   if (head.parentNode !== root || inst.body.parentNode !== root) root.replaceChildren(head, inst.body);
-  if (!inst.loaded) { inst.body.replaceChildren(el('p', { class: 'rp-section__empty' }, COPY.loading)); return; }
-  if (inst.error) { inst.body.replaceChildren(el('p', { class: 'rp-section__empty rp-section__empty--bad', role: 'alert' }, inst.error)); return; }
-  inst.body.replaceChildren(...body(inst));
+  if (!inst.loaded) { inst.body.replaceChildren(panel(inst, [el('p', { class: 'rp-section__empty' }, COPY.loading)])); return; }
+  if (inst.error) { inst.body.replaceChildren(panel(inst, [el('p', { class: 'rp-section__empty rp-section__empty--bad', role: 'alert' }, inst.error)])); return; }
+  inst.body.replaceChildren(panel(inst, body(inst)));
 }

package/workspace/public/pm/dest-people.js

@@ -2,24 +2,22 @@
  * tone, notes and shared work (initiative people-directory, PRD R5 to R11, proposed D90).
  *
  * A DESTINATION MODULE (registry.js): mountDestination(host, ctx) on every render with the same host, disposeDestination(host).
- * It keeps ONE persistent root per host; the header (title and search) is built once, so typing never loses focus, and
- * only the body is rebuilt when its own data changed.
+ * It keeps ONE persistent root per host; the header is built once (h2 title on left, group switch on right), so typing never
+ * loses focus. The search field lives in the left card and is built once. Only the body is rebuilt when its own data changed.
  *
- * What it shows, for the repository the tab names (or the open one):
- *   - Waiting for you: possible duplicates (Merge · Keep separate) and how many tones wait for a confirm. A new person
- *     is added, not listed here (the PM, 2026-10-06): Remove from People on their page keeps them out;
- *   - the list: search over names, handles and initiatives, All · Team · External, sort by latest, most or name;
- *   - the person's page: who, interactions with where each came from, tone (Confirm · Set another · Change), shared
- *     work (initiatives, items they own with Blocked shown, coming meetings), notes (Add · Remove), and identity and
- *     sources (handles, how many interactions each source gave, the file the person lives in).
- * Every press is a page press to POST /api/people/decide. Nothing here reads a source: GET /api/people records the names
- * the workspace's own records hold, and agent sessions record what they saw through `pmos people record`. A link from another place opens a person through the tab's slug (people-link.js).
- * In fixture mode it reads nothing.
+ * Layout (desktop): header row, "Waiting for you" merge candidates as bordered rows, then two cards side-by-side (minmax(300px,2fr) 3fr,
+ * gap 16px, fixed height calc(100vh - 220px) min-height 420px, internal scrolling). Left card: "PEOPLE" label + count, search field,
+ * full-width sort tabs, list of people. Right card: person detail with avatar, name, meta, Confirm / ⋯ menu, 3 tiles (Interactions,
+ * Tone, Shared work), scrollable sections (Interactions, Shared work, Notes, Identity and sources).
+ *
+ * What it shows: waiting for you (possible merge candidates), the people list (search, filter, sort), and person's page
+ * (who, interactions, tone, shared work, notes, identity). Every press is a page press to POST /api/people/decide.
+ * A link from another place opens a person through the tab's slug (people-link.js). In fixture mode it reads nothing.
  */
 
 import { el } from './dom.js';
-import { button, row, field, toast, empty, tabs, badge, menu, ensureComponentsCss } from './primitives.js';
-import { ensureSprite } from './icons.js';
+import { button, iconButton, row, field, toast, empty, tabs, badge, menu, ensureComponentsCss } from './primitives.js';
+import { ensureSprite, icon } from './icons.js';
 import { pmGet, pmPost } from './http.js';
 import { wsOf } from './data.js';
 import { registerCommand, openDestination } from './registry.js';
@@ -174,22 +172,18 @@ function review(inst) {
   const rows = [];
   for (const m of r.merges) {
     const key = m.handle.kind + ':' + m.handle.value;
-    rows.push(el('div', { class: 'rp-people-row', role: 'listitem', 'data-people-merge': key },
-      row({
-        title: COPY.same(m.handle.value, m.personName),
-        meta: [m.why],
-        trail: [
-          button({ label: COPY.merge, variant: 'outline', size: 'sm', attrs: { 'data-people-act': 'merge', 'data-people-key': key },
-            onClick: () => decide(inst, { act: 'merge', person: m.person, handle: m.handle }, COPY.merged) }),
-          button({ label: COPY.keep, variant: 'ghost', size: 'sm', attrs: { 'data-people-act': 'keep-separate', 'data-people-key': key },
-            onClick: () => decide(inst, { act: 'keep-separate', a: m.a, b: m.b }, COPY.kept) }),
-        ],
-      })));
+    rows.push(el('div', { class: 'rp-people-merge', role: 'listitem', 'data-people-merge': key },
+      el('div', { class: 'rp-people-merge__dot' }),
+      el('div', { class: 'rp-people-merge__text' },
+        el('div', { class: 'rp-people-merge__title' }, COPY.same(m.handle.value, m.personName)),
+        el('div', { class: 'rp-people-merge__why' }, m.why)),
+      button({ label: COPY.merge, icon: 'git-merge', variant: 'outline', size: 'sm', attrs: { 'data-people-act': 'merge', 'data-people-key': key },
+        onClick: () => decide(inst, { act: 'merge', person: m.person, handle: m.handle }, COPY.merged) }),
+      button({ label: COPY.keep, variant: 'ghost', size: 'sm', attrs: { 'data-people-act': 'keep-separate', 'data-people-key': key },
+        onClick: () => decide(inst, { act: 'keep-separate', a: m.a, b: m.b }, COPY.kept) })));
   }
   if (r.tones.length) rows.push(el('p', { class: 'rp-people-hint', 'data-people-tones': String(r.tones.length) }, COPY.tonesWait(r.tones.length)));
-  return el('section', { class: 'rp-people-review', 'data-people-review': '' },
-    el('h3', { class: 'rp-people-sec__title' }, `${COPY.waiting} · ${r.count}`),
-    el('div', { role: 'list' }, rows));
+  return el('div', { class: 'rp-people-review', 'data-people-review': '' }, ...rows);
 }
 
 /* ── the list ────────────────────────────────────────────────────────────────────────────────────────────────────── */
@@ -212,11 +206,15 @@ function shownPeople(inst) {
 function personLine(inst, p) {
   const open = inst.open === p.id;
   const t = toneOf(p);
-  return el('div', { class: 'rp-people-row' + (open ? ' rp-people-row--open' : ''), role: 'listitem', 'data-people-person': p.id },
+  const toneClass = t === 'tense' || t === 'cautious' || t === 'warm' ? t : '';
+  const initials = p.name.split(/\s+/).map((w) => w[0]).join('').toUpperCase();
+  return el('div', { class: 'rp-people-item', role: 'listitem', 'data-people-person': p.id },
     row({
       title: p.name,
-      meta: [who(p), p.last ? `${p.count} · ${day(p.last)}` : String(p.count)],
-      trail: t ? [badge({ text: p.tone.confirmed ? t : t + '?', tone: t === 'tense' ? 'destructive' : t === 'cautious' ? 'warning' : 'outline', attrs: { 'data-people-tone': t } })] : [],
+      meta: [[who(p), p.external ? COPY.external : null].filter(Boolean).join(' · ')],
+      lead: [el('span', { class: 'rp-people-row__avatar' }, initials)],
+      trail: t ? [el('span', { class: 'rp-people-row__tone' + (p.tone.confirmed ? '' : ' rp-people-row__tone--proposed'), 'data-people-tone': t },
+        el('i', { class: 'rp-people-row__tone-dot ' + toneClass }), p.tone.confirmed ? t : t + '?')] : [],
       onOpen: () => { inst.open = p.id; draw(inst); },
       openLabel: `${p.name}, ${who(p)}`,
       openAttrs: { 'aria-current': open ? 'true' : null, 'data-people-open': p.id },
@@ -226,20 +224,19 @@ function personLine(inst, p) {
 function listPane(inst) {
   const v = inst.view;
   const all = v.people.filter((p) => matches(p, inst.q.trim().toLowerCase()));
-  const controls = el('div', { class: 'rp-people-views' },
-    tabs({ variant: 'line', value: inst.group, ariaLabel: 'Group', attrs: { 'data-people-group': '' },
-      items: [{ id: 'all', label: COPY.all, count: all.length }, { id: 'team', label: COPY.team, count: all.filter((p) => !p.external).length },
-        { id: 'external', label: COPY.external, count: all.filter((p) => p.external).length }],
-      onChange: (val) => { inst.group = val; draw(inst); } }),
-    tabs({ variant: 'segmented', value: inst.sort, ariaLabel: 'Sort', attrs: { 'data-people-sort': '' },
-      items: [{ id: 'latest', label: COPY.latest }, { id: 'most', label: COPY.most }, { id: 'name', label: COPY.name }],
-      onChange: (val) => { inst.sort = val; draw(inst); } }));
   const list = shownPeople(inst);
   let rows;
   if (!v.people.length) rows = [el('p', { class: 'rp-section__empty' }, COPY.none)];
   else if (!list.length) rows = [el('p', { class: 'rp-section__empty' }, COPY.noMatch(inst.q.trim()))];
   else rows = [el('div', { role: 'list', 'data-people-list': '' }, list.map((p) => personLine(inst, p)))];
-  return el('div', { class: 'rp-people-list' }, controls, ...rows);
+  return el('div', { class: 'rp-people-card' },
+    el('div', { class: 'rp-people-card__header' },
+      el('p', { class: 'rp-people-card__label' }, COPY.title, el('span', { class: 'rp-people-card__count' }, all.length))),
+    inst.head.find,
+    tabs({ variant: 'segmented', full: true, value: inst.sort, ariaLabel: 'Sort', attrs: { 'data-people-sort': '' },
+      items: [{ id: 'latest', label: COPY.latest }, { id: 'most', label: COPY.most }, { id: 'name', label: COPY.name }],
+      onChange: (val) => { inst.sort = val; draw(inst); } }),
+    el('div', { class: 'rp-people-card__list' }, ...rows));
 }
 
 /* ── the person's page ───────────────────────────────────────────────────────────────────────────────────────────── */
@@ -250,11 +247,16 @@ function section(title, kids, attrs) {
 
 function interactionsSec(p) {
   if (!p.interactions.length) return section(COPY.interactions, [el('p', { class: 'rp-people-hint' }, COPY.noInteractions)], { 'data-people-sec': 'interactions' });
-  return section(`${COPY.interactions} · ${p.count}`, [el('ol', { class: 'rp-people-ints' }, p.interactions.slice(0, 50).map((i) =>
-    el('li', { class: 'rp-people-int', 'data-people-int': i.date },
-      el('span', { class: 'rp-people-int__when' }, `${day(i.date)} · ${i.kind}`),
-      el('span', { class: 'rp-people-int__text' }, i.text),
-      el('span', { class: 'rp-people-int__src' }, [SOURCE[i.source] || i.source, i.pointer, i.tone].filter(Boolean).join(' · ')))))],
+  const icons = { mail: 'mail', live: 'message-square', calendar: 'calendar', jira: 'ticket', gather: 'file-text', plan: 'file-text', notes: 'file-text' };
+  return section(`${COPY.interactions} · ${p.count}`, [el('div', { class: 'rp-people-ints' }, p.interactions.slice(0, 50).map((i) => {
+    const iconName = icons[i.source] || 'file-text';
+    return el('div', { class: 'rp-people-int', 'data-people-int': i.date },
+      el('span', { class: 'rp-people-int__icon' }, icon(iconName)),
+      el('div', {},
+        el('div', { class: 'rp-people-int__text' }, i.text),
+        el('small', {}, `${day(i.date)} · ${i.kind}`),
+        el('small', { class: 'rp-people-int__src' }, [SOURCE[i.source] || i.source, i.pointer, i.tone].filter(Boolean).join(' · '))));
+  }))],
   { 'data-people-sec': 'interactions' });
 }
 
@@ -267,8 +269,6 @@ function toneSec(inst, p) {
   else if (t.proposed) kids.push(el('p', { class: 'rp-people-tone', 'data-people-proposed': t.proposed }, COPY.proposed(t.proposed)));
   if (mix) kids.push(el('p', { class: 'rp-people-hint', 'data-people-mix': '' }, mix));
   const acts = [];
-  if (!t.confirmed && t.proposed) acts.push(button({ label: COPY.confirm, variant: 'primary', size: 'sm', attrs: { 'data-people-act': 'tone-confirm' },
-    onClick: () => decide(inst, { act: 'tone', person: p.id, tone: t.proposed }, COPY.toneSaved) }));
   const another = button({ label: COPY.setAnother, variant: 'outline', size: 'sm', iconEnd: 'chevron-down', attrs: { 'data-people-act': 'tone-set', 'aria-haspopup': 'menu' },
     onClick: () => menu({ anchor: another, ariaLabel: COPY.setAnother,
       items: TONES.map((x) => ({ label: x, onSelect: () => decide(inst, { act: 'tone', person: p.id, tone: x }, COPY.toneSaved) })) }) });
@@ -281,25 +281,24 @@ function toneSec(inst, p) {
 
 function sharedSec(p) {
   const s = p.shared;
-  const lines = [];
-  for (const g of s.initiatives) lines.push(el('li', { class: 'rp-people-shared', 'data-people-shared': 'initiative' }, `${g.id} · ${g.count} interaction${g.count === 1 ? '' : 's'}`));
+  const chips = [];
+  for (const g of s.initiatives) chips.push(el('span', { class: 'rp-people-chip', 'data-people-shared': 'initiative' }, icon('target'), `${g.id} · ${g.count} interaction${g.count === 1 ? '' : 's'}`));
   for (const it of s.items) {
-    lines.push(el('li', { class: 'rp-people-shared', 'data-people-shared': 'item', 'data-people-item': it.id },
-      `${COPY.owns} ${it.title || it.id}${it.initiative ? ' · ' + it.initiative : ''} · ${it.state}`,
-      it.blocked ? badge({ text: COPY.blocked, tone: 'warning', attrs: { title: it.reason || COPY.blocked } }) : null));
+    const chip = el('span', { class: 'rp-people-chip', 'data-people-shared': 'item', 'data-people-item': it.id }, icon(it.blocked ? 'ban' : 'target'), `${COPY.owns} ${it.title || it.id}${it.blocked ? ' · ' + COPY.blocked : ''}`);
+    if (it.blocked) chip.classList.add('warn');
+    chips.push(chip);
   }
   for (const m of s.meetings) {
     const when = new Date(m.start);
-    lines.push(el('li', { class: 'rp-people-shared', 'data-people-shared': 'meeting' },
-      `${COPY.meeting} · ${when.toLocaleDateString('en-US', { weekday: 'short', month: 'short', day: 'numeric' })} ${when.toTimeString().slice(0, 5)} · ${m.title}`));
+    chips.push(el('span', { class: 'rp-people-chip', 'data-people-shared': 'meeting' }, icon('calendar'), `${when.toLocaleDateString('en-US', { weekday: 'short', month: 'short', day: 'numeric' })} · ${m.title}`));
   }
-  return section(COPY.shared, lines.length ? [el('ul', { class: 'rp-people-list-plain' }, lines)] : [el('p', { class: 'rp-people-hint' }, COPY.noShared)], { 'data-people-sec': 'shared' });
+  return section(COPY.shared, chips.length ? [el('div', { class: 'rp-people-chips' }, chips)] : [el('p', { class: 'rp-people-hint' }, COPY.noShared)], { 'data-people-sec': 'shared' });
 }
 
 function notesSec(inst, p) {
-  const list = p.notes.map((n) => el('li', { class: 'rp-people-note', 'data-people-note': n.id },
+  const list = p.notes.map((n) => el('div', { class: 'rp-people-note', 'data-people-note': n.id },
     el('span', { class: 'rp-people-note__text' }, n.text),
-    button({ label: COPY.remove, variant: 'ghost', size: 'sm', attrs: { 'data-people-act': 'note-remove', 'data-people-key': n.id },
+    iconButton({ icon: 'x', ariaLabel: COPY.remove, size: 'sm', attrs: { 'data-people-act': 'note-remove', 'data-people-key': n.id },
       onClick: () => decide(inst, { act: 'note-remove', person: p.id, id: n.id }, COPY.noteRemoved) })));
   const f = field({ label: COPY.addNote, kind: 'textarea', hideLabel: true, placeholder: COPY.notePlaceholder, attrs: { 'data-people-field': 'note' } });
   const save = async () => {
@@ -310,8 +309,8 @@ function notesSec(inst, p) {
     if (r) f.control.value = '';
   };
   return section(COPY.notes, [
-    list.length ? el('ul', { class: 'rp-people-list-plain' }, list) : el('p', { class: 'rp-people-hint' }, COPY.noNotes),
-    el('div', { class: 'rp-people-noteadd' }, f, el('div', { class: 'rp-people-acts' }, button({ label: COPY.addNote, variant: 'outline', size: 'sm', attrs: { 'data-people-act': 'note-add' }, onClick: save }))),
+    list.length ? el('div', { class: 'rp-people-list-plain' }, list) : el('p', { class: 'rp-people-hint' }, COPY.noNotes),
+    el('div', { class: 'rp-people-noteadd' }, f, iconButton({ icon: 'plus', ariaLabel: COPY.addNote, size: 'sm', attrs: { 'data-people-act': 'note-add' }, onClick: save })),
   ], { 'data-people-sec': 'notes' });
 }
 
@@ -319,25 +318,52 @@ function identitySec(inst, p) {
   const by = {};
   for (const i of p.interactions) by[i.source] = (by[i.source] || 0) + 1;
   const file = inst.view.file ? String(inst.view.file).split('/').slice(-3).join('/') : 'people.jsonl';
-  return section(COPY.identity, [
-    el('ul', { class: 'rp-people-list-plain' },
-      p.handles.map((h) => el('li', { class: 'rp-people-handle', 'data-people-handle': h.kind + ':' + h.value }, handleText(h))),
-      Object.entries(by).map(([s, n]) => el('li', { class: 'rp-people-hint' }, `${SOURCE[s] || s}: ${n} interaction${n === 1 ? '' : 's'}`))),
-    (p.sources || []).length ? el('p', { class: 'rp-people-hint', 'data-people-sources': p.sources.join(',') }, COPY.foundIn(p.sources.map((s) => SOURCE[s] || s).join(', '))) : null,
-    el('p', { class: 'rp-people-hint rp-people-file' }, COPY.lives(file)),
-  ], { 'data-people-sec': 'identity' });
+  const details = el('details', { class: 'rp-people-sec', 'data-people-sec': 'identity' },
+    el('summary', {},
+      icon('chevron-down'),
+      COPY.identity),
+    el('div', { class: 'rp-people-list-plain' },
+      p.handles.map((h) => el('div', { class: 'rp-people-handle', 'data-people-handle': h.kind + ':' + h.value }, handleText(h))),
+      Object.entries(by).map(([s, n]) => el('div', { class: 'rp-people-hint' }, `${SOURCE[s] || s}: ${n} interaction${n === 1 ? '' : 's'}`)),
+      (p.sources || []).length ? el('div', { class: 'rp-people-hint', 'data-people-sources': p.sources.join(',') }, COPY.foundIn(p.sources.map((s) => SOURCE[s] || s).join(', '))) : null,
+      el('div', { class: 'rp-people-hint rp-people-file' }, COPY.lives(file))));
+  return details;
 }
 
 function personPane(inst) {
   const p = inst.view.people.find((x) => x.id === inst.open);
-  if (!p) return el('div', { class: 'rp-people-page' }, el('p', { class: 'rp-section__empty' }, COPY.pick));
-  return el('article', { class: 'rp-people-page', 'data-people-page': p.id },
-    el('header', { class: 'rp-people-who' },
-      el('h3', { class: 'rp-people-who__name' }, p.name),
-      el('p', { class: 'rp-people-hint' }, [who(p), p.external && (p.role || p.org) ? COPY.external : null].filter(Boolean).join(' · ')),
-      el('div', { class: 'rp-people-acts' }, button({ label: COPY.removeFromPeople, variant: 'ghost', size: 'sm', attrs: { 'data-people-act': 'remove' },
-        onClick: async () => { const r = await decide(inst, { act: 'remove', person: p.id }, COPY.removed(p.name)); if (r) { inst.open = null; draw(inst); } } }))),
-    interactionsSec(p), toneSec(inst, p), sharedSec(p), notesSec(inst, p), identitySec(inst, p));
+  if (!p) return el('div', { class: 'rp-people-card' }, el('p', { class: 'rp-section__empty' }, COPY.pick));
+  const t = p.tone;
+  const confirmBtn = !t.confirmed && t.proposed ? button({ label: COPY.confirm + ' ' + t.proposed, icon: 'check', variant: 'primary', size: 'sm',
+    attrs: { 'data-people-act': 'tone-confirm' },
+    onClick: () => decide(inst, { act: 'tone', person: p.id, tone: t.proposed }, COPY.toneSaved) }) : null;
+  const moreBtn = iconButton({ icon: 'ellipsis', ariaLabel: 'More', attrs: { 'data-people-act': 'more' },
+    onClick: () => menu({ anchor: moreBtn, ariaLabel: 'Actions', items: [
+      { label: COPY.removeFromPeople, icon: 'x', attrs: { 'data-people-act': 'remove' }, onSelect: async () => { const r = await decide(inst, { act: 'remove', person: p.id }, COPY.removed(p.name)); if (r) { inst.open = null; draw(inst); } } }
+    ] }) });
+  return el('article', { class: 'rp-people-card', 'data-people-page': p.id },
+    el('div', { class: 'rp-people-page__header' },
+      el('div', { class: 'rp-people-page__info' },
+        el('span', { class: 'rp-people-page__avatar' }, p.name.split(/\s+/).map((w) => w[0]).join('').toUpperCase()),
+        el('div', { class: 'rp-people-page__text' },
+          el('h3', { class: 'rp-people-page__name' }, p.name),
+          el('p', { class: 'rp-people-hint' }, [who(p), p.external && (p.role || p.org) ? COPY.external : null].filter(Boolean).join(' · ')))),
+      el('div', { class: 'rp-people-page__actions' }, confirmBtn, moreBtn)),
+    el('div', { class: 'rp-people-page__tiles' },
+      el('div', { class: 'rp-people-tile' },
+        el('p', { class: 'rp-people-tile__label' }, COPY.interactions),
+        el('b', {}, p.count && p.last ? `${p.count} · ${day(p.last)}` : String(p.count || 0))),
+      el('div', { class: 'rp-people-tile' },
+        el('p', { class: 'rp-people-tile__label' }, COPY.tone),
+        el('b', {}, t.confirmed || t.proposed ? [
+          el('i', { class: 'rp-people-tile__dot ' + (t.confirmed ? 'rp-people-tile__dot--confirmed' : 'rp-people-tile__dot--proposed') }),
+          ' ', t.confirmed ? t.confirmed : (t.proposed + '?')
+        ] : 'None')),
+      el('div', { class: 'rp-people-tile' },
+        el('p', { class: 'rp-people-tile__label' }, COPY.shared),
+        el('b', {}, p.shared.initiatives.length ? `${p.shared.initiatives.length} ${p.shared.initiatives.length === 1 ? 'initiative' : 'initiatives'}` : 'None'))),
+    el('div', { class: 'rp-people-page__scroll' },
+      interactionsSec(p), toneSec(inst, p), sharedSec(p), notesSec(inst, p), identitySec(inst, p)));
 }
 
 /* ── the page ────────────────────────────────────────────────────────────────────────────────────────────────────── */
@@ -348,7 +374,15 @@ function header(inst) {
   const q = find.control;
   q.addEventListener('input', () => { inst.q = q.value; draw(inst); });
   q.addEventListener('keydown', (e) => { if (e.key === 'Escape') { q.resetCommitted(''); inst.q = ''; draw(inst); } });
-  inst.head = el('div', { class: 'rp-people-top' }, el('h2', { class: 'rp-head__title' }, COPY.title), el('div', { class: 'rp-people-find' }, find));
+  const v = inst.view || { people: [] };
+  const all = v.people ? v.people.filter((p) => matches(p, inst.q.trim().toLowerCase())) : [];
+  const titleText = v.people && v.people.length ? `${v.people.length} ${v.people.length === 1 ? 'person' : 'people'}` : COPY.title;
+  inst.titleEl = el('h2', { class: 'rp-head__title' }, titleText);
+  inst.head = el('div', { class: 'rp-people-top' },
+    inst.titleEl,
+    tabs({ variant: 'segmented', value: inst.group, ariaLabel: 'Group', attrs: { 'data-people-group': '' },
+      items: [{ id: 'all', label: COPY.all }, { id: 'team', label: COPY.team }, { id: 'external', label: COPY.external }],
+      onChange: (val) => { inst.group = val; draw(inst); } }));
   inst.head.find = find;
   return inst.head;
 }
@@ -367,5 +401,9 @@ function draw(inst) {
   // Focus stays in a note being typed: a redraw of the page would drop it, so it waits until the field is left.
   const typing = document.activeElement && inst.body.contains(document.activeElement) && document.activeElement.matches('textarea');
   if (typing) { inst.last = ''; return; }
-  inst.body.replaceChildren(...[review(inst), el('div', { class: 'rp-people-grid' }, listPane(inst), personPane(inst))].filter(Boolean));
+  const n = inst.view.people.length;
+  inst.titleEl.textContent = n ? `${n} ${n === 1 ? 'person' : 'people'}` : COPY.title;
+  const rev = review(inst);
+  const grid = el('div', { class: 'rp-people-grid' }, listPane(inst), personPane(inst));
+  inst.body.replaceChildren(...[rev, grid].filter(Boolean));
 }

package/workspace/public/pm/dock-sessions.js

@@ -89,9 +89,10 @@ export function groupsOf(repo, { all = false } = {}) {
   const out = [...by.keys()].sort((a, b) => rank(a) - rank(b) || a.localeCompare(b))
     .map((i) => ({ key: 'i:' + i, title: titleOf(i), initiative: i, automatic: false, sessions: by.get(i) }));
   if (none.length) out.push({ key: 'none', title: C().notLinked, initiative: null, automatic: false, sessions: none });
-  // hidden by default; the session in front is never hidden, and neither is one that is waiting on the PM
+  // hidden by default; the session in front is never hidden, and neither is one held on a permission call (a finished agent reads
+  // 'needs you' too, so that state alone does not show it)
   const front = frontSessionId();
-  const show = all || state.dsShowAuto || sched.some((s) => s.id === front || s.shown === 'needs' || s.shown === 'blocked');
+  const show = all || state.dsShowAuto || sched.some((s) => s.id === front || s.shown === 'blocked');
   if (sched.length && show) out.push({ key: 'auto', title: C().automatic, initiative: null, automatic: true, sessions: sched });
   return out;
 }

package/workspace/public/pm/mobile.css

@@ -264,7 +264,7 @@
   body > [data-pm-theme] [data-dest="initiatives"] [data-in-nowline],
   body > [data-pm-theme] [data-dest="initiatives"] [data-in-hint],
   body > [data-pm-theme] [data-dest="initiatives"] .in-grip,
-  body > [data-pm-theme] [data-dest="board"] .bo-head__n,
+  body > [data-pm-theme] [data-dest="board"] .bo-head .td-count,
   body > [data-pm-theme] [data-dest="docs"] .rp-docs-top .rp-head__title,
   body[data-ph-view="cards"] > [data-pm-theme] [data-dest="docs"] .rp-docs-top,
   body[data-ph-view="cards"] > [data-pm-theme] [data-dest="docs"] .rp-docs-views,

package/workspace/public/pm/primitives.js

@@ -274,12 +274,12 @@ export function row({ title, titleIcon, meta, signals, lead, trail, onOpen, open
   trail && trail.length ? el('span', { class: 'pmc-row__trail' }, trail) : null);
 }
 
-/** card({ title, titleIcon?, meta?, signals?, lead?, trail?, onOpen, openLabel?, attrs? }): a raised card with one open button. */
-export function card({ title, titleIcon, meta, signals, lead, trail, onOpen, openLabel, muted, attrs, openAttrs } = {}) {
+/** card({ title, titleIcon?, meta?, signals?, lead?, trail?, onOpen, openLabel?, center?, attrs? }): a raised card with one open button. */
+export function card({ title, titleIcon, meta, signals, lead, trail, onOpen, openLabel, muted, center, attrs, openAttrs } = {}) {
   // the open button holds the title and the meta line, as a row's does: one column, and one tall target on a phone
   const open = el('button', { type: 'button', class: 'pmc-card__open', 'aria-label': openLabel || null, onClick: onOpen, ...(openAttrs || {}) },
     titleLine('pmc-card__title', title, titleIcon), metaLine('pmc-card__meta', meta, signals));
-  return el('div', withClass(cx('pmc-card', muted && 'pmc-card--muted'), attrs),
+  return el('div', withClass(cx('pmc-card', muted && 'pmc-card--muted', center && 'pmc-card--center'), attrs),
     el('div', { class: 'pmc-card__top' },
       lead && lead.length ? el('span', { class: 'pmc-card__lead' }, lead) : null,
       open,

package/workspace/public/pm/today-copy.js

@@ -104,13 +104,15 @@ export const COPY = {
     toggle: (need) => (need ? `Your day · ${need} ${need === 1 ? 'needs' : 'need'} you` : 'Your day: calendar, jobs, goals and mentions'),
     fold: 'Fold your day',
     hello: { morning: 'Good morning.', afternoon: 'Good afternoon.', evening: 'Good evening.' },
+    unfinished: (open, all) => (!all ? 'No goals yet' : open ? `${open} unfinished ${open === 1 ? 'goal' : 'goals'}` : 'All goals done'),
     free: (min) => `${Math.floor(min / 60)} h ${min % 60} min free`,
     steps: ['Read', 'Sort', 'Agents work', 'You approve'],
     stepTitle: ['Read your sources', 'Make the jobs', 'Agents do the work', 'You approve'],
     stepHint: ['The session reads your calendar and your mentions.', 'Each job is tied to a goal or a meeting.', 'One session per job, at most 5 at once.', 'Only what sends or decides waits for you.'],
     stepOf: (n) => `Prepare my day · step ${n} of 4`,
     status: {
-      idle: 'One press: the agent reads, makes the jobs and does them. You approve only what sends or decides.',
+      idle: 'Not prepared yet',
+      last: (at, n) => (at ? `Last prepared ${at}` : 'Prepared today') + (n ? ` · ${n} ${n === 1 ? 'needs' : 'need'} you` : ''),
       reading: 'Reading your calendar and mentions…',
       readFailed: (why) => `The read stopped: ${why}`,
       working: (w, n) => `${w} ${w === 1 ? 'agent' : 'agents'} working · ${n} ${n === 1 ? 'needs' : 'need'} you`,

package/workspace/public/pm/today-day.js

@@ -389,34 +389,38 @@ function select(type, id) {
 function topBar(ctx) {
   const { m, ws } = ctx;
   const si = stepIndex(m.stage);
-  const steps = el('ol', { class: 'td-day__steps', 'aria-label': D.prepare }, ...D.steps.map((t, i) => {
+  const press = runs.get(ws);
+  const busy = !!press && press.state === 'busy';
+  const bs = m.run && m.run.brief_session;
+  const reading = !!bs && !bs.ended_at && m.stage === 'reading' && !m.readFailed;
+  // the four steps show as a small progress bar only while Prepare my day is running; otherwise the bar says when it last ran
+  const inProgress = busy || reading || (!!m.run && m.stage === 'working');
+  const steps = inProgress ? el('ol', { class: 'td-day__steps', 'aria-label': D.prepare }, ...D.steps.map((t, i) => {
     const st = si < 0 ? 'todo' : i < si || si === 4 ? 'done' : i === si ? 'now' : 'todo';
-    return el('li', null, button({ label: [el('span', { class: 'td-day__tsdot', 'aria-hidden': 'true' }), t], variant: 'ghost', size: 'sm', onClick: () => select('step', i),
-      attrs: { class: 'td-day__ts', 'data-step-state': st, 'data-day-step': String(i), 'data-day-sel': 'step:' + i, 'aria-current': ctx.cur('step', String(i)), title: D.stepHint[i] } }));
-  }));
+    return el('li', null, button({ label: [el('span', { class: 'td-day__seg', 'aria-hidden': 'true' })], variant: 'ghost', size: 'sm', onClick: () => select('step', i),
+      attrs: { class: 'td-day__ts', 'data-step-state': st, 'data-day-step': String(i), 'data-day-sel': 'step:' + i, 'aria-current': ctx.cur('step', String(i)), 'aria-label': t + ': ' + D.stepHint[i], title: t + ': ' + D.stepHint[i] } }));
+  })) : null;
   const working = m.tasks.filter((t) => t.status === 'working' || t.status === 'sending').length;
-  const status = !m.run ? D.status.idle : m.readFailed ? D.status.readFailed(m.readFailed.why) : m.stage === 'reading' ? D.status.reading : m.stage === 'working' ? D.status.working(working, m.needs)
-    : m.stage === 'review' ? D.status.review(m.needs, m.done) : D.status.done(m.done);
+  const started = m.run && m.run.started_at ? hhmm(m.run.started_at) : '';
+  const status = !m.run ? (busy ? D.starting : D.status.idle) : m.readFailed ? D.status.readFailed(m.readFailed.why) : m.stage === 'reading' ? D.status.reading : m.stage === 'working' ? D.status.working(working, m.needs)
+    : D.status.last(started, m.needs);
   let check = null;
   if (m.run && m.check) {
     const every = m.settings && m.settings.dayCheck && typeof m.settings.dayCheck.every === 'number' ? m.settings.dayCheck.every : m.check.every;
     const running = !!m.check.running || ui.busy.has('check');
-    check = every === 0 ? el('span', { class: 'td-day__check', 'data-day': 'check' }, D.checkOff)
-      : el('span', { class: 'td-day__check', 'data-day': 'check' }, el('span', null, running ? D.checking : D.checked(hhmm(m.check.last), hhmm(m.check.next))),
-        button({ label: D.checkNow, size: 'sm', disabled: running, attrs: { 'data-day': 'check-now' }, onClick: () => checkNow(ws) }));
+    check = every === 0 ? el('span', { class: 'td-day__check', 'data-day': 'check', title: D.checkOff }, D.checkOff)
+      : el('span', { class: 'td-day__check', 'data-day': 'check', title: running ? D.checking : D.checked(hhmm(m.check.last), hhmm(m.check.next)) },
+        iconButton({ icon: 'refresh-cw', ariaLabel: D.checkNow, size: 'sm', attrs: { 'data-day': 'check-now', disabled: running ? 'true' : null }, onClick: () => checkNow(ws) }));
   }
-  const press = runs.get(ws);
-  const busy = !!press && press.state === 'busy';
-  const bs = m.run && m.run.brief_session;
-  const reading = !!bs && !bs.ended_at && m.stage === 'reading' && !m.readFailed;
   const label = busy ? D.starting : reading ? D.stillReading : m.run ? D.again : D.prepare;
+  const open = m.allGoals.filter((g) => g.status === 'open').length;
   return el('header', { class: 'td-day__bar' },
-    (() => { const when = [dateLabel(m.now), m.free !== null && m.free !== undefined ? D.free(m.free) : null].filter(Boolean).join(' · ');
+    (() => { const when = [dateLabel(m.now), D.unfinished(open, m.allGoals.length)].filter(Boolean).join(' · ');
       return el('div', { class: 'td-day__hello', title: greet(m.now) + ' ' + when }, el('b', null, greet(m.now)), ' ', el('span', { class: 'td-day__dim' }, when)); })(),
     steps,
     el('span', { class: 'td-day__status', role: 'status', 'data-day': 'status', title: status }, status),
     check,
-    button({ label: D.sources, size: 'sm', attrs: { 'data-day': 'sources', 'data-day-sel': 'sources:all', 'aria-current': ctx.cur('sources', 'all') }, onClick: () => select('sources', 'all') }),
+    iconButton({ icon: 'settings', ariaLabel: D.sources, size: 'sm', attrs: { 'data-day': 'sources', 'data-day-sel': 'sources:all', 'aria-current': ctx.cur('sources', 'all') }, onClick: () => select('sources', 'all') }),
     button({ label, variant: 'primary', size: 'sm', disabled: busy || reading, attrs: { 'data-day': 'prepare', 'data-goals': 'prepare-day', title: D.prepareHint, 'aria-busy': busy ? 'true' : 'false' }, onClick: () => prepareDay(ws) }),
     iconButton({ icon: 'chevron-down', ariaLabel: D.fold, size: 'sm', expanded: true, attrs: { 'data-day': 'toggle' }, onClick: () => fold(false) }));
 }