@bongos/core 1.24.7 → 1.24.8

package/modules/hall-ui/public/market-watch-rules-lib.js

@@ -0,0 +1,207 @@
+// market-watch-rules-lib.js — the Market Watch rules page's markup, pure (task 1004941).
+//
+// Built to docs/design/mocks/market-watch/rules.html, option C, the pipeline map: a
+// version slider (v1 to the version in use, plus the proposed next one), the five steps
+// as a row of nodes (searches → sources → names → scoring → brief), the tapped step's
+// rules in plain words with its open proposals, and the cost of one run by step.
+//
+// Every string here comes from the server's GET /market-watch/rules and much of it is
+// member-typed (reasons, names, searches), so every one goes through `esc`; nothing is
+// inserted as HTML. Node-require-safe: no document, no fetch, so a test renders the real
+// markup from a real view.
+(function (root) {
+  'use strict';
+
+  const ASK = () => (root && root.OTBAsk) || (typeof require === 'function' ? require('./hall-ask.js') : null);
+  const money = (n) => `$${(Number(n) || 0).toFixed(2)}`;
+
+  // The slider's stops: every version that was in use, then the proposed next one.
+  function stops(view) {
+    const out = (view.history || []).map((h) => ({
+      version: h.version, kind: h.status === 'active' ? 'now' : 'past', summary: h.summary, changed: h.changed || [], rules: h.rules, entry: h,
+    }));
+    if (view.next) {
+      out.push({
+        version: view.next.version,
+        kind: 'next',
+        summary: view.next.applied === 1 ? 'if you approve the proposal' : `if you approve all ${view.next.applied} proposals`,
+        changed: view.next.changed || [],
+        rules: view.next.rules,
+      });
+    }
+    return out;
+  }
+
+  function stopLabel(stop) {
+    if (!stop) return '';
+    return `v${stop.version}${stop.kind === 'now' ? ' · now' : stop.kind === 'next' ? ' · proposed' : ''}`;
+  }
+
+  function sliderHtml(view, at, esc) {
+    const s = stops(view);
+    if (!s.length) return '';
+    const i = Math.max(0, Math.min(s.length - 1, at));
+    const cur = s[i];
+    const pill = cur.kind === 'now' ? 'in use' : cur.summary || '';
+    const ticks = s.map((x) => `<span>v${esc(x.version)}${x.kind === 'next' ? '?' : ''}</span>`).join('');
+    return `<div class="mwr-time">`
+      + `<span class="mwr-mono" id="mwr-vl">${esc(stopLabel(cur))}</span>`
+      + `<input type="range" id="mwr-v" min="0" max="${s.length - 1}" value="${i}" aria-label="rules version"${s.length < 2 ? ' disabled' : ''}>`
+      + `<span class="mwr-pill${cur.kind === 'now' ? ' mwr-pill--hot' : ''}" id="mwr-vs">${esc(pill)}</span>`
+      + `</div><div class="mwr-ticks" aria-hidden="true">${ticks}</div>`;
+  }
+
+  // The five nodes. `changed` marks the steps the slider's version changed.
+  function pipelineHtml(view, { open, changed = [] }, esc) {
+    return (view.steps || []).map((s, i) => {
+      const cls = `mwr-node${changed.includes(s.key) ? ' mwr-node--changed' : ''}`;
+      const badge = s.open ? `<span class="mwr-badge" aria-label="${esc(s.open)} open proposals">${esc(s.open)}</span>` : '';
+      const node = `<button type="button" class="${cls}" data-step="${esc(s.key)}" aria-pressed="${s.key === open}">`
+        + `<span class="mwr-node__k">${esc(s.label)}</span><span class="mwr-node__v">${esc(s.value)}</span>`
+        + `<span class="mwr-node__s">${esc(s.sub)}</span>${badge}</button>`;
+      return node + (i < view.steps.length - 1 ? '<span class="mwr-arrow" aria-hidden="true">&rarr;</span>' : '');
+    }).join('');
+  }
+
+  // A step's rules, as the chosen version has them.
+  function rulesBodyHtml(step, rules, view, esc) {
+    const r = rules || {};
+    const rows = (list) => (list && list.length
+      ? `<ul class="mwr-rows">${list.map((x) => `<li class="mwr-row"><span class="mwr-grow">${esc(x)}</span></li>`).join('')}</ul>`
+      : '<p class="mwr-empty">Nothing here yet.</p>');
+    if (step === 'searches') return rows(r.search_queries);
+    if (step === 'sources') return rows(r.sources);
+    if (step === 'brief') return r.instructions ? `<pre class="mwr-pre">${esc(r.instructions)}</pre>` : '<p class="mwr-empty">No brief yet.</p>';
+    if (step === 'scoring') {
+      const kinds = Object.keys(r.rubric || {}).sort();
+      if (!kinds.length) return '<p class="mwr-empty">Nothing is scored yet.</p>';
+      return kinds.map((kind) => `<p class="mwr-sub">${esc(kind === 'competitor' ? 'competitors' : kind === 'partner' ? 'partners' : kind)}</p>`
+        + `<ul class="mwr-rows">${(r.rubric[kind] || []).map((d) => {
+          const w = Number.isInteger(d.weight) ? d.weight : 1;
+          return `<li class="mwr-row" title="${esc(d.definition || '')}"><span class="mwr-grow">${esc(d.label || d.key)}</span><span class="mwr-mono">×${esc(w)}</span></li>`;
+        }).join('')}</ul>`).join('');
+    }
+    // names: the people's list, not a rules field
+    const step3 = (view.steps || []).find((s) => s.key === 'names');
+    const top = (step3 && step3.rules && step3.rules.top) || [];
+    if (!top.length) return '<p class="mwr-empty">Nothing is watched yet.</p>';
+    const more = step3.value - top.length;
+    return `<ul class="mwr-rows">${top.map((t) => `<li class="mwr-row"><span class="mwr-grow">${esc(t.name)}</span>`
+      + `<span class="mwr-pill${t.overall != null && t.overall >= 6 ? ' mwr-pill--hot' : ''}">${t.overall == null ? '' : esc(t.overall)}${t.kind === 'competitor' ? '' : ` · ${esc(t.kind)}`}</span></li>`).join('')}`
+      + `${more > 0 ? `<li class="mwr-row mwr-faint">+ ${esc(more)} more</li>` : ''}</ul>`;
+  }
+
+  // One open proposal. A card only for a reader who can act on it (the owner decides;
+  // where the government decides, anyone who may open a matter can send it to the vote);
+  // everyone else reads it as one line.
+  function proposalHtml(p, view, esc) {
+    const d = view.decide || {};
+    const nextV = view.active ? view.active.version + 1 : 1;
+    const q = /[?]$/.test(p.summary) ? p.summary : `${p.summary}?`;
+    const where = `proposal from ${p.by || 'a member'}`;
+    if (p.at_vote) {
+      return `<li class="mwr-row mwr-prop"><span class="mwr-dot" aria-hidden="true"></span><span class="mwr-grow">${esc(q)} <span class="mwr-faint">· ${esc(p.reason)}</span></span><span class="mwr-pill">at a vote</span></li>`;
+    }
+    const opts = [];
+    if (d.viewer_may_decide) {
+      opts.push({ label: 'Approve', result: p.kind === 'rule_change' ? `becomes v${nextV}` : 'takes effect now', rec: true, attrs: { 'data-act': 'approve', 'data-id': p.id } });
+    }
+    if (d.may_put_to_vote) opts.push({ label: 'Put to a vote', result: d.who ? `decided by ${d.who}` : 'the government decides', attrs: { 'data-act': 'vote', 'data-id': p.id } });
+    if (d.viewer_may_decide) opts.push({ label: 'Decline', result: 'stays in history', attrs: { 'data-act': 'decline', 'data-id': p.id } });
+    const ask = ASK();
+    if (!opts.length || !ask) {
+      return `<li class="mwr-row mwr-prop"><span class="mwr-dot" aria-hidden="true"></span><span class="mwr-grow">${esc(q)} <span class="mwr-faint">· ${esc(p.by || 'a member')}: ${esc(p.reason)}</span></span><span class="mwr-pill">waiting</span></li>`;
+    }
+    return ask.html({ tag: 'li', where, q, said: p.reason, row: true, opts, attrs: { 'data-proposal': p.id } });
+  }
+
+  function panelHtml(view, step, stop, esc) {
+    const s = (view.steps || []).find((x) => x.key === step);
+    if (!s) return '';
+    const props = (view.proposals || []).filter((p) => p.step === step);
+    // who we watch is not versioned with the rules, so the slider does not date it
+    const viewing = stop && stop.kind !== 'now' && step !== 'names' ? `<p class="mwr-faint mwr-viewing">as of ${esc(stopLabel(stop))}</p>` : '';
+    return `<h2 class="mwr-panel__h">${esc(s.title)}</h2>${viewing}`
+      + rulesBodyHtml(step, stop ? stop.rules : null, view, esc)
+      + (props.length ? `<ul class="mwr-props">${props.map((p) => proposalHtml(p, view, esc)).join('')}</ul>` : '')
+      + `<div class="mwr-propose"><button type="button" class="mwr-btn" data-act="propose" data-step="${esc(step)}" aria-expanded="false">propose a change</button></div>`
+      + '<div class="mwr-form-slot" id="mwr-form-slot"></div>';
+  }
+
+  // The form for one step's change. Selects carry only values the server's own check
+  // accepts; the server checks again.
+  function formHtml(view, step, esc) {
+    const active = (view.history || []).find((h) => h.status === 'active');
+    const r = (active && active.rules) || {};
+    const opt = (v, label) => `<option value="${esc(v)}">${esc(label)}</option>`;
+    const reason = '<label class="mwr-field"><span>why</span><input name="reason" maxlength="500" required placeholder="one line"></label>';
+    let body = '';
+    if (step === 'searches' || step === 'sources') {
+      const list = step === 'searches' ? (r.search_queries || []) : (r.sources || []);
+      body = `<label class="mwr-field"><span>change</span><select name="op">${opt('add', step === 'searches' ? 'add a search' : 'add a source')}${list.length ? opt('remove', 'remove one') : ''}</select></label>`
+        + `<label class="mwr-field" data-for="add"><span>${step === 'searches' ? 'search for' : 'read'}</span><input name="text" maxlength="300"></label>`
+        + (list.length ? `<label class="mwr-field" data-for="remove" hidden><span>remove</span><select name="pick">${list.map((x) => opt(x, x)).join('')}</select></label>` : '');
+    } else if (step === 'names') {
+      body = `<label class="mwr-field"><span>name</span><input name="name" maxlength="200" required></label>`
+        + `<label class="mwr-field"><span>kind</span><select name="kind">${opt('competitor', 'competitor')}${opt('partner', 'partner')}${opt('topic', 'topic')}</select></label>`
+        + '<label class="mwr-field"><span>link</span><input name="url" type="url" maxlength="500" placeholder="https://"></label>'
+        + '<label class="mwr-field"><span>why watch it</span><input name="why" maxlength="500"></label>';
+    } else if (step === 'scoring') {
+      const dims = [];
+      for (const kind of Object.keys(r.rubric || {}).sort()) {
+        for (const d of r.rubric[kind] || []) dims.push(opt(`${kind}|${d.key}`, `${d.label || d.key} (${kind})`));
+      }
+      body = `<label class="mwr-field"><span>score</span><select name="dim">${dims.join('')}</select></label>`
+        + `<label class="mwr-field"><span>counts</span><select name="weight">${[0, 1, 2, 3].map((w) => opt(w, w ? `×${w}` : 'not at all')).join('')}</select></label>`;
+    } else if (step === 'brief') {
+      body = `<label class="mwr-field mwr-field--wide"><span>the brief</span><textarea name="text" rows="4" maxlength="4000">${esc(r.instructions || '')}</textarea></label>`;
+    }
+    return `<form class="mwr-form" data-step="${esc(step)}">${body}${reason}`
+      + '<div class="mwr-form__go"><button type="submit" class="mwr-btn mwr-btn--go">send the proposal</button><button type="button" class="mwr-btn" data-act="cancel">cancel</button></div></form>';
+  }
+
+  // The form's fields → the { step, change, reason } the server takes.
+  function proposalFromForm(step, f) {
+    const v = (k) => (f[k] == null ? '' : String(f[k]));
+    let change;
+    if (step === 'searches' || step === 'sources') change = v('op') === 'remove' ? { op: 'remove', text: v('pick') } : { op: 'add', text: v('text') };
+    else if (step === 'names') change = { op: 'add', name: v('name'), kind: v('kind'), url: v('url'), why: v('why') };
+    else if (step === 'scoring') {
+      const [kind, key] = v('dim').split('|');
+      change = { op: 'weight', kind, key, weight: Number(v('weight')) };
+    } else change = { op: 'set', text: v('text') };
+    return { step, change, reason: v('reason') };
+  }
+
+  function costHtml(cost, esc) {
+    if (!cost) return '';
+    const rows = cost.rows.map((r) => `<li class="mwr-row"><span class="mwr-grow">${esc(r.label)}</span><span class="mwr-mono">${esc(money(r.usd))}</span></li>`).join('');
+    const note = cost.basis === 'run'
+      ? `run ${esc(cost.run && cost.run.n != null ? cost.run.n : '')} cost ${esc(money(cost.total))}${cost.run && cost.run.cost_log_usd != null ? ` (cost log ${esc(money(cost.run.cost_log_usd))})` : ''}; the split by step is an estimate`
+      : `estimate: no run has cost anything yet, so these are ${esc(money(cost.total))} from the planning figures`;
+    return `<ul class="mwr-rows">${rows}</ul><p class="mwr-note">${note}</p>`;
+  }
+
+  const ERRORS = Object.freeze({
+    owner_only: 'Only the project owner can decide this.',
+    decided_by_sitting: 'The government decides this one. Put it to a vote.',
+    already_proposed: 'That change is already waiting.',
+    already_there: 'The rules already have that.',
+    not_there: 'The rules do not have that.',
+    no_change: 'That is how the rules already are.',
+    reason_required: 'Say why in one line.',
+    too_many_open: 'You have twenty proposals waiting. Wait for some to be decided.',
+    url_required: 'Add the link to its site.',
+    bad_url: 'That link does not look right.',
+    name_required: 'Give it a name.',
+    text_required: 'Write something first.',
+    no_longer_applies: 'The rules changed since this was proposed. Decline it and propose again.',
+    no_government: 'This project has no government; the owner decides.',
+    already_at_vote: 'It is already at a vote.',
+  });
+  const errorText = (code, fallback) => ERRORS[code] || fallback || 'That did not work. Try again.';
+
+  const lib = { stops, stopLabel, sliderHtml, pipelineHtml, rulesBodyHtml, proposalHtml, panelHtml, formHtml, proposalFromForm, costHtml, errorText };
+  if (typeof module !== 'undefined' && module.exports) module.exports = lib;
+  if (root) root.OTBMarketWatchRules = lib;
+})(typeof window !== 'undefined' ? window : null);

