create-pmos 0.52.0 → 0.53.0

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

@@ -0,0 +1,438 @@
+/* pm/dest-board.js — the Board destination: every initiative's items in one Kanban (pm-os-absorb Run 4, slice 4D; PRD R9, R19).
+ *
+ * A destination module (registry.js): `mountDestination(host, ctx)` runs on EVERY render with the same host and rebuilds only
+ * when its own data changed; `disposeDestination(host)` runs when the tab closes. It draws the Breakdown's Board for all
+ * the work initiatives at once:
+ *   - the filters: Active (the default), Mine, and one initiative; the one primary action, + Add item;
+ *   - the Release cards for the ready batches, above the columns (release-card.js);
+ *   - the four columns, drawn by bd-board.js renderBoard and moved by the same actions as the Breakdown's Board: a drag,
+ *     the card's ⋯ menu, or the item sheet's state buttons. Done is held for Undo (undo-hold.js).
+ *
+ * WHERE THE DATA COMES FROM. GET /api/board (lib/routes-board.js) answers every card with the state that its tree row has,
+ * because both read one fold. The page keeps the last answer and draws from it; it stores nothing else (D33). A write is
+ * drawn at once on a copy, POSTed to /api/plan-items, and the Board is read again, so the screen never keeps a change
+ * that was not saved. An agent's card that you drag reads "moved by you": the writer records the move with override.
+ *
+ * WHEN IT READS AGAIN. On a change of this workspace's ledgers (data.js polls them while a pane is open) and, through
+ * sig-watch.js watchSig, when the `sig` of GET /api/board?only=sig changes: a placement, a factory change or a write from
+ * the CLI that the ledger poll does not see.
+ *
+ * ONE INITIATIVE'S STAGES, MANY INITIATIVES' BOARD. renderBoard draws a card's meta from the layout's stages, so the page
+ * gives it one combined list: a stage id is `<initiative>::<stage>` and its label is "<initiative title> · <stage>". The
+ * item sheet and the writes use the plain stage id of the item's own initiative.
+ */
+
+import { el, setChildren } from './dom.js';
+import { state, FIXTURE } from './state.js';
+import { wsOf, watchLedgers } from './data.js';
+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 { COPY as BD } from './breakdown-copy.js';
+import { COPY } from './board-copy.js';
+import { hold, cancel, isHeld, flush, overlay, anyHeld } from './undo-hold.js';
+import { loadSortable, baseOptions, dragSet } from './bd-drag.js';
+import { renderBoard, bindBoardDrag, WIDE_BOARD } from './bd-board.js';
+import { openItemSheet } from './item-sheet.js';
+import { recount, moveLocal, setLocal, flagLocal, removeLocal, keepLocal } from './bd-model.js';
+import { releaseCard, grantScopes } from './release-card.js';
+
+const SEP = '::';
+const keyOf = (initiative, stage) => initiative + SEP + stage;
+const plainStage = (stage) => { const s = String(stage); const i = s.indexOf(SEP); return i < 0 ? s : s.slice(i + SEP.length); };
+const enc = encodeURIComponent;
+const clone = (o) => (typeof structuredClone === 'function' ? structuredClone(o) : JSON.parse(JSON.stringify(o)));
+const STATE_LABEL = (s) => BD.states[s] || s;
+
+const panes = new WeakMap();   // host -> pane
+const live = new Set();
+
+/** The answer of GET /api/board as the layout renderBoard and the item sheet read: one stage list for every initiative. */
+function layoutOf(out) {
+  const stages = [];
+  for (const ini of out.initiatives || []) {
+    for (const s of ini.stages || []) {
+      stages.push({ id: keyOf(ini.id, s.id), label: COPY.stageOf(ini.title, s.label), initiative: ini.id, items: [], visible: true });
+    }
+  }
+  const items = {};
+  for (const [id, it] of Object.entries(out.items || {})) items[id] = { ...it, stage: keyOf(it.initiative, it.stage) };
+  return { items, stages, board: clone(out.board || { todo: [], doing: [], review: [], done: [], doneOlder: 0 }), now: out.now, flags: [], batches: [] };
+}
+
+/** recount rebuilds the columns from the items, but the older Done items never reach the page: keep the server's count. */
+function recountBoard(L, older) {
+  recount(L);
+  L.board.doneOlder = older || 0;
+  return L;
+}
+
+/** The layout drawn: the last answer, with every held change applied. */
+function view(P) {
+  if (!P.raw) return null;
+  const L = clone(P.raw);
+  return anyHeld() ? recountBoard(overlay(L), P.older) : L;
+}
+
+/** The layout of ONE initiative for the item sheet: its own stages with their plain ids, its batches, every item by plain stage. */
+function sheetView(P, initiative) {
+  const L = view(P);
+  if (!L) return null;
+  const ini = ((P.out && P.out.initiatives) || []).find((i) => i.id === initiative) || { stages: [], batches: [] };
+  const items = {};
+  for (const [id, it] of Object.entries(L.items)) items[id] = { ...it, stage: plainStage(it.stage) };
+  return { ...L, items, stages: (ini.stages || []).map((s) => ({ id: s.id, label: s.label, items: [], visible: true })), batches: ini.batches || [] };
+}
+
+async function load(P) {
+  if (P.loading) { P.again = true; return; }
+  P.loading = true;
+  try {
+    do {
+      P.again = false;
+      const f = P.filter === 'init' ? 'init:' + P.init : P.filter;
+      const out = await pmGet('/api/board?ws=' + enc(P.ws) + '&filter=' + enc(f));
+      if (P.disposed) return;
+      if (!out || out.ok === false) { P.error = (out && out.error) || 'could not read'; P.loaded = true; }
+      else { P.error = null; P.out = out; P.raw = layoutOf(out); P.older = (out.board && out.board.doneOlder) || 0; P.loaded = true; }
+      bump(P);
+    } while (P.again && !P.disposed);
+  } finally { P.loading = false; }
+}
+
+function bump(P) {
+  P.ver++;
+  if (P.dragging) return;
+  render(P);
+}
+
+function focusKeyIn(P) {
+  const a = document.activeElement;
+  if (!a || !P.root.contains(a)) return null;
+  const k = a.closest('[data-fk]');
+  return k ? k.getAttribute('data-fk') : null;
+}
+
+function headOf(P) {
+  const out = P.out;
+  const inits = (out && out.initiatives) || [];
+  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 }],
+    onChange: (v) => P.actions.setFilter(v), attrs: { 'data-bo-filter': P.filter === 'init' ? 'init:' + P.init : P.filter },
+  });
+  for (const b of f.querySelectorAll('[data-tab]')) b.setAttribute('data-fk', 'f:' + b.getAttribute('data-tab'));
+  const pick = field({
+    label: COPY.initiative, kind: 'select', hideLabel: true, value: P.filter === 'init' ? P.init : '',
+    options: [{ value: '', label: COPY.anyInitiative }, ...inits.map((i) => ({ value: i.id, label: i.title }))],
+    onCommit: (v) => P.actions.setInit(v), attrs: { 'data-bo-init': '', 'data-fk': 'init' },
+  });
+  const add = button({
+    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;
+  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),
+  ];
+}
+
+function render(P) {
+  P.rendering = true;
+  try {
+    const fk = focusKeyIn(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;
+    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 });
+      const rel = (P.out && P.out.releases) || [];
+      if (rel.length) {
+        grantScopes(() => bump(P));
+        kids.unshift(el('div', { class: 'bo-releases', 'data-bo-releases': String(rel.length) },
+          el('div', { class: 'bo-releases__head' }, COPY.release.head),
+          rel.map((r) => releaseCard(r, { ws: P.ws, onDone: () => load(P) })),
+          el('div', { class: 'bo-releases__note' }, COPY.release.note)));
+      }
+      if (!((P.out && P.out.initiatives) || []).length) kids.unshift(el('div', { class: 'bd-note', 'data-bo-none': '' }, COPY.noInitiatives));
+      else if (!Object.keys(L.items).length) kids.unshift(el('div', { class: 'bd-note', 'data-bo-empty': '' }, COPY.noItems));
+      if (P.error) kids.unshift(el('div', { class: 'bd-note bd-note--error', role: 'alert' }, COPY.readFailed(P.error)));
+    }
+    setChildren(P.bodyEl, kids);
+    // a card dragged to Done before the factory's work was merged says so (R7): text on the card, never a control
+    if (L) {
+      for (const c of P.bodyEl.querySelectorAll('.bd-card[data-item]')) {
+        const it = L.items[c.getAttribute('data-item')];
+        if (it && it.state === 'done' && it.factory && it.factory.notMerged) c.appendChild(el('div', { class: 'bo-card__note', 'data-bo-notmerged': '' }, it.factory.label || COPY.notMerged));
+      }
+    }
+    P.root.setAttribute('data-bo-filter', P.filter === 'init' ? 'init:' + P.init : P.filter);
+    if (fk) {
+      const t = P.root.querySelector('[data-fk="' + (window.CSS && CSS.escape ? CSS.escape(fk) : fk) + '"]');
+      if (t && document.activeElement !== t) t.focus({ preventScroll: true });
+    }
+    P.renderedVer = P.ver;
+    if (P.sheet && P.sheet.open) P.sheet.refresh();
+    bindDrag(P);
+  } finally { P.rendering = false; }
+}
+
+function bindDrag(P) {
+  if (!P.raw || P.disposed) return;
+  const ver = P.ver;
+  loadSortable().then((Sortable) => {
+    if (!Sortable || P.disposed || P.ver !== ver || P.drags.size) return;
+    const L = view(P);
+    if (!L) return;
+    bindBoardDrag({ P, L, A: P.actions, wide: P.wide, cardMenus: P.cardMenus }, Sortable, P.drags, baseOptions);
+  });
+}
+
+/* ── writes ───────────────────────────────────────────────────────────────────────────────────────────────────────── */
+
+async function write(P, events, apply) {
+  if (apply && P.raw) { apply(P.raw); recountBoard(P.raw, P.older); bump(P); }
+  const out = await postEvents(P.ws, events);
+  if (!out || out.ok === false) {
+    toast({ text: (out && out.error) || 'nothing was saved', tone: 'error' });
+    await load(P);
+    return out;
+  }
+  await load(P);
+  return out;
+}
+
+function undone(P, id) {
+  bump(P);
+  const t = P.root.querySelector('[data-fk="card:' + id + '"]');
+  if (t && t.isConnected && !(P.sheet && P.sheet.open)) t.focus({ preventScroll: true });
+}
+
+function makeActions(P) {
+  const L = () => view(P);
+  const A = {
+    rerender: () => bump(P),
+    refresh: () => load(P),
+    setBoardCol(c) { if (P.boardCol === c) return; P.boardCol = c; bump(P); },
+    setFilter(f) {
+      if (P.filter === f && !P.init) return;
+      P.filter = f; P.init = null;
+      bump(P); load(P);
+    },
+    setInit(id) {
+      if (!id) { P.filter = 'active'; P.init = null; } else { P.filter = 'init'; P.init = id; }
+      bump(P); load(P);
+    },
+    moveTo(id, to) {
+      const it = L() && L().items[id];
+      if (!it) { bump(P); return; }
+      if (it.state === to) { bump(P); return; }
+      if (to === 'done') {
+        hold({
+          key: 'done:' + id, ws: P.ws, text: BD.markedDone,
+          events: [{ ev: 'moved', item: id, to: 'done' }],
+          apply: (lay) => moveLocal(lay, id, 'done'),
+          onDone: () => load(P), onUndo: () => undone(P, id),
+        });
+        bump(P);
+        return;
+      }
+      if (isHeld('done:' + id)) cancel('done:' + id);
+      write(P, [{ ev: 'moved', item: id, to }], (raw) => moveLocal(raw, id, to));
+    },
+    withdraw(id) {
+      const it = L() && L().items[id];
+      if (!it) return;
+      flush('done:' + id);
+      hold({
+        key: 'withdraw:' + id, ws: P.ws, text: BD.withdrawn,
+        events: [{ ev: 'withdrawn', item: id }],
+        apply: (lay) => removeLocal(lay, id),
+        onDone: () => load(P), onUndo: () => undone(P, id),
+      });
+      bump(P);
+    },
+    setFields(id, fields) {
+      const it = P.raw && P.raw.items[id];
+      const local = it && 'stage' in fields ? { ...fields, stage: keyOf(it.initiative, fields.stage) } : fields;
+      return write(P, [{ ev: 'set', item: id, fields }], (raw) => setLocal(raw, id, local));
+    },
+    flag(id, blocked, reason) {
+      return write(P, [blocked ? { ev: 'flagged', item: id, blocked: true, reason } : { ev: 'flagged', item: id, blocked: false }],
+        (raw) => flagLocal(raw, id, blocked, reason));
+    },
+    async keepBatch(initiative, b) {
+      const n = (b.items || []).length;
+      const out = await write(P, [{ ev: 'kept', initiative, batch: b.by, items: b.items }], (raw) => keepLocal(raw, b.by, b.items));
+      if (out && out.ok !== false) toast({ text: BD.kept(n) });
+    },
+    openSheet(id, opts) {
+      if (P.sheet && P.sheet.open) P.sheet.close();
+      const it = P.raw && P.raw.items[id];
+      if (!it) return;
+      const initiative = it.initiative;
+      const ctx = {
+        ws: P.ws, slug: initiative, view: () => sheetView(P, initiative),
+        move: (i, to) => A.moveTo(i, to), setFields: (i, f) => A.setFields(i, f), flag: (i, b, r) => A.flag(i, b, r),
+        withdraw: (i) => A.withdraw(i), sessions: () => state.sessions || [],
+        attachEvidence: (i, evidence) => write(P, [{ ev: 'moved', item: i, to: 'done', evidence }], (raw) => {
+          const x = raw.items[i]; const k = String(evidence).indexOf(':');
+          if (x && k > 0) { x.evidence = { kind: String(evidence).slice(0, k), ref: String(evidence).slice(k + 1) }; x.noEvidence = false; }
+        }),
+        keep: (b) => A.keepBatch(initiative, b),
+        onClose: (i) => {
+          P.sheet = null;
+          const t = P.root.querySelector('[data-fk="card:' + i + '"]');
+          if (t && t.isConnected) t.focus({ preventScroll: true });
+        },
+      };
+      P.sheet = openItemSheet(ctx, id, opts);
+    },
+    menu(anchor, id) {
+      const lay = L();
+      const it = lay && lay.items[id];
+      if (!it) return;
+      const items = [];
+      for (const s of ['todo', 'doing', 'review', 'done']) if (s !== it.state) items.push({ label: BD.menu.moveTo(STATE_LABEL(s)), onSelect: () => A.moveTo(id, s) });
+      items.push({ sep: true });
+      items.push({ label: BD.handToAgent, icon: 'bot', onSelect: () => A.openSheet(id, { handoff: true }) });
+      items.push({ label: BD.labels.withdraw, danger: true, onSelect: () => A.withdraw(id) });
+      menu({ anchor, items, ariaLabel: BD.aria.more(it.title) });
+    },
+    openAdd() { openAdd(P); },
+  };
+  return A;
+}
+
+/** + Add item: a sheet with a title, an initiative and a stage. The item is planned in that initiative's ledger. */
+function openAdd(P) {
+  const inits = (P.out && P.out.initiatives) || [];
+  if (!inits.length) { toast({ text: COPY.adding.needInitiative, tone: 'error' }); return; }
+  const stagesOf = (id) => ((inits.find((i) => i.id === id) || {}).stages || []);
+  const pickStage = (id) => { const ss = stagesOf(id); return (ss.find((s) => s.id === 'build') || ss[0] || {}).id || ''; };
+  const first = P.filter === 'init' && inits.some((i) => i.id === P.init) ? P.init : inits[0].id;
+  const title = field({ label: COPY.adding.fieldTitle, kind: 'text', attrs: { 'data-bo-input': 'title', maxlength: '200', spellcheck: 'true' } });
+  const stageSel = field({
+    label: COPY.adding.fieldStage, kind: 'select', value: pickStage(first),
+    options: stagesOf(first).map((s) => ({ value: s.id, label: s.label })), attrs: { 'data-bo-input': 'stage' },
+  });
+  const initSel = field({
+    label: COPY.adding.fieldInitiative, kind: 'select', value: first, options: inits.map((i) => ({ value: i.id, label: i.title })),
+    attrs: { 'data-bo-input': 'initiative' },
+    onCommit: (v) => {
+      const sel = stageSel.control;
+      sel.replaceChildren(...stagesOf(v).map((s) => el('option', { value: s.id }, s.label)));
+      sel.value = pickStage(v);
+    },
+  });
+  let busy = false;
+  const submit = async () => {
+    if (busy) return;
+    const t = title.control.value.trim();
+    if (!t) { toast({ text: COPY.adding.needTitle, tone: 'error' }); title.control.focus(); return; }
+    busy = true;
+    const out = await postEvents(P.ws, [{ ev: 'planned', initiative: initSel.control.value, title: t, stage: stageSel.control.value }]);
+    busy = false;
+    if (!out || out.ok === false) { toast({ text: (out && out.error) || 'nothing was saved', tone: 'error' }); return; }
+    sh.close();
+    toast({ text: COPY.added });
+    load(P);
+  };
+  title.control.addEventListener('keydown', (e) => { if (e.key === 'Enter') { e.preventDefault(); submit(); } });
+  const sh = sheet({
+    mode: 'auto', title: COPY.adding.title, sub: COPY.adding.sub, attrs: { 'data-bo-sheet': 'add' },
+    body: [title, el('div', { class: 'bd-grid2' }, initSel, stageSel)],
+    actions: [
+      button({ label: COPY.adding.cancel, variant: 'outline', onClick: () => sh.close(), attrs: { 'data-bo-cancel': '' } }),
+      button({ label: COPY.adding.add, variant: 'primary', onClick: submit, attrs: { 'data-bo-confirm': '' } }),
+    ],
+    onClose: () => { const b = P.root.querySelector('[data-fk="add"]'); if (b && b.isConnected) b.focus({ preventScroll: true }); },
+  });
+  title.control.focus();
+}
+
+/* ── mount ────────────────────────────────────────────────────────────────────────────────────────────────────────── */
+
+function dispose(P) {
+  P.disposed = true;
+  P.drags.destroy();
+  if (P.unwatch) P.unwatch();
+  if (P.stopSig) P.stopSig();
+  if (P.onLedgers) window.removeEventListener('pmos:ledgers', P.onLedgers);
+  if (P.resize) P.resize.disconnect();
+  if (P.sheet && P.sheet.open) P.sheet.close();
+  live.delete(P);
+}
+
+function createPane(host, ws) {
+  const headEl = el('div', { class: 'bd-head bo-head' });
+  const bodyEl = el('div', { class: 'bd-body', 'data-bd-body': '' });
+  const root = el('div', { class: 'bd-pane bo-pane', 'data-bo-pane': '', 'data-ws': ws }, headEl, bodyEl);
+  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,
+    coarse: typeof matchMedia === 'function' && matchMedia('(pointer: coarse)').matches,
+  };
+  P.actions = makeActions(P);
+  P.unwatch = watchLedgers(ws);
+  P.onLedgers = (e) => {
+    const d = e && e.detail;
+    if (d && (d.changed || []).includes(ws)) load(P);
+  };
+  window.addEventListener('pmos:ledgers', P.onLedgers);
+  // the signature of GET /api/board (the placements and the factory join, which the ledger poll does not cover)
+  P.stopSig = watchSig(async () => {
+    const j = await pmGet('/api/board?ws=' + enc(ws) + '&only=sig');
+    return j && j.ok !== false && typeof j.sig === 'string' ? j.sig : null;
+  }, () => load(P));
+  if (typeof ResizeObserver === 'function') {
+    P.resize = new ResizeObserver((entries) => {
+      const w = entries[0] && entries[0].contentRect.width;
+      if (!w) return;
+      P.lastWidth = w;
+      if ((w >= WIDE_BOARD) !== P.wide) bump(P);
+    });
+    P.resize.observe(root);
+  }
+  return P;
+}
+
+export function mountDestination(host, ctx) {
+  if (FIXTURE) return;
+  const ws = wsOf((ctx && ctx.tab && ctx.tab.repo) || currentProduct());
+  let P = panes.get(host);
+  if (P && (P.disposed || P.ws !== ws)) { dispose(P); panes.delete(host); P = null; }
+  if (!ws) { ensureComponentsCss(); host.replaceChildren(empty({ text: COPY.noWorkspace, attrs: { 'data-bo-no-ws': '' } })); return; }
+  if (!P) {
+    ensureComponentsCss(); layer(); ensureSprite();
+    P = createPane(host, ws);
+    panes.set(host, P); live.add(P);
+    setChildren(host, [P.root]);
+    render(P);
+    load(P);
+    return;
+  }
+  if (host.firstChild !== P.root || host.childNodes.length !== 1) setChildren(host, [P.root]);
+  if (P.renderedVer !== P.ver && !P.dragging) render(P);
+}
+
+export function disposeDestination(host) {
+  const P = panes.get(host);
+  if (!P) return;
+  panes.delete(host);
+  if (!P.disposed) dispose(P);
+}
+
+/* for the browser suites: the pane of a host, read-only */
+export function _paneOf(host) { return panes.get(host) || null; }

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

