/* global React */
const { useState, useRef, useEffect } = React;
/* ============================================================
P-01 · Audit — five questions, every one pass/fail
============================================================ */
function Audit({ items, summary }) {
const [openIdx, setOpenIdx] = useState(null);
return (
P-01 · Audit
5/5 passing · auto-run on every piece
{items.map((it, i) => (
setOpenIdx(openIdx === i ? null : i)}
>
Q{String(i + 1).padStart(2, "0")}
Pass
))}
Voice Audit Test · v1.2
5 of 5 · ratified by founder
);
}
/* ============================================================
P-02 · Gate sequence
============================================================ */
function Gates({ stages }) {
return (
P-02 · Gate sequence
3 layers · all required
{stages.map((s, i) => (
G{i + 1} · {s.kind}
{s.name}
{s.actor}
{s.desc}
{i < stages.length - 1 && (
)}
))}
);
}
/* ============================================================
P-03 · Canon bundle (the four files)
============================================================ */
function Bundle({ files }) {
const [openIdx, setOpenIdx] = useState(null);
const total = files.reduce((sum, f) => sum + f.bytes, 0);
const totalKb = (total / 1024).toFixed(1);
return (
P-03 · Canon bundle
4 files · {totalKb} kb total · open any
content-captain / canon
ratified 2026.04.02
{files.map((f, i) => (
setOpenIdx(openIdx === i ? null : i)}
>
{f.name}
{(f.bytes / 1024).toFixed(2)} kb
{f.desc}
{openIdx === i ? "Close" : "Open file →"}
{f.body}
))}
);
}
/* ============================================================
P-04 · Refusal marker
============================================================ */
function Refusal({ kind, struck, replacement }) {
return (
Refused · {kind}
{struck}
What ships instead
{replacement}
);
}
/* ============================================================
P-05 · Contrast ladder
============================================================ */
function Ladder({ left, right }) {
return (
P-05 · Contrast ladder
most companies · LVRD
{left.label}
{left.title}
{left.items.map((t, i) => (
- {String(i + 1).padStart(2, "0")}{t}
))}
{right.label}
{right.title}
{right.items.map((t, i) => (
- {String(i + 1).padStart(2, "0")}{t}
))}
);
}
/* ============================================================
P-06 · Pivot quote
============================================================ */
function Pivot({ children, attr }) {
return (
Load-bearing
{children}
{attr &&
{attr}
}
);
}
/* ============================================================
P-07 · Cadence strip
============================================================ */
function Cadence({ weeks }) {
return (
P-07 · Cadence
52-week roll · one piece per heartbeat
{weeks.map((w, i) => (
{w.label}
))}
Shipped
Missed · named
This piece
);
}
/* ============================================================
P-08 · Margin standard — inline gutter annotation
Used as …
============================================================ */
function ParaWithMargin({ tag, note, children }) {
return (
{children}
{tag}
{note}
);
}
/* ============================================================
P-09 · File chip
============================================================ */
function FChip({ children }) {
return {children};
}
/* ============================================================
P-10 · Standards table
============================================================ */
function Standards({ rows }) {
return (
P-10 · Standards
W1–W5 · applied to this piece
{rows.map((r, i) => (
{r.key}
{r.name}. {r.def}
Holds
))}
);
}
Object.assign(window, {
Audit, Gates, Bundle, Refusal, Ladder, Pivot, Cadence,
ParaWithMargin, FChip, Standards
});