// ============================================================ // Chrome: Nav, Footer, CartDrawer, Toast // ============================================================ const { useState, useEffect, useCallback, useRef } = React; // ---- Icons ---- const Icon = { cart: (p) => , search: (p) => , close: (p) => , plus: (p) => , minus: (p) => , arrow: (p) => , check: (p) => , menu: (p) => , bolt: (p) => , shield: (p) => , palette: (p) => , globe: (p) => , phone: (p) => , android: (p) => , wifi: (p) => , truck: (p) => , spark: (p) => , whatsapp: (p) => , mail: (p) => , }; // ---- Pinwheel mark (echoes the logo's X) ---- function Pinwheel({ size = 24 }) { return ( ); } // ---- Nav ---- function Nav({ route, navigate, cartCount, openCart }) { const [menuOpen, setMenuOpen] = useState(false); const links = [ { id: 'home', label: 'Home' }, { id: 'series-lumen', label: 'Lumen' }, { id: 'series-chroma', label: 'Chroma' }, { id: 'series-beacon', label: 'Beacon' }, { id: 'shop', label: 'Shop' }, { id: 'app', label: 'App' }, { id: 'about', label: 'About' }, ]; function go(id) { setMenuOpen(false); navigate(id); } return (
{ e.preventDefault(); go('home'); }}> vividpix
{menuOpen && (
{ if (e.target === e.currentTarget) setMenuOpen(false); }}>
)}
); } // ---- Footer ---- function Footer({ navigate }) { return ( ); } // ---- Cart Drawer ---- function CartDrawer({ open, onClose, items, updateQty, removeItem, navigate }) { const subtotal = items.reduce((s, it) => s + it.price * it.qty, 0); const shipping = subtotal > 25000 ? 0 : 499; const total = subtotal + shipping; return ( <>
); } // ---- Floating WhatsApp button ---- function FloatingWhatsApp() { return ( { e.currentTarget.style.transform = 'translateY(-2px)'; }} onMouseLeave={(e) => { e.currentTarget.style.transform = 'translateY(0)'; }} > Chat with us ); } // ---- Toast ---- function Toast({ message, show }) { return (
{message}
); } Object.assign(window, { Nav, Footer, CartDrawer, Toast, Icon, Pinwheel, FloatingWhatsApp });