[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_272":273,"_274":275},"routes/_app.x.$handle.$name",{"_105":104,"_32":46,"_113":91,"_27":114,"_13":14,"_115":-5,"_11":116,"_117":118,"_119":120,"_121":122,"_123":124,"_20":-5,"_125":126,"_127":128,"_129":25,"_130":131,"_132":60,"_133":-5,"_134":-5,"_135":136},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_44":45,"_32":46,"_39":47,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":54,"_55":-5,"_18":56,"_57":58,"_59":60,"_61":-5,"_62":-5,"_63":64,"_65":66,"_67":68,"_69":70,"_71":72,"_73":-5,"_74":75,"_76":75,"_77":78,"_79":78,"_80":78,"_81":75,"_82":75,"_83":84,"_85":86,"_87":88,"_89":25},"version",5,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":33,"_34":35,"_36":38,"_39":40,"_41":14,"_42":43,"_24":25},"previous",{"_30":31,"_32":33,"_34":35,"_36":37},"deleted",false,"deletedHere","path","frontend/components/App.tsx","latestPath","fileId","019fa93f-136f-70f6-aad9-d5fddc17eb27","name","App.tsx","fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Counter } from \"./Counter.tsx\";\n\nexport function App() {\n return (\n

React + Hono Starter

\n \n

\n View source\n

\n );\n}\n","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport { ChatPanel } from \"./ChatPanel.tsx\";\nimport { CodePanel } from \"./CodePanel.tsx\";\nimport { PreviewPanel } from \"./PreviewPanel.tsx\";\n\nexport interface Summary {\n completionTokens: number;\n promptTokens: number;\n ttftMs: number;\n totalMs: number;\n tokensPerSecond: number;\n roundTripMs: number;\n}\n\nexport interface GenerationRun {\n kind: \"run\";\n id: string;\n summary?: Summary;\n error?: string;\n}\n\nexport type FeedItem =\n | { kind: \"user\"; text: string }\n | GenerationRun;\n\nexport function App() {\n const [feed, setFeed] = useState([]);\n // Follow-ups extend the running spec and regenerate the full page — at\n // ~460 tok/s a full regeneration is fast enough to feel like an edit.\n const [instructions, setInstructions] = useState([]);\n const [code, setCode] = useState(\"\");\n const [html, setHtml] = useState(\"\");\n const [loading, setLoading] = useState(false);\n\n async function send(instruction: string) {\n if (loading) return;\n const next = [...instructions, instruction];\n const runId = crypto.randomUUID();\n\n setLoading(true);\n setInstructions(next);\n setCode(\"\");\n setFeed((prev) => [\n ...prev,\n { kind: \"user\", text: instruction },\n { kind: \"run\", id: runId },\n ]);\n\n const updateRun = (update: (run: GenerationRun) => GenerationRun) => {\n setFeed((prev) => prev.map((item) => item.kind === \"run\" && item.id === runId ? update(item) : item));\n };\n const startedAt = performance.now();\n\n try {\n const res = await fetch(\"/api/generate\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ instructions: next }),\n });\n\n if (!res.ok || !res.body) {\n const err = await res.json().catch(() => ({}));\n throw new Error(err?.error ?? `Request failed (${res.status})`);\n }\n\n const reader = res.body.getReader();\n const decoder = new TextDecoder();\n let buffer = \"\";\n\n while (true) {\n const { done, value } = await reader.read();\n if (done) break;\n buffer += decoder.decode(value, { stream: true });\n\n const frames = buffer.split(\"\\n\\n\");\n buffer = frames.pop() ?? \"\";\n\n for (const frame of frames) {\n const line = frame.split(\"\\n\").find((l) => l.startsWith(\"data:\"));\n if (!line) continue;\n const event = JSON.parse(line.slice(5).trim());\n\n switch (event.type) {\n case \"delta\":\n setCode(event.html);\n setHtml(event.html);\n break;\n\n case \"done\": {\n const roundTripMs = performance.now() - startedAt;\n setHtml(event.html);\n setCode(event.html);\n updateRun((run) => ({ ...run, summary: { ...event.stats, roundTripMs } }));\n break;\n }\n\n case \"error\":\n throw new Error(event.message);\n }\n }\n }\n } catch (err) {\n const message = err instanceof Error ? err.message : String(err);\n updateRun((run) => ({ ...run, error: message }));\n setInstructions(instructions);\n } finally {\n setLoading(false);\n }\n }\n\n function reset() {\n setFeed([]);\n setInstructions([]);\n setCode(\"\");\n setHtml(\"\");\n }\n\n return (\n

