[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-85121":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":16,"stars7d":16,"stars30d":16,"stars90d":16,"forks30d":16,"starsTrendScore":16,"compositeScore":17,"rankGlobal":10,"rankLanguage":10,"license":18,"archived":19,"fork":19,"defaultBranch":20,"hasWiki":19,"hasPages":19,"topics":21,"createdAt":10,"pushedAt":10,"updatedAt":22,"readmeContent":23,"aiSummary":10,"trendingCount":16,"starSnapshotCount":16,"syncStatus":15,"lastSyncTime":24,"discoverSource":25},85121,"sideshow","modem-dev\u002Fsideshow","modem-dev","A live visual surface for terminal coding agents — agents draw HTML snippets, you watch and comment back","",null,"TypeScript",66,1,52,2,0,36,"MIT License",false,"main",[],"2026-06-15 10:04:33","# sideshow\n\n[![CI](https:\u002F\u002Fgithub.com\u002Fmodem-dev\u002Fsideshow\u002Factions\u002Fworkflows\u002Fci.yml\u002Fbadge.svg)](https:\u002F\u002Fgithub.com\u002Fmodem-dev\u002Fsideshow\u002Factions\u002Fworkflows\u002Fci.yml)\n[![License: MIT](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FLicense-MIT-blue.svg)](LICENSE)\n\nA live visual surface for terminal coding agents.\n\nLet agents say it in HTML — diagrams, UI sketches, charts. sideshow is a small\nserver with a browser viewer: agents publish HTML snippets from the terminal,\nthey render live, and you comment back. Your comments reach the agent.\n\n\u003Cpicture>\n  \u003Csource media=\"(prefers-color-scheme: dark)\" srcset=\"docs\u002Fsideshow-dark.png\">\n  \u003Cimg alt=\"The sideshow viewer: agent sessions in a sidebar, a published JWT-flow diagram with a comment thread between the user and claude-code, and an interactive backoff explainer below\" src=\"docs\u002Fsideshow-light.png\">\n\u003C\u002Fpicture>\n\nAn agent sketched a sequence diagram during an auth refactor; the user asked a\nquestion under it, and the agent replied and revised.\n\nThe loop — publish, render, comment, revise:\n\n![Animated demo: an agent publishes a diagram that appears live in the viewer, the user types a question under it, and the agent revises the snippet to a second version and replies in the thread](docs\u002Fsideshow-demo.gif)\n\n## Quick start\n\nRequires Node 22.18 or newer.\n\n```sh\nnpm install\nnpx sideshow serve --open   # viewer on http:\u002F\u002Flocalhost:4242\n```\n\nThen point your agent at the surface:\n\n```sh\ncurl -s http:\u002F\u002Flocalhost:4242\u002Fsetup >> AGENTS.md\n```\n\nThat block teaches any agent with a shell (pi, opencode, amp, codex, Claude\nCode) to publish snippets and poll for comments over curl.\n\nNo agent handy? `npx sideshow demo` seeds two example sessions to look around.\n\n## Connecting agents\n\nPick whichever tier the agent supports — each one covers the full loop.\n\n**Shell.** The `sideshow` CLI has no dependencies and groups sessions for you:\n\n```sh\nsideshow publish sketch.html --title \"Cache layout\"\nsideshow wait      # block until the user comments\n```\n\n**MCP.** Tools: `publish_snippet`, `update_snippet`, `wait_for_feedback`,\n`reply_to_user`, `list_snippets`, `get_design_guide`. Connect over stdio or\nstraight to the server at `\u002Fmcp`:\n\n```sh\nclaude mcp add --scope user sideshow -- npx -y sideshow mcp\n# or, no local process:\nclaude mcp add --scope user --transport http sideshow http:\u002F\u002Flocalhost:4242\u002Fmcp\n```\n\n**Plain HTTP.** `POST \u002Fapi\u002Fsnippets`, `PUT \u002Fapi\u002Fsnippets\u002F:id`, and\n`GET \u002Fapi\u002Fcomments?wait=60` for long-polling. Documented at `\u002Fguide`.\n\nMCP agents get usage instructions automatically; everything else uses the\n`\u002Fsetup` block above. Claude Code users can also install the skill in\n`skills\u002Fsideshow\u002F` (`cp -r skills\u002Fsideshow ~\u002F.claude\u002Fskills\u002F`).\n\n## Concepts\n\n- **Session** — one agent conversation. Sessions appear in the viewer sidebar;\n  click a title to rename, hover to delete.\n- **Snippet** — one published HTML fragment. It renders in a sandboxed iframe\n  (`sandbox=\"allow-scripts\"`, no same-origin) under a CSP that limits external\n  resources to a short CDN allowlist. Updating a snippet creates a new version;\n  old versions stay viewable.\n- **Comment thread** — every snippet has one. You write in the browser; agents\n  read via long-poll (`sideshow wait` or `wait_for_feedback`) and reply. A\n  snippet can also call `sendPrompt('...')` to post to its own thread.\n\nThe design contract at `\u002Fguide` tells agents how to write snippets that fit the\nviewer: fragment-only HTML, theme CSS variables, dark mode rules.\n\n## Architecture\n\n- `server\u002Fapp.ts` — runtime-agnostic Hono app: REST API, SSE live feed,\n  long-poll comments, snippet renderer, MCP endpoint.\n- `server\u002Fstorage.ts` — `Store` interface and the JSON-file implementation.\n- `viewer\u002F` — the viewer, a single static HTML file.\n- `bin\u002Fsideshow.js` — CLI, Node built-ins only.\n- `mcp\u002Fserver.ts` — stdio MCP server, a thin client over the HTTP API.\n- `workers\u002F` — Cloudflare entry point and SQLite store.\n\n## Deploying to Cloudflare\n\nThe same app runs on Cloudflare Workers — for when agents run on a different\nmachine than the browser, or you want the viewer on your phone.\n\n```sh\nnpx wrangler login\nnpx wrangler secret put SIDESHOW_TOKEN   # any long random string\nnpm run deploy                           # https:\u002F\u002Fsideshow.\u003Caccount>.workers.dev\n```\n\nA deployed instance requires the token on every request. Open the viewer once\nas `\u002F?key=\u003Ctoken>` to set a cookie. Agents need two environment variables; the\nCLI and stdio MCP pick them up automatically:\n\n```sh\nexport SIDESHOW_URL=https:\u002F\u002Fsideshow.\u003Caccount>.workers.dev\nexport SIDESHOW_TOKEN=\u003Ctoken>\n```\n\nRemote agents can connect MCP straight to the deployment:\n\n```sh\nclaude mcp add --transport http sideshow https:\u002F\u002Fsideshow.\u003Caccount>.workers.dev\u002Fmcp \\\n  --header \"Authorization: Bearer $SIDESHOW_TOKEN\"\n```\n\nThe whole app runs inside a single Durable Object with SQLite storage. One\ninstance per board keeps the in-memory event bus authoritative, so SSE and\nlong-polling behave the same as the local server.\n\n## Development\n\n```sh\nnpm run dev          # server with watch + viewer watch build\nnpm test             # node --test\nnpm run typecheck    # tsc --noEmit\nnpm run lint         # oxlint\nnpm run format       # oxfmt\n```\n\nThe server and CLI have no build step — TypeScript runs directly on Node via\nnative type-stripping, and the npm package ships compiled JS built on prepack.\nThe viewer (`viewer\u002Fsrc\u002F`, Solid) is the exception: Vite builds it into a\nsingle self-contained `viewer\u002Fdist\u002Findex.html` (`npm run build:viewer`). See\n[AGENTS.md](AGENTS.md) for architecture rules.\n\n## License\n\n[MIT](LICENSE)\n","2026-06-15 02:30:05","CREATED_QUERY"]