@variance-authority/tribunal 0.1.0

package/dist/ui/attribution.js

@@ -0,0 +1,79 @@
+/**
+ * What the run decided about each thing that moved, addressed by the pair.
+ *
+ * The build page used to answer *why did this move* by walking the census
+ * itself — up from the component that moved, through what encloses it, to a name
+ * the diff reaches. That walk was a reconstruction, and it worked from the
+ * thinner half of the record: the census carries edges, and the run that wrote it
+ * also had the diff, the source index that maps a component to the file declaring
+ * it, the props digest each rendering was grouped under, and the subjects where
+ * the same component with the same props held still. It reached a conclusion from
+ * all four and wrote one sentence per movement. None of it crossed the wire.
+ *
+ * So the page asks rather than re-derives. What is here is the addressing — a
+ * movement is about a *pair*, and the two questions a surface asks of it are
+ * *what happened to this component here* and *what happened to it anywhere* —
+ * plus the one fold that turns a component's several answers into the band it is
+ * read under.
+ *
+ * ## The pair is not a formality
+ *
+ * The same `Button` is `edited` on the page whose file the diff names and
+ * `upstream` on the page where a changed parent hands it a different label. A
+ * surface keyed by component alone shows one of those and is wrong about the
+ * other, and which one it is wrong about depends on iteration order.
+ */
+const NONE = [];
+export function attributionsOf(build) {
+    const pairs = new Map();
+    const byComponent = new Map();
+    for (const movement of build.movements) {
+        pairs.set(key(movement.component, movement.subject), movement);
+        const found = byComponent.get(movement.component);
+        if (found === undefined)
+            byComponent.set(movement.component, [movement]);
+        else
+            found.push(movement);
+    }
+    return {
+        at: (component, subject) => pairs.get(key(component, subject)),
+        about: (component) => byComponent.get(component) ?? NONE,
+    };
+}
+// A separator neither half can contain, so a `Card` moving in `a<NUL>b` and a
+// `Card<NUL>a` moving in `b` cannot arrive at one key. Written as the escape and
+// not as the byte: a source file with a NUL in it is binary to `grep`, and a
+// search that finds nothing in a file that contains the word is the exact
+// failure this repository exists to refuse.
+const IN = '\u0000';
+function key(component, subject) {
+    return `${component}${IN}${subject}`;
+}
+/**
+ * Ladder order — the order the run climbs, so the strongest explanation first.
+ *
+ * Used to fold a component's several answers into one, and the direction is the
+ * point. A component that is `edited` in one render and `upstream` in another was
+ * edited: the second render is the same edit arriving somewhere else, and a fold
+ * that took the weaker rung would file the whole change under a consequence of
+ * itself.
+ */
+const LADDER = ['edited', 'token', 'upstream', 'contradicted', 'unexplained'];
+/**
+ * One component's rung, over every render it moved in.
+ *
+ * `undefined` when the run recorded nothing about it — which is not a rung and
+ * must never be drawn as one. A build ingested before attributions were carried
+ * returns this for everything, and a reader that turned it into *unexplained*
+ * would be reporting a missing input as a finding.
+ */
+export function rungAcross(movements) {
+    let best;
+    for (const movement of movements) {
+        if (best === undefined || LADDER.indexOf(movement.cause) < LADDER.indexOf(best)) {
+            best = movement.cause;
+        }
+    }
+    return best;
+}
+//# sourceMappingURL=attribution.js.map

package/dist/ui/attribution.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"attribution.js","sourceRoot":"","sources":["../../src/ui/attribution.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAeH,MAAM,IAAI,GAA4B,EAAE,CAAC;AAEzC,MAAM,UAAU,cAAc,CAAC,KAAkB;IAC/C,MAAM,KAAK,GAAG,IAAI,GAAG,EAAwB,CAAC;IAC9C,MAAM,WAAW,GAAG,IAAI,GAAG,EAA0B,CAAC;IAEtD,KAAK,MAAM,QAAQ,IAAI,KAAK,CAAC,SAAS,EAAE,CAAC;QACvC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,QAAQ,CAAC,SAAS,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,CAAC;QAC/D,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;QAClD,IAAI,KAAK,KAAK,SAAS;YAAE,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,SAAS,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;;YACpE,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC5B,CAAC;IAED,OAAO;QACL,EAAE,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QAC9D,KAAK,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,WAAW,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,IAAI;KACzD,CAAC;AACJ,CAAC;AAED,8EAA8E;AAC9E,iFAAiF;AACjF,6EAA6E;AAC7E,0EAA0E;AAC1E,4CAA4C;AAC5C,MAAM,EAAE,GAAG,QAAQ,CAAC;AAEpB,SAAS,GAAG,CAAC,SAAiB,EAAE,OAAe;IAC7C,OAAO,GAAG,SAAS,GAAG,EAAE,GAAG,OAAO,EAAE,CAAC;AACvC,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,MAAM,GAAoB,CAAC,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,aAAa,CAAC,CAAC;AAE/F;;;;;;;GAOG;AACH,MAAM,UAAU,UAAU,CAAC,SAAkC;IAC3D,IAAI,IAAsB,CAAC;IAC3B,KAAK,MAAM,QAAQ,IAAI,SAAS,EAAE,CAAC;QACjC,IAAI,IAAI,KAAK,SAAS,IAAI,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC;YAChF,IAAI,GAAG,QAAQ,CAAC,KAAK,CAAC;QACxB,CAAC;IACH,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC","sourcesContent":["/**\n * What the run decided about each thing that moved, addressed by the pair.\n *\n * The build page used to answer *why did this move* by walking the census\n * itself — up from the component that moved, through what encloses it, to a name\n * the diff reaches. That walk was a reconstruction, and it worked from the\n * thinner half of the record: the census carries edges, and the run that wrote it\n * also had the diff, the source index that maps a component to the file declaring\n * it, the props digest each rendering was grouped under, and the subjects where\n * the same component with the same props held still. It reached a conclusion from\n * all four and wrote one sentence per movement. None of it crossed the wire.\n *\n * So the page asks rather than re-derives. What is here is the addressing — a\n * movement is about a *pair*, and the two questions a surface asks of it are\n * *what happened to this component here* and *what happened to it anywhere* —\n * plus the one fold that turns a component's several answers into the band it is\n * read under.\n *\n * ## The pair is not a formality\n *\n * The same `Button` is `edited` on the page whose file the diff names and\n * `upstream` on the page where a changed parent hands it a different label. A\n * surface keyed by component alone shows one of those and is wrong about the\n * other, and which one it is wrong about depends on iteration order.\n */\n\nimport type { BuildDetail, MovementView } from '../review-types.js';\n\n/** The five rungs, as the report's ladder names them. */\nexport type Rung = MovementView['cause'];\n\n/** One build's attributions, indexed the two ways a surface asks for them. */\nexport interface Attributions {\n  /** What the run concluded about this component in this render. */\n  readonly at: (component: string, subject: string) => MovementView | undefined;\n  /** Every conclusion about this component, in the order the store returned. */\n  readonly about: (component: string) => readonly MovementView[];\n}\n\nconst NONE: readonly MovementView[] = [];\n\nexport function attributionsOf(build: BuildDetail): Attributions {\n  const pairs = new Map<string, MovementView>();\n  const byComponent = new Map<string, MovementView[]>();\n\n  for (const movement of build.movements) {\n    pairs.set(key(movement.component, movement.subject), movement);\n    const found = byComponent.get(movement.component);\n    if (found === undefined) byComponent.set(movement.component, [movement]);\n    else found.push(movement);\n  }\n\n  return {\n    at: (component, subject) => pairs.get(key(component, subject)),\n    about: (component) => byComponent.get(component) ?? NONE,\n  };\n}\n\n// A separator neither half can contain, so a `Card` moving in `a<NUL>b` and a\n// `Card<NUL>a` moving in `b` cannot arrive at one key. Written as the escape and\n// not as the byte: a source file with a NUL in it is binary to `grep`, and a\n// search that finds nothing in a file that contains the word is the exact\n// failure this repository exists to refuse.\nconst IN = '\\u0000';\n\nfunction key(component: string, subject: string): string {\n  return `${component}${IN}${subject}`;\n}\n\n/**\n * Ladder order — the order the run climbs, so the strongest explanation first.\n *\n * Used to fold a component's several answers into one, and the direction is the\n * point. A component that is `edited` in one render and `upstream` in another was\n * edited: the second render is the same edit arriving somewhere else, and a fold\n * that took the weaker rung would file the whole change under a consequence of\n * itself.\n */\nconst LADDER: readonly Rung[] = ['edited', 'token', 'upstream', 'contradicted', 'unexplained'];\n\n/**\n * One component's rung, over every render it moved in.\n *\n * `undefined` when the run recorded nothing about it — which is not a rung and\n * must never be drawn as one. A build ingested before attributions were carried\n * returns this for everything, and a reader that turned it into *unexplained*\n * would be reporting a missing input as a finding.\n */\nexport function rungAcross(movements: readonly MovementView[]): Rung | undefined {\n  let best: Rung | undefined;\n  for (const movement of movements) {\n    if (best === undefined || LADDER.indexOf(movement.cause) < LADDER.indexOf(best)) {\n      best = movement.cause;\n    }\n  }\n  return best;\n}\n"]}

