import React, { useState } from "react"; import { motion, AnimatePresence } from "framer-motion"; // Drop/replace image URLs here — order matches the 3 featured products. const productImages = [ "https://res.cloudinary.com/r88fkouv/image/upload/v1784481680/Components/Images/1784481679932-mp0q5n7n5.webp", "https://res.cloudinary.com/r88fkouv/image/upload/v1784481684/Components/Images/1784481680834-3jxerjuns.png", "https://res.cloudinary.com/r88fkouv/image/upload/v1784481679/Components/Images/1784481676284-dko9ihuxh.png", ]; const PRODUCTS = [ { name: "Oro rosa", price: "$55,00", img: productImages[0] }, { name: "Azul", price: "$65,00", img: productImages[1] }, { name: "Purpura", price: "$55,00", img: productImages[2] }, ]; export default function ProductShowcase() { const [selected, setSelected] = useState(0); const mainImage = PRODUCTS[selected]?.img; return (

{/* background glow */}

{/* Left: copy + product picker */}

Headphones
Wireless

Mejores efectos de sonido y una mejor experiencia auditiva. Tiene 3 modos de ecualizacion con los que puede cambiar libremente.

IR A LA TIENDA

{PRODUCTS.map((p, i) => { const isSelected = selected === i; return ( setSelected(i)} whileHover={{ y: -2 }} whileTap={{ scale: 0.96 }} className={`flex items-center gap-3 bg-transparent p-0 text-left transition-opacity duration-200 ${ isSelected ? "opacity-100" : "opacity-50" }`} >

{p.img ? ( {p.name}

) : ( )}

{p.price} {p.name}

); })}

{/* Right: hero image */}

{mainImage ? ( ) : (

)}

); }

Headphones Wireless

Headphones
Wireless

Wireless Headphones | Premium Sound, 3 EQ Modes