[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_298":299,"_300":301},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":-7,"_18":19,"_17":-7,"_225":-5,"_20":226,"_22":227,"_228":229,"_230":231,"_26":232,"_24":233,"_234":-5,"_235":-5,"_236":53,"_237":238,"_239":45,"_240":-5,"_241":-5,"_242":243},"routes/_app.x.$handle.$name.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":25,"_26":27,"_28":-5,"_29":-5,"_30":-5,"_31":-5,"_32":-5},"handle","vibench","name","notes-anthropic-claude-fable-5-9b3c144b","branchName","main","version","path","frontend/index.html","project",{"_33":168,"_13":14,"_46":169,"_170":-5,"_171":53,"_172":173,"_174":173,"_175":176,"_177":-5,"_178":179,"_180":-5,"_181":53,"_182":-5,"_183":-5,"_184":74,"_185":186,"_187":188,"_189":190,"_191":192,"_193":-5,"_194":195,"_196":195,"_197":198,"_199":198,"_200":198,"_201":195,"_202":195,"_203":204,"_205":206,"_207":208,"_209":53},"tree",[57,58,59],"file",{"_33":34,"_13":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":45,"_46":47,"_17":48,"_49":24,"_50":51,"_52":53,"_54":-5,"_18":55},"contents",[],"upstream","pull","ahead","behind","envVars","id","7cb36aa6-4742-46d7-9fc1-928a7a46b980","index.html","fileId","d88d8830-7a3c-11f1-8d40-1607ee4eb77e","parentId","e9650d5f-a24b-42b2-baa0-e7ecb6ab0856","branchId","f6ccd7fb-7aa4-488c-9e71-3503a4456205","branchVersion",16,"latest",true,"createdAt",["D",1783453893483],1,"fileType","content","\n\n \n \n \n Notes\n \n \n \n \n

\n \n \n \n","deleted",false,"label",[56,35],"frontend",{"_33":78,"_13":56,"_36":39,"_38":-5,"_40":41,"_42":79,"_44":45,"_46":80,"_17":74,"_49":81,"_50":-5,"_52":53,"_54":-5,"_67":82,"_18":83},{"_33":70,"_13":71,"_36":72,"_38":-5,"_40":41,"_42":48,"_44":45,"_46":73,"_17":74,"_49":24,"_50":75,"_52":53,"_54":-5,"_67":76,"_18":77},{"_33":60,"_13":61,"_36":62,"_38":-5,"_40":41,"_42":63,"_44":45,"_46":64,"_17":48,"_49":65,"_50":66,"_52":53,"_54":-5,"_67":68,"_18":69},"bb19ae33-8fbc-47bd-b750-866e0dc5a951","index.ts","d86b187c-7a3c-11f1-98ef-1607ee4eb77e",8,["D",1783453798043],"http","import { parseVal, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\nimport { Hono } from \"npm:hono\";\n\nconst PASSWORD = \"my-notes-are-mine\";\n\nawait sqlite.execute(`CREATE TABLE IF NOT EXISTS notes (\n id TEXT PRIMARY KEY,\n body TEXT NOT NULL DEFAULT '',\n updated_at INTEGER NOT NULL\n)`);\n\nconst app = new Hono();\n\n// Serve the SPA shell\napp.get(\"/\", () => serveFile(\"/frontend/index.html\"));\napp.get(\"/note/*\", () => serveFile(\"/frontend/index.html\"));\n\n// Serve all /frontend files\napp.get(\"/frontend/**/*\", (c) => serveFile(c.req.path));\n\n// View source redirect\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// ---- Auth ----\napp.post(\"/api/unlock\", async (c) => {\n const body = await c.req.json().catch(() => ({} as any));\n const password = body?.password;\n if (typeof password !== \"string\" || password.length === 0) {\n return c.json({ error: \"Password is required\" }, 400);\n }\n if (password !== PASSWORD) {\n return c.json({ error: \"Incorrect password\" }, 401);\n }\n return c.json({ ok: true });\n});\n\nconst requireAuth = async (c: any, next: any) => {\n const auth = c.req.header(\"authorization\") || \"\";\n if (auth !== `Bearer ${PASSWORD}`) {\n return c.json({ error: \"Unauthorized\" }, 401);\n }\n await next();\n};\napp.use(\"/api/notes\", requireAuth);\napp.use(\"/api/notes/*\", requireAuth);\n\n// ---- Notes CRUD ----\napp.get(\"/api/notes\", async (c) => {\n const result = await sqlite.execute(\n \"SELECT id, body, updated_at FROM notes ORDER BY updated_at DESC\",\n );\n return c.json({ notes: result.rows });\n});\n\napp.post(\"/api/notes\", async (c) => {\n const id = crypto.randomUUID();\n const now = Date.now();\n await sqlite.execute({\n sql: \"INSERT INTO notes (id, body, updated_at) VALUES (?, ?, ?)\",\n args: [id, \"\", now],\n });\n return c.json({ note: { id, body: \"\", updated_at: now } }, 201);\n});\n\napp.get(\"/api/notes/:id\", async (c) => {\n const id = c.req.param(\"id\");\n const result = await sqlite.execute({\n sql: \"SELECT id, body, updated_at FROM notes WHERE id = ?\",\n args: [id],\n });\n if (result.rows.length === 0) return c.json({ error: \"Not found\" }, 404);\n return c.json({ note: result.rows[0] });\n});\n\napp.put(\"/api/notes/:id\", async (c) => {\n const id = c.req.param(\"id\");\n const body = await c.req.json().catch(() => ({} as any));\n const text = typeof body?.body === \"string\" ? body.body : \"\";\n const now = Date.now();\n const result = await sqlite.execute({\n sql: \"UPDATE notes SET body = ?, updated_at = ? WHERE id = ?\",\n args: [text, now, id],\n });\n if (result.rowsAffected === 0) return c.json({ error: \"Not found\" }, 404);\n return c.json({ note: { id, body: text, updated_at: now } });\n});\n\napp.delete(\"/api/notes/:id\", async (c) => {\n const id = c.req.param(\"id\");\n await sqlite.execute({\n sql: \"DELETE FROM notes WHERE id = ?\",\n args: [id],\n });\n return c.json({ ok: true });\n});\n\n// Unwrap and rethrow Hono errors as the original error\napp.onError((err) => Promise.reject(err));\n\nexport default app.fetch;\n","children",[],[61],"573e3495-1969-428a-8e57-84feaed51878","README.md","d82ec606-7a3c-11f1-b8b5-1607ee4eb77e",["D",1783453716842],0,"# React + Hono Starter\n\nA minimal starter template for building client-side React apps with a Hono\nbackend on Val Town. Click **Remix** to get your own copy.\n\n## Picking a starter\n\n| Starter | When to pick it |\n| --- | --- |\n| [`basic-html-starter`](https://www.val.town/x/templates/basic-html-starter) | Static HTML pages. Sprinkle of vanilla JS. No server-side rendering. |\n| [`hono-jsx-starter`](https://www.val.town/x/templates/hono-jsx-starter) | Dynamic server-rendered HTML with JSX. API routes. No React, no SPA. |\n| **[`react-hono-starter`](https://www.val.town/x/templates/react-hono-starter)** *(you're here)* | Client-side React SPA with a Hono API backend. |\n\n**Want to build UI?** Start writing React components in\n[`frontend/components/`](/frontend/components/). Import them into `App.tsx` and\nyou're good to go. Styling is [Twind](https://twind.style/) — just use Tailwind\nutility classes, zero config.\n\n**Want to add an API?** Add routes in [`index.ts`](/index.ts) (there's a\ncommented-out example). Fetch them from your React components.\n\n## Architecture\n\n```mermaid\ngraph LR\n Browser -->|\"GET /\"| Hono[\"index.ts
(Hono server)\"]\n Hono -->|serves| HTML[\"index.html\"]\n HTML -->|loads| Entry[\"index.tsx\"]\n Entry -->|renders| App[\"App.tsx\"]\n App -->|renders| Counter[\"Counter.tsx\"]\n```\n\n## File structure\n\n```\nindex.ts ← Hono backend (serves frontend + API routes)\nfrontend/\n index.html ← HTML shell (loads Twind + React)\n index.tsx ← React entrypoint (mounts )\n favicon.svg ← App icon\n components/\n App.tsx ← Root component (layout + view source link)\n Counter.tsx ← Example component with state\n```\n\n## How it works\n\n1. **`index.ts`** is the HTTP entrypoint — a Hono server that serves the\n frontend and any API routes you add.\n2. **`frontend/index.html`** loads Twind and the React entrypoint.\n3. **`frontend/index.tsx`** mounts the React app.\n4. **`frontend/components/App.tsx`** is the root layout — add new components\n alongside it.\n5. **`frontend/components/Counter.tsx`** is an example stateful component —\n replace it with your own!\n\n## Next steps\n\n- Add API routes in `index.ts`\n- Add new components in `frontend/components/`\n- Add a SQLite database — see the\n [React Hono Example](https://www.val.town/x/stevekrouse/reactHonoExample) for\n a full-stack example with database, queries, and shared types\n",[],[71],"56319596-f601-4581-8227-b8226408712e",2,["D",1783453717051],"directory",[84,85,86,87,88],[56],{"_33":116,"_13":117,"_36":118,"_38":39,"_40":41,"_42":119,"_44":45,"_46":120,"_17":74,"_49":81,"_50":-5,"_52":53,"_54":-5,"_67":121,"_18":122},{"_33":108,"_13":109,"_36":110,"_38":39,"_40":41,"_42":111,"_44":45,"_46":112,"_17":74,"_49":24,"_50":113,"_52":53,"_54":-5,"_67":114,"_18":115},{"_33":34,"_13":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":45,"_46":105,"_17":48,"_49":24,"_50":51,"_52":53,"_54":-5,"_67":106,"_18":107},{"_33":98,"_13":99,"_36":100,"_38":39,"_40":41,"_42":79,"_44":45,"_46":101,"_17":74,"_49":94,"_50":102,"_52":53,"_54":-5,"_67":103,"_18":104},{"_33":89,"_13":90,"_36":91,"_38":39,"_40":41,"_42":92,"_44":45,"_46":93,"_17":74,"_49":94,"_50":95,"_52":53,"_54":-5,"_67":96,"_18":97},"e39dbe5f-6ed0-4ba6-af53-da534d0a54ab","lib.ts","15a502c0-7a3d-11f1-9f00-1607ee4eb77e",9,["D",1783453819980],"script","// Shared helpers for the notes app\n\nexport interface Note {\n id: string;\n body: string;\n updated_at: number;\n}\n\nexport function noteTitle(body: string): string {\n const line = body\n .split(\"\\n\")\n .map((l) => l.trim())\n .find((l) => l.length > 0);\n return line && line.length > 0 ? line : \"New Note\";\n}\n\nexport function notePreview(body: string): string {\n const lines = body.split(\"\\n\");\n const titleIdx = lines.findIndex((l) => l.trim().length > 0);\n if (titleIdx === -1) return \"\";\n const rest = lines\n .slice(titleIdx + 1)\n .map((l) => l.trim())\n .filter((l) => l.length > 0)\n .join(\" \");\n if (rest.length > 120) return rest.slice(0, 120) + \"…\";\n return rest;\n}\n\n// Exact format YYYY-MM-DD hh:mm, 24-hour, UTC\nexport function formatTimestamp(ms: number): string {\n const d = new Date(ms);\n const pad = (n: number) => String(n).padStart(2, \"0\");\n return `${d.getUTCFullYear()}-${pad(d.getUTCMonth() + 1)}-${pad(d.getUTCDate())} ${pad(d.getUTCHours())}:${\n pad(d.getUTCMinutes())\n }`;\n}\n\nexport function makeApi(password: string) {\n const headers = {\n \"Authorization\": `Bearer ${password}`,\n \"Content-Type\": \"application/json\",\n };\n return {\n async listNotes(): Promise {\n const res = await fetch(\"/api/notes\", { headers });\n if (!res.ok) throw new Error(\"Failed to load notes\");\n const data = await res.json();\n return data.notes as Note[];\n },\n async createNote(): Promise {\n const res = await fetch(\"/api/notes\", { method: \"POST\", headers });\n if (!res.ok) throw new Error(\"Failed to create note\");\n const data = await res.json();\n return data.note as Note;\n },\n async getNote(id: string): Promise {\n const res = await fetch(`/api/notes/${id}`, { headers });\n if (res.status === 404) return null;\n if (!res.ok) throw new Error(\"Failed to load note\");\n const data = await res.json();\n return data.note as Note;\n },\n async saveNote(id: string, body: string): Promise {\n const res = await fetch(`/api/notes/${id}`, {\n method: \"PUT\",\n headers,\n body: JSON.stringify({ body }),\n keepalive: true,\n });\n if (!res.ok) throw new Error(\"Failed to save note\");\n const data = await res.json();\n return data.note as Note;\n },\n async deleteNote(id: string): Promise {\n const res = await fetch(`/api/notes/${id}`, { method: \"DELETE\", headers });\n if (!res.ok) throw new Error(\"Failed to delete note\");\n },\n };\n}\n\nexport type Api = ReturnType;\n",[],[56,90],"334a2b9b-be4b-450c-b2df-9e408a406fb3","index.tsx","d84ac4be-7a3c-11f1-b8b5-1607ee4eb77e",["D",1783453717051],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();",[],[56,99],["D",1783453893483],[],[56,35],"805b56db-b096-4b53-b465-034e4d155b0a","favicon.svg","d8b2465c-7a3c-11f1-b872-1607ee4eb77e",5,["D",1783453717717],"\n",[],[56,109],"0f002924-cddf-4144-b910-fdd6aefd4294","components","7e3b53ec-d10d-49e2-b2c2-fa8bbdfbb105",6,["D",1783453718038],[123,124,125,126,127],[56,117],{"_33":160,"_13":161,"_36":162,"_38":118,"_40":41,"_42":163,"_44":45,"_46":164,"_17":48,"_49":94,"_50":165,"_52":53,"_54":-5,"_67":166,"_18":167},{"_33":152,"_13":153,"_36":154,"_38":118,"_40":41,"_42":155,"_44":45,"_46":156,"_17":74,"_49":94,"_50":157,"_52":53,"_54":-5,"_67":158,"_18":159},{"_33":144,"_13":145,"_36":146,"_38":118,"_40":41,"_42":147,"_44":45,"_46":148,"_17":74,"_49":94,"_50":149,"_52":53,"_54":-5,"_67":150,"_18":151},{"_33":136,"_13":137,"_36":138,"_38":118,"_40":41,"_42":139,"_44":45,"_46":140,"_17":74,"_49":94,"_50":141,"_52":53,"_54":-5,"_67":142,"_18":143},{"_33":128,"_13":129,"_36":130,"_38":118,"_40":41,"_42":131,"_44":45,"_46":132,"_17":74,"_49":94,"_50":133,"_52":53,"_54":-5,"_67":134,"_18":135},"d71680cb-9dff-43d0-af2b-63e13060d9ea","PasswordGate.tsx","15acfb24-7a3d-11f1-b0a4-1607ee4eb77e",10,["D",1783453820032],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface Props {\n onUnlock: (password: string) => void;\n}\n\nexport function PasswordGate({ onUnlock }: Props) {\n const [password, setPassword] = useState(\"\");\n const [error, setError] = useState(null);\n const [busy, setBusy] = useState(false);\n\n async function submit(e: React.FormEvent) {\n e.preventDefault();\n if (busy) return;\n if (password.length === 0) {\n setError(\"Password is required\");\n return;\n }\n setBusy(true);\n setError(null);\n try {\n const res = await fetch(\"/api/unlock\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ password }),\n });\n if (res.ok) {\n onUnlock(password);\n } else if (res.status === 401) {\n setError(\"Incorrect password\");\n } else {\n const data = await res.json().catch(() => ({}));\n setError(data.error || \"Something went wrong\");\n }\n } catch {\n setError(\"Something went wrong\");\n } finally {\n setBusy(false);\n }\n }\n\n return (\n

🔒

Notes

\n Enter the password to unlock your notes.\n

\n );\n}\n",[],[56,117,129],"2310d300-7671-4c69-8e8d-35dd75fdf916","NotesList.tsx","265dd7ea-7a3d-11f1-a74c-1607ee4eb77e",11,["D",1783453847967],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Api, Note } from \"../lib.ts\";\nimport { formatTimestamp, notePreview, noteTitle } from \"../lib.ts\";\nimport { ConfirmDialog } from \"./ConfirmDialog.tsx\";\n\ninterface Props {\n api: Api;\n onOpenNote: (id: string) => void;\n}\n\nexport function NotesList({ api, onOpenNote }: Props) {\n const [notes, setNotes] = useState(null);\n const [query, setQuery] = useState(\"\");\n const [pendingDelete, setPendingDelete] = useState(null);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n api.listNotes().then(setNotes).catch(() => setError(\"Failed to load notes\"));\n }, []);\n\n async function createNote() {\n try {\n const note = await api.createNote();\n onOpenNote(note.id);\n } catch {\n setError(\"Failed to create note\");\n }\n }\n\n async function confirmDelete() {\n if (!pendingDelete) return;\n const id = pendingDelete.id;\n setPendingDelete(null);\n try {\n await api.deleteNote(id);\n setNotes((prev) => (prev ? prev.filter((n) => n.id !== id) : prev));\n } catch {\n setError(\"Failed to delete note\");\n }\n }\n\n const q = query.toLowerCase();\n const filtered = (notes || []).filter((n) => {\n if (q === \"\") return true;\n return noteTitle(n.body).toLowerCase().includes(q) || n.body.toLowerCase().includes(q);\n });\n\n return (\n

📝 Notes

\n \n New Note\n \n

\n\n setQuery(e.target.value)}\n placeholder=\"Search notes…\"\n aria-label=\"Search notes\"\n className=\"w-full border border-gray-300 rounded-lg px-3 py-2 mb-4 focus:outline-none focus:ring-2 focus:ring-blue-500\"\n />\n\n {error &&

