/* ===========================================================
PIPOQUE — UI atoms (mascote, ícones, toast, paleta)
=========================================================== */
const { useState, useEffect, useRef, useCallback, createContext, useContext } = React;
/* ---------- Mascote Pipo (usa o symbol #pipo do index) ---------- */
function Pipo({ size = 80, style = {}, className = '', rotate = 0 }) {
return (
);
}
/* ---------- Logo oficial (balde de pipoca) ---------- */
function Logo({ size = 48, className = '', style = {} }) {
return (
);
}
/* ---------- Visual de produto (foto, ou pote estilizado) ---------- */
function ProductVisual({ glyph = '🍿', color = 'p1', image = '', showMascot = true, style = {}, big = false }) {
if (image) {
return 
;
}
const bg = `var(--${color})`;
return (
);
}
/* ---------- Ícones (line, herdam currentColor) ---------- */
const Icon = {
cart: (p) => ,
home: (p) => ,
menu: (p) => ,
user: (p) => ,
close: (p) => ,
plus: (p) => ,
back: (p) => ,
trash: (p) => ,
edit: (p) => ,
check: (p) => ,
copy: (p) => ,
box: (p) => ,
gear: (p) => ,
users: (p) => ,
receipt: (p) => ,
logout: (p) => ,
whatsapp: (p) => ,
instagram: (p) => ,
tiktok: (p) => ,
pin: (p) => ,
clock: (p) => ,
star: (p) => ,
bike: (p) => ,
eye: (p) => ,
eyeoff: (p) => ,
search: (p) => ,
upload: (p) => ,
};
/* ---------- Toast ---------- */
const ToastCtx = createContext(null);
function ToastProvider({ children }) {
const [toasts, setToasts] = useState([]);
const push = useCallback((msg, em = '🍿') => {
const id = Math.random().toString(36).slice(2);
setToasts((t) => [...t, { id, msg, em }]);
setTimeout(() => setToasts((t) => t.filter((x) => x.id !== id)), 2600);
}, []);
return (
{children}
{toasts.map((t) => (
{t.em}{t.msg}
))}
{pals.map((p) => (
);
}
/* ---------- Modal genérico ---------- */
function Modal({ title, onClose, children, foot, wide }) {
useEffect(() => {
const h = (e) => { if (e.key === 'Escape') onClose(); };
window.addEventListener('keydown', h);
return () => window.removeEventListener('keydown', h);
}, [onClose]);
return (
{title}
{children}
{foot &&
{foot}
}
);
}
Object.assign(window, {
Pipo, Logo, ProductVisual, Icon, ToastProvider, useToast, PaletteSwitch, Modal
});