// v2-character.jsx — BigAndaa: expressive, character-led illustration
// Soft-geometric, brand colors (purple body, white face, sun/coral/sage props).
// expressions: 'happy' | 'wave' | 'wink' | 'caring' | 'sleepy' | 'think'
// holding: null | 'check' | 'list' | 'heart' | 'bell'
function BigAndaa({ size = 360, expression = 'happy', holding = 'check', style, className }) {
const W = 360, H = 380;
const s = size / W;
const Eyes = () => {
if (expression === 'wink') {
return (
<>
);
}
if (expression === 'sleepy') {
return (
<>
);
}
if (expression === 'caring') {
return (
<>
{/* soft cheeks */}
);
}
// happy / wave / think default
return (
<>
{/* sparkle in eye */}
);
};
const Mouth = () => {
if (expression === 'sleepy') return ;
if (expression === 'think') return ;
if (expression === 'caring') return ;
// wide happy smile
return ;
};
return (
);
}
// Small peeking head — for margins / corners
function AndaaPeek({ size = 80, expression = 'happy', style }) {
return (
);
}
// inject character keyframes once
if (typeof document !== 'undefined' && !document.getElementById('v2-char-kf')) {
const st = document.createElement('style');
st.id = 'v2-char-kf';
st.textContent = `
@keyframes v2-wave { 0%,100%{transform:rotate(0)} 25%{transform:rotate(-14deg)} 60%{transform:rotate(8deg)} }
@keyframes v2-twinkle { 0%,100%{transform:scale(1) rotate(0); opacity:1} 50%{transform:scale(1.25) rotate(20deg); opacity:0.8} }
@media (prefers-reduced-motion: reduce){ [style*="v2-wave"],[style*="v2-twinkle"]{animation:none !important} }
`;
document.head.appendChild(st);
}
Object.assign(window, { BigAndaa, AndaaPeek });