{error}

}\n\n {notes === null ? (\n

Loading…

\n ) : notes.length === 0 ? (\n

No notes yet

Click “New Note” to create your first note.

\n ) : filtered.length === 0 ? (\n

No notes match your search.

\n ) : (\n

onOpenNote(note.id)}\n className=\"px-4 py-3 flex items-start gap-3 cursor-pointer hover:bg-gray-50\"\n data-note-id={note.id}\n >\n

{noteTitle(note.body)}

\n {notePreview(note.body) || No additional text}\n

\n \n {formatTimestamp(note.updated_at)}\n \n {\n e.stopPropagation();\n setPendingDelete(note);\n }}\n title=\"Delete note\"\n aria-label={`Delete note ${noteTitle(note.body)}`}\n className=\"text-gray-400 hover:text-red-600 px-2 py-1 rounded\"\n >\n 🗑️\n \n

\n \n ))}\n

\n )}\n\n

\n view source\n

\n\n {pendingDelete && (\n setPendingDelete(null)}\n />\n )}\n

\n );\n}\n",[],[56,117,137],"bd6ea6f1-5cc7-403a-bde9-6c7cdc8046d6","NoteEditor.tsx","32a5e470-7a3d-11f1-bfdf-1607ee4eb77e",13,["D",1783453868633],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Api, Note } from \"../lib.ts\";\nimport { noteTitle } from \"../lib.ts\";\nimport { ConfirmDialog } from \"./ConfirmDialog.tsx\";\n\ninterface Props {\n api: Api;\n noteId: string;\n onBack: () => void;\n}\n\nexport function NoteEditor({ api, noteId, onBack }: Props) {\n const [note, setNote] = useState(null);\n const [notFound, setNotFound] = useState(false);\n const [body, setBody] = useState(\"\");\n const [confirming, setConfirming] = useState(false);\n const [saving, setSaving] = useState(false);\n\n const bodyRef = useRef(body);\n bodyRef.current = body;\n const loadedRef = useRef(false);\n const dirtyRef = useRef(false);\n const deletedRef = useRef(false);\n const textareaRef = useRef(null);\n\n useEffect(() => {\n let cancelled = false;\n api.getNote(noteId).then((n) => {\n if (cancelled) return;\n if (!n) {\n setNotFound(true);\n return;\n }\n setNote(n);\n setBody(n.body);\n bodyRef.current = n.body;\n loadedRef.current = true;\n // Focus the body text area once loaded\n setTimeout(() => textareaRef.current?.focus(), 0);\n }).catch(() => setNotFound(true));\n return () => {\n cancelled = true;\n };\n }, [noteId]);\n\n async function flushSave() {\n if (!loadedRef.current || deletedRef.current) return;\n if (!dirtyRef.current) return;\n dirtyRef.current = false;\n try {\n await api.saveNote(noteId, bodyRef.current);\n } catch {\n dirtyRef.current = true;\n }\n }\n\n // Guarantee persistence if the tab is closed/reloaded mid-edit\n useEffect(() => {\n const handler = () => {\n if (loadedRef.current && dirtyRef.current && !deletedRef.current) {\n // keepalive fetch inside api.saveNote\n api.saveNote(noteId, bodyRef.current).catch(() => {});\n }\n };\n window.addEventListener(\"beforeunload\", handler);\n window.addEventListener(\"pagehide\", handler);\n return () => {\n window.removeEventListener(\"beforeunload\", handler);\n window.removeEventListener(\"pagehide\", handler);\n };\n }, [noteId]);\n\n // Save on unmount (e.g. browser back button navigation)\n useEffect(() => {\n return () => {\n if (loadedRef.current && dirtyRef.current && !deletedRef.current) {\n api.saveNote(noteId, bodyRef.current).catch(() => {});\n }\n };\n }, [noteId]);\n\n async function handleBack() {\n setSaving(true);\n await flushSave();\n onBack();\n }\n\n async function confirmDelete() {\n setConfirming(false);\n deletedRef.current = true;\n try {\n await api.deleteNote(noteId);\n } catch {\n // ignore; note may already be gone\n }\n onBack();\n }\n\n if (notFound) {\n return (\n