package/modules/hall-ui/public/market-watch-rules.css

@@ -0,0 +1,68 @@
+/* market-watch-rules.css — the Market Watch rules page (task 1004941), built to
+   docs/design/mocks/market-watch/rules.html, option C (the pipeline map), on the hall's
+   own tokens rather than the mockup's literal colours and fonts. Everything is under the
+   `mwr-` prefix; the proposal card is the hall's ask card (hall-ask.css). */
+
+.mwr { max-width: 1000px; margin: 0 auto; padding: 4px 0 48px; color: var(--ink); }
+.mwr-mono { font-family: var(--font-mono); font-size: 12.5px; }
+.mwr-faint { color: var(--ink-faint); }
+.mwr-empty { color: var(--ink-soft); margin: 8px 0; }
+
+/* the version slider */
+.mwr-time { display: flex; align-items: center; gap: 12px; margin-top: 6px; }
+.mwr-time .mwr-mono { flex: none; white-space: nowrap; }
+.mwr-time input { flex: 1; min-width: 0; height: 24px; margin: 0; accent-color: var(--accent); }
+.mwr-ticks { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-faint); padding: 0 4px; }
+.mwr-pill { font-size: 12px; padding: 2px 9px; border-radius: 999px; border: 1px solid var(--border); color: var(--ink-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 50%; }
+.mwr-pill--hot { background: var(--accent-tint); border-color: transparent; color: var(--accent-ink); }
+
+/* the pipeline: five steps you tap */
+.mwr-pipe { display: flex; align-items: stretch; overflow-x: auto; padding: 14px 8px 14px 2px; margin-top: 8px; scrollbar-width: thin; }
+.mwr-node { flex: none; width: 150px; border: 1px solid var(--border); border-radius: 18px; padding: 12px; background: var(--bg-card); color: var(--ink); cursor: pointer; text-align: left; position: relative; display: flex; flex-direction: column; gap: 4px; font: inherit; }
+.mwr-node:hover { border-color: var(--border-strong); }
+.mwr-node:focus-visible { outline: 2px solid var(--focus, var(--accent)); outline-offset: 3px; }
+.mwr-node__k { font-size: 12px; color: var(--ink-faint); }
+.mwr-node__v { font-size: 22px; font-weight: 300; letter-spacing: -0.02em; }
+.mwr-node__s { font-size: 12.5px; color: var(--ink-soft); }
+.mwr-node[aria-pressed="true"] { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
+.mwr-node--changed { background: var(--accent-tint); }
+.mwr-badge { position: absolute; top: -7px; right: -7px; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--accent); color: var(--accent-on); font-size: 11px; font-weight: 600; display: grid; place-items: center; box-sizing: border-box; }
+.mwr-arrow { flex: none; width: 28px; display: grid; place-items: center; color: var(--ink-faint); line-height: 1; }
+/* on a phone the steps stack, and the arrow between them points down */
+@media (max-width: 640px) {
+  .mwr-pipe { flex-direction: column; overflow-x: visible; padding-right: 8px; }
+  .mwr-node { width: 100%; flex-direction: row; align-items: baseline; gap: 10px; }
+  .mwr-node__v { font-size: 18px; }
+  .mwr-arrow { width: auto; height: 20px; font-size: 0; }
+  .mwr-arrow::after { content: "\2193"; font-size: 15px; line-height: 20px; }
+}
+
+/* the tapped step */
+.mwr-panel { border: 1px solid var(--border); border-radius: 20px; padding: 16px; margin-top: 8px; background: var(--bg-card); }
+.mwr-panel__h { margin: 0 0 8px; font-weight: 300; font-size: 21px; letter-spacing: -0.02em; }
+.mwr-viewing { margin: -4px 0 8px; font-size: 13px; }
+.mwr-sub { margin: 12px 0 4px; font-size: 12px; letter-spacing: 0.06em; color: var(--ink-faint); }
+.mwr-pre { white-space: pre-wrap; font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-soft); margin: 0; }
+.mwr-rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule-soft, var(--border)); }
+.mwr-row { display: flex; align-items: center; gap: 12px; min-height: 46px; padding: 8px 2px; border-bottom: 1px solid var(--rule-soft, var(--border)); white-space: nowrap; overflow: hidden; }
+.mwr-grow { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
+.mwr-props { list-style: none; margin: 14px 0 0; padding: 0; }
+.mwr-prop .mwr-pill { flex: none; max-width: none; }
+.mwr-dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }
+.mwr-propose { margin-top: 12px; }
+
+/* buttons and the proposal form */
+.mwr-btn { border: 1px solid var(--border-strong); background: transparent; color: var(--ink); border-radius: 999px; padding: 7px 14px; cursor: pointer; font: inherit; font-weight: 500; font-size: 14px; white-space: nowrap; }
+.mwr-btn:hover { background: var(--hask-chip-pick, var(--bg-frame)); }
+.mwr-btn--go { background: var(--accent); border-color: var(--accent); color: var(--accent-on); }
+.mwr-btn--go:hover { background: var(--accent); filter: brightness(1.05); }
+.mwr-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px 12px; margin-top: 12px; }
+.mwr-field { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--ink-soft); min-width: 0; }
+.mwr-field--wide { grid-column: 1 / -1; }
+.mwr-field[hidden] { display: none; }
+.mwr-field input, .mwr-field select, .mwr-field textarea { font: inherit; font-size: 14px; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; min-width: 0; box-sizing: border-box; width: 100%; }
+.mwr-form__go { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; }
+
+/* the cost of one run */
+.mwr-lbl { font-size: 12px; letter-spacing: 0.06em; color: var(--ink-faint); margin: 26px 0 8px; font-weight: 400; }
+.mwr-note { margin: 8px 0 0; font-size: 12.5px; color: var(--ink-faint); }