@@ -0,0 +1,134 @@
+/* pm/dest-initiatives.js — the Initiatives destination (pm-os-absorb Run 2, slice 2D; PRD R9, R15, R17, R20).
+ *
+ * The shell of the place: a header with the View control (Roadmap, List, and any view another run registered, such as
+ * Timeline) and the New initiative button, and under it the view that is chosen. Roadmap and List are built here; a
+ * registered view is mounted with initiativesViewCtx(…), the one way to build its ctx, and appears only when
+ * initiativesViews() lists it.
+ *
+ * This module imports the others so that their registrations run when it loads at boot: the initiative sheet (it becomes
+ * the opener of every initiative), the Cycle review card and the triage card (Today cards), and the New-initiative form.
+ *
+ * mountDestination(host, ctx) runs on every render. It keeps ONE root per host and rebuilds a view only when the
+ * repository, the workspace or the chosen view changed.
+ */
+
+import { el } from './dom.js';
+import { button, tabs, empty, ensureComponentsCss } from './primitives.js';
+import { wsOf } from './data.js';
+import { setInitiativeOpener, registerCommand, initiativesViews, initiativesViewCtx, openDestination } from './registry.js';
+import { COPY } from './initiatives-copy.js';
+import { getRoadmap, grantScopes } from './initiatives-api.js';
+import { mountRoadmap } from './roadmap.js';
+import { mountList } from './initiative-list.js';
+import { openSheet } from './initiative-sheet.js';
+import { openNewInitiative } from './new-initiative-sheet.js';
+import './cycle-review.js';
+import './triage-card.js';
+
+setInitiativeOpener(openSheet);
+
+registerCommand({ id: 'initiatives-open', label: 'Open Initiatives', hint: 'Roadmap and List', cli: 'pmos initiative list', run: () => openDestination('initiatives') });
+registerCommand({
+  id: 'initiatives-new', label: COPY.newInitiative, hint: 'Add one to Later', cli: 'pmos initiative new "<title>" --anchor <kr>',
+  run: () => { openDestination('initiatives'); try { window.dispatchEvent(new CustomEvent('pmos:initiatives-new')); } catch { /* no window */ } },
+});
+registerCommand({ id: 'initiatives-list', label: 'Initiatives as a list', hint: 'By objective', cli: 'pmos initiative list', run: () => { try { window.localStorage.setItem('pmos.initiatives.view', 'list'); } catch { /* no storage */ } openDestination('initiatives'); try { window.dispatchEvent(new CustomEvent('pmos:initiatives-view', { detail: 'list' })); } catch { /* no window */ } } });
+
+const BUILT_IN = ['roadmap', 'list'];
+const roots = new WeakMap();   // host -> its persistent root and what it shows
+
+function savedView() { try { return window.localStorage.getItem('pmos.initiatives.view'); } catch { return null; } }
+function saveView(v) { try { window.localStorage.setItem('pmos.initiatives.view', v); } catch { /* no storage */ } }
+
+const flat = (answer) => {
+  if (!answer || !answer.horizons) return [];
+  return [...(answer.horizons.now || []), ...(answer.horizons.next || []), ...(answer.horizons.later || []), ...(answer.dormant || [])];
+};
+
+export function mountDestination(host, ctx) {
+  ensureComponentsCss();
+  const state = ctx.state;
+  const repo = (ctx.tab && ctx.tab.repo) || state.product || null;
+  const ws = (repo && wsOf(repo)) || state.wsId || null;
+  let r = roots.get(host);
+  if (!r) {
+    r = { root: el('div', { class: 'in-dest', 'data-in-dest': '' }), view: savedView() || 'roadmap', key: null, handle: null, extra: null, rows: [], sig: null, grants: [] };
+    roots.set(host, r);
+    host.replaceChildren(r.root);
+    const reloadView = () => { if (r.handle && r.handle.reload) r.handle.reload(); refreshRows(r, ws); };
+    r.onChanged = reloadView;
+    // The three listeners are kept on r so disposeDestination can take them off: a closed tab must not keep its host alive.
+    r.listeners = [
+      ['pmos:initiatives-changed', () => { if (roots.get(host) === r) r.onChanged(); }],
+      ['pmos:initiatives-new', () => { if (roots.get(host) === r) r.openNew(); }],
+      ['pmos:initiatives-view', (e) => { if (roots.get(host) === r && e.detail) { r.view = e.detail; r.draw(r.ctx); } }],
+    ];
+    for (const [name, fn] of r.listeners) window.addEventListener(name, fn);
+  }
+  r.ctx = ctx;
+  r.openNew = () => openNewInitiative({ repo, ws, anchors: r.rows.map((x) => x.anchor), onAdded: () => r.onChanged() });
+  r.draw = (c) => draw(host, r, c, repo, ws);
+  if (r.key === keyOf(r, repo, ws)) return;   // nothing changed that this place draws: keep the live view (a drag may be running in it)
+  r.draw(ctx);
+}
+
+const keyOf = (r, repo, ws) => [repo, ws, r.view, initiativesViews().map((v) => v.id).join(',')].join('|');
+
+function refreshRows(r, ws) {
+  if (!ws) return;
+  getRoadmap(ws).then((a) => { if (a && a.ok) { r.rows = flat(a); r.sig = a.sig || null; } });
+}
+
+function draw(host, r, ctx, repo, ws) {
+  if (r.handle && r.handle.dispose) r.handle.dispose();
+  if (r.extra && r.extra.dispose) { try { r.extra.dispose(r.body); } catch { /* the view is gone */ } }
+  r.handle = null; r.extra = null;
+
+  const views = [
+    { id: 'roadmap', label: COPY.roadmap },
+    { id: 'list', label: COPY.list },
+    ...initiativesViews().filter((v) => !BUILT_IN.includes(v.id)).map((v) => ({ id: v.id, label: v.label || v.id })),
+  ];
+  if (!views.some((v) => v.id === r.view)) r.view = 'roadmap';
+  r.key = keyOf(r, repo, ws);
+
+  const head = el('div', { class: 'in-head' },
+    el('h2', { class: 'in-head__title' }, COPY.title),
+    tabs({ variant: 'segmented', role: 'tablist', ariaLabel: COPY.views, items: views, value: r.view, attrs: { 'data-in-views': '' }, onChange: (id) => { r.view = id; saveView(id); r.draw(r.ctx); } }),
+    button({ label: COPY.newInitiative, icon: 'plus', variant: 'primary', attrs: { 'data-in-new': '' }, onClick: () => r.openNew() }));
+  r.body = el('div', { class: 'in-body', 'data-in-body': r.view });
+  r.root.replaceChildren(head, r.body);
+
+  if (!ws) { r.body.replaceChildren(empty({ text: COPY.noRepo, attrs: { 'data-in-empty': 'repo' } })); return; }
+
+  const open = (rp, slug) => ctx.openInitiative(rp || repo, slug);
+  if (r.view === 'roadmap') {
+    r.handle = mountRoadmap(r.body, { repo, ws, openInitiative: open, onData: (a) => { r.rows = flat(a); r.sig = a.sig || null; } });
+  } else if (r.view === 'list') {
+    r.handle = mountList(r.body, { repo, ws, openInitiative: open, grants: () => r.grants });
+    refreshRows(r, ws);
+    grantScopes().then((g) => { r.grants = g; if (r.handle && r.handle.reload) r.handle.reload(); });
+  } else {
+    const v = initiativesViews().find((x) => x.id === r.view);
+    if (v) {
+      refreshRows(r, ws);
+      getRoadmap(ws).then((a) => {
+        if (r.view !== v.id) return;
+        const rows = a && a.ok ? flat(a) : [];
+        r.rows = rows;
+        v.mount(r.body, initiativesViewCtx({ repo, ws, rows, sig: a && a.sig ? a.sig : null, openInitiative: open, setState: ctx.setState }));
+      });
+      r.extra = { dispose: (b) => { if (typeof v.dispose === 'function') v.dispose(b); } };
+    }
+  }
+}
+
+export function disposeDestination(host) {
+  const r = roots.get(host);
+  if (!r) return;
+  if (r.handle && r.handle.dispose) r.handle.dispose();
+  if (r.extra && r.extra.dispose) { try { r.extra.dispose(r.body); } catch { /* gone */ } }
+  for (const [name, fn] of r.listeners || []) window.removeEventListener(name, fn);
+  r.listeners = null;
+  roots.delete(host);
+}