viagen 0.0.56 → 0.1.2

package/dist/cli.js

@@ -252,7 +252,9 @@ async function deploySandbox(opts) {
       sandboxId: sandbox2.sandboxId,
       mode: useGit ? "git" : "upload",
       streamLogs: (opts2) => devServer.logs(opts2),
-      stop: () => sandbox2.stop()
+      stop: async () => {
+        await sandbox2.stop();
+      }
     };
   } catch (err) {
     await sandbox2.stop().catch(() => {

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import { Plugin } from 'vite';
+import { McpServerConfig } from '@anthropic-ai/claude-agent-sdk';
 
 declare const DEFAULT_SYSTEM_PROMPT = "\n  You are embedded in a Vite dev server as the \"viagen\" plugin.\n  Your job is to help build and modify the app. Files you edit will trigger Vite HMR automatically.\n  You can read .viagen/server.log to check recent Vite dev server output (compile errors, HMR updates, warnings).\n  Be concise.\n\n  You have agent-browser available for interacting with the running app in a real browser.\n  Use it to visually verify your changes, test interactions, and catch UI issues.\n  Key commands:\n    agent-browser open <url>          \u2014 open a page\n    agent-browser snapshot            \u2014 get accessibility tree with element refs (@e1, @e2, etc.)\n    agent-browser click @e<N>         \u2014 click an element by ref\n    agent-browser fill @e<N> \"value\"  \u2014 fill an input\n    agent-browser screenshot <file>   \u2014 capture a screenshot (you can view the image)\n    agent-browser diff snapshot --baseline <file> \u2014 compare page state before/after\n    agent-browser close               \u2014 close the browser\n  After making changes, consider using agent-browser to verify the result visually.\n";
 
@@ -97,6 +98,8 @@ interface ViagenOptions {
      * @example ['src/components', '.env', 'vite.config.ts']
      */
     editable?: string[];
+    /** Additional MCP servers to make available to Claude. Merged with built-in viagen tools. */
+    mcpServers?: Record<string, McpServerConfig>;
     /** Enable verbose debug logging. Also enabled by VIAGEN_DEBUG=1 in .env. */
     debug?: boolean;
 }

package/dist/index.js

@@ -101,16 +101,17 @@ function registerHealthRoutes(server, env, errorRef) {
     const prompt = env["VIAGEN_PROMPT"] || null;
     const taskId = env["VIAGEN_TASK_ID"] || null;
     const environmentId = env["VIAGEN_ENVIRONMENT_ID"] || null;
+    const projectId = env["VIAGEN_PROJECT_ID"] || null;
     res.setHeader("Content-Type", "application/json");
     if (configured) {
-      res.end(JSON.stringify({ status: "ok", configured: true, git, vercel, branch, session, prompt, taskId, environmentId, missing }));
+      res.end(JSON.stringify({ status: "ok", configured: true, git, vercel, branch, session, prompt, taskId, environmentId, projectId, missing }));
     } else {
       res.end(
-        JSON.stringify({ status: "error", configured: false, git, vercel, branch, session, prompt, taskId, environmentId, missing })
+        JSON.stringify({ status: "error", configured: false, git, vercel, branch, session, prompt, taskId, environmentId, projectId, missing })
       );
     }
   });
-  const currentVersion = true ? "0.0.56" : "0.0.0";
+  const currentVersion = true ? "0.1.2" : "0.0.0";
   debug("health", `version resolved: ${currentVersion}`);
   let versionCache = null;
   server.middlewares.use("/via/version", (_req, res) => {
@@ -770,10 +771,10 @@ data: ${JSON.stringify(doneData)}
 `);
           res.end();
         }
-        if (opts.viagenClient && opts.environmentId) {
+        if (opts.viagenClient && opts.projectId) {
           const taskId = opts.env["VIAGEN_TASK_ID"];
           if (taskId && (event.inputTokens || event.outputTokens)) {
-            opts.viagenClient.tasks.update(opts.environmentId, taskId, {
+            opts.viagenClient.tasks.update(opts.projectId, taskId, {
               ...event.inputTokens != null && { inputTokens: event.inputTokens },
               ...event.outputTokens != null && { outputTokens: event.outputTokens }
             }).catch((err) => {
@@ -3798,7 +3799,7 @@ function buildUiHtml(opts) {
 
         // Store task context for history rendering
         healthTaskId = data.taskId || null;
-        healthProjectId = data.environmentId || null;
+        healthProjectId = data.projectId || data.environmentId || null;
 
         // Load chat history from server (source of truth)
         await loadHistory();
@@ -3892,7 +3893,7 @@ function buildUiHtml(opts) {
         if (data.prompt && data.configured && chatLog.length === 0) {
           if (data.taskId) {
             // Task mode: show link instead of raw prompt
-            var taskUrl = 'https://app.viagen.dev/environments/' + data.environmentId + '/tasks/' + data.taskId;
+            var taskUrl = 'https://app.viagen.dev/projects/' + (data.projectId || data.environmentId) + '/tasks/' + data.taskId;
             var div = document.createElement('div');
             div.className = 'msg msg-user';
             div.innerHTML = '<span class="label">Task</span><span class="text">Working on <a href="' + escapeHtml(taskUrl) + '" target="_blank" style="color:#2563eb;text-decoration:underline;">Via Task</a></span>';
@@ -4287,6 +4288,34 @@ function parseCookies(header) {
   }
   return cookies;
 }
+function buildWaitPage(targetUrl) {
+  return `<!DOCTYPE html>
+<html><head><meta charset="utf-8"><title>Loading\u2026</title>
+<style>
+  body { margin: 0; display: flex; align-items: center; justify-content: center;
+         height: 100vh; background: #0a0a0a; color: #888; font-family: system-ui; }
+  .spinner { width: 20px; height: 20px; border: 2px solid #333; border-top-color: #f97316;
+             border-radius: 50%; animation: spin .6s linear infinite; margin-right: 12px; }
+  @keyframes spin { to { transform: rotate(360deg); } }
+</style></head>
+<body><div class="spinner"></div><span>Starting dev server\u2026</span>
+<script>
+(async () => {
+  const target = ${JSON.stringify(targetUrl)};
+  for (let i = 0; i < 60; i++) {
+    try {
+      const r = await fetch(target, { credentials: 'same-origin' });
+      const text = await r.text();
+      // Vite is ready when we get a non-empty HTML response
+      if (r.ok && text.length > 0) { window.location.replace(target); return; }
+    } catch {}
+    await new Promise(r => setTimeout(r, 500));
+  }
+  // After 30s, navigate anyway \u2014 let the user see whatever error there is
+  window.location.replace(target);
+})();
+</script></body></html>`;
+}
 function createAuthMiddleware(token) {
   return function authMiddleware(req, res, next) {
     const url2 = new URL(req.url ?? "/", `http://${req.headers.host ?? "localhost"}`);
@@ -4294,26 +4323,26 @@ function createAuthMiddleware(token) {
     if (pathMatch && pathMatch[2] === token) {
       const cleanPath = pathMatch[1] || "/";
       const cleanUrl = cleanPath + (url2.search || "");
-      debug("auth", `token URL match (/t/:token) \u2192 redirect to ${cleanUrl}`);
+      debug("auth", `token URL match (/t/:token) \u2192 wait-page redirect to ${cleanUrl}`);
       res.setHeader(
         "Set-Cookie",
         `viagen_session=${token}; HttpOnly; SameSite=Lax; Path=/`
       );
-      res.writeHead(302, { Location: cleanUrl });
-      res.end();
+      res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+      res.end(buildWaitPage(cleanUrl));
       return;
     }
     const queryToken = url2.searchParams.get("token");
     if (queryToken === token) {
       url2.searchParams.delete("token");
       const cleanUrl = url2.pathname + (url2.search || "");
-      debug("auth", `query token match (?token=) \u2192 redirect to ${cleanUrl}`);
+      debug("auth", `query token match (?token=) \u2192 wait-page redirect to ${cleanUrl}`);
       res.setHeader(
         "Set-Cookie",
         `viagen_session=${token}; HttpOnly; SameSite=Lax; Path=/`
       );
-      res.writeHead(302, { Location: cleanUrl });
-      res.end();
+      res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+      res.end(buildWaitPage(cleanUrl));
       return;
     }
     if (req.headers.cookie) {
@@ -18657,7 +18686,7 @@ import {
   tool
 } from "@anthropic-ai/claude-agent-sdk";
 function createViagenTools(config2) {
-  const { client, environmentId } = config2;
+  const { client, projectId } = config2;
   const taskId = process.env["VIAGEN_TASK_ID"];
   const tools = [
     tool(
@@ -18682,7 +18711,7 @@ function createViagenTools(config2) {
         }
         const internalStatus = args.status === "review" ? "validating" : args.status === "completed" ? "completed" : args.status;
         try {
-          await client.tasks.update(environmentId, id, {
+          await client.tasks.update(projectId, id, {
             ...internalStatus && { status: internalStatus },
             ...args.prUrl && { prUrl: args.prUrl },
             result: args.result,
@@ -18703,12 +18732,12 @@ function createViagenTools(config2) {
     ),
     tool(
       "viagen_list_tasks",
-      "List tasks in the current environment. Optionally filter by status.",
+      "List tasks in the current project. Optionally filter by status.",
       {
         status: external_exports.enum(["ready", "running", "validating", "completed", "timed_out"]).optional().describe("Filter tasks by status.")
       },
       async (args) => {
-        const tasks = await client.tasks.list(environmentId, args.status);
+        const tasks = await client.tasks.list(projectId, args.status);
         return {
           content: [
             {
@@ -18726,7 +18755,7 @@ function createViagenTools(config2) {
         taskId: external_exports.string().describe("The task ID to retrieve.")
       },
       async (args) => {
-        const task = await client.tasks.get(environmentId, args.taskId);
+        const task = await client.tasks.get(projectId, args.taskId);
         return {
           content: [
             {
@@ -18739,14 +18768,14 @@ function createViagenTools(config2) {
     ),
     tool(
       "viagen_create_task",
-      "Create a new task in the current environment. Use this to create follow-up work.",
+      "Create a new task in the current project. Use this to create follow-up work.",
       {
         prompt: external_exports.string().describe("The task prompt / instructions."),
         branch: external_exports.string().optional().describe("Git branch name for the task."),
         type: external_exports.enum(["task", "plan"]).optional().describe("Task type: 'task' for code changes, 'plan' for implementation plans.")
       },
       async (args) => {
-        const task = await client.tasks.create(environmentId, {
+        const task = await client.tasks.create(projectId, {
           prompt: args.prompt,
           branch: args.branch,
           type: args.type
@@ -18793,12 +18822,12 @@ Constraints:
 `;
 var TASK_TOOLS_PROMPT = `
 You have access to viagen platform tools for task management:
-- viagen_list_tasks: List tasks in this environment (optionally filter by status)
+- viagen_list_tasks: List tasks in this project (optionally filter by status)
 - viagen_get_task: Get full details of a specific task
 - viagen_create_task: Create follow-up tasks for work you identify
 - viagen_update_task: Update a task's status ('review' or 'completed'). Accepts an optional taskId \u2014 defaults to the current task if one is set.
 
-Use these to understand environment context and create follow-up work when appropriate.
+Use these to understand project context and create follow-up work when appropriate.
 `;
 
 // src/index.ts
@@ -19049,7 +19078,9 @@ async function deploySandbox(opts) {
       sandboxId: sandbox.sandboxId,
       mode: useGit ? "git" : "upload",
       streamLogs: (opts2) => devServer.logs(opts2),
-      stop: () => sandbox.stop()
+      stop: async () => {
+        await sandbox.stop();
+      }
     };
   } catch (err) {
     await sandbox.stop().catch(() => {
@@ -19182,7 +19213,7 @@ ${payload.err.frame || ""}`
       }
       const platformToken = env["VIAGEN_USER_TOKEN"] || env["VIAGEN_AUTH_TOKEN"];
       const platformUrl = env["VIAGEN_PLATFORM_URL"] || "https://app.viagen.dev";
-      const environmentId = env["VIAGEN_ENVIRONMENT_ID"];
+      const projectId = env["VIAGEN_PROJECT_ID"];
       let viagenClient = null;
       if (platformToken) {
         viagenClient = createViagen({ token: platformToken, baseUrl: platformUrl });
@@ -19222,9 +19253,9 @@ ${payload.err.frame || ""}`
             res.end(JSON.stringify({ error: "Method not allowed" }));
             return;
           }
-          if (!viagenClient || !environmentId) {
+          if (!viagenClient || !projectId) {
             res.writeHead(503, { "Content-Type": "application/json" });
-            res.end(JSON.stringify({ error: "Task creation not configured: missing platform credentials or VIAGEN_ENVIRONMENT_ID" }));
+            res.end(JSON.stringify({ error: "Task creation not configured: missing platform credentials or VIAGEN_PROJECT_ID" }));
             return;
           }
           let body = "";
@@ -19246,7 +19277,7 @@ Page URL: ${pageUrl}`);
               if (screenshot) parts.push("\n[Screenshot attached]");
               parts.push("\n\n[Submitted via viagen preview feedback]");
               const fullPrompt = parts.join("");
-              const task = await viagenClient.tasks.create(environmentId, { prompt: fullPrompt, type: "task" });
+              const task = await viagenClient.tasks.create(projectId, { prompt: fullPrompt, type: "task" });
               if (screenshot && task.id) {
                 try {
                   const [header, b64] = screenshot.split(",");
@@ -19254,7 +19285,7 @@ Page URL: ${pageUrl}`);
                   const binary = Buffer.from(b64, "base64");
                   const blob = new Blob([binary], { type: mime });
                   const ext = mime === "image/png" ? "png" : "jpeg";
-                  await viagenClient.tasks.addAttachment(environmentId, task.id, blob, `screenshot.${ext}`);
+                  await viagenClient.tasks.addAttachment(projectId, task.id, blob, `screenshot.${ext}`);
                   debug("preview", `screenshot attached to task ${task.id}`);
                 } catch (attachErr) {
                   debug("preview", `screenshot attachment failed (non-fatal): ${attachErr}`);
@@ -19277,15 +19308,19 @@ Page URL: ${pageUrl}`);
       const resolvedModel = env["VIAGEN_MODEL"] || opts.model;
       debug("server", `creating ChatSession (model: ${resolvedModel})`);
       let mcpServers;
-      const hasPlatformContext = !!(viagenClient && environmentId);
+      const hasPlatformContext = !!(viagenClient && projectId);
       if (hasPlatformContext) {
         debug("server", "creating viagen MCP tools (platform connected)");
         const viagenMcp = createViagenTools({
           client: viagenClient,
-          environmentId
+          projectId
         });
         mcpServers = { [viagenMcp.name]: viagenMcp };
       }
+      if (options?.mcpServers) {
+        mcpServers = { ...mcpServers, ...options.mcpServers };
+        debug("server", `merged ${Object.keys(options.mcpServers).length} user MCP server(s)`);
+      }
       const isPlanMode = env["VIAGEN_TASK_TYPE"] === "plan";
       let systemPrompt = options?.systemPrompt;
       if (isPlanMode) {
@@ -19310,7 +19345,7 @@ Page URL: ${pageUrl}`);
       registerChatRoutes(server, chatSession, {
         env,
         viagenClient: viagenClient ?? void 0,
-        environmentId
+        projectId
       });
       if (hasEditor) {
         registerFileRoutes(server, {
@@ -19330,8 +19365,8 @@ Page URL: ${pageUrl}`);
             debug("server", "auto-prompt completed");
             logBuffer.push("info", `[viagen] Prompt completed`);
             const currentTaskId = env["VIAGEN_TASK_ID"];
-            if (viagenClient && environmentId && currentTaskId && (event.inputTokens || event.outputTokens)) {
-              viagenClient.tasks.update(environmentId, currentTaskId, {
+            if (viagenClient && projectId && currentTaskId && (event.inputTokens || event.outputTokens)) {
+              viagenClient.tasks.update(projectId, currentTaskId, {
                 ...event.inputTokens != null && { inputTokens: event.inputTokens },
                 ...event.outputTokens != null && { outputTokens: event.outputTokens }
               }).catch((err) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "viagen",
-  "version": "0.0.56",
+  "version": "0.1.2",
   "description": "Vite dev server plugin that exposes endpoints for chatting with Claude Code SDK",
   "type": "module",
   "main": "./dist/index.js",
@@ -50,6 +50,6 @@
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "https://github.com/viagen-dev/viagen"
+    "url": "https://github.com/viagen-dev/viagen-sdk"
   }
 }

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2025 Ben Ipsen
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/README.md

@@ -1,170 +0,0 @@
-# viagen
-
-A Vite dev server plugin and CLI tool that enables you to use Claude Code in a sandbox — instantly.
-
-## Prerequisites
-
-- [Claude](https://claude.ai/signup) — Max, Pro, or API plan. The setup wizard handles auth.
-- [Vercel](https://vercel.com/signup) — Free plan works. Sandboxes last 45 min on Hobby, 5 hours on Pro.
-- [GitHub CLI](https://cli.github.com) — Enables git clone and push from sandboxes.
-
-## Quick Setup (Claude Code Plugin)
-
-```
-/plugin marketplace add viagen-dev/viagen-claude-plugin
-/plugin install viagen@viagen-marketplace
-```
-
-**Restart Claude Code to load the plugin.**
-
-```
-/viagen-install
-```
-
-The plugin will handle npm installation, vite config updates, and run the setup wizard for you.
-
-## Manual Setup
-
-### Step 1 — Add viagen to your app
-
-```bash
-npm install --save-dev viagen
-```
-
-```ts
-// vite.config.ts
-import { defineConfig } from 'vite'
-import { viagen } from 'viagen'
-
-export default defineConfig({
-  plugins: [viagen()],
-})
-```
-
-### Step 2 — Setup
-
-```bash
-npx viagen setup
-```
-
-The setup wizard authenticates with Claude, detects your GitHub and Vercel credentials, and captures your git remote info — all written to your local `.env`. This ensures sandboxes clone the correct repo instead of inferring it at runtime.
-
-You can now run `npm run dev` to start the local dev server. At this point you can launch viagen and chat with Claude to make changes to your app.
-
-### Step 3 — Sandbox
-
-```bash
-npx viagen sandbox
-```
-
-Deploys your dev server to a remote Vercel Sandbox — an isolated VM-like environment where Claude can read, write, and push code.
-
-```bash
-# Deploy on a specific branch
-npx viagen sandbox --branch feature/my-thing
-
-# Set a longer timeout (default: 30 min)
-npx viagen sandbox --timeout 60
-
-# Auto-send a prompt on load
-npx viagen sandbox --prompt "build me a landing page"
-
-# Stop a running sandbox
-npx viagen sandbox stop <sandboxId>
-```
-
-
-## Plugin Options
-
-```ts
-viagen({
-  position: 'bottom-right',  // toggle button position
-  model: 'sonnet',           // claude model
-  panelWidth: 375,           // chat panel width in px
-  overlay: true,             // fix button on error overlay
-  ui: true,                  // inject chat panel into pages
-  sandboxFiles: [...],       // copy files manually into sandbox
-  systemPrompt: '...',       // custom system prompt (see below)
-  editable: ['src','conf'],  // files/dirs editable in the UI
-})
-```
-
-
-### Editable Files
-
-Add a file editor panel to the chat UI:
-
-```ts
-viagen({
-  editable: ['src/components', 'vite.config.ts']
-})
-```
-
-Paths can be files or directories (directories include all files within). The editor appears as a "Files" tab in the chat panel with a collapsible directory tree, syntax highlighting (TypeScript, JavaScript, CSS, HTML, JSON, Markdown), and image preview.
-
-The default system prompt tells Claude it's embedded in a Vite dev server, that file edits trigger HMR, and how to check server logs. Recent build errors are automatically appended to give Claude context about what went wrong.
-
-To customize the prompt, you can replace it entirely or extend the default:
-
-```ts
-import { viagen, DEFAULT_SYSTEM_PROMPT } from 'viagen'
-
-viagen({
-  // Replace entirely
-  systemPrompt: 'You are a React expert. Only use TypeScript.',
-
-  // Or extend the default
-  systemPrompt: DEFAULT_SYSTEM_PROMPT + '\nAlways use Tailwind for styling.',
-})
-```
-
-## API
-
-Every viagen endpoint is available as an API. Build your own UI, integrate with CI, or script Claude from the command line.
-
-```
-POST /via/chat        — send a message, streamed SSE response
-POST /via/chat/reset  — clear conversation history
-GET  /via/health      — check API key status
-GET  /via/error       — latest build error (if any)
-GET  /via/ui          — standalone chat interface
-GET  /via/iframe      — split view (app + chat side by side)
-GET  /via/files       — list editable files (when configured)
-GET  /via/file?path=  — read file content
-POST /via/file        — write file content { path, content }
-GET  /via/file/raw    — serve raw file (images, etc.) with correct MIME type
-GET  /via/git/status  — list changed files (git status)
-GET  /via/git/diff    — full diff, or single file with ?path=
-GET  /via/git/branch  — current branch, remote URL, open PR info
-GET  /via/logs        — dev server log entries, optional ?since=<timestamp>
-```
-
-When `VIAGEN_AUTH_TOKEN` is set (always on in sandboxes), pass the token as a `Bearer` header, a `/t/:token` path segment, or a `?token=` query param.
-
-```bash
-# With curl
-curl -X POST http://localhost:5173/via/chat \
-  -H "Authorization: Bearer $VIAGEN_AUTH_TOKEN" \
-  -H "Content-Type: application/json" \
-  -d '{"message": "add a hello world route"}'
-
-# Or pass the token in the URL path (sets a session cookie)
-open "http://localhost:5173/via/ui/t/$VIAGEN_AUTH_TOKEN"
-
-# ?token= query param also works (fallback for backwards compat)
-open "http://localhost:5173/via/ui?token=$VIAGEN_AUTH_TOKEN"
-```
-
-## Development
-
-```bash
-npm install
-npm run dev        # Dev server (site)
-npm run build      # Build with tsup
-npm run test       # Run tests
-npm run typecheck  # Type check
-```
-
-## License
-
-[MIT](LICENSE)