/* Chrome → window: Banner, Header, CookieBanner, Footer */
(function () {
const { useState, useEffect, useRef } = React;
const Icon = window.Icon, Logo = window.Logo;
// ---- constitution banner ----
window.TopBanner = function TopBanner({ text, onClose }) {
return (
);
};
// ---- header + mega menu ----
const MENU_KEYS = ["alliance", "clubs", "missions", "projects", "membership"];
// Map each mega sub-item (by index) to a cross-page URL
const MEGA_HREFS = {
alliance: ["index.html#about", "index.html#pillars", "index.html#governance", "index.html#bureau", "index.html#council", "index.html#ethics"],
clubs: ["clubs.html#club-1", "clubs.html#club-2", "clubs.html#club-3", "clubs.html#club-4", "clubs.html#club-5", "clubs.html#club-6", "clubs.html#club-7"],
missions: ["missions.html", "missions.html#agenda", "missions.html#forum", "missions.html#reports"],
projects: ["projects.html#projects", "projects.html#pipeline"],
membership: ["membership.html#why-join", "membership.html#membership-tiers", "membership.html#membership-sov", "membership.html#application", "membership.html#faq"],
};
window.Header = function Header({ C, lang, setLang, mark, navStyle, overHero, heroDark, currentPage, onNav }) {
const [open, setOpen] = useState(null);
const [scrolled, setScrolled] = useState(false);
const [mobile, setMobile] = useState(false);
const closeT = useRef();
useEffect(() => {
const f = () => setScrolled(window.scrollY > 40);
f(); window.addEventListener("scroll", f, { passive: true });
return () => window.removeEventListener("scroll", f);
}, []);
const transparent = navStyle === "transparent" && overHero && !scrolled && !open;
const onDark = transparent && heroDark;
const mode = onDark ? "light" : "dark";
const linkColor = onDark ? "rgba(255,255,255,.9)" : "var(--ink)";
const enter = (k) => { clearTimeout(closeT.current); setOpen(k); };
const leave = () => { closeT.current = setTimeout(() => setOpen(null), 120); };
// Top-level nav: [key, label, href, activePage]
const navItems = [
["alliance", C.nav.alliance, "index.html", "home"],
["clubs", C.nav.clubs, "clubs.html", "clubs"],
["missions", C.nav.missions, "missions.html", "missions"],
["projects", C.nav.projects, "projects.html", "projects"],
["membership", C.nav.membership, "membership.html", "membership"],
["news", C.nav.news, "news.html", "news"],
["contact", C.nav.contact, "contact.html", "contact"],
];
return (
{/* desktop nav */}
{/* right cluster */}
{C.nav.join}
{/* mega menu */}
{open && C.mega[open] && (
enter(open)}
style={{
position: "absolute", left: 0, right: 0, top: "100%",
background: "var(--surface)", borderBottom: "1px solid var(--hairline)",
boxShadow: "0 24px 48px -24px rgba(14,31,58,.22)",
animation: "emaFade .22s var(--ease)",
}}>
{["fr", "en"].map((l, i) => (
{i === 1 && /}
))}
);
}
function MobileMenu({ C, navItems, lang, setLang, onClose }) {
useEffect(() => {
document.body.style.overflow = "hidden";
return () => { document.body.style.overflow = ""; };
}, []);
return ReactDOM.createPortal(
EMA
,
document.body
);
}
// ---- cookie banner ----
window.CookieBanner = function CookieBanner({ C, onClose }) {
return (
{C.cookie.text}
);
};
// footer column links → cross-page URLs (parallel to C.footer.cols)
const FOOT_HREFS = [
["index.html#about", "index.html#governance", "index.html#bureau", "index.html#ethics"],
["clubs.html", "missions.html", "projects.html", "membership.html"],
["news.html", "news.html#publications", "news.html#press", "contact.html"],
];
// ---- footer ----
window.Footer = function Footer({ C, mark }) {
return (
);
};
})();