package/modules/hall-ui/public/market-watch-rules.html

@@ -0,0 +1,54 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Market Watch rules — {{worldName}}</title>
+  <meta name="description" content="How the weekly market watch works, step by step, in plain words: what it searches, what it reads, who it watches, how it scores and what it writes. Propose a change with a reason.">
+  <link rel="icon" href="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><text x='16' y='24' font-size='24' text-anchor='middle' font-family='sans-serif'>⌂</text></svg>">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link rel="stylesheet" href="/builders/style.css?v=2026-07-02-shell1">
+  <link rel="stylesheet" href="/builders/hall-ask.css">
+  <link rel="stylesheet" href="/builders/market-watch-rules.css">
+</head>
+<body data-page="market-watch-rules" data-page-title="Market Watch rules">
+
+<div class="app">
+  <aside class="app-sidebar" id="app-sidebar" aria-label="Primary"></aside>
+  <div class="app-scrim" id="app-scrim" hidden></div>
+  <div class="app-body">
+    <header class="app-topbar" id="app-topbar"></header>
+    <div class="app-content">
+      <!-- The page's one h1, for screen readers: no page shows its head (task 1004836). -->
+      <div class="page-head page-head--room">
+        <h1 class="page-head__h">Market Watch rules</h1>
+      </div>
+
+      <main id="hall-main" class="mwr">
+        <div id="mwr-slider"></div>
+        <div class="mwr-pipe" id="mwr-pipe" aria-label="the watch, step by step"></div>
+        <section class="mwr-panel" id="mwr-panel" aria-live="polite"><p class="mwr-empty">Loading the watch rules…</p></section>
+        <h2 class="mwr-lbl">cost of one run, by step</h2>
+        <div id="mwr-cost"></div>
+      </main>
+
+      <footer class="app-foot" id="app-foot"></footer>
+    </div>
+  </div>
+</div>
+
+<div id="toast" class="toast" role="status" aria-live="polite" data-visible="0"></div>
+
+<script src="/builders/dom-utils.js?v=2026-10-25-escape"></script>
+<script src="/builders/shell-trail.js?v=2026-10-08-city-tab"></script>
+<script src="/builders/craft-mode.js?v=2026-10-09-living3"></script>
+<script src="/builders/shell.js?v=2026-10-25-escape"></script>
+<!-- jump palette (Ctrl/Cmd-K). Optional by design: without it the shell's slot stays hidden. -->
+<script src="/builders/palette.js" defer></script>
+<script src="/builders/hall-kit.js"></script>
+<script src="/builders/hall-ask.js"></script>
+<script src="/builders/market-watch-rules-lib.js"></script>
+<script src="/builders/market-watch-rules.js"></script>
+</body>
+</html>