package/dist/ui/because.d.ts

@@ -0,0 +1,51 @@
+/**
+ * The run's own answer to *why did this move*, printed where the decision is made.
+ *
+ * Every other sentence on the change page is the page reasoning about records.
+ * This one is not: the run wrote it, from four things this surface never
+ * receives — the diff, the source index that maps a component to the file
+ * declaring it, the props digest each rendering was grouped under, and the
+ * subjects where the same component with the same props held still. It reached a
+ * conclusion and put it in one sentence per movement, and until the store carried
+ * those, the page answered the question by climbing the census on its own and
+ * arriving somewhere weaker.
+ *
+ * ## The sentence is the report's, not a second one
+ *
+ * `because` is written once, in the attribution ladder, and shipped to the
+ * terminal and to here. What differs is the rendering: the ladder marks the names
+ * it is claiming things about with backticks, and this turns those into `code`
+ * rather than reprinting the punctuation. A second sentence written for the web
+ * is a second thing that can disagree with the first, and the disagreement would
+ * be between a reviewer's screen and their CI log.
+ *
+ * ## What the link is for
+ *
+ * On the `upstream` rung the sentence names a component the commit edited, and
+ * that component is usually a change on this same docket. *This moved on what
+ * `ProductCard` gave it* is only half an instruction; the other half is that
+ * `ProductCard` is where the decision belongs, and it is one click away.
+ */
+import type { ReactElement } from 'react';
+import type { Origin } from './grouping.js';
+import type { Route } from './route.js';
+export declare function Because({ origin, build, changes, go, }: {
+    readonly origin: Origin;
+    readonly build: string;
+    /** Components with a change page of their own, so a link goes somewhere. */
+    readonly changes: ReadonlySet<string>;
+    readonly go: (route: Route) => void;
+}): ReactElement | null;
+/**
+ * One sentence, with the names it claims things about drawn as code.
+ *
+ * The ladder writes them between backticks because it is also written for a
+ * terminal. Splitting on the pair rather than parsing anything: the sentences are
+ * this repository's own, an unbalanced backtick in one is a defect in the
+ * sentence, and the failure mode here — a stray backtick surviving into the
+ * output — is visible in the place it would be introduced.
+ */
+export declare function Marked({ say }: {
+    readonly say: string;
+}): ReactElement;
+//# sourceMappingURL=because.d.ts.map

package/dist/ui/because.js

