\n {Array.from({ length: 50 }).map((_, i) => (\n \n ))}\n

\n );\n}\n\n/* CANDLES */\nfunction Candles({ candlesOut, setCandlesOut }) {\n return (\n {\n e.stopPropagation();\n setCandlesOut(true);\n }}\n >\n {[1, 2, 3].map((i) => (\n

\n {!candlesOut &&

}\n

\n ))}\n

\n );\n}\n\nfunction HeartSVG({ text }) {\n return (\n \n );\n}\n\nfunction App() {\n const [open, setOpen] = useState(false);\n const [stage, setStage] = useState(\"card\"); // card | cake | cut\n const [candlesOut, setCandlesOut] = useState(false);\n const audioRef = useRef(null);\n\n const openCard = () => {\n setOpen(true);\n audioRef.current?.play();\n };\n\n return (\n

\n \n\n {open && }\n\n {/* CARD STAGE */}\n {stage === \"card\" && (\n \n {!open\n ? (\n

Tap to open ✨

\n )\n : (\n

Happy Birthday, babe 🎂

\n I really hope today brings you calm moments(like not blocking\n me), soft smiles, and little things that make your heart feel\n light.\n

\n No matter how things feel right now, you deserve a day that’s\n warm, gentle, and truly happy. 🤍 And I want you to know that\n I truly love you.\n

\n\n \n

\n )}\n

\n )}\n\n {/* CAKE STAGE */}\n {stage !== \"card\" && (\n

\n {stage === \"cake\" &&

}\n\n stage === \"cake\" && setStage(\"cut\")}\n >\n {/* We render two halves that slide apart */}\n

\n \n

\n\n \n

\n\n

\n {stage === \"cake\" && (\n

\n Happy birthday princess tap the cake to cut ✂️\n

\n )}\n\n {stage === \"cut\" && !candlesOut && (\n

Tap the candles to blow them out 🕯️

\n )}\n\n {candlesOut && (\n

✨ Make a wish, gorgeous ✨

\n )}\n

\n )}\n\n \n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") client();\n\nexport default async function server() {\n return new Response(\n `\n \n \n Happy Birthday 🎂\n \n \n \n

\n \n \n \n `,\n { headers: { \"content-type\": \"text/html\" } },\n );\n}","deleted","label","happy19thbirthdayprincess",[100],"permalink","https://www.val.town/x/AK12/Birthday/code/main.tsx","extension","actionData","errors"]