package/modules/hall-ui/public/market-watch-rules.js

@@ -0,0 +1,129 @@
+// market-watch-rules.js — the Market Watch rules page (/builders/market-watch-rules,
+// task 1004941). One read, GET /api/bongos/market-watch/rules; the markup is
+// OTBMarketWatchRules's (market-watch-rules-lib.js). Three writes, each checked again on
+// the server: a member's proposal, the owner's approve or decline, and putting a proposal
+// to the government's vote.
+
+(() => {
+  'use strict';
+
+  const lib = window.OTBMarketWatchRules;
+  const esc = (s) => window.OTB.escapeHtml(s);
+  const toast = (m) => window.OTB.toast(m);
+  const API = '/api/bongos/market-watch';
+  const $ = (id) => document.getElementById(id);
+
+  let view = null;
+  let step = 'searches';
+  let at = 0;
+
+  async function send(method, url, body) {
+    const r = await fetch(url, {
+      method,
+      credentials: 'same-origin',
+      headers: body ? { 'content-type': 'application/json' } : {},
+      body: body ? JSON.stringify(body) : undefined,
+    });
+    let data = null;
+    try { data = await r.json(); } catch (_) { /* no body */ }
+    return { ok: r.ok, status: r.status, data };
+  }
+  const codeOf = (data) => (window.OTB.errCode ? window.OTB.errCode(data) : (data && data.error && data.error.code));
+
+  function stopNow() {
+    const s = lib.stops(view);
+    const i = s.findIndex((x) => x.kind === 'now');
+    return i === -1 ? Math.max(0, s.length - 1) : i;
+  }
+
+  function render() {
+    const stops = lib.stops(view);
+    const stop = stops[at] || null;
+    $('mwr-slider').innerHTML = lib.sliderHtml(view, at, esc);
+    $('mwr-pipe').innerHTML = lib.pipelineHtml(view, { open: step, changed: stop ? stop.changed : [] }, esc);
+    $('mwr-panel').innerHTML = lib.panelHtml(view, step, stop, esc);
+    $('mwr-cost').innerHTML = lib.costHtml(view.cost, esc);
+    const slider = $('mwr-v');
+    if (slider) slider.addEventListener('input', () => { at = Number(slider.value); render(); $('mwr-v').focus(); });
+  }
+
+  async function load() {
+    const r = await send('GET', `${API}/rules`);
+    if (!r.ok) {
+      const msg = r.status === 404
+        ? 'Market Watch is off on this project. The owner turns it on in Modules.'
+        : 'Could not load the watch rules. Try reloading the page.';
+      $('mwr-pipe').innerHTML = '';
+      $('mwr-panel').innerHTML = `<p class="mwr-empty">${esc(msg)}</p>`;
+      return;
+    }
+    view = r.data;
+    if (!view.steps || !view.history || !view.history.length) {
+      $('mwr-panel').innerHTML = '<p class="mwr-empty">This project has no watch rules yet.</p>';
+      return;
+    }
+    at = stopNow();
+    render();
+  }
+
+  function openForm(btn) {
+    const slot = $('mwr-form-slot');
+    if (!slot) return;
+    if (slot.firstChild) { slot.innerHTML = ''; btn.setAttribute('aria-expanded', 'false'); return; }
+    slot.innerHTML = lib.formHtml(view, step, esc);
+    btn.setAttribute('aria-expanded', 'true');
+    const form = slot.querySelector('form');
+    const op = form.querySelector('select[name="op"]');
+    if (op) {
+      op.addEventListener('change', () => {
+        form.querySelectorAll('[data-for]').forEach((el) => { el.hidden = el.dataset.for !== op.value; });
+      });
+    }
+    const first = form.querySelector('input, select, textarea');
+    if (first) first.focus();
+  }
+
+  async function submitForm(form) {
+    const fields = Object.fromEntries(new FormData(form).entries());
+    const body = lib.proposalFromForm(form.dataset.step, fields);
+    const btn = form.querySelector('button[type="submit"]');
+    btn.disabled = true;
+    const r = await send('POST', `${API}/rules/proposals`, body);
+    btn.disabled = false;
+    if (!r.ok) return toast(lib.errorText(codeOf(r.data)));
+    toast('proposal sent');
+    await load();
+  }
+
+  async function act(kind, id) {
+    const url = kind === 'vote' ? `${API}/proposals/${id}/vote` : `${API}/proposals/${id}/decide`;
+    const r = await send('POST', url, kind === 'vote' ? undefined : { decision: kind });
+    if (!r.ok) return toast(lib.errorText(codeOf(r.data)));
+    if (kind === 'approve') toast(r.data && r.data.version ? `approved · v${r.data.version.version}` : 'approved');
+    else toast(kind === 'vote' ? 'sent to a vote' : 'declined');
+    await load();
+  }
+
+  document.addEventListener('click', (e) => {
+    if (!view) return;
+    const node = e.target.closest('.mwr-node');
+    if (node) { step = node.dataset.step; render(); return; }
+    const b = e.target.closest('[data-act]');
+    if (!b) return;
+    const what = b.dataset.act;
+    if (what === 'propose') return openForm(b);
+    if (what === 'cancel') { $('mwr-form-slot').innerHTML = ''; return; }
+    if (what === 'approve' || what === 'decline' || what === 'vote') {
+      b.disabled = true;
+      act(what, b.dataset.id).finally(() => { b.disabled = false; });
+    }
+  });
+  document.addEventListener('submit', (e) => {
+    const form = e.target.closest('.mwr-form');
+    if (!form) return;
+    e.preventDefault();
+    submitForm(form);
+  });
+
+  load();
+})();