@@ -0,0 +1,52 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Go } from './shell.js';
+import { count, number } from './text.js';
+export function Because({ origin, build, changes, go, }) {
+    const recorded = origin.appearances.flatMap(({ movement }) => movement ?? []);
+    if (recorded.length === 0)
+        return null;
+    return (_jsx(_Fragment, { children: reasons(recorded).map(({ movement, renders }) => (_jsxs("p", { className: `va-attributed va-attributed-${movement.cause}`, children: [_jsx(Sentence, { movement: movement, build: build, changes: changes, go: go }), renders === origin.appearances.length ? null : (_jsxs("span", { className: "va-note", children: [' ', "\u2014 in ", count(renders, 'render'), " of ", number(origin.appearances.length), "."] }))] }, movement.because))) }));
+}
+/**
+ * The distinct answers, widest first.
+ *
+ * Usually one. When it is not, the reason is worth the second paragraph: the same
+ * `Button` is `edited` on the page whose file the diff names and `upstream` on the
+ * page where a changed parent hands it a different label, and a page that printed
+ * only the first would be telling a reviewer they edited a render they did not.
+ */
+function reasons(movements) {
+    const found = new Map();
+    for (const movement of movements) {
+        const seen = found.get(movement.because);
+        if (seen === undefined)
+            found.set(movement.because, { movement, renders: 1 });
+        else
+            seen.renders += 1;
+    }
+    return [...found.values()].sort((left, right) => right.renders - left.renders);
+}
+function Sentence({ movement, build, changes, go, }) {
+    const upstream = movement.upstream;
+    const linked = upstream !== undefined && changes.has(upstream);
+    return (_jsxs(_Fragment, { children: [_jsx(Marked, { say: movement.because }), movement.standing === undefined ? null : (_jsx("span", { className: movement.standing === 'flake' ? ' va-mark va-alarm' : ' va-mark va-note', children: movement.standing === 'flake'
+                    ? 'this render already failed to read the same way twice'
+                    : 'nobody has read this render twice yet' })), linked ? (_jsxs(_Fragment, { children: [' ', _jsxs(Go, { to: { page: 'change', build, change: upstream }, go: go, className: "va-attributed-go", title: `The decision belongs to ${upstream}, which is a change on this build`, children: ["Decide it under ", upstream] })] })) : null] }));
+}
+/**
+ * One sentence, with the names it claims things about drawn as code.
+ *
+ * The ladder writes them between backticks because it is also written for a
+ * terminal. Splitting on the pair rather than parsing anything: the sentences are
+ * this repository's own, an unbalanced backtick in one is a defect in the
+ * sentence, and the failure mode here — a stray backtick surviving into the
+ * output — is visible in the place it would be introduced.
+ */
+export function Marked({ say }) {
+    // Keyed by position, which is the identity: the list is one sentence cut into
+    // its own pieces, and it is rebuilt whole or not at all.
+    return (_jsx(_Fragment, { children: say
+            .split('`')
+            .map((part, index) => index % 2 === 0 ? _jsx("span", { children: part }, index) : _jsx("code", { children: part }, index)) }));
+}
+//# sourceMappingURL=because.js.map

package/dist/ui/because.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"because.js","sourceRoot":"","sources":["../../src/ui/because.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * The run's own answer to *why did this move*, printed where the decision is made.\n *\n * Every other sentence on the change page is the page reasoning about records.\n * This one is not: the run wrote it, from four things this surface never\n * receives — the diff, the source index that maps a component to the file\n * declaring it, the props digest each rendering was grouped under, and the\n * subjects where the same component with the same props held still. It reached a\n * conclusion and put it in one sentence per movement, and until the store carried\n * those, the page answered the question by climbing the census on its own and\n * arriving somewhere weaker.\n *\n * ## The sentence is the report's, not a second one\n *\n * `because` is written once, in the attribution ladder, and shipped to the\n * terminal and to here. What differs is the rendering: the ladder marks the names\n * it is claiming things about with backticks, and this turns those into `code`\n * rather than reprinting the punctuation. A second sentence written for the web\n * is a second thing that can disagree with the first, and the disagreement would\n * be between a reviewer's screen and their CI log.\n *\n * ## What the link is for\n *\n * On the `upstream` rung the sentence names a component the commit edited, and\n * that component is usually a change on this same docket. *This moved on what\n * `ProductCard` gave it* is only half an instruction; the other half is that\n * `ProductCard` is where the decision belongs, and it is one click away.\n */\n\nimport type { ReactElement } from 'react';\nimport type { MovementView } from '../review-types.js';\nimport type { Origin } from './grouping.js';\nimport type { Route } from './route.js';\nimport { Go } from './shell.js';\nimport { count, number } from './text.js';\n\nexport function Because({\n  origin,\n  build,\n  changes,\n  go,\n}: {\n  readonly origin: Origin;\n  readonly build: string;\n  /** Components with a change page of their own, so a link goes somewhere. */\n  readonly changes: ReadonlySet<string>;\n  readonly go: (route: Route) => void;\n}): ReactElement | null {\n  const recorded = origin.appearances.flatMap(({ movement }) => movement ?? []);\n  if (recorded.length === 0) return null;\n\n  return (\n    <>\n      {reasons(recorded).map(({ movement, renders }) => (\n        <p key={movement.because} className={`va-attributed va-attributed-${movement.cause}`}>\n          <Sentence movement={movement} build={build} changes={changes} go={go} />\n          {renders === origin.appearances.length ? null : (\n            <span className=\"va-note\">\n              {' '}\n              — in {count(renders, 'render')} of {number(origin.appearances.length)}.\n            </span>\n          )}\n        </p>\n      ))}\n    </>\n  );\n}\n\n/**\n * The distinct answers, widest first.\n *\n * Usually one. When it is not, the reason is worth the second paragraph: the same\n * `Button` is `edited` on the page whose file the diff names and `upstream` on the\n * page where a changed parent hands it a different label, and a page that printed\n * only the first would be telling a reviewer they edited a render they did not.\n */\nfunction reasons(\n  movements: readonly MovementView[],\n): readonly { movement: MovementView; renders: number }[] {\n  const found = new Map<string, { movement: MovementView; renders: number }>();\n  for (const movement of movements) {\n    const seen = found.get(movement.because);\n    if (seen === undefined) found.set(movement.because, { movement, renders: 1 });\n    else seen.renders += 1;\n  }\n  return [...found.values()].sort((left, right) => right.renders - left.renders);\n}\n\nfunction Sentence({\n  movement,\n  build,\n  changes,\n  go,\n}: {\n  readonly movement: MovementView;\n  readonly build: string;\n  readonly changes: ReadonlySet<string>;\n  readonly go: (route: Route) => void;\n}): ReactElement {\n  const upstream = movement.upstream;\n  const linked = upstream !== undefined && changes.has(upstream);\n\n  return (\n    <>\n      <Marked say={movement.because} />\n      {movement.standing === undefined ? null : (\n        <span className={movement.standing === 'flake' ? ' va-mark va-alarm' : ' va-mark va-note'}>\n          {movement.standing === 'flake'\n            ? 'this render already failed to read the same way twice'\n            : 'nobody has read this render twice yet'}\n        </span>\n      )}\n      {linked ? (\n        <>\n          {' '}\n          <Go\n            to={{ page: 'change', build, change: upstream }}\n            go={go}\n            className=\"va-attributed-go\"\n            title={`The decision belongs to ${upstream}, which is a change on this build`}\n          >\n            Decide it under {upstream}\n          </Go>\n        </>\n      ) : null}\n    </>\n  );\n}\n\n/**\n * One sentence, with the names it claims things about drawn as code.\n *\n * The ladder writes them between backticks because it is also written for a\n * terminal. Splitting on the pair rather than parsing anything: the sentences are\n * this repository's own, an unbalanced backtick in one is a defect in the\n * sentence, and the failure mode here — a stray backtick surviving into the\n * output — is visible in the place it would be introduced.\n */\nexport function Marked({ say }: { readonly say: string }): ReactElement {\n  // Keyed by position, which is the identity: the list is one sentence cut into\n  // its own pieces, and it is rebuilt whole or not at all.\n  return (\n    <>\n      {say\n        .split('`')\n        .map((part, index) =>\n          index % 2 === 0 ? <span key={index}>{part}</span> : <code key={index}>{part}</code>,\n        )}\n    </>\n  );\n}\n"]}