\n \n \n \n

\n );\n}\n","createdAt",["D",1785251016664],"branchVersion","branchId","c959d9d7-5194-4cc5-9bf9-0691febd5692","id","a1964936-8c95-4607-b31e-33e25b934072","modal-kimi-k3-coder",["D",1785250910951],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Kimi K3 on Modal codes a web page live","imageUrl","a0bf3b31-15a5-4d5c-880e-4b1e22c9bc18","pinnedFileId","019fa93f-136f-70f6-aad9-f54e55868055","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","e81e7335-6d4c-4764-a902-d0962bbfa9f7","tursoName","a19649368c954607b31e33e25b934072","tursoHostname","a19649368c954607b31e33e25b934072-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789473745358],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_105":104,"_112":108},"org",{"_105":104,"_106":-5,"_107":108,"_18":56,"_109":110,"_111":25},"branch",{"_13":90,"_32":91,"_44":43,"_92":45,"_93":94,"_95":96,"_97":51,"_98":99,"_100":101,"_102":46,"_103":104},"isOwned",25,"main","projectId","forkedBranchId","961078ea-f528-11ef-aa68-569c3dd06744","forkedBranchVersion",89,"forkedProjectPrivacy","forkedProjectId","96102714-f528-11ef-aa68-569c3dd06744","forkedProjectOrgId","019aa807-52c2-709c-928b-2029bae9a558","projectName","userHandle","stevekrouse","handle","displayName","avatar","https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_44":45,"_32":46,"_39":267,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":54,"_55":-5,"_18":56,"_57":58,"_59":60,"_61":-5,"_62":-5,"_63":64,"_65":66,"_67":68,"_69":70,"_71":268,"_73":-5,"_74":75,"_76":75,"_77":78,"_79":78,"_80":78,"_81":75,"_82":75,"_83":269,"_85":270,"_87":271,"_89":25},"tree",[205,212,213,214],"files",[205,206,207,208,209,210,211,212,213,214],"counts",{"_195":64,"_196":178,"_197":64,"_198":199,"_200":201},"contents",[160,161,162,163],"upstreamProject",{"_44":99,"_32":155,"_53":156,"_55":157,"_50":51,"_83":158},"upstreamBranch",{"_44":94,"_39":148,"_149":150,"_32":91,"_92":99,"_13":151,"_93":-5,"_95":-5,"_152":153,"_48":-5,"_89":25,"_50":51,"_103":154,"_65":101,"_102":155},"emptyEnvVars","flags",[137,138,139,140,141],"hasHttpFiles","grants","orgs","customDomains",{},{"_44":147,"_143":-5},{"_44":146,"_143":-5},{"_44":145,"_143":-5},{"_44":144,"_143":-5},{"_44":142,"_143":-5},"ece55307-3729-4e2c-a5bd-1c35bbba70d1","reporterId","22dace37-0e81-41e9-8366-5cdea290f262","fb18ea75-4ef9-47cd-a6ac-3bd436c3de05","1fb7e848-cf5a-4612-a68c-8ca0365a6345","fae996cd-6c68-4f36-923f-ec5f97e6ac90",["D",1740674013689],"updatedAt",["D",1785420707976],91,"lockfileKey","1785420708123-esm.town_v_templates_react-hono-starter@91-main","templates","react-hono-starter","Starter template with client-side React & Hono server","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/64dc00cc-94d9-47dd-81b1-dde02610d900/square512?exp=1789549199&sig=78a5bc27f03474c98a49b09a954e18cc6dd63f22ba19ce3e096717a88d3522b5",{"_105":154,"_112":159},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789549199&sig=85ec03bbe2ae9af315fa5e89fceebe840b59020b3ec43df39e2ab37ef0d215ad",{"_44":189,"_32":190,"_30":191,"_167":-5,"_42":43,"_41":178,"_169":60,"_39":192,"_13":64,"_34":193,"_36":-5,"_24":25,"_172":-5,"_27":194},{"_44":183,"_32":184,"_30":185,"_167":-5,"_42":43,"_41":178,"_169":25,"_39":186,"_13":64,"_34":20,"_36":187,"_24":25,"_172":-5,"_27":188},{"_44":174,"_32":175,"_30":58,"_167":-5,"_42":43,"_41":176,"_169":60,"_39":177,"_13":178,"_34":179,"_36":180,"_24":25,"_172":181,"_27":182},{"_44":164,"_32":165,"_30":166,"_167":-5,"_42":43,"_41":168,"_169":25,"_39":170,"_13":64,"_34":35,"_36":171,"_24":25,"_172":-5,"_27":173},"d4171c1b-18ba-4c52-baf6-f3723c781e24","kimi.ts","6d6fb6b8-8a95-11f1-89d4-1607ee4eb77e","parentId",2,"latest",["D",1785250981469],"const ENDPOINT = \"https://steve-88677--ep-kimi-k3-server.us-west.modal.direct/v1/chat/completions\";\nconst MODEL = \"moonshotai/Kimi-K3\";\nconst MAX_TOKENS = 8192;\n\nconst SYSTEM = `You write one complete, self-contained HTML document.\n- Output raw HTML only: no prose, no code fences, no explanation.\n- Start with and end with , then stop.\n- Include all CSS in a \n \n \n

