[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_26":27,"_28":29,"_30":12,"_31":12,"_32":12,"_33":12,"_34":12,"_35":12,"_36":12,"_37":-5,"_38":39},"routes/canvas.shared.$sharedTextdocId",{"_9":10,"_11":12},"sharedTextdoc",{"_13":14,"_15":-7,"_16":17,"_18":19,"_20":21,"_22":23,"_24":12,"_25":12},"isAuthenticated",false,"sharedTextdocId","6a189701f68481918fb9dc75c5fa912d","versionInt","title","Udrinkimake Drink Generator App","type","code/react","content","import React, { useMemo, useState } from \"react\";\nimport { motion } from \"framer-motion\";\nimport { Sparkles, Martini, Wand2, RefreshCcw, Copy, Check } from \"lucide-react\";\nimport { Card, CardContent } from \"@/components/ui/card\";\nimport { Button } from \"@/components/ui/button\";\n\nconst flavorMap = {\n Fruity: [\"pineapple\", \"strawberry\", \"mango\", \"peach\", \"passion fruit\"],\n Citrus: [\"lemon\", \"lime\", \"orange\", \"grapefruit\", \"blood orange\"],\n Sweet: [\"vanilla\", \"caramel\", \"honey\", \"coconut\", \"brown sugar\"],\n Spicy: [\"jalapeño\", \"ginger\", \"cinnamon\", \"chili salt\", \"spiced syrup\"],\n Herbal: [\"mint\", \"basil\", \"rosemary\", \"lavender\", \"cucumber\"],\n Creamy: [\"coconut cream\", \"vanilla cream\", \"banana\", \"white chocolate\", \"sweet cream\"],\n};\n\nconst spirits = [\"Vodka\", \"Tequila\", \"Rum\", \"Gin\", \"Whiskey\", \"Champagne\", \"Mocktail\"];\nconst vibes = [\"Glamorous\", \"Refreshing\", \"Bold\", \"Romantic\", \"Tropical\", \"Luxury\", \"Fun & Colorful\"];\nconst strengths = [\"Light\", \"Medium\", \"Strong\", \"Alcohol-Free\"];\nconst sweetness = [\"Not Sweet\", \"Balanced\", \"Sweet\", \"Dessert Sweet\"];\nconst garnishes = [\"Edible Glitter\", \"Fresh Fruit\", \"Citrus Wheel\", \"Mint Bouquet\", \"Sugar Rim\", \"Smoke Bubble\", \"Flower Garnish\"];\n\nfunction pick(list, seed) {\n return list[Math.abs(seed) % list.length];\n}\n\nfunction hashInput(input) {\n return input.split(\"\").reduce((acc, char) => acc + char.charCodeAt(0), 0);\n}\n\nfunction generateDrink({ flavor, spirit, vibe, strength, sweet, garnish, notes }) {\n const seed = hashInput(`${flavor}${spirit}${vibe}${strength}${sweet}${garnish}${notes}`);\n const flavors = flavorMap[flavor] || flavorMap.Fruity;\n const mainFlavor = pick(flavors, seed);\n const accentFlavor = pick(flavors.filter((f) => f !== mainFlavor), seed + 2) || \"lime\";\n\n const base = spirit === \"Mocktail\" || strength === \"Alcohol-Free\" ? \"premium zero-proof base\" : spirit.toLowerCase();\n const sparkle = garnish === \"Edible Glitter\" ? \"with a shimmer finish\" : garnish === \"Smoke Bubble\" ? \"finished with a dramatic smoke bubble\" : `garnished with ${garnish.toLowerCase()}`;\n\n const names = [\n `${vibe} ${mainFlavor} Kiss`,\n `The Udrinkimake ${mainFlavor} Glow`,\n `${mainFlavor} Star Power`,\n `Lights Camera ${accentFlavor}`,\n `${mainFlavor} Afterglow`,\n ];\n\n const glass = strength === \"Strong\" ? \"rocks glass\" : vibe === \"Luxury\" || vibe === \"Glamorous\" ? \"coupe glass\" : \"tall Collins glass\";\n\n return {\n name: pick(names, seed + 5),\n description: `A ${sweet.toLowerCase()}, ${vibe.toLowerCase()} ${flavor.toLowerCase()} drink built with ${base}, ${mainFlavor}, ${accentFlavor}, and a Udrinkimake presentation ${sparkle}.`,\n recipe: [\n spirit === \"Mocktail\" || strength === \"Alcohol-Free\" ? \"2 oz zero-proof spirit or sparkling juice\" : `2 oz ${spirit}`,\n `1 oz ${mainFlavor} puree or syrup`,\n `0.75 oz fresh ${accentFlavor.includes(\"lime\") || accentFlavor.includes(\"lemon\") ? accentFlavor : \"lime\"} juice`,\n sweet === \"Not Sweet\" ? \"0.25 oz simple syrup\" : sweet === \"Dessert Sweet\" ? \"1 oz sweet cream or vanilla syrup\" : \"0.5 oz simple syrup\",\n strength === \"Light\" ? \"Top with sparkling water\" : strength === \"Strong\" ? \"Optional float or bold bitters\" : \"Shake with ice\",\n ],\n instructions: `Shake ingredients with ice, strain into a ${glass}, then finish with ${garnish.toLowerCase()}. Serve with camera-ready Udrinkimake energy.`,\n };\n}\n\nexport default function UdrinkimakeDrinkGenerator() {\n const [form, setForm] = useState({\n flavor: \"Fruity\",\n spirit: \"Tequila\",\n vibe: \"Glamorous\",\n strength: \"Medium\",\n sweet: \"Balanced\",\n garnish: \"Edible Glitter\",\n notes: \"\",\n });\n const [copied, setCopied] = useState(false);\n const drink = useMemo(() => generateDrink(form), [form]);\n\n const update = (key, value) => setForm((prev) => ({ ...prev, [key]: value }));\n\n const copyDrink = async () => {\n const text = `${drink.name}\\n\\n${drink.description}\\n\\nRecipe:\\n${drink.recipe.map((r) => `• ${r}`).join(\"\\n\")}\\n\\nInstructions:\\n${drink.instructions}`;\n await navigator.clipboard.writeText(text);\n setCopied(true);\n setTimeout(() => setCopied(false), 1500);\n };\n\n const randomize = () => {\n setForm({\n flavor: pick(Object.keys(flavorMap), Math.floor(Math.random() * 1000)),\n spirit: pick(spirits, Math.floor(Math.random() * 1000)),\n vibe: pick(vibes, Math.floor(Math.random() * 1000)),\n strength: pick(strengths, Math.floor(Math.random() * 1000)),\n sweet: pick(sweetness, Math.floor(Math.random() * 1000)),\n garnish: pick(garnishes, Math.floor(Math.random() * 1000)),\n notes: form.notes,\n });\n };\n\n return (\n

\n \n

\n Udrinkimake Signature Drink Generator\n

\n Find Their Perfect Drink\n

\n Let customers choose their flavor, vibe, strength, and presentation — then generate a custom beverage your team can make on the spot.\n

\n \n\n

\n \n \n

\n \n

Customer Preferences

Choose what sounds best to them.

\n\n

\n update(\"spirit\", v)} />\n update(\"strength\", v)} />\n update(\"garnish\", v)} />\n

\n\n \n Special Notes\n update(\"notes\", e.target.value)}\n placeholder=\"Example: no coconut, birthday drink, make it pink, low sugar...\"\n className=\"mt-2 w-full h-24 rounded-2xl bg-white/95 text-slate-950 p-4 outline-none focus:ring-4 focus:ring-cyan-300/40\"\n />\n \n\n

\n \n \n

\n \n \n\n \n \n

\n Perfect Match Generated\n

{drink.name}

{drink.description}

\n\n \n

Recipe

\n \n {item}\n

\n\n

Bartender Notes

{drink.instructions}

\n {form.notes &&

Customer note: {form.notes}

}\n

\n\n

Beverages curated & serviced by Udrinkimake.

Where signature beverages, social media, and mobility collide.

\n \n \n \n

\n );\n}\n\nfunction Select({ label, value, options, onChange }) {\n return (\n \n {label}\n onChange(e.target.value)}\n className=\"mt-2 w-full rounded-2xl bg-white/95 text-slate-950 p-3 outline-none focus:ring-4 focus:ring-cyan-300/40\"\n >\n {options.map((option) => (\n \n ))}\n \n \n );\n}\n","access","public","isModerationBlocked","isAnonifyApiKeyDetected","dd",{"_40":41,"_42":43},"disablePrefetch",true,"shouldPrefetchAccount","shouldPrefetchUser","shouldPrefetchSystemHints","manageRootRouteStylesheet","promoteCss","disableSSR","stripModulepreloadImports","paidCampaignAppRedirect","statsigGateEvaluationsPromise",["P",39],"traceId","8751332885667240008","traceTime",1786432856204]