package/dist/ui/browser-entry.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=browser-entry.d.ts.map

package/dist/ui/browser-entry.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StrictMode } from 'react';
+import { createRoot } from 'react-dom/client';
+import { createReviewClient } from './client.js';
+import { ReviewApp } from './review.js';
+/**
+ * The half that runs in a browser, for hosts that do not have a framework.
+ *
+ * A Next.js app renders {@link ReviewApp} itself and never loads this — it has a
+ * bundler, a router and a hydration story of its own, and handing it a
+ * pre-bundled React would give the page two of them. This file exists for the
+ * Node service, which has none of that: it serves a document and needs one script
+ * that turns it into the surface.
+ *
+ * Bundled at this repository's build time by `tools/tribunal-ui.mjs` into
+ * `dist/ui/review.bundle.js`, for the reason recorded in
+ * [`node/ui-assets.ts`](../node/ui-assets.ts).
+ *
+ * It reads its configuration from the document rather than taking it baked in,
+ * because the bundle is built once and every deployment mounts the API somewhere
+ * else. It reads **no token**: the host attaches the capability, and this script
+ * calls its own origin with no credential.
+ */
+const mount = document.getElementById('variance-review');
+const configuration = document.getElementById('variance-config');
+if (mount === null) {
+    throw new Error('the review page has no #variance-review element to mount into');
+}
+if (configuration === null) {
+    throw new Error('the review page has no #variance-config script to read its endpoint from');
+}
+const { endpoint, reviewer } = JSON.parse(configuration.textContent ?? '{}');
+createRoot(mount).render(_jsx(StrictMode, { children: _jsx(ReviewApp, { client: createReviewClient({ endpoint: endpoint ?? '' }), reviewer: reviewer ?? 'reviewer' }) }));
+//# sourceMappingURL=browser-entry.js.map

package/dist/ui/browser-entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"browser-entry.js","sourceRoot":"","sources":["../../src/ui/browser-entry.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC;;;;;;;;;;;;;;;;;GAiBG;AAEH,MAAM,KAAK,GAAG,QAAQ,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AACzD,MAAM,aAAa,GAAG,QAAQ,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEjE,IAAI,KAAK,KAAK,IAAI,EAAE,CAAC;IACnB,MAAM,IAAI,KAAK,CAAC,+DAA+D,CAAC,CAAC;AACnF,CAAC;AACD,IAAI,aAAa,KAAK,IAAI,EAAE,CAAC;IAC3B,MAAM,IAAI,KAAK,CAAC,0EAA0E,CAAC,CAAC;AAC9F,CAAC;AAED,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,WAAW,IAAI,IAAI,CAG1E,CAAC;AAEF,UAAU,CAAC,KAAK,CAAC,CAAC,MAAM,CACtB,KAAC,UAAU,cACT,KAAC,SAAS,IACR,MAAM,EAAE,kBAAkB,CAAC,EAAE,QAAQ,EAAE,QAAQ,IAAI,EAAE,EAAE,CAAC,EACxD,QAAQ,EAAE,QAAQ,IAAI,UAAU,GAChC,GACS,CACd,CAAC","sourcesContent":["import { StrictMode } from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { createReviewClient } from './client.js';\nimport { ReviewApp } from './review.js';\n\n/**\n * The half that runs in a browser, for hosts that do not have a framework.\n *\n * A Next.js app renders {@link ReviewApp} itself and never loads this — it has a\n * bundler, a router and a hydration story of its own, and handing it a\n * pre-bundled React would give the page two of them. This file exists for the\n * Node service, which has none of that: it serves a document and needs one script\n * that turns it into the surface.\n *\n * Bundled at this repository's build time by `tools/tribunal-ui.mjs` into\n * `dist/ui/review.bundle.js`, for the reason recorded in\n * [`node/ui-assets.ts`](../node/ui-assets.ts).\n *\n * It reads its configuration from the document rather than taking it baked in,\n * because the bundle is built once and every deployment mounts the API somewhere\n * else. It reads **no token**: the host attaches the capability, and this script\n * calls its own origin with no credential.\n */\n\nconst mount = document.getElementById('variance-review');\nconst configuration = document.getElementById('variance-config');\n\nif (mount === null) {\n  throw new Error('the review page has no #variance-review element to mount into');\n}\nif (configuration === null) {\n  throw new Error('the review page has no #variance-config script to read its endpoint from');\n}\n\nconst { endpoint, reviewer } = JSON.parse(configuration.textContent ?? '{}') as {\n  readonly endpoint?: string;\n  readonly reviewer?: string;\n};\n\ncreateRoot(mount).render(\n  <StrictMode>\n    <ReviewApp\n      client={createReviewClient({ endpoint: endpoint ?? '' })}\n      reviewer={reviewer ?? 'reviewer'}\n    />\n  </StrictMode>,\n);\n"]}

package/dist/ui/builds.d.ts

@@ -0,0 +1,43 @@
+/**
+ * The front page: every build the store has, newest first.
+ *
+ * A list, and deliberately only a list. What a reader wants here is which build
+ * to open, and the two facts that decide it are how many subjects still have
+ * nobody's name against them and whether the run observed what it planned to.
+ * Everything else about a build is on the build.
+ */
+import { type ReactElement } from 'react';
+import type { BuildSummary } from '../review-types.js';
+import type { ReviewClient } from './client.js';
+import type { Route } from './route.js';
+export declare function BuildsPage({ client, limit, go, }: {
+    readonly client: ReviewClient;
+    readonly limit?: number | undefined;
+    readonly go: (route: Route) => void;
+}): ReactElement;
+export declare function BuildList({ builds, go, }: {
+    readonly builds: readonly BuildSummary[];
+    readonly go: (route: Route) => void;
+}): ReactElement;
+/**
+ * How much of the suite this run looked at, and what happened to the rest.
+ *
+ * **The denominator is the line.** A run that narrowed twenty subjects to two
+ * has done the most expensive thinking in the product, and a page reading
+ * `2 subjects` reports a suite of two. `2 of 20 observed` is the same fact with
+ * the eighteen still in it.
+ *
+ * The states are not two. A run that stated its coverage and skipped nothing is
+ * clean; a run that stated it and failed on fifty is not; and a run that never
+ * said is **unknown**, which must not be drawn as the first. That is the collapse
+ * `RunReport.notObserved` exists to prevent, and drawing `0 failed` for a silent
+ * writer would reintroduce it at the last possible moment.
+ *
+ * `unreached` is drawn without alarm and without apology. It is not a hole, and
+ * it is not somebody's standing decision either — it is the run having read the
+ * diff against every stored baseline and concluded the change cannot arrive.
+ */
+export declare function CoverageLine({ build }: {
+    readonly build: BuildSummary;
+}): ReactElement;
+//# sourceMappingURL=builds.d.ts.map

