/* ============================================================
FLORÍADE — UI compartilhada
============================================================ */
/* Triângulo alquímico do elemento */
function ElementMark({ element, size=16, color="var(--gold)" }){
const t = ELEMENT_TRI[element] || ELEMENT_TRI.fogo;
return (
);
}
/* Correspondências (planeta · signo · elemento) */
function Corr({ p, mono=true }){
return (
{p.planet}
·
{p.sign}
·
);
}
/* Imagem de produto (slot preenchível pelo usuário) */
function ProductImage({ p, tall=true, sigil=true }){
return (
{sigil && (
{p.planet}
)}
);
}
/* Cartão de produto */
function ProductCard({ p, onOpen, index=0 }){
const cart = useCart();
return (
onOpen(p.id)}>{p.name}
{p.latin}
{p.tag}
{brl(p.price)}
);
}
/* ---------- CABEÇALHO ---------- */
function Header({ route, go, palette, setPalette }){
const cart = useCart();
const [solid, setSolid] = useState(false);
const [bump, setBump] = useState(false);
useEffect(()=>{
const onScroll = ()=> setSolid(window.scrollY>40);
window.addEventListener("scroll", onScroll, {passive:true});
return ()=> window.removeEventListener("scroll", onScroll);
},[]);
useEffect(()=>{ if(cart.pulse){ setBump(true); const t=setTimeout(()=>setBump(false),420); return ()=>clearTimeout(t);} },[cart.pulse]);
return (
Florais Spagíricos · desde MMXIX
Oferenda livre acima de R$ 280
);
}
/* ---------- RODAPÉ ---------- */
function Footer({ go }){
return (
);
}
Object.assign(window, { ElementMark, Corr, ProductImage, ProductCard, Header, Footer });