/* ============================================================ legal.jsx — Shared renderer for the five TLI legal pages. Depends on: legal-content.jsx (window.LEGAL_DOCS / LEGAL_INDEX), page.jsx (window.Header), footer.jsx (window.Footer). Usage (per page): ============================================================ */ function LegalStyles() { return ( ); } function LegalTOC({ sections, activeId }) { return ( ); } function LegalBlock({ block }) { const [kind, a, b] = block; if (kind === "h3") return

{a}

; if (kind === "p") return

{a}

; if (kind === "ul") { return (

{li}

); } if (kind === "table") { return (

{a.headers.map((h, i) => )} {a.rows.map((row, ri) => ( {row.map((cell, ci) => )} ))}

{h}
{cell}

); } if (kind === "callout") { return (

{a ?

{a}

: null}

{b}

); } return null; } function LegalPage({ slug }) { const { useState, useEffect, useMemo } = React; const doc = window.LEGAL_DOCS[slug]; // Build sections: each "h2" starts a new section; following blocks until // the next "h2" belong to it. Leading non-h2 blocks (e.g. the Risk callout) // render in an unlabelled intro section. const { sections, tocSections } = useMemo(() => { const secs = []; let cur = null; let leadId = 0; doc.blocks.forEach((blk) => { if (blk[0] === "h2") { cur = { id: "s-" + (secs.length + 1), title: blk[1], blocks: [] }; secs.push(cur); } else { if (!cur) { cur = { id: "lead-" + (leadId++), title: null, blocks: [] }; secs.push(cur); } cur.blocks.push(blk); } }); return { sections: secs, tocSections: secs.filter((s) => s.title) }; }, [slug]); const [activeId, setActiveId] = useState(tocSections[0] ? tocSections[0].id : null); useEffect(() => { const ids = tocSections.map((s) => s.id); const onScroll = () => { const offset = (parseInt(getComputedStyle(document.documentElement).getPropertyValue("--header-h")) || 75) + 60; let current = ids[0]; for (const id of ids) { const el = document.getElementById(id); if (el && el.getBoundingClientRect().top <= offset) current = id; } setActiveId(current); }; onScroll(); window.addEventListener("scroll", onScroll, { passive: true }); return () => window.removeEventListener("scroll", onScroll); }, [slug]); const related = window.LEGAL_INDEX.filter((d) => d.slug !== slug); return (

Home {doc.label}

{doc.eyebrow}

{doc.title}

{doc.intro}

Effective date: {doc.effective} Last updated: {doc.updated}

{sections.map((sec) => (

{sec.title ?

{sec.title}

: null} {sec.blocks.map((blk, i) => )}

))}