\n \n \n \n\n",[],[190,233],"910f0a0e-b645-4d80-b308-085040db3c44","favicon.svg","019fa93f-136f-70f6-aad9-e308c7851d9f",["D",1785250910951],"\n",[],[190,241],"1d786f9a-0872-4dc1-b0f3-7ca902487645","Counter.tsx","019fa93f-136f-70f6-aad9-d85f08be8ca2","019fa93f-136f-70f6-aad9-de5da1ff8d67",["D",1785250910951],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function Counter() {\n const [count, setCount] = useState(0);\n return (\n

\n Clicked\n setCount((c) => c + 1)}\n class=\"bg-blue-500 hover:bg-blue-600 text-white font-medium px-4 py-2 rounded-lg transition-colors cursor-pointer\"\n >\n {count}\n \n times\n

\n );\n}\n",[],[190,255,248],"components","7eabdf4f-033b-4975-959a-73e2bfd167f3",["D",1785251016664],[],[190,255,33],"ea04c433-279c-4056-82a9-f46ce70e54f0",["D",1785250910951],[207,208],[190,255],["D",1785250910951],[206,209,210,211],[190],["D",1785250910951],["D",1789473745358],{"_105":104,"_112":108},{"_105":104,"_106":-5,"_107":108,"_18":56,"_109":110,"_111":25},{"_13":90,"_32":91,"_44":43,"_92":45,"_93":94,"_95":96,"_97":51,"_98":99,"_100":101,"_102":46,"_103":104},"ctx",{"_83":-5,"_134":305,"_306":307,"_308":309,"_310":25,"_311":25,"_312":25,"_313":60,"_314":-5,"_315":-7,"_316":-7,"_317":64,"_318":25,"_319":25,"_320":-5,"_321":25,"_322":25,"_323":25,"_324":-5},"ENV",{"_276":277,"_278":279,"_280":91,"_281":282,"_283":284,"_285":286,"_287":288,"_289":290,"_291":292,"_293":294,"_295":296,"_297":298,"_299":300,"_301":302,"_303":304},"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"]

Diff · v5