package/modules/hall-ui/public/market-watch-rules.states.json

@@ -0,0 +1,17 @@
+{
+  "_": "The Market Watch rules page (task 1004941), built to docs/design/mocks/market-watch/rules.html, option C (the pipeline map). One read, GET /market-watch/rules. Against the kit's own stub it 404s, so the page renders its 'Market Watch is off' state, which the floors must hold too. TO SEE IT POPULATED, point the kit at the hall-preview harness: `node scripts/hall-preview/server.js --port 4641 --fixture-me`, then `render.js --page /builders/market-watch-rules --base-in http://builders.localhost:4641 --base-out http://builders.localhost:4641`. The harness answers from fixtures/market-watch__rules.json, built by the real composers (rules-view.buildView over the seed's rules and 60 items, two approved changes and four open proposals). Steps are opened with clickIfVisible because against the stub the nodes do not exist.",
+  "page": "/builders/market-watch-rules",
+  "surface": "hall-ui",
+  "stub": { "prefix": "/builders/" },
+  "modeQuery": false,
+  "ignoreRequests": ["/api/(gds|bongos)/me$", "/api/(gds|bongos)/me/", "/api/(gds|bongos)/goals", "/api/(gds|bongos)/inbox/", "/api/(gds|bongos)/market-watch/", "/api/(gds|bongos)/core-update"],
+  "ignoreConsole": ["/api/(gds|bongos)/", "\\b401\\b", "\\b404\\b", "Unauthorized", "Not Found", "load failed"],
+  "states": {
+    "in": { "auth": true, "actions": [["wait", 700], ["clickIfVisible", "[data-craft-close]"], ["wait", 150]], "expect": { "visible": ["#mwr-panel"] } },
+    "scoring": { "auth": true, "actions": [["wait", 700], ["clickIfVisible", "[data-craft-close]"], ["wait", 150], ["clickIfVisible", ".mwr-node[data-step='scoring']"], ["wait", 200]] },
+    "names": { "auth": true, "actions": [["wait", 700], ["clickIfVisible", "[data-craft-close]"], ["wait", 150], ["clickIfVisible", ".mwr-node[data-step='names']"], ["wait", 200]] },
+    "propose": { "auth": true, "actions": [["wait", 700], ["clickIfVisible", "[data-craft-close]"], ["wait", 150], ["clickIfVisible", ".mwr-node[data-step='sources']"], ["wait", 150], ["clickIfVisible", "[data-act='propose']"], ["wait", 200]] },
+    "out": { "auth": false }
+  },
+  "reducedMotion": { "auth": true, "actions": [["wait", 700], ["clickIfVisible", "[data-craft-close]"], ["wait", 150]] }
+}

