[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_403":404,"_405":406},"routes/_app.x.$handle.$name",{"_102":101,"_38":50,"_111":92,"_33":112,"_13":14,"_113":-5,"_11":114,"_115":116,"_117":118,"_119":120,"_121":122,"_26":-5,"_123":-5,"_124":-5,"_125":31,"_126":127,"_128":64,"_129":-5,"_130":-5,"_131":132},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_48":49,"_38":50,"_43":51,"_52":-5,"_53":31,"_54":55,"_56":55,"_57":58,"_59":-5,"_19":60,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":-5,"_72":-5,"_73":-5,"_74":-5,"_75":76,"_77":76,"_78":79,"_80":79,"_81":79,"_82":76,"_83":76,"_84":85,"_86":87,"_88":89,"_90":31},"version",61,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","239daea9-879a-4166-b0f2-48e4c2191a5b","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":29,"_30":31,"_32":31,"_33":34,"_35":34},"file",{"_36":37,"_38":34,"_39":26,"_40":42,"_43":44,"_45":14,"_46":47,"_30":31},"previous",{"_36":37,"_38":34,"_39":26,"_40":41},"deleted",false,"deletedHere","path","README.md","latestPath","fileId","6f71b83e-611a-11f1-b6b7-1607ee4eb77e","name","fileType","content","# Skill Library (template)\n\nA public, forkable template for a shared **agent skill library**. It lists\nreusable agent skills, renders each one's `SKILL.md`, and gives you a one-click\n**Copy skill** button that puts a ready-to-run payload on your clipboard.\n\nStyled with plain defaults — system font, a neutral palette, one blue accent —\nand Twind (Tailwind utilities applied at runtime, no build step).\n\n🔗 **Live:** https://dcm31--92861134610211f1a0c51607ee4eb77e.web.val.run\n\n## Fork it\n\n1. Remix this val.\n2. Set `VAL_ID` in `lib/skills.ts` to your `/` (it's baked into the\n copy payload so agents know where to read each skill's files).\n3. Replace the `skills/` folders and the `SKILLS` manifest with your own.\n\nThere's no auth — the template is fully public. (Add a gate in `http.tsx` if you\nwant one.)\n\n## Architecture\n\nServer-rendered Hono app using **Hono JSX** components and **Twind** (Tailwind\nutilities at runtime, no build step). Each request renders a component tree;\nthere is no client-side framework — the only browser JS is the clipboard wiring\nin `frontend/client.js`, served at `/client.js`.\n\n```\nhttp.tsx # thin orchestrator: routes only\nlib/\n skills.ts # SKILLS manifest, file helpers, copy-payload, frontmatter parse\ncomponents/\n Layout.tsx # HTML shell: Twind, system font, markdown CSS\n Home.tsx # skill grid\n SkillDetail.tsx # rendered SKILL.md + copy button + live example + file tree\n FileView.tsx # raw file viewer\n FileTree.tsx # sidebar file tree\nfrontend/\n client.js # clipboard wiring for [data-copy] buttons (served at /client.js)\nskills/\n /\n SKILL.md # entry point — what the skill does + the flow\n scripts/ # runnable code the agent writes locally\n knowledge/ # reference docs the agent reads\n assets/ # optional — HTML fragment shown live on the skill page\n```\n\nThe folder names (`scripts/`, `knowledge/`/`references/`, `assets/`) follow the\nstandard Agent-Skills layout, so the skills validate and stay discoverable by\nagents reading them outside this app.\n\n## Examples (optional, per-skill)\n\nA skill can ship a live preview: drop an HTML fragment in the skill's standard\n`assets/` directory (e.g. `assets/showcase.html`) and list it in the manifest's\n`files`. The app renders the first `assets/*.html` it finds as an **Examples**\npanel on the skill page, and serves it standalone (and embeddable) at\n`/skills//example`. **Reference the file from the skill's `SKILL.md`** (a\nMarkdown link) so agents using the standard skill structure discover it too. The\n**ui-example** skill ships one and explains the feature.\n\n## Routes\n\n| Route | Purpose |\n| --- | --- |\n| `/` | Home — grid of skill cards |\n| `/skills/:slug` | Skill detail — rendered `SKILL.md` + Copy skill button + file tree |\n| `/skills/:slug/example` | Standalone live example (skills with an `assets/*.html` fragment) |\n| `/skills/:slug/files/*` | Raw file viewer for any file in a skill |\n| `/client.js` | Clipboard wiring, served as a module |\n| `/source` | Redirects to this val's source |\n\n## Adding a skill\n\n1. Create `skills//SKILL.md` plus any `scripts/`, `knowledge/`, or\n `assets/` files.\n2. Add an entry to the `SKILLS` array in `lib/skills.ts` — `slug`, `name`,\n `description`, `category`, and the full `files` list.\n\n## Conventions\n\nHono JSX in `.tsx` files (no template-string HTML), Twind/Tailwind styling, a\n`/source` view-source link, and `app.onError` for full stack traces. The one\nscoped `

Diff · v61