package/dist/ui/builds.js

@@ -0,0 +1,79 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The front page: every build the store has, newest first.
+ *
+ * A list, and deliberately only a list. What a reader wants here is which build
+ * to open, and the two facts that decide it are how many subjects still have
+ * nobody's name against them and whether the run observed what it planned to.
+ * Everything else about a build is on the build.
+ */
+import { useCallback, useEffect, useState } from 'react';
+import { Failure, Go, Topbar, messageOf } from './shell.js';
+import { number, when } from './text.js';
+export function BuildsPage({ client, limit, go, }) {
+    const [builds, setBuilds] = useState({ state: 'loading' });
+    const load = useCallback(async () => {
+        setBuilds({ state: 'loading' });
+        try {
+            setBuilds({ state: 'ready', value: await client.builds(limit) });
+        }
+        catch (error) {
+            // Reported, never rendered as an empty list. "No builds need review" is
+            // the sentence somebody merges on.
+            setBuilds({ state: 'failed', why: messageOf(error) });
+        }
+    }, [client, limit]);
+    useEffect(() => {
+        void load();
+    }, [load]);
+    return (_jsxs("div", { className: "va-app", children: [_jsx(Topbar, { crumbs: [], go: go, title: "Variance Authority", subtitle: builds.state === 'ready' ? (builds.value[0]?.project ?? 'review') : 'review', children: _jsx("nav", { className: "va-nav va-topbar-meta", children: _jsx(Go, { to: { page: 'changelog' }, go: go, className: "va-mode", children: "Changelog" }) }) }), _jsx("div", { className: "va-body va-scroll", children: _jsxs("div", { className: "va-page", children: [builds.state === 'loading' ? _jsx("p", { className: "va-note", children: "Loading builds\u2026" }) : null, builds.state === 'failed' ? _jsx(Failure, { why: builds.why, retry: load }) : null, builds.state === 'ready' ? _jsx(BuildList, { builds: builds.value, go: go }) : null] }) })] }));
+}
+export function BuildList({ builds, go, }) {
+    if (builds.length === 0)
+        return _jsx("p", { className: "va-note", children: "No builds have been posted yet." });
+    return (_jsx("ol", { className: "va-builds", children: builds.map((build) => (_jsxs("li", { className: "va-build", children: [_jsxs("p", { className: "va-build-head", children: [_jsxs(Go, { to: { page: 'build', build: build.build }, go: go, className: "va-build-open", children: [_jsx("span", { className: "va-build-id", children: build.build }), _jsx("span", { className: "va-build-go", children: "Review \u2192" })] }), _jsx("code", { className: "va-commit", children: build.commit.slice(0, 8) }), build.branch === undefined ? null : _jsx("span", { className: "va-branch", children: build.branch }), _jsx("span", { className: "va-when", children: when(build.at) })] }), _jsx(Verdicts, { build: build }), _jsx(CoverageLine, { build: build })] }, build.build))) }));
+}
+/**
+ * The counts, with `pending` given the emphasis.
+ *
+ * `unchanged` is the large number and the uninteresting one. What decides whether
+ * anybody has to open this build is how many subjects still have nobody's name
+ * against them.
+ *
+ * Every verdict the store keeps is named, including `ignored`, which this line
+ * used to leave out. Four words over a five-word vocabulary is a line that does
+ * not add up to the build it describes — twenty subjects reported as eighteen —
+ * and the two it silently dropped are the two that came back green because a
+ * declaration said so, which is the half of a build worth auditing.
+ */
+function Verdicts({ build }) {
+    return (_jsxs("p", { className: "va-verdicts", children: [_jsx("span", { className: build.pending > 0 ? 'va-pending' : 'va-settled', children: build.pending > 0 ? `${number(build.pending)} awaiting review` : 'nothing awaiting review' }), _jsxs("span", { className: "va-counts", children: [build.verdicts.changed, " changed \u00B7 ", build.verdicts.new, " new \u00B7", ' ', build.verdicts.incomparable, " incomparable \u00B7 ", build.verdicts.ignored, " ignored \u00B7", ' ', build.verdicts.unchanged, " unchanged"] })] }));
+}
+/**
+ * How much of the suite this run looked at, and what happened to the rest.
+ *
+ * **The denominator is the line.** A run that narrowed twenty subjects to two
+ * has done the most expensive thinking in the product, and a page reading
+ * `2 subjects` reports a suite of two. `2 of 20 observed` is the same fact with
+ * the eighteen still in it.
+ *
+ * The states are not two. A run that stated its coverage and skipped nothing is
+ * clean; a run that stated it and failed on fifty is not; and a run that never
+ * said is **unknown**, which must not be drawn as the first. That is the collapse
+ * `RunReport.notObserved` exists to prevent, and drawing `0 failed` for a silent
+ * writer would reintroduce it at the last possible moment.
+ *
+ * `unreached` is drawn without alarm and without apology. It is not a hole, and
+ * it is not somebody's standing decision either — it is the run having read the
+ * diff against every stored baseline and concluded the change cannot arrive.
+ */
+export function CoverageLine({ build }) {
+    const { coverage } = build;
+    if (!coverage.stated) {
+        return (_jsx("p", { className: "va-coverage va-unknown", children: "This report did not say which subjects it skipped, so its coverage is unknown \u2014 not clean." }));
+    }
+    const seen = Object.values(build.verdicts).reduce((sum, n) => sum + n, 0);
+    const planned = seen + coverage.failed + coverage.excluded + coverage.unreached;
+    return (_jsxs("p", { className: coverage.failed > 0 ? 'va-coverage va-incomplete' : 'va-coverage', children: [_jsx("span", { className: "va-num", children: seen }), " of ", _jsx("span", { className: "va-num", children: planned }), " observed", coverage.unreached === 0 ? null : (_jsxs(_Fragment, { children: [' · ', _jsx("span", { className: "va-num", children: coverage.unreached }), " not reached by this change"] })), coverage.failed === 0 ? null : _jsxs(_Fragment, { children: [" \u00B7 ", coverage.failed, " failed to render"] }), coverage.excluded === 0 ? null : _jsxs(_Fragment, { children: [" \u00B7 ", coverage.excluded, " excluded by configuration"] })] }));
+}
+//# sourceMappingURL=builds.js.map

