// Header, search form, landing page, results page. function Header({ lang, setLang, go, theme }) { return (

); } function SearchForm({ search, setSearch, onSubmit, lang, theme, compact = false }) { const t = COPY[lang]; const airports = [ { code: "CDG", name: "Paris Charles de Gaulle", sub: "Roissy" }, { code: "ORY", name: "Paris Orly", sub: "Orly" }, ]; return (

{ e.preventDefault(); onSubmit(); }} style={{ display: "grid", gridTemplateColumns: compact ? "1.3fr 1fr 1fr auto" : "1.3fr 1fr 1fr auto", gap: 0, background: theme.bg, border: "1px solid " + theme.border, borderRadius: compact ? 14 : 18, padding: compact ? 6 : 8, boxShadow: compact ? "0 1px 3px rgba(10,20,40,0.04)" : "0 20px 60px -20px rgba(10,30,60,0.25), 0 2px 6px rgba(10,30,60,0.05)", alignItems: "stretch", }}> {/* Airport */}

{t.airport}

{airports.map(a => ( ))}

{/* From */} setSearch({ ...search, from: v })} time={search.fromTime} onTimeChange={(v) => setSearch({ ...search, fromTime: v })} theme={theme} /> setSearch({ ...search, to: v })} time={search.toTime} onTimeChange={(v) => setSearch({ ...search, toTime: v })} theme={theme} />

); } function DateField({ label, iconName, value, onChange, time, onTimeChange, theme }) { return (

{label}

onChange(e.target.value)} style={{ border: "none", outline: "none", background: "transparent", fontFamily: "inherit", fontSize: 14, fontWeight: 600, color: theme.ink, width: 132, padding: 0, }}/> onTimeChange(e.target.value)} style={{ border: "none", outline: "none", background: "transparent", fontFamily: "inherit", fontSize: 14, fontWeight: 600, color: theme.ink, width: 86, padding: 0, }}/>

); } // --- LANDING PAGE --- function Landing({ lang, search, setSearch, go, theme }) { const t = COPY[lang]; return (

{/* HERO */}

{/* decorative flight path */}

{lang === "fr" ? "+12 000 voyageurs nous font confiance chaque mois" : "+12,000 travelers trust us every month"}

{t.heroTitle}

{t.heroSub}

go("results")} lang={lang} theme={theme}/>

{/* POPULAR OFFERS — horizontal carousel */}

{/* BENEFITS */}

{t.benefits.map((b, i) => (

{b.t}

{b.d}

))}

{/* HOW IT WORKS */}

{t.steps.map((s, i) => (

0{i + 1}

{s.t}

{s.d}

))}

); } function SectionHead({ title, lang, theme }) { return (

{title}

); } function MiniCard({ parking, seed, lang, theme, onClick }) { return ( ); } function Footer({ lang, theme }) { return ( ); } function FooterCol({ title, children, theme }) { return (

{title}

{children}

); } function FooterLink({ children, onClick, theme }) { return ( { e.preventDefault(); onClick && onClick(); }} style={{ color: theme.inkMuted, textDecoration: "none", cursor: "pointer", transition: "color .15s ease", }} onMouseOver={e => e.currentTarget.style.color = theme.ink} onMouseOut={e => e.currentTarget.style.color = theme.inkMuted} >{children} ); } function PayBadge({ kind, theme }) { const style = { width: 46, height: 30, borderRadius: 6, background: theme.bg, border: "1px solid " + theme.border, display: "inline-flex", alignItems: "center", justifyContent: "center", fontSize: 9, fontWeight: 800, color: theme.ink, letterSpacing: -0.2, }; if (kind === "visa") return VISA; if (kind === "mc") return ( ); if (kind === "amex") return AMEX; if (kind === "apple") return ( Pay ); if (kind === "google") return G Pay; if (kind === "stripe") return stripe; return null; } function AxaLogo() { // AXA is an iconic wordmark — red/black, flat-chiseled A. return ( AXA ); } function ParkingCarousel({ lang, theme, go, setSearch, title }) { const scrollerRef = React.useRef(null); const [tab, setTab] = React.useState("all"); // all | CDG | ORY const [paused, setPaused] = React.useState(false); const list = React.useMemo(() => { if (tab === "all") return PARKINGS; return PARKINGS.filter(p => p.airport === tab); }, [tab]); const scrollBy = (dir) => { const el = scrollerRef.current; if (!el) return; el.scrollBy({ left: dir * 320, behavior: "smooth" }); }; // Auto-scroll: nudge right by one card every 3s when not paused. // Loop back to start when reaching end. React.useEffect(() => { if (paused) return; const el = scrollerRef.current; if (!el) return; const id = setInterval(() => { if (!el) return; const nearEnd = el.scrollLeft + el.clientWidth >= el.scrollWidth - 4; if (nearEnd) { el.scrollTo({ left: 0, behavior: "smooth" }); } else { el.scrollBy({ left: 318, behavior: "smooth" }); } }, 3200); return () => clearInterval(id); }, [paused, tab]); return (

setPaused(true)} onMouseLeave={() => setPaused(false)}>

{title}

{[ { id: "all", label: lang === "fr" ? "Tous" : "All" }, { id: "CDG", label: "CDG" }, { id: "ORY", label: "Orly" }, ].map(o => ( ))}

{paused ? (lang === "fr" ? "en pause" : "paused") : (lang === "fr" ? "défilement auto" : "auto-scroll")}

scrollBy(-1)}/> scrollBy(1)}/>

{list.map((p, i) => (

{ setSearch(s => ({ ...s, airport: p.airport })); go("detail", p.id); }}/>

))}

); } function CarouselBtn({ theme, dir, onClick }) { return ( ); } Object.assign(window, { Header, SearchForm, Landing, SectionHead, MiniCard, Footer, ParkingCarousel });