[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_499":500,"_501":502},"routes/_app.x.$handle.$name",{"_98":97,"_32":46,"_107":88,"_27":108,"_13":14,"_109":-5,"_11":110,"_111":112,"_113":114,"_115":116,"_117":118,"_20":-5,"_119":-5,"_120":-5,"_121":25,"_122":123,"_124":60,"_125":-5,"_126":-5,"_127":128},"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":-5,"_68":-5,"_69":-5,"_70":-5,"_71":72,"_73":72,"_74":75,"_76":75,"_77":75,"_78":72,"_79":72,"_80":81,"_82":83,"_84":85,"_86":25},"version",75,"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","lib/vt.ts","latestPath","fileId","772cd312-6451-11f1-8681-1607ee4eb77e","name","vt.ts","fileType","script","content","// Val Town REST client — the WRITE side of the skill library. Two auth modes:\n// 1. VALTOWN_TOKEN env var (a write-scoped API token), if set — takes priority.\n// 2. An OAuth token the user authorized once at /connect, stored in blob and\n// auto-refreshed on expiry. No token to paste or rotate.\n// Reads (alias/branch lookup, file listing) use the platform's ambient token,\n// which is READ-ONLY. Writes target THIS val's CURRENT branch.\n\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport { blob } from \"https://esm.town/v/std/blob\";\n\nconst VT = \"https://api.val.town\";\nconst OAUTH_TOKEN_URL = \"https://val.town/oauth/token\";\nconst TOKEN_BLOB_KEY = \"librarian:vt_oauth\";\n\n// ── Read auth: the ambient platform token is fine for reads ──────────────────\nfunction readToken(): string | undefined {\n return Deno.env.get(\"VALTOWN_TOKEN\") || Deno.env.get(\"valtown\") || undefined;\n}\nfunction readHeaders(): Record {\n const t = readToken();\n return t ? { Authorization: `Bearer ${t}` } : {};\n}\n\n// ── Write auth: env token, or a stored + refreshed OAuth token ───────────────\nexport type OAuthBundle = {\n access_token: string;\n refresh_token?: string;\n client_id?: string;\n stored_at: number;\n};\n\nexport async function storeOAuthToken(b: OAuthBundle): Promise {\n await blob.setJSON(TOKEN_BLOB_KEY, b);\n}\nasync function loadOAuthToken(): Promise {\n try {\n return ((await blob.getJSON(TOKEN_BLOB_KEY)) as OAuthBundle | null) ?? null;\n } catch {\n return null;\n }\n}\n// How the librarian will authenticate writes right now — for status/onboarding.\nexport async function writeAuthMode(): Promise<\"env\" | \"oauth\" | \"none\"> {\n if (Deno.env.get(\"VALTOWN_TOKEN\")) return \"env\";\n return (await loadOAuthToken())?.access_token ? \"oauth\" : \"none\";\n}\n\n// Resolve the librarian's own web endpoints (connect page + Slack setup page)\n// from the Val Town API, so the catalog toolbar can link to them without\n// hardcoding per-deploy URLs. Cached for the isolate.\nlet _links:\n | { connect: string | null; setup: string | null; slackAppId: string | null }\n | null = null;\nasync function librarianLinks() {\n if (_links) return _links;\n const slackAppId = Deno.env.get(\"SLACK_APP_ID\") || null;\n try {\n const { valId, branchId } = await target();\n const r = await fetch(\n `${VT}/v2/vals/${valId}/files?${qs({ path: \"\", recursive: \"true\", offset: \"0\", limit: \"300\", branch_id: branchId ?? undefined })}`,\n { headers: readHeaders() },\n );\n if (!r.ok) return (_links = { connect: null, setup: null, slackAppId });\n const { data = [] } = await r.json();\n const ep = (p: string) =>\n (data.find((f: any) => f.path === p)?.links?.endpoint as string | undefined) ?? null;\n _links = { connect: ep(\"librarian/connect.ts\"), setup: ep(\"librarian/events.ts\"), slackAppId };\n } catch {\n _links = { connect: null, setup: null, slackAppId };\n }\n return _links;\n}\n\n// Everything the catalog's bottom toolbar needs. Degrades to nulls if the\n// librarian isn't part of this deploy or can't be resolved.\nexport async function librarianBar(): Promise<{\n connectUrl: string | null;\n setupUrl: string | null;\n dmUrl: string | null;\n connected: boolean;\n}> {\n const [links, mode] = await Promise.all([librarianLinks(), writeAuthMode()]);\n return {\n connectUrl: links.connect,\n setupUrl: links.setup,\n dmUrl: links.slackAppId ? `https://slack.com/app_redirect?app=${links.slackAppId}` : null,\n connected: mode !== \"none\",\n };\n}\n\nasync function refreshOAuth(b: OAuthBundle): Promise {\n if (!b.refresh_token || !b.client_id) {\n throw new Error(\"Val Town session can't refresh — re-authorize the librarian at /connect.\");\n }\n const r = await fetch(OAUTH_TOKEN_URL, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },\n body: new URLSearchParams({\n grant_type: \"refresh_token\",\n refresh_token: b.refresh_token,\n client_id: b.client_id,\n }),\n });\n if (!r.ok) {\n throw new Error(`Val Town token refresh failed (${r.status}) — re-authorize at /connect.`);\n }\n const t = await r.json();\n const next: OAuthBundle = {\n access_token: t.access_token,\n refresh_token: t.refresh_token ?? b.refresh_token, // refresh tokens may rotate\n client_id: b.client_id,\n stored_at: Date.now(),\n };\n await storeOAuthToken(next);\n return next;\n}\n\nfunction withAuth(init: RequestInit, token: string): RequestInit {\n return {\n ...init,\n headers: {\n ...(init.headers as Record | undefined),\n Authorization: `Bearer ${token}`,\n },\n };\n}\n\n// A mutating request, authed by VALTOWN_TOKEN or the stored OAuth token\n// (refreshed once on a 401).\nasync function authedWrite(url: string, init: RequestInit): Promise {\n const envToken = Deno.env.get(\"VALTOWN_TOKEN\");\n if (envToken) return fetch(url, withAuth(init, envToken));\n\n let bundle = await loadOAuthToken();\n if (!bundle?.access_token) {\n throw new Error(\n \"The librarian isn't connected to Val Town yet — authorize it once at the /connect page (one click), or set VALTOWN_TOKEN.\",\n );\n }\n let res = await fetch(url, withAuth(init, bundle.access_token));\n if (res.status === 401) {\n bundle = await refreshOAuth(bundle);\n res = await fetch(url, withAuth(init, bundle.access_token));\n }\n return res;\n}\n\nfunction qs(params: Record): string {\n const p = new URLSearchParams();\n for (const [k, v] of Object.entries(params)) if (v != null) p.set(k, v);\n return p.toString();\n}\n\n// Resolve this val's id + the id of the branch we're running on (so writes go\n// to the branch, not main). Reads only; cached for the life of the isolate.\nlet cached: { valId: string; branchId: string | null } | null = null;\nasync function target(): Promise<{ valId: string; branchId: string | null }> {\n if (cached) return cached;\n const v = parseVal();\n const r = await fetch(`${VT}/v2/alias/vals/${v.username}/${v.name}`, { headers: readHeaders() });\n if (!r.ok) throw new Error(`Couldn't resolve ${v.username}/${v.name}: ${r.status}`);\n const val = await r.json();\n let branchId: string | null = null;\n if (v.branch && v.branch !== \"main\") {\n const br = await fetch(\n `${VT}/v2/vals/${val.id}/branches?${qs({ limit: \"100\", offset: \"0\" })}`,\n { headers: readHeaders() },\n );\n if (br.ok) {\n const { data = [] } = await br.json();\n branchId = data.find((b: any) => b.name === v.branch)?.id ?? null;\n }\n }\n cached = { valId: val.id, branchId };\n return cached;\n}\n\n// .ts/.tsx/.js/.jsx must be \"script\"; everything else (md/html/txt) is \"file\".\nfunction typeFor(path: string): \"file\" | \"script\" {\n return /\\.(ts|tsx|js|jsx)$/.test(path) ? \"script\" : \"file\";\n}\n\nasync function ensureDirs(filePath: string): Promise {\n const { valId, branchId } = await target();\n const segs = filePath.split(\"/\");\n segs.pop(); // drop the filename\n let cur = \"\";\n for (const s of segs) {\n cur = cur ? `${cur}/${s}` : s;\n const r = await authedWrite(\n `${VT}/v2/vals/${valId}/files?${qs({ path: cur, branch_id: branchId ?? undefined })}`,\n { method: \"POST\", headers: { \"Content-Type\": \"application/json\" }, body: JSON.stringify({ type: \"directory\" }) },\n );\n // 409 = already exists (fine). Other failures are non-fatal — the API\n // auto-creates parents — so let the file write surface real errors.\n if (!r.ok && r.status !== 409) console.warn(`ensureDirs ${cur}: ${r.status}`);\n }\n}\n\n// Create the file, or overwrite it if it already exists.\nexport async function writeFile(path: string, content: string): Promise {\n const { valId, branchId } = await target();\n await ensureDirs(path);\n const url = `${VT}/v2/vals/${valId}/files?${qs({ path, branch_id: branchId ?? undefined })}`;\n const create = await authedWrite(url, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ type: typeFor(path), content }),\n });\n if (create.ok) return;\n if (create.status === 409) {\n const upd = await authedWrite(url, {\n method: \"PUT\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ content }),\n });\n if (!upd.ok) throw new Error(`update ${path}: ${upd.status} ${(await upd.text()).slice(0, 200)}`);\n return;\n }\n if (create.status === 403) {\n throw new Error(\n `create ${path}: 403 — the connected account lacks val write scope. Re-authorize at /connect, or set a write-scoped VALTOWN_TOKEN.`,\n );\n }\n throw new Error(`create ${path}: ${create.status} ${(await create.text()).slice(0, 200)}`);\n}\n\nexport async function deleteFile(path: string, recursive = false): Promise {\n const { valId, branchId } = await target();\n const url = `${VT}/v2/vals/${valId}/files?${qs({\n path,\n branch_id: branchId ?? undefined,\n recursive: recursive ? \"true\" : undefined,\n })}`;\n const r = await authedWrite(url, { method: \"DELETE\" });\n if (!r.ok && r.status !== 404) {\n throw new Error(`delete ${path}: ${r.status} ${(await r.text()).slice(0, 200)}`);\n }\n}\n\n// Fallback for the catalog when std/utils listing is unavailable. Uses the\n// read token (ambient is fine). Returns null if there's nothing to list with.\nexport async function restListSkillFiles(): Promise<\n { path: string; type: string }[] | null\n> {\n if (!readToken()) return null;\n try {\n const { valId, branchId } = await target();\n const r = await fetch(\n `${VT}/v2/vals/${valId}/files?${qs({\n path: \"skills\",\n recursive: \"true\",\n offset: \"0\",\n limit: \"200\",\n branch_id: branchId ?? undefined,\n })}`,\n { headers: readHeaders() },\n );\n if (!r.ok) return null;\n const { data = [] } = await r.json();\n return data.map((f: any) => ({ path: f.path, type: f.type }));\n } catch {\n return null;\n }\n}\n","// Val Town REST client — the WRITE side of the skill library. Two auth modes:\n// 1. VALTOWN_TOKEN env var (a write-scoped API token), if set — takes priority.\n// 2. An OAuth token the user authorized once at /connect, stored in blob and\n// auto-refreshed on expiry. No token to paste or rotate.\n// Reads (alias/branch lookup, file listing) use the platform's ambient token,\n// which is READ-ONLY. Writes target THIS val's CURRENT branch.\n\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport { blob } from \"https://esm.town/v/std/blob\";\n\nconst VT = \"https://api.val.town\";\nconst OAUTH_TOKEN_URL = \"https://val.town/oauth/token\";\nconst TOKEN_BLOB_KEY = \"librarian:vt_oauth\";\n\n// ── Read auth: the ambient platform token is fine for reads ──────────────────\nfunction readToken(): string | undefined {\n return Deno.env.get(\"VALTOWN_TOKEN\") || Deno.env.get(\"valtown\") || undefined;\n}\nfunction readHeaders(): Record {\n const t = readToken();\n return t ? { Authorization: `Bearer ${t}` } : {};\n}\n\n// ── Write auth: env token, or a stored + refreshed OAuth token ───────────────\nexport type OAuthBundle = {\n access_token: string;\n refresh_token?: string;\n client_id?: string;\n stored_at: number;\n};\n\nexport async function storeOAuthToken(b: OAuthBundle): Promise {\n await blob.setJSON(TOKEN_BLOB_KEY, b);\n}\nasync function loadOAuthToken(): Promise {\n try {\n return ((await blob.getJSON(TOKEN_BLOB_KEY)) as OAuthBundle | null) ?? null;\n } catch {\n return null;\n }\n}\n// How the librarian will authenticate writes right now — for status/onboarding.\nexport async function writeAuthMode(): Promise<\"env\" | \"oauth\" | \"none\"> {\n if (Deno.env.get(\"VALTOWN_TOKEN\")) return \"env\";\n return (await loadOAuthToken())?.access_token ? \"oauth\" : \"none\";\n}\n\n// Resolve the librarian's own web endpoints (connect page + Slack setup page)\n// from the Val Town API, so the catalog toolbar can link to them without\n// hardcoding per-deploy URLs. Cached for the isolate.\nlet _links:\n | { connect: string | null; setup: string | null; slackAppId: string | null }\n | null = null;\nasync function librarianLinks() {\n if (_links) return _links;\n const slackAppId = Deno.env.get(\"SLACK_APP_ID\") || null;\n try {\n const { valId, branchId } = await target();\n const r = await fetch(\n `${VT}/v2/vals/${valId}/files?${qs({ path: \"\", recursive: \"true\", offset: \"0\", limit: \"100\", branch_id: branchId ?? undefined })}`,\n { headers: readHeaders() },\n );\n if (!r.ok) return (_links = { connect: null, setup: null, slackAppId });\n const { data = [] } = await r.json();\n const ep = (p: string) =>\n (data.find((f: any) => f.path === p)?.links?.endpoint as string | undefined) ?? null;\n _links = { connect: ep(\"librarian/connect.ts\"), setup: ep(\"librarian/events.ts\"), slackAppId };\n } catch {\n _links = { connect: null, setup: null, slackAppId };\n }\n return _links;\n}\n\n// Everything the catalog's bottom toolbar needs. Degrades to nulls if the\n// librarian isn't part of this deploy or can't be resolved.\nexport async function librarianBar(): Promise<{\n connectUrl: string | null;\n setupUrl: string | null;\n dmUrl: string | null;\n connected: boolean;\n}> {\n const [links, mode] = await Promise.all([librarianLinks(), writeAuthMode()]);\n return {\n connectUrl: links.connect,\n setupUrl: links.setup,\n dmUrl: links.slackAppId ? `https://slack.com/app_redirect?app=${links.slackAppId}` : null,\n connected: mode !== \"none\",\n };\n}\n\nasync function refreshOAuth(b: OAuthBundle): Promise {\n if (!b.refresh_token || !b.client_id) {\n throw new Error(\"Val Town session can't refresh — re-authorize the librarian at /connect.\");\n }\n const r = await fetch(OAUTH_TOKEN_URL, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },\n body: new URLSearchParams({\n grant_type: \"refresh_token\",\n refresh_token: b.refresh_token,\n client_id: b.client_id,\n }),\n });\n if (!r.ok) {\n throw new Error(`Val Town token refresh failed (${r.status}) — re-authorize at /connect.`);\n }\n const t = await r.json();\n const next: OAuthBundle = {\n access_token: t.access_token,\n refresh_token: t.refresh_token ?? b.refresh_token, // refresh tokens may rotate\n client_id: b.client_id,\n stored_at: Date.now(),\n };\n await storeOAuthToken(next);\n return next;\n}\n\nfunction withAuth(init: RequestInit, token: string): RequestInit {\n return {\n ...init,\n headers: {\n ...(init.headers as Record | undefined),\n Authorization: `Bearer ${token}`,\n },\n };\n}\n\n// A mutating request, authed by VALTOWN_TOKEN or the stored OAuth token\n// (refreshed once on a 401).\nasync function authedWrite(url: string, init: RequestInit): Promise {\n const envToken = Deno.env.get(\"VALTOWN_TOKEN\");\n if (envToken) return fetch(url, withAuth(init, envToken));\n\n let bundle = await loadOAuthToken();\n if (!bundle?.access_token) {\n throw new Error(\n \"The librarian isn't connected to Val Town yet — authorize it once at the /connect page (one click), or set VALTOWN_TOKEN.\",\n );\n }\n let res = await fetch(url, withAuth(init, bundle.access_token));\n if (res.status === 401) {\n bundle = await refreshOAuth(bundle);\n res = await fetch(url, withAuth(init, bundle.access_token));\n }\n return res;\n}\n\nfunction qs(params: Record): string {\n const p = new URLSearchParams();\n for (const [k, v] of Object.entries(params)) if (v != null) p.set(k, v);\n return p.toString();\n}\n\n// Resolve this val's id + the id of the branch we're running on (so writes go\n// to the branch, not main). Reads only; cached for the life of the isolate.\nlet cached: { valId: string; branchId: string | null } | null = null;\nasync function target(): Promise<{ valId: string; branchId: string | null }> {\n if (cached) return cached;\n const v = parseVal();\n const r = await fetch(`${VT}/v2/alias/vals/${v.username}/${v.name}`, { headers: readHeaders() });\n if (!r.ok) throw new Error(`Couldn't resolve ${v.username}/${v.name}: ${r.status}`);\n const val = await r.json();\n let branchId: string | null = null;\n if (v.branch && v.branch !== \"main\") {\n const br = await fetch(\n `${VT}/v2/vals/${val.id}/branches?${qs({ limit: \"100\", offset: \"0\" })}`,\n { headers: readHeaders() },\n );\n if (br.ok) {\n const { data = [] } = await br.json();\n branchId = data.find((b: any) => b.name === v.branch)?.id ?? null;\n }\n }\n cached = { valId: val.id, branchId };\n return cached;\n}\n\n// .ts/.tsx/.js/.jsx must be \"script\"; everything else (md/html/txt) is \"file\".\nfunction typeFor(path: string): \"file\" | \"script\" {\n return /\\.(ts|tsx|js|jsx)$/.test(path) ? \"script\" : \"file\";\n}\n\nasync function ensureDirs(filePath: string): Promise {\n const { valId, branchId } = await target();\n const segs = filePath.split(\"/\");\n segs.pop(); // drop the filename\n let cur = \"\";\n for (const s of segs) {\n cur = cur ? `${cur}/${s}` : s;\n const r = await authedWrite(\n `${VT}/v2/vals/${valId}/files?${qs({ path: cur, branch_id: branchId ?? undefined })}`,\n { method: \"POST\", headers: { \"Content-Type\": \"application/json\" }, body: JSON.stringify({ type: \"directory\" }) },\n );\n // 409 = already exists (fine). Other failures are non-fatal — the API\n // auto-creates parents — so let the file write surface real errors.\n if (!r.ok && r.status !== 409) console.warn(`ensureDirs ${cur}: ${r.status}`);\n }\n}\n\n// Create the file, or overwrite it if it already exists.\nexport async function writeFile(path: string, content: string): Promise {\n const { valId, branchId } = await target();\n await ensureDirs(path);\n const url = `${VT}/v2/vals/${valId}/files?${qs({ path, branch_id: branchId ?? undefined })}`;\n const create = await authedWrite(url, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ type: typeFor(path), content }),\n });\n if (create.ok) return;\n if (create.status === 409) {\n const upd = await authedWrite(url, {\n method: \"PUT\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ content }),\n });\n if (!upd.ok) throw new Error(`update ${path}: ${upd.status} ${(await upd.text()).slice(0, 200)}`);\n return;\n }\n if (create.status === 403) {\n throw new Error(\n `create ${path}: 403 — the connected account lacks val write scope. Re-authorize at /connect, or set a write-scoped VALTOWN_TOKEN.`,\n );\n }\n throw new Error(`create ${path}: ${create.status} ${(await create.text()).slice(0, 200)}`);\n}\n\nexport async function deleteFile(path: string, recursive = false): Promise {\n const { valId, branchId } = await target();\n const url = `${VT}/v2/vals/${valId}/files?${qs({\n path,\n branch_id: branchId ?? undefined,\n recursive: recursive ? \"true\" : undefined,\n })}`;\n const r = await authedWrite(url, { method: \"DELETE\" });\n if (!r.ok && r.status !== 404) {\n throw new Error(`delete ${path}: ${r.status} ${(await r.text()).slice(0, 200)}`);\n }\n}\n\n// Fallback for the catalog when std/utils listing is unavailable. Uses the\n// read token (ambient is fine). Returns null if there's nothing to list with.\nexport async function restListSkillFiles(): Promise<\n { path: string; type: string }[] | null\n> {\n if (!readToken()) return null;\n try {\n const { valId, branchId } = await target();\n const r = await fetch(\n `${VT}/v2/vals/${valId}/files?${qs({\n path: \"skills\",\n recursive: \"true\",\n offset: \"0\",\n limit: \"200\",\n branch_id: branchId ?? undefined,\n })}`,\n { headers: readHeaders() },\n );\n if (!r.ok) return null;\n const { data = [] } = await r.json();\n return data.map((f: any) => ({ path: f.path, type: f.type }));\n } catch {\n return null;\n }\n}\n","createdAt",["D",1781043791262],"branchVersion","branchId","7c862450-0674-426e-9c69-ceda93eca788","id","6852d2a6-72e8-40e3-b5f0-53b7f8f82e7f","skills",["D",1780679910046],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Shareable agent skill library","imageUrl","9319c175-2593-4f88-ba21-04f2ef7b1c28","pinnedFileId","92861134-6102-11f1-a0c5-1607ee4eb77e","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",1,"orgId","d663a026-6449-42f6-9156-1d4a2d64d38c","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_98":97,"_106":102},"org",{"_98":97,"_99":100,"_101":102,"_18":56,"_103":104,"_105":25},"branch",{"_13":87,"_32":88,"_44":43,"_89":45,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":46,"_96":97},"isOwned",96,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","dcm31","handle","displayName","Charlie","avatar","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/3e904faa-3764-4629-c475-f561a49b0000/square512?exp=1789574399&sig=a925208509ae04f12f2c0946312b0486500a05bf884a2b0f9b9455e5f9f79132","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_44":45,"_32":46,"_39":495,"_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":-5,"_68":-5,"_69":-5,"_70":-5,"_71":72,"_73":72,"_74":75,"_76":75,"_77":75,"_78":72,"_79":72,"_80":496,"_82":497,"_84":498,"_86":25},"tree",[202,209,211,214,225,240,241,242],"files",[202,203,204,205,206,207,208,209,210,211,212,213,214,215,216,217,218,219,220,221,222,223,224,225,226,227,228,229,230,231,232,233,234,235,236,237,238,239,240,241,242],"counts",{"_190":170,"_191":192,"_193":192,"_194":195,"_196":197},"contents",[129,130,131,132,133,134,135,136],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_44":184,"_32":185,"_30":186,"_140":-5,"_42":43,"_41":187,"_142":60,"_39":188,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_27":189},{"_44":178,"_32":179,"_30":180,"_140":-5,"_42":43,"_41":181,"_142":60,"_39":182,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_27":183},{"_44":172,"_32":173,"_30":174,"_140":-5,"_42":43,"_41":175,"_142":60,"_39":176,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_27":177},{"_44":166,"_32":167,"_30":168,"_140":-5,"_42":43,"_41":141,"_142":60,"_39":169,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_27":171},{"_44":160,"_32":46,"_30":161,"_140":-5,"_42":43,"_41":162,"_142":60,"_39":163,"_13":64,"_34":164,"_36":-5,"_24":25,"_145":-5,"_27":165},{"_44":154,"_32":155,"_30":156,"_140":-5,"_42":43,"_41":141,"_142":25,"_39":157,"_13":150,"_34":20,"_36":158,"_24":25,"_145":-5,"_27":159},{"_44":147,"_32":148,"_30":58,"_140":-5,"_42":43,"_41":141,"_142":25,"_39":149,"_13":150,"_34":151,"_36":152,"_24":25,"_145":-5,"_27":153},{"_44":137,"_32":138,"_30":139,"_140":-5,"_42":43,"_41":141,"_142":60,"_39":143,"_13":64,"_34":35,"_36":144,"_24":25,"_145":-5,"_27":146},"64cd3c2b-9f72-4ee3-9ed8-00e2a37484eb","og.ts","8a603662-6128-11f1-abe9-1607ee4eb77e","parentId",74,"latest",["D",1781043647946],"// Open Graph / Twitter card image (1200×630), generated with satori (JSX→SVG)\n// + resvg-wasm (SVG→PNG). Served at GET /og.png. Light/blue theme to match the\n// Skill Library UI. Modeled on stevekrouse/agentfax's og.ts.\nimport satori from \"npm:satori@0.10.13\";\nimport { initWasm, Resvg } from \"npm:@resvg/resvg-wasm@2.6.2\";\n\n// Static-weight TTFs (variable fonts crash satori's opentype.js).\nconst SANS_BOLD_TTF =\n \"https://raw.githubusercontent.com/google/fonts/main/ofl/ptsans/PT_Sans-Web-Bold.ttf\";\nconst SANS_REGULAR_TTF =\n \"https://raw.githubusercontent.com/google/fonts/main/ofl/ptsans/PT_Sans-Web-Regular.ttf\";\nconst RESVG_WASM_URL = \"https://unpkg.com/@resvg/resvg-wasm@2.6.2/index_bg.wasm\";\n\nlet fontsPromise: Promise<{ bold: ArrayBuffer; regular: ArrayBuffer }> | null = null;\nfunction loadFonts() {\n if (!fontsPromise) {\n const get = (url: string, label: string) =>\n fetch(url).then((r) => {\n if (!r.ok) throw new Error(`${label} font fetch failed: ${r.status}`);\n return r.arrayBuffer();\n });\n fontsPromise = Promise.all([\n get(SANS_BOLD_TTF, \"Bold\"),\n get(SANS_REGULAR_TTF, \"Regular\"),\n ]).then(([bold, regular]) => ({ bold, regular }));\n }\n return fontsPromise;\n}\n\nlet wasmPromise: Promise | null = null;\nfunction ensureResvg(): Promise {\n if (!wasmPromise) {\n wasmPromise = fetch(RESVG_WASM_URL)\n .then((r) => {\n if (!r.ok) throw new Error(`resvg wasm fetch failed: ${r.status}`);\n return r.arrayBuffer();\n })\n .then((bytes) => initWasm(bytes));\n }\n return wasmPromise;\n}\n\nfunction pill(text: string) {\n return {\n type: \"div\",\n props: {\n style: {\n display: \"flex\",\n fontSize: 26,\n color: \"#404040\",\n background: \"#f5f5f5\",\n border: \"1px solid #e5e5e5\",\n borderRadius: \"999px\",\n padding: \"12px 28px\",\n },\n children: text,\n },\n };\n}\n\n// A stacked-cards \"library\" glyph as a satori SVG node (0–32 grid), scaled to `size`.\nfunction stackIcon(size: number) {\n return {\n type: \"svg\",\n props: {\n width: size,\n height: size,\n viewBox: \"0 0 32 32\",\n children: [\n { type: \"rect\", props: { x: 9, y: 3, width: 18, height: 22, rx: 3, fill: \"#bfdbfe\" } },\n { type: \"rect\", props: { x: 6, y: 6, width: 18, height: 22, rx: 3, fill: \"#60a5fa\" } },\n { type: \"rect\", props: { x: 3, y: 9, width: 18, height: 22, rx: 3, fill: \"#2563eb\" } },\n { type: \"rect\", props: { x: 6, y: 14, width: 12, height: 1.6, rx: 0.8, fill: \"#ffffff\" } },\n { type: \"rect\", props: { x: 6, y: 18, width: 9, height: 1.6, rx: 0.8, fill: \"#ffffff\" } },\n { type: \"rect\", props: { x: 6, y: 22, width: 11, height: 1.6, rx: 0.8, fill: \"#dbeafe\" } },\n ],\n },\n };\n}\n\nasync function renderSvg(count: number): Promise {\n const { bold, regular } = await loadFonts();\n const tree = {\n type: \"div\",\n props: {\n style: {\n width: \"1200px\",\n height: \"630px\",\n display: \"flex\",\n background: \"#fafafa\",\n padding: \"56px\",\n fontFamily: \"Sans\",\n },\n children: [\n {\n type: \"div\",\n props: {\n style: {\n flex: 1,\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n padding: \"0 72px\",\n border: \"1px solid #e5e5e5\",\n borderRadius: \"28px\",\n background: \"#ffffff\",\n },\n children: [\n {\n type: \"div\",\n props: {\n style: { display: \"flex\", flexDirection: \"column\", maxWidth: \"640px\" },\n children: [\n {\n type: \"div\",\n props: {\n style: { display: \"flex\", fontSize: 28, fontWeight: 700, color: \"#2563eb\", letterSpacing: \"6px\" },\n children: \"SKILL LIBRARY\",\n },\n },\n {\n type: \"div\",\n props: {\n style: { display: \"flex\", fontSize: 104, fontWeight: 700, color: \"#171717\", letterSpacing: \"-3px\", marginTop: \"18px\" },\n children: \"Skill Library\",\n },\n },\n {\n type: \"div\",\n props: {\n style: { display: \"flex\", fontSize: 36, color: \"#525252\", lineHeight: 1.35, marginTop: \"20px\" },\n children: \"A shared library of reusable agent skills. Fork it and drop in your own.\",\n },\n },\n {\n type: \"div\",\n props: {\n style: { display: \"flex\", flexDirection: \"row\", gap: \"14px\", marginTop: \"34px\" },\n children: [pill(`${count} skill${count === 1 ? \"\" : \"s\"}`), pill(\"Built on Val Town\")],\n },\n },\n ],\n },\n },\n stackIcon(300),\n ],\n },\n },\n ],\n },\n };\n return await satori(tree as any, {\n width: 1200,\n height: 630,\n fonts: [\n { name: \"Sans\", data: bold, weight: 700, style: \"normal\" },\n { name: \"Sans\", data: regular, weight: 400, style: \"normal\" },\n ],\n });\n}\n\nexport async function renderOg(count: number): Promise {\n try {\n const svg = await renderSvg(count);\n await ensureResvg();\n const png = new Resvg(svg).render().asPng();\n return new Response(png, {\n headers: { \"content-type\": \"image/png\", \"cache-control\": \"public, max-age=3600\" },\n });\n } catch (err) {\n const msg = err instanceof Error ? err.stack || err.message : String(err);\n return new Response(`OG render failed:\\n${msg}`, {\n status: 500,\n headers: { \"content-type\": \"text/plain\" },\n });\n }\n}\n","label",[138],"bc24b7c1-46b9-454b-aa2e-5551714b1bd7","http.tsx",["D",1781043647946],14,"http","/** @jsxImportSource npm:hono@4/jsx */\n// Skill Library — thin HTTP orchestrator for the public catalog. Routes only;\n// markup lives in components/, data + helpers in lib/skills.ts, client JS in\n// frontend/client.js. A skill is just a folder under skills/ — the catalog is\n// derived at runtime from each SKILL.md's frontmatter (no manifest). See\n// README.md. (The Slack \"skills librarian\" bot lives in librarian/.)\n\nimport { Hono } from \"npm:hono@4\";\nimport { marked } from \"npm:marked@15\";\nimport { readFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\n\nimport {\n buildCopyPayload,\n esc,\n exampleAsset,\n getSkill,\n getSkills,\n parseFrontmatter,\n readSkillFile,\n} from \"./lib/skills.ts\";\nimport { librarianBar } from \"./lib/vt.ts\";\nimport { renderOg } from \"./og.ts\";\nimport { Layout } from \"./components/Layout.tsx\";\nimport { Home } from \"./components/Home.tsx\";\nimport { SkillDetail } from \"./components/SkillDetail.tsx\";\nimport { FileView } from \"./components/FileView.tsx\";\n\nconst app = new Hono();\napp.onError((err) => Promise.reject(err)); // full stack traces in logs\n\nconst origin = (c: { req: { url: string } }) => new URL(c.req.url).origin;\n\n// ── Public assets ────────────────────────────────────────────────────────────\n\napp.get(\"/client.js\", async () => {\n const js = await readFile(\"/frontend/client.js\", import.meta.url);\n return new Response(js, {\n headers: { \"content-type\": \"text/javascript; charset=utf-8\" },\n });\n});\n\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// Social card image (Open Graph / Twitter)\napp.get(\"/og.png\", async () => renderOg((await getSkills()).length));\n\n// ── Pages ────────────────────────────────────────────────────────────────────\n\napp.get(\"/\", async (c) =>\n c.html(\n \n \n ,\n ));\n\napp.get(\"/skills/:slug\", async (c) => {\n const skill = await getSkill(c.req.param(\"slug\"));\n if (!skill) return c.notFound();\n const rawMd = await readSkillFile(skill.slug, \"SKILL.md\");\n if (!rawMd) return c.notFound();\n const { body } = parseFrontmatter(rawMd);\n const html = await marked.parse(body);\n const payload = buildCopyPayload(skill, rawMd); // payload keeps frontmatter — that IS the skill format\n // Live preview = the skill's first assets/*.html (see lib/skills.ts).\n const examplePath = exampleAsset(skill);\n const exampleHtml = examplePath\n ? (await readSkillFile(skill.slug, examplePath)) ?? undefined\n : undefined;\n return c.html(\n \n \n ,\n );\n});\n\n// Standalone, embeddable render of a skill's live example asset. Same design\n// system, no surrounding app chrome.\napp.get(\"/skills/:slug/example\", async (c) => {\n const skill = await getSkill(c.req.param(\"slug\"));\n const examplePath = skill && exampleAsset(skill);\n if (!skill || !examplePath) return c.notFound();\n const html = await readSkillFile(skill.slug, examplePath);\n if (html == null) return c.notFound();\n return c.html(\n \n \n ← {skill.name}\n \n

\n {skill.name} — examples\n

\n ,\n );\n});\n\napp.get(\"/skills/:slug/files/*\", async (c) => {\n const skill = await getSkill(c.req.param(\"slug\"));\n if (!skill) return c.notFound();\n const path = c.req.path.replace(`/skills/${skill.slug}/files/`, \"\");\n if (!skill.files.includes(path)) return c.notFound();\n const content = await readSkillFile(skill.slug, path);\n if (content === null) return c.notFound();\n const isMarkdown = path.endsWith(\".md\");\n const rendered = isMarkdown\n ? await marked.parse(parseFrontmatter(content).body)\n : `

${esc(content)}

`;\n return c.html(\n \n \n ,\n );\n});\n\nexport default app.fetch;\n",[148],"64a5042f-93c4-4d6a-ad02-1abe28da36fe","README.md","6f71b83e-611a-11f1-b6b7-1607ee4eb77e",["D",1781043647946],"# Skill Library\n\nA directory of reusable **agent skills**. Each skill is a folder of Markdown and\ncode; the app renders every skill's `SKILL.md` and gives you a one-click **Copy\nskill** button that puts a ready-to-run payload on your clipboard.\n\nA skill is **just a folder** — drop `skills//SKILL.md` in and it shows up.\nThere's no manifest to keep in sync. There's also a **Slack \"Skills Librarian\"**\nbot (in `librarian/`) that can list, explain, and CRUD skills by chat.\n\n🔗 **Catalog:** https://dcm31--92861134610211f1a0c51607ee4eb77e.web.val.run\n\n## How a skill is structured\n\nA skill is a folder under `skills//` following the standard Agent-Skills\nlayout, so it stays valid and discoverable by agents reading it outside this app:\n\n```\nskills//\n SKILL.md # entry point — what the skill does and the flow to follow\n scripts/ # runnable code the agent writes locally\n knowledge/ # reference docs the agent reads for context\n assets/ # optional HTML fragment, shown as a live example\n```\n\nOnly `SKILL.md` is required. Its YAML frontmatter is the skill's metadata —\n**this is the single source of truth; there is no separate manifest:**\n\n```markdown\n---\nname: PR Summarizer\ndescription: Reads a GitHub PR diff and writes a release note. Use when…\ncategory: Engineering\n---\n\n# PR Summarizer\n…the instructions an agent follows…\n```\n\nThe catalog is derived at request time: the app lists `skills/*`, reads each\n`SKILL.md`'s frontmatter for `name` / `description` / `category`, and collects\nthe folder's files. Add a folder → it appears. Edit frontmatter → the card\nupdates. (`name` falls back to a title-cased slug, `category` to\n\"Uncategorized\", if you omit them.)\n\n## Managing skills\n\nThree ways, in increasing convenience:\n\n1. **The Slack Skills Librarian** (see below) — \"list the skills\", \"how does X\n work\", \"create a skill that…\", \"change the UI skill to…\".\n2. **A coding agent** via the Val Town plugin (Claude Code / Codex / Cursor):\n `npx plugins add val-town/plugins`, then ask it to add or edit a skill.\n3. **By hand** in the Val Town editor — a skill's body is plain Markdown, so a\n typo fix is a two-second edit that deploys on save.\n\n## The Slack Skills Librarian (`librarian/`)\n\nA Slack agent (Claude + the Vercel AI SDK, built on the `templates/ai-slackbot`\nquickstart) that manages this library through a small set of structured tools.\nThe design split: **reads are broad, writes are deliberate.**\n\n| Tool | What it does |\n| --- | --- |\n| `list_skills` | Lightweight catalog (name / category / description) |\n| `read_skill` / `read_skill_file` | Read a skill's SKILL.md or a supporting file |\n| `create_skill` | New skill — writes the folder + SKILL.md with correct frontmatter |\n| `update_skill` | Change metadata, body, or one file of an existing skill |\n| `delete_skill` | Remove a skill (guarded by an explicit `confirm`) |\n\n`create_skill` / `update_skill` own the folder-and-frontmatter shape, so the bot\ncan't produce a malformed skill, and every write is scoped to this val's\n`skills/` folder. Reads use `std/utils` (token-free); writes use the Val Town\nREST API with a token (`VALTOWN_TOKEN`) and target the **current branch**, so on\nthe `librarian` branch new skills land on the branch until you merge to `main`.\n\n### Setup\n\n1. Open the bot's HTTP endpoint (the `librarian/events.ts` file's URL) and click\n **Create Slack App →** — scopes, events, and the webhook URL are pre-filled\n from a manifest.\n2. Install the app to your workspace, then set four environment variables on\n this val:\n - `SLACK_BOT_TOKEN`, `SLACK_SIGNING_SECRET` — from the Slack app\n - `ANTHROPIC_API_KEY` — for the model\n - `VALTOWN_TOKEN` — a Val Town API token with val write access (this is what\n lets the librarian edit skills; only the skill-CRUD tools use it)\n3. Message the bot in its Assistant tab or `@mention` it in a channel.\n\n> **Note:** the bot authenticates to Val Town with a single service token\n> (`VALTOWN_TOKEN`) for now. Swapping this for one-click Val Town OAuth (so you\n> authorize the bot instead of pasting a token) is a planned follow-up — the\n> token is read in one place (`lib/vt.ts`) so OAuth drops in there.\n\n---\n\n## Live examples\n\nA skill can ship a live preview — a working UI rendered right on its page. Drop\nan HTML fragment in the skill's `assets/` folder (e.g. `assets/showcase.html`)\nand reference it from `SKILL.md` with a Markdown link. The app renders the first\n`assets/*.html` it finds as an **Examples** panel, and serves it standalone\n(iframe-embeddable) at `/skills//example`. The **ui-example** skill ships\none and walks through the feature.\n\n## Technical details\n\n### Files\n\n```\nhttp.tsx # public catalog routes\nlib/skills.ts # skill discovery (folder → catalog), file + copy-payload helpers, frontmatter parse\nlib/vt.ts # Val Town REST client: skill writes + a catalog read-list fallback\nog.ts # social card image\ncomponents/ # Layout, Home, SkillDetail, FileView, FileTree\nfrontend/client.js # clipboard wiring for [data-copy] buttons\nskills// # the skills themselves (source of truth)\nlibrarian/ # the Slack Skills Librarian bot\n events.ts # HTTP entry: setup page + Slack /events + /process\n generate-response.ts # the agent loop (Claude + tools)\n skill-tools.ts # list / read / create / update / delete tools\n slack-utils.ts # Slack client, verification, thread reconstruction\n handle-*.ts # app_mention / message / thread_started handlers\n prompt.md # librarian system prompt\n```\n\n### Catalog routes\n\n| Route | Purpose |\n| --- | --- |\n| `/` | Home — grid of skill cards |\n| `/skills/:slug` | Skill detail — rendered `SKILL.md`, Copy button, file tree |\n| `/skills/:slug/example` | Standalone live example (when a skill ships an `assets/*.html`) |\n| `/skills/:slug/files/*` | Raw file viewer |\n| `/client.js`, `/source`, `/og.png` | Clipboard JS, source redirect, social card |\n\n### Gating it to your team\n\nBy default the catalog is public. To restrict it to a Val Town org, sign requests\nthrough `std/oauth` and check the signed-in user against your org's members (wrap\nthe `http.tsx` `fetch` export with the OAuth middleware). Requires a Teams\naccount.\n",[155],"208bcc7a-dbb3-4d97-b6b5-79f20ea31507","a1b35e7d-59ce-4d6b-8738-2d706101a7d2",60,["D",1780696519223],"directory",[46],"0ec00c07-4172-455a-a089-4640bf5fb515","librarian","019eae79-55cb-7558-864f-4ba98efbe737",["D",1781043647946],0,[167],"7bda0f03-93e2-4732-a3a6-6a2e07040a64","lib","12f0707e-2c4a-41a9-92ef-370a78c04011",8,["D",1780690030621],[173],"13306b3b-c86a-4aed-acf5-e5718b8ed0da","frontend","0f3784d6-e4a2-4781-a7f4-2d6a3fea5d8d",9,["D",1780690033369],[179],"09b94b55-391d-44c3-9b5c-7c1312d29db4","components","d0b511be-7c7d-403e-addd-624c52fec544",10,["D",1780690053093],[185],"pulls","branches",2,"forks","envVars",{"_198":200,"_201":200},"connections",{"_198":170,"_199":170},"count","unfilledCount",4,"emptyCount",{"_44":184,"_32":185,"_30":186,"_140":-5,"_42":43,"_41":187,"_142":60,"_39":492,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":493,"_27":494},{"_44":484,"_32":485,"_30":486,"_140":186,"_42":43,"_41":487,"_142":60,"_39":488,"_13":64,"_34":35,"_36":489,"_24":25,"_145":-5,"_244":490,"_27":491},{"_44":476,"_32":477,"_30":478,"_140":186,"_42":43,"_41":479,"_142":60,"_39":480,"_13":64,"_34":35,"_36":481,"_24":25,"_145":-5,"_244":482,"_27":483},{"_44":469,"_32":470,"_30":471,"_140":186,"_42":43,"_41":141,"_142":60,"_39":472,"_13":192,"_34":35,"_36":473,"_24":25,"_145":-5,"_244":474,"_27":475},{"_44":462,"_32":463,"_30":464,"_140":186,"_42":43,"_41":141,"_142":60,"_39":465,"_13":306,"_34":35,"_36":466,"_24":25,"_145":-5,"_244":467,"_27":468},{"_44":454,"_32":455,"_30":456,"_140":186,"_42":43,"_41":457,"_142":60,"_39":458,"_13":317,"_34":35,"_36":459,"_24":25,"_145":-5,"_244":460,"_27":461},{"_44":447,"_32":448,"_30":449,"_140":186,"_42":43,"_41":141,"_142":25,"_39":450,"_13":170,"_34":35,"_36":451,"_24":25,"_145":-5,"_244":452,"_27":453},{"_44":178,"_32":179,"_30":180,"_140":-5,"_42":43,"_41":181,"_142":60,"_39":444,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":445,"_27":446},{"_44":437,"_32":438,"_30":439,"_140":180,"_42":43,"_41":181,"_142":60,"_39":440,"_13":170,"_34":35,"_36":441,"_24":25,"_145":-5,"_244":442,"_27":443},{"_44":172,"_32":173,"_30":174,"_140":-5,"_42":43,"_41":175,"_142":60,"_39":434,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":435,"_27":436},{"_44":427,"_32":428,"_30":429,"_140":174,"_42":43,"_41":141,"_142":60,"_39":430,"_13":200,"_34":35,"_36":431,"_24":25,"_145":-5,"_244":432,"_27":433},{"_44":423,"_32":33,"_30":31,"_140":174,"_42":43,"_41":14,"_142":25,"_39":424,"_13":64,"_34":35,"_36":38,"_24":25,"_145":-5,"_244":425,"_27":426},{"_44":166,"_32":167,"_30":168,"_140":-5,"_42":43,"_41":141,"_142":60,"_39":420,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":421,"_27":422},{"_44":413,"_32":414,"_30":415,"_140":168,"_42":43,"_41":141,"_142":25,"_39":416,"_13":170,"_34":151,"_36":417,"_24":25,"_145":-5,"_244":418,"_27":419},{"_44":406,"_32":407,"_30":408,"_140":168,"_42":43,"_41":141,"_142":60,"_39":409,"_13":170,"_34":151,"_36":410,"_24":25,"_145":-5,"_244":411,"_27":412},{"_44":399,"_32":400,"_30":401,"_140":168,"_42":43,"_41":141,"_142":25,"_39":402,"_13":170,"_34":151,"_36":403,"_24":25,"_145":-5,"_244":404,"_27":405},{"_44":392,"_32":393,"_30":394,"_140":168,"_42":43,"_41":141,"_142":60,"_39":395,"_13":170,"_34":35,"_36":396,"_24":25,"_145":-5,"_244":397,"_27":398},{"_44":385,"_32":386,"_30":387,"_140":168,"_42":43,"_41":141,"_142":25,"_39":388,"_13":170,"_34":35,"_36":389,"_24":25,"_145":-5,"_244":390,"_27":391},{"_44":378,"_32":379,"_30":380,"_140":168,"_42":43,"_41":141,"_142":25,"_39":381,"_13":170,"_34":35,"_36":382,"_24":25,"_145":-5,"_244":383,"_27":384},{"_44":371,"_32":372,"_30":373,"_140":168,"_42":43,"_41":141,"_142":25,"_39":374,"_13":170,"_34":35,"_36":375,"_24":25,"_145":-5,"_244":376,"_27":377},{"_44":364,"_32":365,"_30":366,"_140":168,"_42":43,"_41":141,"_142":60,"_39":367,"_13":170,"_34":20,"_36":368,"_24":25,"_145":-5,"_244":369,"_27":370},{"_44":357,"_32":358,"_30":359,"_140":168,"_42":43,"_41":141,"_142":60,"_39":360,"_13":170,"_34":35,"_36":361,"_24":25,"_145":-5,"_244":362,"_27":363},{"_44":350,"_32":351,"_30":352,"_140":168,"_42":43,"_41":141,"_142":25,"_39":353,"_13":170,"_34":35,"_36":354,"_24":25,"_145":-5,"_244":355,"_27":356},{"_44":160,"_32":46,"_30":161,"_140":-5,"_42":43,"_41":162,"_142":60,"_39":347,"_13":64,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":348,"_27":349},{"_44":342,"_32":328,"_30":323,"_140":161,"_42":43,"_41":343,"_142":60,"_39":344,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":345,"_27":346},{"_44":338,"_32":311,"_30":332,"_140":323,"_42":43,"_41":333,"_142":60,"_39":339,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":340,"_27":341},{"_44":329,"_32":330,"_30":331,"_140":332,"_42":43,"_41":333,"_142":60,"_39":334,"_13":170,"_34":20,"_36":335,"_24":25,"_145":-5,"_244":336,"_27":337},{"_44":321,"_32":254,"_30":322,"_140":323,"_42":43,"_41":141,"_142":60,"_39":324,"_13":64,"_34":20,"_36":325,"_24":25,"_145":-5,"_244":326,"_27":327},{"_44":316,"_32":288,"_30":283,"_140":161,"_42":43,"_41":317,"_142":60,"_39":318,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":319,"_27":320},{"_44":312,"_32":311,"_30":305,"_140":283,"_42":43,"_41":306,"_142":60,"_39":313,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":314,"_27":315},{"_44":302,"_32":303,"_30":304,"_140":305,"_42":43,"_41":306,"_142":60,"_39":307,"_13":170,"_34":20,"_36":308,"_24":25,"_145":-5,"_244":309,"_27":310},{"_44":298,"_32":297,"_30":292,"_140":283,"_42":43,"_41":200,"_142":60,"_39":299,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":300,"_27":301},{"_44":289,"_32":290,"_30":291,"_140":292,"_42":43,"_41":200,"_142":60,"_39":293,"_13":170,"_34":35,"_36":294,"_24":25,"_145":-5,"_244":295,"_27":296},{"_44":281,"_32":254,"_30":282,"_140":283,"_42":43,"_41":141,"_142":60,"_39":284,"_13":64,"_34":20,"_36":285,"_24":25,"_145":-5,"_244":286,"_27":287},{"_44":276,"_32":261,"_30":256,"_140":161,"_42":43,"_41":277,"_142":60,"_39":278,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":279,"_27":280},{"_44":272,"_32":271,"_30":265,"_140":256,"_42":43,"_41":266,"_142":60,"_39":273,"_13":170,"_34":164,"_36":-5,"_24":25,"_145":-5,"_244":274,"_27":275},{"_44":262,"_32":263,"_30":264,"_140":265,"_42":43,"_41":266,"_142":60,"_39":267,"_13":170,"_34":20,"_36":268,"_24":25,"_145":-5,"_244":269,"_27":270},{"_44":253,"_32":254,"_30":255,"_140":256,"_42":43,"_41":141,"_142":60,"_39":257,"_13":175,"_34":20,"_36":258,"_24":25,"_145":-5,"_244":259,"_27":260},{"_44":154,"_32":155,"_30":156,"_140":-5,"_42":43,"_41":141,"_142":25,"_39":250,"_13":150,"_34":20,"_36":158,"_24":25,"_145":-5,"_244":251,"_27":252},{"_44":147,"_32":148,"_30":58,"_140":-5,"_42":43,"_41":141,"_142":25,"_39":247,"_13":150,"_34":151,"_36":152,"_24":25,"_145":-5,"_244":248,"_27":249},{"_44":137,"_32":138,"_30":139,"_140":-5,"_42":43,"_41":141,"_142":60,"_39":243,"_13":64,"_34":35,"_36":144,"_24":25,"_145":-5,"_244":245,"_27":246},["D",1781043647946],"children",[],[138],["D",1781043647946],[],[148],["D",1781043647946],[],[155],"ed64a881-0960-4fb0-b3f3-d4782f61a9cb","SKILL.md","5b495132-611a-11f1-ac10-1607ee4eb77e","82af8637-3f7d-4a48-b2eb-33adcb23f00e",["D",1781043647946],"---\nname: UI Example\ndescription: Shows off the live-example feature — a skill that ships an HTML fragment, rendered inline on its page and standalone. Read it to learn how examples work.\ncategory: Reference\n---\n\n# UI Example\n\n> This skill exists to demonstrate the library's **live-example feature** — and to double as a quick reference for the design system every page here inherits. Scroll up: the **Examples** panel above this text is rendered live from the HTML fragment this skill ships.\n\n## What you're looking at\n\nA skill can ship a single HTML fragment under its `assets/` directory. When it does, two things happen automatically:\n\n1. It renders as an **Examples** panel at the top of the skill page (the box above).\n2. It's served on its own, full-bleed, at `/skills//example` — open it with the **\"Open standalone ↗\"** link. That URL is embeddable (drop it in an `

Diff · v75