Note not found. It may have been deleted.

\n \n ← Back to notes\n \n

\n );\n }\n\n return (\n

\n \n ← Back to notes\n \n setConfirming(true)}\n className=\"text-red-600 hover:text-red-800 font-medium px-3 py-1 rounded border border-red-200 hover:bg-red-50\"\n >\n Delete\n \n

\n\n {note === null ? (\n

Loading…

\n ) : (\n {\n setBody(e.target.value);\n dirtyRef.current = true;\n }}\n placeholder=\"Start typing your note…\"\n aria-label=\"Note body\"\n className=\"w-full h-[60vh] bg-white rounded-xl shadow p-4 border border-gray-200 focus:outline-none focus:ring-2 focus:ring-blue-500 resize-y font-sans text-base leading-relaxed\"\n />\n )}\n\n {confirming && (\n setConfirming(false)}\n />\n )}\n

\n );\n}\n",[],[56,117,145],"8eb18c57-7409-4e9c-b335-026c87de47fc","ConfirmDialog.tsx","2694377c-7a3d-11f1-a271-1607ee4eb77e",12,["D",1783453848014],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface Props {\n title: string;\n onConfirm: () => void;\n onCancel: () => void;\n}\n\nexport function ConfirmDialog({ title, onConfirm, onCancel }: Props) {\n return (\n \n