package/dist/ui/builds.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"builds.js","sourceRoot":"","sources":["../../src/ui/builds.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * The front page: every build the store has, newest first.\n *\n * A list, and deliberately only a list. What a reader wants here is which build\n * to open, and the two facts that decide it are how many subjects still have\n * nobody's name against them and whether the run observed what it planned to.\n * Everything else about a build is on the build.\n */\n\nimport { useCallback, useEffect, useState, type ReactElement } from 'react';\nimport type { BuildSummary } from '../review-types.js';\nimport type { ReviewClient } from './client.js';\nimport type { Route } from './route.js';\nimport { Failure, Go, Topbar, messageOf, type Loaded } from './shell.js';\nimport { number, when } from './text.js';\n\nexport function BuildsPage({\n  client,\n  limit,\n  go,\n}: {\n  readonly client: ReviewClient;\n  readonly limit?: number | undefined;\n  readonly go: (route: Route) => void;\n}): ReactElement {\n  const [builds, setBuilds] = useState<Loaded<readonly BuildSummary[]>>({ state: 'loading' });\n\n  const load = useCallback(async (): Promise<void> => {\n    setBuilds({ state: 'loading' });\n    try {\n      setBuilds({ state: 'ready', value: await client.builds(limit) });\n    } catch (error) {\n      // Reported, never rendered as an empty list. \"No builds need review\" is\n      // the sentence somebody merges on.\n      setBuilds({ state: 'failed', why: messageOf(error) });\n    }\n  }, [client, limit]);\n\n  useEffect(() => {\n    void load();\n  }, [load]);\n\n  return (\n    <div className=\"va-app\">\n      <Topbar\n        crumbs={[]}\n        go={go}\n        title=\"Variance Authority\"\n        subtitle={builds.state === 'ready' ? (builds.value[0]?.project ?? 'review') : 'review'}\n      >\n        <nav className=\"va-nav va-topbar-meta\">\n          <Go to={{ page: 'changelog' }} go={go} className=\"va-mode\">\n            Changelog\n          </Go>\n        </nav>\n      </Topbar>\n\n      <div className=\"va-body va-scroll\">\n        <div className=\"va-page\">\n          {builds.state === 'loading' ? <p className=\"va-note\">Loading builds…</p> : null}\n          {builds.state === 'failed' ? <Failure why={builds.why} retry={load} /> : null}\n          {builds.state === 'ready' ? <BuildList builds={builds.value} go={go} /> : null}\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport function BuildList({\n  builds,\n  go,\n}: {\n  readonly builds: readonly BuildSummary[];\n  readonly go: (route: Route) => void;\n}): ReactElement {\n  if (builds.length === 0) return <p className=\"va-note\">No builds have been posted yet.</p>;\n\n  return (\n    <ol className=\"va-builds\">\n      {builds.map((build) => (\n        <li key={build.build} className=\"va-build\">\n          <p className=\"va-build-head\">\n            <Go to={{ page: 'build', build: build.build }} go={go} className=\"va-build-open\">\n              <span className=\"va-build-id\">{build.build}</span>\n              <span className=\"va-build-go\">Review →</span>\n            </Go>\n            <code className=\"va-commit\">{build.commit.slice(0, 8)}</code>\n            {build.branch === undefined ? null : <span className=\"va-branch\">{build.branch}</span>}\n            <span className=\"va-when\">{when(build.at)}</span>\n          </p>\n          <Verdicts build={build} />\n          <CoverageLine build={build} />\n        </li>\n      ))}\n    </ol>\n  );\n}\n\n/**\n * The counts, with `pending` given the emphasis.\n *\n * `unchanged` is the large number and the uninteresting one. What decides whether\n * anybody has to open this build is how many subjects still have nobody's name\n * against them.\n *\n * Every verdict the store keeps is named, including `ignored`, which this line\n * used to leave out. Four words over a five-word vocabulary is a line that does\n * not add up to the build it describes — twenty subjects reported as eighteen —\n * and the two it silently dropped are the two that came back green because a\n * declaration said so, which is the half of a build worth auditing.\n */\nfunction Verdicts({ build }: { readonly build: BuildSummary }): ReactElement {\n  return (\n    <p className=\"va-verdicts\">\n      <span className={build.pending > 0 ? 'va-pending' : 'va-settled'}>\n        {build.pending > 0 ? `${number(build.pending)} awaiting review` : 'nothing awaiting review'}\n      </span>\n      <span className=\"va-counts\">\n        {build.verdicts.changed} changed · {build.verdicts.new} new ·{' '}\n        {build.verdicts.incomparable} incomparable · {build.verdicts.ignored} ignored ·{' '}\n        {build.verdicts.unchanged} unchanged\n      </span>\n    </p>\n  );\n}\n\n/**\n * How much of the suite this run looked at, and what happened to the rest.\n *\n * **The denominator is the line.** A run that narrowed twenty subjects to two\n * has done the most expensive thinking in the product, and a page reading\n * `2 subjects` reports a suite of two. `2 of 20 observed` is the same fact with\n * the eighteen still in it.\n *\n * The states are not two. A run that stated its coverage and skipped nothing is\n * clean; a run that stated it and failed on fifty is not; and a run that never\n * said is **unknown**, which must not be drawn as the first. That is the collapse\n * `RunReport.notObserved` exists to prevent, and drawing `0 failed` for a silent\n * writer would reintroduce it at the last possible moment.\n *\n * `unreached` is drawn without alarm and without apology. It is not a hole, and\n * it is not somebody's standing decision either — it is the run having read the\n * diff against every stored baseline and concluded the change cannot arrive.\n */\nexport function CoverageLine({ build }: { readonly build: BuildSummary }): ReactElement {\n  const { coverage } = build;\n  if (!coverage.stated) {\n    return (\n      <p className=\"va-coverage va-unknown\">\n        This report did not say which subjects it skipped, so its coverage is unknown — not clean.\n      </p>\n    );\n  }\n\n  const seen = Object.values(build.verdicts).reduce((sum, n) => sum + n, 0);\n  const planned = seen + coverage.failed + coverage.excluded + coverage.unreached;\n\n  return (\n    <p className={coverage.failed > 0 ? 'va-coverage va-incomplete' : 'va-coverage'}>\n      <span className=\"va-num\">{seen}</span> of <span className=\"va-num\">{planned}</span> observed\n      {coverage.unreached === 0 ? null : (\n        <>\n          {' · '}\n          <span className=\"va-num\">{coverage.unreached}</span> not reached by this change\n        </>\n      )}\n      {coverage.failed === 0 ? null : <> · {coverage.failed} failed to render</>}\n      {coverage.excluded === 0 ? null : <> · {coverage.excluded} excluded by configuration</>}\n    </p>\n  );\n}\n"]}

