/* Shared components for Quito Auto Parts */ const WA_NUMBER = '593991234567'; const WA_BASE = `https://wa.me/${WA_NUMBER}`; const waLink = (text) => `${WA_BASE}?text=${encodeURIComponent(text)}`; const Logo = () => ( window.navigate('home')}> QUITO AUTO PARTS REPUESTOS · QUITO EC ); const Navbar = ({ active = 'Inicio' }) => { const [open, setOpen] = React.useState(false); const links = [ { label: 'Inicio', page: 'home' }, { label: 'Marcas', page: 'brands' }, { label: 'Catálogo', page: 'catalog' }, { label: 'Nosotros', page: 'about' }, { label: 'Contacto', page: 'contact' }, ]; const go = (page) => { setOpen(false); window.navigate(page); }; return ( <> {open && (
{links.map(l => ( go(l.page)}> {l.label} ))} go('catalog')} style={{marginTop: 32, justifyContent: 'center'}}> Ver Catálogo →
)} ); }; const WAIcon = ({ size = 18 }) => ( ); const WAFloat = () => ( ); const Footer = () => ( ); /* Brand badge - geometric (original, not real logos) */ const BrandBadge = ({ brand, size = 64 }) => { const map = { Kia: { color: '#E31E24', char: 'K' }, Hyundai: { color: '#0257B4', char: 'H' }, Chevrolet: { color: '#D4A437', char: 'C' }, }; const { color, char } = map[brand] || map.Kia; return (
OEM {char}
); }; /* Compatibility chip per brand */ const CompatChip = ({ brand, model }) => { const cls = brand === 'Kia' ? 'plate-red' : brand === 'Hyundai' ? 'plate-blue' : 'plate-gold'; return ● {brand}{model ? ' · ' + model : ''}; }; /* Generic part image placeholder */ const PartImage = ({ kind = 'brake', accent = '#888' }) => { const shapes = { brake: ( {[...Array(12)].map((_,i) => ( ))} ), filter: ( {[...Array(10)].map((_,i) => ( ))} ), spark: ( ), shock: ( {[...Array(6)].map((_,i) => ( ))} ), belt: ( {[...Array(20)].map((_,i) => ( ))} ), battery: ( 12V ), bulb: ( ), pump: ( {[...Array(6)].map((_,i) => ( ))} ), }; return ( {shapes[kind] || shapes.brake} ); }; /* Engine/car hero background SVG */ const HeroBg = () => (
{/* Engine block */} {[...Array(6)].map((_,i) => ( {[...Array(8)].map((_,j) => ( ))} ))} {[...Array(20)].map((_,i) => ( ))} {/* Radiator left */} {[...Array(12)].map((_,i) => ( ))} {/* Red diagonal accent */}
); /* Helper: build a WhatsApp link for a product */ const productWALink = (name, sku) => { const text = sku ? `Hola, me interesa el repuesto: ${name} (SKU: ${sku}). ¿Está disponible?` : `Hola, me interesa el repuesto: ${name}. ¿Está disponible y cuánto cuesta?`; return waLink(text); }; Object.assign(window, { WA_NUMBER, WA_BASE, waLink, productWALink, Logo, Navbar, WAIcon, WAFloat, Footer, BrandBadge, CompatChip, PartImage, HeroBg });