/* ==========================================================================
Shared primitives — used across all sections.
Exposes on window so other Babel scripts can use them.
========================================================================== */
const { useState: useStatePrim, useEffect: useEffectPrim, useRef: useRefPrim } = React;
/* ---- Hooks ---- */
function useInView(options = { threshold: 0.3 }) {
const ref = useRefPrim(null);
const [inView, setInView] = useStatePrim(false);
useEffectPrim(() => {
if (!ref.current) return;
const obs = new IntersectionObserver(([entry]) => {
if (entry.isIntersecting) { setInView(true); obs.disconnect(); }
}, options);
obs.observe(ref.current);
return () => obs.disconnect();
}, []);
return [ref, inView];
}
function useTyped(text, trigger, speed = 28) {
const [out, setOut] = useStatePrim("");
useEffectPrim(() => {
if (!trigger) { setOut(""); return; }
let i = 0;
const id = setInterval(() => {
i++;
setOut(text.slice(0, i));
if (i >= text.length) clearInterval(id);
}, speed);
return () => clearInterval(id);
}, [trigger, text]);
return out;
}
/* ---- Field (fillable, types on scroll) ---- */
function Field({ label, value, typed = true, colSpan = 1, speed = 28 }) {
const [ref, inView] = useInView();
const display = useTyped(value, inView && typed, speed);
const final = typed ? display : value;
const showCursor = typed && inView && display.length < value.length;
return (
1 ? { gridColumn: `span ${colSpan}` } : {}}>
{label}
{final}
{showCursor && }
);
}
/* ---- Part header ---- */
function PartHeader({ part, title, meta, instructions }) {
return (
<>
Part {part}
{title}
{meta && {meta}}
{instructions && (
{instructions}
See instructions
)}
);
}
/* ---- Line items (services) ---- */
function LineItem({ num, title, desc, amount }) {
const [ref, inView] = useInView({ threshold: 0.5 });
return (
{num}
{amount || "✓ INCLUDED"}
);
}
function LineSectionHeader({ label }) {
return (
{label}
);
}
/* ---- Decorative barcode / QR ---- */
function Barcode({ seed = "BH1040" }) {
const bars = [];
let hash = 0;
for (let i = 0; i < seed.length; i++) hash = (hash * 31 + seed.charCodeAt(i)) & 0xffff;
for (let i = 0; i < 60; i++) {
hash = (hash * 1103515245 + 12345) & 0x7fffffff;
const w = 1 + (hash % 3);
const solid = (hash >> 3) % 3 !== 0;
bars.push();
}
return {bars}
;
}
function QR() {
const cells = [];
let h = 7919;
for (let i = 0; i < 256; i++) {
h = (h * 1103515245 + 12345) & 0x7fffffff;
const on = (h >> 5) % 3 === 0;
const r = Math.floor(i / 16), c = i % 16;
const inFinder =
(r < 4 && c < 4) || (r < 4 && c >= 12) || (r >= 12 && c < 4);
const show = inFinder ? (r === 0 || r === 3 || r === 12 || r === 15 || c === 0 || c === 3 || c === 12 || c === 15 || (r >= 1 && r <= 2 && c >= 1 && c <= 2) || (r >= 1 && r <= 2 && c >= 13 && c <= 14) || (r >= 13 && r <= 14 && c >= 1 && c <= 2)) : on;
cells.push();
}
return {cells}
;
}
/* ---- Decorative sketches ---- */
function BuildingSketch() {
return (
);
}
function FormSketch() {
return (
);
}
/* ---- StatBox: numbered line item rendered as a figure cell ---- */
function StatBox({ n, k, v, accent = false }) {
return (
);
}
Object.assign(window, {
useInView, useTyped,
Field, PartHeader, LineItem, LineSectionHeader,
Barcode, QR,
BuildingSketch, FormSketch,
StatBox,
});