package/dist/ui/carried.d.ts

@@ -0,0 +1,73 @@
+/**
+ * The other changes riding in the same picture as this one.
+ *
+ * A decision is taken on a *subject*, and approving one promotes the whole
+ * candidate image as the new baseline. So a render that carries this change and
+ * two others settles all three, under whichever of them the reviewer happened to
+ * open. Nothing on the page said so, and the reviewer had no way to find out: the
+ * docket files each render under one change, and the other two are on their own
+ * pages with their own approve buttons that have already been pressed by proxy.
+ *
+ * At one component and a dozen renders that is a small hazard. A button drawn in
+ * three thousand shots is where it stops being one — the batch is the only way to
+ * decide it, and the batch is exactly what makes the co-carried change invisible.
+ *
+ * ## What counts as another change here
+ *
+ * `cause` on the component hashes, which is *its own content moved* rather than
+ * *its box was pushed*. A container that reflowed is not a second change and
+ * listing it would put six framework wrappers on every render. The named few that
+ * come back are the components a reviewer would have opened a page for.
+ *
+ * ## What it will not say
+ *
+ * That a render carries only this change, when nothing compared its hashes. A
+ * baseline without component digests answers *not read*, and reading that as
+ * *nothing else is here* is the reassurance this whole surface must never give.
+ */
+import type { ReactElement } from 'react';
+import type { BuildDetail } from '../review-types.js';
+import type { Route } from './route.js';
+/** One other component causing a difference in renders this change is decided in. */
+export interface Carried {
+    readonly component: string;
+    /** Renders of this change it also moved in, in the order they were given. */
+    readonly subjects: readonly string[];
+}
+/** What else is in the pictures a decision here would promote. */
+export interface Carrying {
+    /** The other causes, widest first. */
+    readonly others: readonly Carried[];
+    /** Renders whose hashes were read and name no other cause. */
+    readonly alone: readonly string[];
+    /** Renders whose hashes were read and name at least one. */
+    readonly shared: readonly string[];
+    /** Renders where nothing compared hashes, which is neither of the above. */
+    readonly unread: readonly string[];
+    /** The other causes in one render. */
+    readonly at: (subject: string) => readonly string[];
+}
+export declare function carriedWith(build: BuildDetail, component: string, subjects: readonly string[]): Carrying;
+/**
+ * What a press of Approve settles beyond the change it is under.
+ *
+ * The button says *Approve this change (7)* and promotes seven whole pictures.
+ * Four of those seven also hold a `CardFooter` that moved on its own, and it has
+ * a page and an approve button of its own that nobody pressed — so the reviewer
+ * decides it here, under a heading with another component's name on it, and the
+ * `CardFooter` page afterwards reports renders already baselined against a
+ * decision it never recorded.
+ *
+ * Named rather than counted, and linked: the instruction the sentence implies is
+ * *go and look at that one first*, and it is one click away.
+ */
+export declare function AlsoCarries({ carrying, renders, build, changes, go, }: {
+    readonly carrying: Carrying;
+    /** Renders on this page, which the shared count is a fraction of. */
+    readonly renders: number;
+    readonly build: string;
+    /** Components with a change page of their own, so a link goes somewhere. */
+    readonly changes: ReadonlySet<string>;
+    readonly go: (route: Route) => void;
+}): ReactElement | null;
+//# sourceMappingURL=carried.d.ts.map

package/dist/ui/carried.js

@@ -0,0 +1,63 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Go } from './shell.js';
+import { count, number } from './text.js';
+export function carriedWith(build, component, subjects) {
+    const read = new Map(build.subjects.map((each) => [each.subject, each.moved]));
+    const others = new Map();
+    const alone = [];
+    const shared = [];
+    const unread = [];
+    const at = new Map();
+    for (const subject of subjects) {
+        const moved = read.get(subject);
+        if (moved === undefined) {
+            unread.push(subject);
+            continue;
+        }
+        const causes = moved
+            .filter((each) => each.cause && each.component !== component)
+            .map((each) => each.component)
+            .sort();
+        at.set(subject, causes);
+        if (causes.length === 0)
+            alone.push(subject);
+        else
+            shared.push(subject);
+        for (const name of causes) {
+            const seen = others.get(name);
+            if (seen === undefined)
+                others.set(name, [subject]);
+            else
+                seen.push(subject);
+        }
+    }
+    return {
+        others: [...others.entries()]
+            .map(([name, where]) => ({ component: name, subjects: where }))
+            .sort((left, right) => right.subjects.length - left.subjects.length ||
+            left.component.localeCompare(right.component)),
+        alone,
+        shared,
+        unread,
+        at: (subject) => at.get(subject) ?? [],
+    };
+}
+/**
+ * What a press of Approve settles beyond the change it is under.
+ *
+ * The button says *Approve this change (7)* and promotes seven whole pictures.
+ * Four of those seven also hold a `CardFooter` that moved on its own, and it has
+ * a page and an approve button of its own that nobody pressed — so the reviewer
+ * decides it here, under a heading with another component's name on it, and the
+ * `CardFooter` page afterwards reports renders already baselined against a
+ * decision it never recorded.
+ *
+ * Named rather than counted, and linked: the instruction the sentence implies is
+ * *go and look at that one first*, and it is one click away.
+ */
+export function AlsoCarries({ carrying, renders, build, changes, go, }) {
+    if (carrying.others.length === 0 && carrying.unread.length === 0)
+        return null;
+    return (_jsxs("p", { className: "va-carries", children: [carrying.others.length === 0 ? null : (_jsxs(_Fragment, { children: [_jsxs("strong", { children: [number(carrying.shared.length), " of ", count(renders, 'render')] }), ' ', "also carry", ' ', carrying.others.map((other, index) => (_jsxs("span", { children: [index === 0 ? '' : index === carrying.others.length - 1 ? ' and ' : ', ', changes.has(other.component) ? (_jsx(Go, { to: { page: 'change', build, change: other.component }, go: go, className: "va-carries-go", children: other.component })) : (_jsx("strong", { children: other.component })), _jsxs("span", { className: "va-note", children: [" (", number(other.subjects.length), ")"] })] }, other.component))), ". A decision is taken on the whole picture, so approving here accepts those in the same renders \u2014 before anyone opened their page.", ' '] })), carrying.unread.length === 0 ? null : (_jsxs("span", { className: "va-note", children: [count(carrying.unread.length, 'render'), " compared against a baseline with no component hashes, so nothing says what else is in ", carrying.unread.length === 1 ? 'it' : 'them', "."] }))] }));
+}
+//# sourceMappingURL=carried.js.map