package/modules/market-watch/matter-acts.js

@@ -0,0 +1,59 @@
+'use strict';
+
+// modules/market-watch/matter-acts.js — what a PASSED government vote on a Market Watch
+// proposal carries out (task 1004941, goal 1000137).
+//
+// Where the project's government hands its Rules building to a sitting (the
+// decision-rules table, ADR 0363), the owner cannot approve a proposal alone: the decide
+// route refuses with 409 decided_by_sitting, and the proposal is put to a vote instead
+// (POST /market-watch/proposals/:id/vote, which files a Rules matter through the
+// government port). When that sitting passes the matter, the government module calls
+// this act through the 'governor.matterAct' contribution point, after the close commits,
+// and it approves the proposal through the SAME decideProposal the owner's route calls,
+// so a vote can do nothing the owner's approval could not. A returned matter acts on
+// nothing; the proposal stays open for the owner to decline.
+//
+// A module never requires a sibling: the government reaches this only through the
+// contribution, and this reaches the government only through its port.
+
+const api = require('../../src/module-api');
+const proposals = require('./proposals');
+const { projectKey } = require('./seed');
+
+const log = api.logger('market-watch');
+const POINT = 'governor.matterAct';
+const AREA = 'rules';
+const TYPE = 'market_watch_proposal';
+
+// Where the act finds the project and its transaction. A test (and the government walk)
+// replaces these to run the act without a database or branding.
+const runtime = {
+  project: () => projectKey(api.branding().domains.publicOrigin),
+  withTx: (fn) => api.withTx(fn, { pool: api.pool }),
+};
+
+async function approveByVote(action, ctx) {
+  const project = runtime.project();
+  if (!project) return { done: false, reason: 'no_project' };
+  const withTx = runtime.withTx;
+  const out = await proposals.decideProposal({
+    project,
+    id: action.proposal_id,
+    decision: 'approve',
+    decidedBy: ctx && ctx.decidedBy,
+    via: { decided_via: 'vote', matter_id: ctx && ctx.matterId != null ? String(ctx.matterId) : null },
+    withTx,
+  });
+  if (!out.ok) {
+    log.warn(`[market-watch] proposal ${action.proposal_id} passed by vote (matter ${ctx && ctx.matterId}) but was not applied: ${out.reason}`);
+    return { done: false, reason: out.reason };
+  }
+  log.info(`[market-watch] proposal ${action.proposal_id} ${out.status} by vote (matter ${ctx && ctx.matterId})`);
+  return { done: true };
+}
+
+function contributeMarketWatchMatterActs() {
+  api.contribute(POINT, { area: AREA, type: TYPE, act: (action, ctx) => approveByVote(action, ctx) });
+}
+
+module.exports = { approveByVote, contributeMarketWatchMatterActs, runtime };

