Shad 2edba020ef
Some checks failed
build-and-publish / test (push) Has been cancelled
build-and-publish / image (push) Has been cancelled
feat(canvas): reimagine ProcessGraph as FM industrial blueprint
Pulls the actual FM06/flow-master-design-philosophy doctrine
(DESIGN_PHILOSOPHY.md + SYNTHESIS.md + IMPLEMENTATION_STANDARD.md
+ ADR 0001/0002) and rebuilds the canvas to match: 'operations
cockpit', 'industrial, instrumented, accountable'. Light paper
canvas + navy frame + amber accent + 1px rules + square edges +
monospace operational labels.

WHAT CHANGED
- ProcessGraph.tsx rewritten: square 1px navy nodes, mono uppercase
  labels, orthogonal step edges (ReactFlow type:'step' → MLHV only),
  two-layer Background (8px minor + 64px major navy hairline grid),
  doctrinal palette tokens via var(--bp-*).
- BlueprintFrame.tsx (new): top instrument readout strip
  (DEF / VERSION / HUB / NODES / EDGES / SRC / MODE / TX), top + left
  rulers with 8/64px ticks, navy corner glyph at origin, bottom
  status legend.
- index.css: scoped [data-canvas="blueprint"] block (~280 lines)
  declaring 11 doctrinal hex tokens once; opacity derivatives go
  through CSS color-mix(in srgb, var(--bp-navy) 13%, transparent)
  not raw rgba(). No box-shadow on selected node (outline instead).
- LeftRail.tsx: gate toast now names the real endpoint
  (POST /api/runtime/transactions/{id}/actions/{submit,save_draft})
  on the unsigned-in path too, restoring the convention from the
  prior real-mutations pass.
- qa/smoke.mjs updated for the new selectors (.bp-node,
  .bp-readout-blueprint). Old guided-tour assertions replaced with
  Studio scene assertions. 27/27 PASS.
- qa/smoke_blueprint.mjs (new): 15 assertions covering S1–S3 + S5.
- qa/palette_audit.mjs (new): three checks — doctrinal CSS hex,
  no raw rgba() in blueprint scope, no hardcoded color literals in
  blueprint TSX. All pass.

ORACLE-REVIEWED
Round 1 FAIL: hardcoded TSX color literals + box-shadow + rgba +
narrow palette audit. Round 2 PASS after fixing all four.

CONTRACT EVIDENCE
- vitest: 5 files, 24 tests, all green
- main smoke: 27/27, 0 console errors
- blueprint smoke: 15/15, 0 console errors
- palette audit: 11 CSS doctrinal hex tokens, 0 raw rgba, 2 TSX files clean
- vite build: green

Confidence: high
Scope-risk: narrow (scoped [data-canvas="blueprint"])
Not-tested: pixel-level visual diff (Oracle could not inspect images
this round; relied on programmatic DOM + path-command assertions)
2026-06-14 01:43:00 +04:00

57 lines
2.1 KiB
JavaScript

// Doctrine palette audit (S6).
// 1. Every hex color inside the INDUSTRIAL BLUEPRINT CANVAS CSS section
// must be one of the doctrinal tokens.
// 2. Blueprint TSX files must not introduce hardcoded hex/rgb literals —
// they should reference --bp-* tokens via var(...).
import { readFileSync } from "node:fs";
const DOCTRINE = new Set([
"#f5f7fb", "#e8edf5", "#d5dde9",
"#1a2740", "#243453",
"#4a5b80", "#7a8aa8",
"#c46a14", "#3d6a2c", "#a6342a", "#1d6f82",
]);
function fail(msg) { console.log("✗", msg); process.exitCode = 1; }
function pass(msg) { console.log("✓", msg); }
const css = readFileSync("src/index.css", "utf8");
const idx = css.indexOf("INDUSTRIAL BLUEPRINT CANVAS");
if (idx < 0) { fail("blueprint CSS block not found"); process.exit(1); }
const cssBlock = css.slice(idx);
const cssHexes = cssBlock.match(/#[0-9a-fA-F]{6}|#[0-9a-fA-F]{3}/g) || [];
const cssOffending = cssHexes.filter((h) => !DOCTRINE.has(h.toLowerCase()));
if (cssOffending.length === 0) {
pass(`CSS palette: ${cssHexes.length} hex tokens, all doctrinal`);
} else {
fail(`CSS non-doctrinal hex tokens: ${cssOffending.join(", ")}`);
}
const cssRgba = cssBlock.match(/rgba?\([^)]*\)/g) || [];
if (cssRgba.length === 0) {
pass("CSS has no raw rgba() literals (alpha goes through color-mix tokens)");
} else {
fail(`CSS raw rgba() literals: ${cssRgba.join(", ")}`);
}
const tsxFiles = [
"src/components/ProcessGraph.tsx",
"src/components/BlueprintFrame.tsx",
];
let tsxOffending = 0;
for (const f of tsxFiles) {
const src = readFileSync(f, "utf8");
const hex = (src.match(/#[0-9a-fA-F]{6}|#[0-9a-fA-F]{3}/g) || []).filter(
(h) => !DOCTRINE.has(h.toLowerCase()),
);
const rgba = src.match(/rgba?\(\s*\d+/g) || [];
if (hex.length || rgba.length) {
fail(`${f}: hardcoded color literals: hex=${hex.join(",") || "none"} rgba=${rgba.join(",") || "none"}`);
tsxOffending += hex.length + rgba.length;
}
}
if (tsxOffending === 0) pass(`TSX palette: ${tsxFiles.length} blueprint TSX files clean (no hardcoded color literals)`);
if (process.exitCode === 1) console.log("\nPalette audit FAILED");
else console.log("\nPalette audit PASSED");