package/dist/ui/carried.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carried.js","sourceRoot":"","sources":["../../src/ui/carried.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * The other changes riding in the same picture as this one.\n *\n * A decision is taken on a *subject*, and approving one promotes the whole\n * candidate image as the new baseline. So a render that carries this change and\n * two others settles all three, under whichever of them the reviewer happened to\n * open. Nothing on the page said so, and the reviewer had no way to find out: the\n * docket files each render under one change, and the other two are on their own\n * pages with their own approve buttons that have already been pressed by proxy.\n *\n * At one component and a dozen renders that is a small hazard. A button drawn in\n * three thousand shots is where it stops being one — the batch is the only way to\n * decide it, and the batch is exactly what makes the co-carried change invisible.\n *\n * ## What counts as another change here\n *\n * `cause` on the component hashes, which is *its own content moved* rather than\n * *its box was pushed*. A container that reflowed is not a second change and\n * listing it would put six framework wrappers on every render. The named few that\n * come back are the components a reviewer would have opened a page for.\n *\n * ## What it will not say\n *\n * That a render carries only this change, when nothing compared its hashes. A\n * baseline without component digests answers *not read*, and reading that as\n * *nothing else is here* is the reassurance this whole surface must never give.\n */\n\nimport type { ReactElement } from 'react';\nimport type { BuildDetail } from '../review-types.js';\nimport type { Route } from './route.js';\nimport { Go } from './shell.js';\nimport { count, number } from './text.js';\n\n/** One other component causing a difference in renders this change is decided in. */\nexport interface Carried {\n  readonly component: string;\n  /** Renders of this change it also moved in, in the order they were given. */\n  readonly subjects: readonly string[];\n}\n\n/** What else is in the pictures a decision here would promote. */\nexport interface Carrying {\n  /** The other causes, widest first. */\n  readonly others: readonly Carried[];\n  /** Renders whose hashes were read and name no other cause. */\n  readonly alone: readonly string[];\n  /** Renders whose hashes were read and name at least one. */\n  readonly shared: readonly string[];\n  /** Renders where nothing compared hashes, which is neither of the above. */\n  readonly unread: readonly string[];\n  /** The other causes in one render. */\n  readonly at: (subject: string) => readonly string[];\n}\n\nexport function carriedWith(\n  build: BuildDetail,\n  component: string,\n  subjects: readonly string[],\n): Carrying {\n  const read = new Map(build.subjects.map((each) => [each.subject, each.moved]));\n  const others = new Map<string, string[]>();\n  const alone: string[] = [];\n  const shared: string[] = [];\n  const unread: string[] = [];\n  const at = new Map<string, readonly string[]>();\n\n  for (const subject of subjects) {\n    const moved = read.get(subject);\n    if (moved === undefined) {\n      unread.push(subject);\n      continue;\n    }\n\n    const causes = moved\n      .filter((each) => each.cause && each.component !== component)\n      .map((each) => each.component)\n      .sort();\n\n    at.set(subject, causes);\n    if (causes.length === 0) alone.push(subject);\n    else shared.push(subject);\n    for (const name of causes) {\n      const seen = others.get(name);\n      if (seen === undefined) others.set(name, [subject]);\n      else seen.push(subject);\n    }\n  }\n\n  return {\n    others: [...others.entries()]\n      .map(([name, where]) => ({ component: name, subjects: where }))\n      .sort((left, right) => right.subjects.length - left.subjects.length ||\n        left.component.localeCompare(right.component)),\n    alone,\n    shared,\n    unread,\n    at: (subject) => at.get(subject) ?? [],\n  };\n}\n\n/**\n * What a press of Approve settles beyond the change it is under.\n *\n * The button says *Approve this change (7)* and promotes seven whole pictures.\n * Four of those seven also hold a `CardFooter` that moved on its own, and it has\n * a page and an approve button of its own that nobody pressed — so the reviewer\n * decides it here, under a heading with another component's name on it, and the\n * `CardFooter` page afterwards reports renders already baselined against a\n * decision it never recorded.\n *\n * Named rather than counted, and linked: the instruction the sentence implies is\n * *go and look at that one first*, and it is one click away.\n */\nexport function AlsoCarries({\n  carrying,\n  renders,\n  build,\n  changes,\n  go,\n}: {\n  readonly carrying: Carrying;\n  /** Renders on this page, which the shared count is a fraction of. */\n  readonly renders: number;\n  readonly build: string;\n  /** Components with a change page of their own, so a link goes somewhere. */\n  readonly changes: ReadonlySet<string>;\n  readonly go: (route: Route) => void;\n}): ReactElement | null {\n  if (carrying.others.length === 0 && carrying.unread.length === 0) return null;\n\n  return (\n    <p className=\"va-carries\">\n      {carrying.others.length === 0 ? null : (\n        <>\n          <strong>\n            {number(carrying.shared.length)} of {count(renders, 'render')}\n          </strong>{' '}\n          also carry{' '}\n          {carrying.others.map((other, index) => (\n            <span key={other.component}>\n              {index === 0 ? '' : index === carrying.others.length - 1 ? ' and ' : ', '}\n              {changes.has(other.component) ? (\n                <Go\n                  to={{ page: 'change', build, change: other.component }}\n                  go={go}\n                  className=\"va-carries-go\"\n                >\n                  {other.component}\n                </Go>\n              ) : (\n                <strong>{other.component}</strong>\n              )}\n              <span className=\"va-note\"> ({number(other.subjects.length)})</span>\n            </span>\n          ))}\n          . A decision is taken on the whole picture, so approving here accepts those in the same\n          renders — before anyone opened their page.{' '}\n        </>\n      )}\n      {carrying.unread.length === 0 ? null : (\n        <span className=\"va-note\">\n          {count(carrying.unread.length, 'render')} compared against a baseline with no component\n          hashes, so nothing says what else is in {carrying.unread.length === 1 ? 'it' : 'them'}.\n        </span>\n      )}\n    </p>\n  );\n}\n"]}