package/modules/market-watch/module.json

@@ -1,9 +1,9 @@
 {
   "key": "market-watch",
   "title": "Market Watch (a weekly AI watch on a project's market)",
-  "description": "A weekly AI watch on a project's competitors, partners and topics, with a sourced log per tracked item and a weekly question to members (goal 1000137). Its data model (tables, read queries and the hub seed of the 2026-10-28 research) and its weekly run (an hourly poller that researches each tracked item on the project's own Anthropic key, under the monthly cap) are in, and so is the weekly ask card in the hall's attention inbox (task 1004940); the pages are not yet. Off by default, and it cannot be turned on behind an open join door with no payer, because every run will spend the project's AI budget.",
-  "version": "0.3.0",
-  "coreVersion": "^1.19.0",
+  "description": "A weekly AI watch on a project's competitors, partners and topics, with a sourced log per tracked item and a weekly question to members (goal 1000137). Its data model (tables, read queries and the hub seed of the 2026-10-28 research), its weekly run (an hourly poller that researches each tracked item on the project's own Anthropic key, under the monthly cap), the weekly ask card in the hall's attention inbox (task 1004940) and its rules page (the watch rules in plain words, members' proposed changes, and the owner's or the government's decision on each, task 1004941) are in. Off by default, and it cannot be turned on behind an open join door with no payer, because every run will spend the project's AI budget.",
+  "version": "0.4.0",
+  "coreVersion": "^1.22.0",
   "category": {
     "parent": "knowledge"
   },
@@ -14,7 +14,8 @@
   "contributes": {
     "migrations": true,
     "routes": [
-      "ask"
+      "ask",
+      "rules"
     ],
     "pollers": [
       "hub-seed",