[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_152":153,"_154":155},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_18":19,"_17":-7,"_115":-5,"_20":116,"_22":117,"_118":119,"_120":121,"_25":122,"_24":-5,"_123":-5,"_124":-5,"_125":53,"_126":127,"_128":44,"_129":-5,"_130":-5,"_131":132},"routes/_app.x.$handle.$name.branch.$branch.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":-7,"_25":26,"_27":-5,"_28":-5,"_29":-5,"_30":-5,"_31":-5},"handle","Moosebarbs","name","untitled-145","branchName","main","version","path","","project",{"_33":61,"_13":14,"_45":62,"_63":-5,"_64":53,"_65":66,"_67":66,"_68":-5,"_69":-5,"_70":71,"_72":-5,"_73":53,"_74":-5,"_75":-5,"_76":77,"_78":79,"_80":-5,"_81":-5,"_82":-5,"_83":-5,"_84":85,"_86":85,"_87":88,"_89":88,"_90":88,"_91":85,"_92":85,"_93":94,"_95":96,"_97":98,"_99":53},"tree",[56],"file","contents",[32],"upstream","pull","ahead","behind","envVars",{"_33":34,"_13":35,"_36":37,"_38":-5,"_39":40,"_41":42,"_43":44,"_45":46,"_17":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_18":55},"id","c5fb47f0-083d-11f1-9166-42dde27851f2","main.ts","fileId","da419d50-07dd-11f1-a3df-42dde27851f2","parentId","branchId","da3eb266-07dd-11f1-a3df-42dde27851f2","branchVersion",25,"latest",true,"createdAt",["D",1770919683265],24,"fileType","http","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\nconst NO_PHRASES = [\n \"No 💔\",\n \"Pretty please? 🥺\",\n \"But we'd be so cute together! 💕\",\n \"One more chance, pookie?\",\n \"Don't break my heart :(\",\n \"What about a maybe?\",\n \"Please don't do this to me, I'm fragile\",\n];\n\nfunction App() {\n const [page, setPage] = useState<\"intro\" | \"letter\" | \"valentine\">(\"intro\");\n const [typedTitle, setTypedTitle] = useState(\"\");\n const [typedParagraph, setTypedParagraph] = useState(\"\");\n const [noClicks, setNoClicks] = useState(0);\n const [isValentine, setIsValentine] = useState(false);\n\n const fullTitle = \"Hi💕\";\n const fullParagraph =\n \"This is probably way overdue and I should probably get a scolding but I'm hoping you won't because I am your baby boy 😁💕\";\n\n // Typing effect (intro only)\n useEffect(() => {\n if (page !== \"intro\") return;\n\n let titleIndex = 0;\n let paragraphIndex = 0;\n\n const titleInterval = setInterval(() => {\n setTypedTitle(fullTitle.slice(0, titleIndex + 1));\n titleIndex++;\n\n if (titleIndex === fullTitle.length) {\n clearInterval(titleInterval);\n\n const paragraphInterval = setInterval(() => {\n setTypedParagraph(fullParagraph.slice(0, paragraphIndex + 1));\n paragraphIndex++;\n\n if (paragraphIndex === fullParagraph.length) {\n clearInterval(paragraphInterval);\n }\n }, 35);\n }\n }, 120);\n\n return () => clearInterval(titleInterval);\n }, [page]);\n\n const backgroundStyle: React.CSSProperties = {\n minHeight: \"100vh\",\n width: \"100%\",\n backgroundImage:\n \"url('https://i.pinimg.com/1200x/f2/39/9c/f2399c85f83f1b6a221d389c2c4c27bf.jpg')\",\n backgroundSize: \"cover\",\n backgroundPosition: \"center\",\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n padding: \"40px 20px\",\n fontFamily: \"'Aquarelle', cursive\",\n };\n\n const buttonStyle: React.CSSProperties = {\n marginTop: \"40px\",\n padding: \"12px 28px\",\n fontSize: \"20px\",\n backgroundColor: \"#ff66b2\",\n color: \"white\",\n border: \"none\",\n borderRadius: \"30px\",\n cursor: \"pointer\",\n fontFamily: \"'Aquarelle', cursive\",\n };\n\n // ---------------- INTRO PAGE ----------------\n if (page === \"intro\") {\n return (\n

\n {typedTitle}\n

\n\n \n {typedParagraph}\n

\n\n \n

\n );\n }\n\n // ---------------- LETTER PAGE ----------------\n // ---------------- LETTER PAGE ----------------\nif (page === \"letter\") {\n return (\n \n \n

\n To:\n

\n\n

Hi baby,

\n\n

\n So I’m seated trying to write a love letter to my girl but rather than words flowing in my head, its flashing images of you smiling. A little corny but its true. I can’t explain enough how I am head over heels for your. From the first day I ever saw you, I just couldn’t help feel pulled to you mama. I still remember the day I believe I fell inlove but I probably did not know it at the time, I remember looking at you walking from a far and swear time slowed down and everything else around me went silent. All my focus was just on this beautiful girl in a red overall dress and a black Tee.. \nMy world stopped, nothing in that moment even mattered apart from you, I got butterflies. I understand how that feels now. I got so nervous talking to you. As nonchalant as I probably was, I was itching to run away. \n\n

\n\n