Delete note?

\n Are you sure you want to permanently delete “{title}”?\n

\n This action cannot be undone. There is no trash or recovery.\n

\n \n Cancel\n \n \n Delete\n \n

\n \n );\n}\n",[],[56,117,153],"59d82e0b-025f-4358-b410-44ed2e8c20e9","App.tsx","d9472920-7a3c-11f1-94ec-1607ee4eb77e",15,["D",1783453882592],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useMemo, useState } from \"https://esm.sh/react@18.2.0\";\nimport { makeApi } from \"../lib.ts\";\nimport { NoteEditor } from \"./NoteEditor.tsx\";\nimport { NotesList } from \"./NotesList.tsx\";\nimport { PasswordGate } from \"./PasswordGate.tsx\";\n\nfunction parseRoute(pathname: string): { view: \"list\" } | { view: \"note\"; id: string } {\n const m = pathname.match(/^\\/note\\/([^/]+)\\/?$/);\n if (m) return { view: \"note\", id: decodeURIComponent(m[1]) };\n return { view: \"list\" };\n}\n\nexport function App() {\n // In-memory only: reload or reopening the tab re-locks the app.\n const [password, setPassword] = useState(null);\n const [path, setPath] = useState(window.location.pathname);\n\n useEffect(() => {\n const onPop = () => setPath(window.location.pathname);\n window.addEventListener(\"popstate\", onPop);\n return () => window.removeEventListener(\"popstate\", onPop);\n }, []);\n\n function navigate(to: string) {\n if (window.location.pathname !== to) {\n window.history.pushState({}, \"\", to);\n }\n setPath(to);\n }\n\n const api = useMemo(() => (password ? makeApi(password) : null), [password]);\n\n if (!password || !api) {\n return setPassword(pw)} />;\n }\n\n const route = parseRoute(path);\n\n if (route.view === \"note\") {\n return (\n navigate(\"/\")}\n />\n );\n }\n\n return (\n navigate(`/note/${id}`)}\n />\n );\n}\n",[],[56,117,161],"2d8b39df-fd7e-4321-8058-b663c050799b",["D",1783453716406],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","ViBench-VT: notes built by anthropic/claude-fable-5 (remix)","imageUrl","userId","1cb5e0c6-ae85-4bcd-999e-4394b4ef8d27","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","orgId","019f3c8e-4c18-7004-b524-3ee59b13853d","tursoName","2d8b39dffd7e43218058b663c050799b","tursoHostname","2d8b39dffd7e43218058b663c050799b-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789524636084],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_224":219},"org",{"_11":12,"_218":219,"_220":219,"_178":179,"_221":222,"_223":53},"branch",{"_17":43,"_13":16,"_33":41,"_210":168,"_211":-5,"_212":-5,"_213":-5,"_214":-5,"_215":-5,"_216":14,"_217":12},"isOwned","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","","avatar","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_33":168,"_13":14,"_46":293,"_170":-5,"_171":53,"_172":173,"_174":173,"_175":176,"_177":-5,"_178":179,"_180":-5,"_181":53,"_182":-5,"_183":-5,"_184":74,"_185":186,"_187":188,"_189":190,"_191":294,"_193":-5,"_194":195,"_196":195,"_197":198,"_199":198,"_200":198,"_201":195,"_202":195,"_203":295,"_205":296,"_207":297,"_209":53},[254,265,266],"files",[254,255,256,257,258,259,260,261,262,263,264,265,266],"counts",{"_245":74,"_246":48,"_247":74,"_32":248,"_249":250},[],{"_33":34,"_13":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":45,"_46":47,"_17":48,"_49":24,"_50":51,"_52":53,"_54":-5,"_18":244},"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},[56,35],"pulls","branches","forks",{"_251":74,"_253":74},"connections",{"_251":74,"_252":74},"count","unfilledCount","emptyCount",{"_33":78,"_13":56,"_36":39,"_38":-5,"_40":41,"_42":79,"_44":45,"_46":80,"_17":74,"_49":81,"_50":-5,"_52":53,"_54":-5,"_67":291,"_18":292},{"_33":116,"_13":117,"_36":118,"_38":39,"_40":41,"_42":119,"_44":45,"_46":120,"_17":74,"_49":81,"_50":-5,"_52":53,"_54":-5,"_67":289,"_18":290},{"_33":160,"_13":161,"_36":162,"_38":118,"_40":41,"_42":163,"_44":45,"_46":164,"_17":48,"_49":94,"_50":165,"_52":53,"_54":-5,"_67":287,"_18":288},{"_33":152,"_13":153,"_36":154,"_38":118,"_40":41,"_42":155,"_44":45,"_46":156,"_17":74,"_49":94,"_50":157,"_52":53,"_54":-5,"_67":285,"_18":286},{"_33":144,"_13":145,"_36":146,"_38":118,"_40":41,"_42":147,"_44":45,"_46":148,"_17":74,"_49":94,"_50":149,"_52":53,"_54":-5,"_67":283,"_18":284},{"_33":136,"_13":137,"_36":138,"_38":118,"_40":41,"_42":139,"_44":45,"_46":140,"_17":74,"_49":94,"_50":141,"_52":53,"_54":-5,"_67":281,"_18":282},{"_33":128,"_13":129,"_36":130,"_38":118,"_40":41,"_42":131,"_44":45,"_46":132,"_17":74,"_49":94,"_50":133,"_52":53,"_54":-5,"_67":279,"_18":280},{"_33":108,"_13":109,"_36":110,"_38":39,"_40":41,"_42":111,"_44":45,"_46":112,"_17":74,"_49":24,"_50":113,"_52":53,"_54":-5,"_67":277,"_18":278},{"_33":34,"_13":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":45,"_46":105,"_17":48,"_49":24,"_50":51,"_52":53,"_54":-5,"_67":275,"_18":276},{"_33":98,"_13":99,"_36":100,"_38":39,"_40":41,"_42":79,"_44":45,"_46":101,"_17":74,"_49":94,"_50":102,"_52":53,"_54":-5,"_67":273,"_18":274},{"_33":89,"_13":90,"_36":91,"_38":39,"_40":41,"_42":92,"_44":45,"_46":93,"_17":74,"_49":94,"_50":95,"_52":53,"_54":-5,"_67":271,"_18":272},{"_33":70,"_13":71,"_36":72,"_38":-5,"_40":41,"_42":48,"_44":45,"_46":73,"_17":74,"_49":24,"_50":75,"_52":53,"_54":-5,"_67":269,"_18":270},{"_33":60,"_13":61,"_36":62,"_38":-5,"_40":41,"_42":63,"_44":45,"_46":64,"_17":48,"_49":65,"_50":66,"_52":53,"_54":-5,"_67":267,"_18":268},[],[61],[],[71],[],[56,90],[],[56,99],[],[56,35],[],[56,109],[],[56,117,129],[],[56,117,137],[],[56,117,145],[],[56,117,153],[],[56,117,161],[256,257,258,259,260],[56,117],[255,261,262,263,264],[56],["D",1783453716406],["D",1789524636084],{"_11":12,"_224":219},{"_11":12,"_218":219,"_220":219,"_178":179,"_221":222,"_223":53},{"_17":43,"_13":16,"_33":41,"_210":168,"_211":-5,"_212":-5,"_213":-5,"_214":-5,"_215":-5,"_216":14,"_217":12},"ctx",{"_203":-5,"_241":331,"_332":333,"_334":335,"_336":53,"_337":53,"_338":53,"_339":45,"_340":-5,"_341":-7,"_342":-7,"_343":74,"_344":53,"_345":53,"_346":-5,"_347":53,"_348":53,"_349":53,"_350":-5},"ENV",{"_302":303,"_304":305,"_306":16,"_307":308,"_309":310,"_311":312,"_313":314,"_315":316,"_317":318,"_319":320,"_321":322,"_323":324,"_325":326,"_327":328,"_329":330},"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"]