// Splat — a little green blob. Shape is consistent across expressions; only eyes + mouth change.
// He's the "sticker with outline" variant from the question.
const SplatBody = ({ fill = "#5FBF5F", outline = "#0F1F2C", shadow = "#2F8C3A" }) => (
{/* undershadow inside the blob to give him volume */}
{/* highlight */}
{/* little antenna */}
);
const SplatEyes = ({ expression = "happy" }) => {
// shared eye socket
const sockets = (
<>
);
switch (expression) {
case "wink":
return (
<>
);
case "sleepy":
return (
<>
);
case "surprised":
return (
<>
{sockets}
);
case "thinking":
return (
<>
{sockets}
);
case "reading":
return (
<>
{/* little glasses */}
);
case "happy":
default:
return (
<>
{sockets}
);
}
};
const SplatMouth = ({ expression = "happy" }) => {
switch (expression) {
case "wink":
case "happy":
return ;
case "surprised":
return ;
case "thinking":
return ;
case "sleepy":
return ;
case "reading":
return ;
default:
return ;
}
};
const SplatCheeks = () => (
<>
);
const Splat = ({ size = 120, expression = "happy", fill = "#5FBF5F", cheeks = true, className = "", style = {} }) => (
);
// Tiny splat for inline use
const SplatBadge = ({ size = 28, expression = "happy" }) => (
);
Object.assign(window, { Splat, SplatBadge });