\n You’ve become more than just the girl I fell for in a red overall dress. You’re my safe place. You’re the person I want to tell everything to the good news first, the bad days too. When something happens, my first thought is always, “I can’t wait to tell her.” That’s when I knew this wasn’t just a crush or a phase. That’s when I knew you meant something deeper to me.\nAnd yeah, we’ve had our ups and downs. We’ve had moments that tested us. But even in those moments, I never once questioned wanting you. I’d rather work through the hard days with you than have easy days without you. Loving you isn’t always perfect, but it’s real. And I’ll choose real every time.\n\n

\n\n

\n You’ve taught me things about myself without even trying. You’ve shown me patience, vulnerability, and how it feels to care about someone in a way that’s steady and certain. Being with you makes me want to be better not because you ask me to, but because you inspire me to.\nSometimes I sit back and think about how lucky I am that out of everyone in this world, I get to love you. I get to call you mine. And I don’t ever want to take that for granted. I want to keep creating memories with you, keep laughing with you, keep growing with you. I want to look back one day and say we chose each other over and over again.\n\n

\n\n

\n You’re my Clover for a reason rare, lucky, and something I never want to lose.\nI love you more than I probably know how to put into words. But I promise I’ll spend forever trying to show you.\n\n

\n\n

\n setPage(\"valentine\")}\n style={{\n marginTop: \"40px\",\n padding: \"12px 28px\",\n fontSize: \"18px\",\n backgroundColor: \"#ff66b2\",\n color: \"white\",\n border: \"none\",\n borderRadius: \"30px\",\n cursor: \"pointer\",\n fontFamily: \"'Aquarelle'\",\n }}\n >\n Continue 💘\n \n

\n \n \n );\n}\n // ---------------- VALENTINE PAGE ----------------\n const yesButtonSize = noClicks * 20 + 18;\n\n return (\n

\n {!isValentine ? (\n <>\n

\n Will you be my Valentine? 💘\n

\n\n

\n setIsValentine(true)}\n style={{\n ...buttonStyle,\n backgroundColor: \"green\",\n fontSize: `${yesButtonSize}px`,\n }}\n >\n Yes 💖\n \n\n setNoClicks((prev) => prev + 1)}\n style={{\n ...buttonStyle,\n backgroundColor: \"red\",\n fontSize: \"18px\",\n }}\n >\n {noClicks === 0\n ? \"No\"\n : NO_PHRASES[Math.min(noClicks - 1, NO_PHRASES.length - 1)]}\n \n

\n \n ) : (\n

\n Yay!!! 💖🎉\n

\n )}\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")!).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function (): Promise {\n return new Response(\n `\n \n \n For My Clover 💕\n \n \n \n \n \n

\n \n \n \n `,\n { headers: { \"content-type\": \"text/html\" } },\n );\n}","deleted",false,"label",[35],{"_33":34,"_13":35,"_36":37,"_38":-5,"_39":40,"_41":42,"_43":44,"_45":57,"_17":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_58":59,"_18":60},["D",1770919683265],"children",[],[35],"da3e488a-07dd-11f1-a3df-42dde27851f2",["D",1770878485583],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","userId","019c5087-535a-76fd-863e-a17e38a0e262","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","019c5087-535a-76fd-863e-a469ac4d43a1","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_114":110},"org",{"_11":12,"_108":-5,"_109":110,"_70":71,"_111":112,"_113":53},"branch",{"_17":42,"_13":16,"_33":40,"_100":61,"_101":-5,"_102":-5,"_103":-5,"_104":-5,"_105":-5,"_106":14,"_107":12},"isOwned","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzM5WWVobzVTVDY2OEpTY3Jyd2hhSHh4a1FCQSJ9","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_33":61,"_13":14,"_45":148,"_63":-5,"_64":53,"_65":66,"_67":66,"_68":-5,"_69":-5,"_70":71,"_72":-5,"_73":53,"_74":-5,"_75":-5,"_76":77,"_78":79,"_80":-5,"_81":-5,"_82":-5,"_83":-5,"_84":85,"_86":85,"_87":88,"_89":88,"_90":88,"_91":85,"_92":85,"_93":149,"_95":150,"_97":151,"_99":53},[145],"files",[145],"counts",{"_135":77,"_136":137,"_138":77,"_31":139,"_140":141},[133],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_33":34,"_13":35,"_36":37,"_38":-5,"_39":40,"_41":42,"_43":44,"_45":46,"_17":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_18":134},[35],"pulls","branches",1,"forks",{"_142":77,"_144":77},"connections",{"_142":77,"_143":77},"count","unfilledCount","emptyCount",{"_33":34,"_13":35,"_36":37,"_38":-5,"_39":40,"_41":42,"_43":44,"_45":57,"_17":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_58":146,"_18":147},[],[35],["D",1770878485583],{"_11":12,"_114":110},{"_11":12,"_108":-5,"_109":110,"_70":71,"_111":112,"_113":53},{"_17":42,"_13":16,"_33":40,"_100":61,"_101":-5,"_102":-5,"_103":-5,"_104":-5,"_105":-5,"_106":14,"_107":12},"ctx",{"_93":-5,"_130":185,"_186":187,"_188":189,"_190":53,"_191":53,"_192":53,"_193":44,"_194":-5,"_195":-7,"_196":-7,"_197":77,"_198":53,"_199":53,"_200":-5,"_201":53,"_202":53,"_203":53,"_204":-5},"ENV",{"_156":157,"_158":159,"_160":16,"_161":162,"_163":164,"_165":166,"_167":168,"_169":170,"_171":172,"_173":174,"_175":176,"_177":178,"_179":180,"_181":182,"_183":184},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Code