code-to-design 0.1.0

package/dist/chunk-QJKUBMF6.js

@@ -0,0 +1,1471 @@
+// src/commands/scan.ts
+import { join as join9 } from "path";
+import { rm, mkdir as mkdir3 } from "fs/promises";
+import { existsSync as existsSync6, watch as fsWatch } from "fs";
+
+// ../core/src/discovery/route-scanner.ts
+import { readdir, stat } from "fs/promises";
+import { join, extname } from "path";
+var PAGE_EXTENSIONS = /* @__PURE__ */ new Set([".js", ".jsx", ".ts", ".tsx"]);
+var PAGE_BASENAMES = /* @__PURE__ */ new Set(["page"]);
+function isPageFile(filename) {
+  const ext = extname(filename);
+  const basename = filename.slice(0, -ext.length);
+  return PAGE_EXTENSIONS.has(ext) && PAGE_BASENAMES.has(basename);
+}
+function shouldSkipDir(name) {
+  if (name.startsWith("_")) return true;
+  if (name.startsWith("@")) return true;
+  if (name.startsWith("(.)") || name.startsWith("(..)")) return true;
+  if (name === "node_modules" || name === ".next") return true;
+  return false;
+}
+function isRouteGroup(name) {
+  return name.startsWith("(") && name.endsWith(")") && !name.startsWith("(.");
+}
+function parseDynamicSegment(segment) {
+  const optionalCatchAll = segment.match(/^\[\[\.\.\.(.+)\]\]$/);
+  if (optionalCatchAll) {
+    return { name: optionalCatchAll[1], isCatchAll: true, isOptional: true };
+  }
+  const catchAll = segment.match(/^\[\.\.\.(.+)\]$/);
+  if (catchAll) {
+    return { name: catchAll[1], isCatchAll: true, isOptional: false };
+  }
+  const dynamic = segment.match(/^\[(.+)\]$/);
+  if (dynamic) {
+    return { name: dynamic[1], isCatchAll: false, isOptional: false };
+  }
+  return null;
+}
+function segmentToUrlPart(segment) {
+  const param = parseDynamicSegment(segment);
+  if (!param) return segment;
+  if (param.isCatchAll && param.isOptional) return `:${param.name}*`;
+  if (param.isCatchAll) return `:${param.name}+`;
+  return `:${param.name}`;
+}
+async function scanDir(dirPath, urlSegments, params) {
+  const routes = [];
+  let entries;
+  try {
+    entries = await readdir(dirPath);
+  } catch {
+    return routes;
+  }
+  for (const entry of entries) {
+    const entryPath = join(dirPath, entry);
+    const entryStat = await stat(entryPath).catch(() => null);
+    if (!entryStat) continue;
+    if (entryStat.isFile() && isPageFile(entry)) {
+      const urlPath = "/" + urlSegments.join("/");
+      routes.push({
+        urlPath: urlPath || "/",
+        filePath: entryPath,
+        params: [...params],
+        isDynamic: params.length > 0
+      });
+    }
+    if (entryStat.isDirectory()) {
+      if (shouldSkipDir(entry)) continue;
+      if (isRouteGroup(entry)) {
+        const nested = await scanDir(entryPath, urlSegments, params);
+        routes.push(...nested);
+      } else {
+        const param = parseDynamicSegment(entry);
+        const urlPart = segmentToUrlPart(entry);
+        const newParams = param ? [...params, param] : params;
+        const nested = await scanDir(entryPath, [...urlSegments, urlPart], newParams);
+        routes.push(...nested);
+      }
+    }
+  }
+  return routes;
+}
+async function scanRoutes(options) {
+  const { appDir } = options;
+  const dirStat = await stat(appDir).catch(() => null);
+  if (!dirStat || !dirStat.isDirectory()) {
+    throw new Error(`App directory not found: ${appDir}`);
+  }
+  const routes = await scanDir(appDir, [], []);
+  routes.sort((a, b) => a.urlPath.localeCompare(b.urlPath));
+  return routes;
+}
+
+// ../core/src/analysis/code-analyzer.ts
+import { readFile as readFile2 } from "fs/promises";
+import { join as join3, dirname, resolve } from "path";
+import { existsSync as existsSync2 } from "fs";
+
+// ../core/src/analysis/auth-detector.ts
+import { readFile } from "fs/promises";
+import { join as join2 } from "path";
+import { existsSync } from "fs";
+var MIDDLEWARE_FILES = ["middleware.ts", "middleware.js", "middleware.tsx", "middleware.jsx"];
+function extractCookieNames(source) {
+  const cookies = [];
+  const regex = /cookies\.get\(\s*['"]([^'"]+)['"]\s*\)/g;
+  let match;
+  while ((match = regex.exec(source)) !== null) {
+    cookies.push(match[1]);
+  }
+  return [...new Set(cookies)];
+}
+function extractApiBaseUrl(source) {
+  const regex = /process\.env\.(\w*API_URL\w*)\s*\|\|\s*['"]([^'"]+)['"]/;
+  const match = source.match(regex);
+  if (match) return match[2];
+  const simpleRegex = /['"]https?:\/\/[^'"]+\/api['"]/;
+  const simpleMatch = source.match(simpleRegex);
+  if (simpleMatch) return simpleMatch[0].replace(/['"]/g, "");
+  return null;
+}
+function extractAuthCheckEndpoint(source) {
+  const patterns = [
+    /[`'"](\/auth\/me)[`'"]/,
+    /[`'"](\/api\/auth\/me)[`'"]/,
+    /[`'"](\/auth\/session)[`'"]/,
+    /[`'"](\/api\/auth\/session)[`'"]/,
+    /[`'"](\/auth\/user)[`'"]/,
+    /[`'"](\/api\/user\/me)[`'"]/
+  ];
+  for (const pattern of patterns) {
+    const match = source.match(pattern);
+    if (match) return match[1];
+  }
+  return null;
+}
+async function detectAuth(projectRoot, allSources) {
+  const config = {
+    hasAuth: false,
+    cookieNames: [],
+    authCheckEndpoint: null,
+    apiBaseUrl: null
+  };
+  for (const filename of MIDDLEWARE_FILES) {
+    const middlewarePath = join2(projectRoot, filename);
+    if (existsSync(middlewarePath)) {
+      try {
+        const source = await readFile(middlewarePath, "utf-8");
+        const cookies = extractCookieNames(source);
+        if (cookies.length > 0) {
+          config.hasAuth = true;
+          config.cookieNames.push(...cookies);
+        }
+      } catch {
+      }
+    }
+  }
+  const combinedSource = allSources.join("\n");
+  const authEndpoint = extractAuthCheckEndpoint(combinedSource);
+  if (authEndpoint) {
+    config.hasAuth = true;
+    config.authCheckEndpoint = authEndpoint;
+  }
+  if (/useAuth|AuthProvider|AuthContext|SessionProvider/i.test(combinedSource)) {
+    config.hasAuth = true;
+  }
+  config.apiBaseUrl = extractApiBaseUrl(combinedSource);
+  return config;
+}
+
+// ../core/src/analysis/code-analyzer.ts
+var DEFAULT_MAX_TOKENS = 8e3;
+var CHARS_PER_TOKEN = 4;
+function extractImportPaths(source) {
+  const paths = [];
+  const regex = /import\s+(?:[\s\S]*?\s+from\s+)?['"]([^'"]+)['"]/g;
+  let match;
+  while ((match = regex.exec(source)) !== null) {
+    paths.push(match[1]);
+  }
+  return paths;
+}
+function resolvePathAlias(importPath, aliases) {
+  for (const [pattern, replacement] of Object.entries(aliases)) {
+    const prefix = pattern.replace(/\*$/, "");
+    if (importPath.startsWith(prefix)) {
+      const rest = importPath.slice(prefix.length);
+      return replacement.replace(/\*$/, "") + rest;
+    }
+  }
+  return null;
+}
+async function readPathAliases(projectRoot) {
+  const aliases = {};
+  for (const filename of ["tsconfig.json", "jsconfig.json"]) {
+    const configPath = join3(projectRoot, filename);
+    if (!existsSync2(configPath)) continue;
+    try {
+      const content = await readFile2(configPath, "utf-8");
+      const stripped = content.replace(
+        /"(?:[^"\\]|\\.)*"|\/\/.*$|\/\*[\s\S]*?\*\//gm,
+        (match) => match.startsWith('"') ? match : ""
+      );
+      const config = JSON.parse(stripped);
+      const paths = config.compilerOptions?.paths;
+      const baseUrl = config.compilerOptions?.baseUrl || ".";
+      const resolvedBaseUrl = resolve(projectRoot, baseUrl);
+      if (paths) {
+        for (const [key, values] of Object.entries(paths)) {
+          const targets = values;
+          if (targets.length > 0) {
+            aliases[key] = join3(resolvedBaseUrl, targets[0]);
+          }
+        }
+      }
+    } catch {
+    }
+  }
+  return aliases;
+}
+function resolveImportToFile(importPath, fromDir) {
+  const extensions = [".ts", ".tsx", ".js", ".jsx"];
+  const candidates = [];
+  const resolved = resolve(fromDir, importPath);
+  candidates.push(resolved);
+  for (const ext of extensions) {
+    candidates.push(resolved + ext);
+  }
+  for (const ext of extensions) {
+    candidates.push(join3(resolved, `index${ext}`));
+  }
+  for (const candidate of candidates) {
+    if (existsSync2(candidate)) return candidate;
+  }
+  return null;
+}
+async function traceImports(filePath, projectRoot, aliases, maxDepth, visited = /* @__PURE__ */ new Set()) {
+  const results = /* @__PURE__ */ new Map();
+  if (visited.has(filePath) || maxDepth < 0) return results;
+  visited.add(filePath);
+  let source;
+  try {
+    source = await readFile2(filePath, "utf-8");
+  } catch {
+    return results;
+  }
+  results.set(filePath, source);
+  const importPaths = extractImportPaths(source);
+  const fileDir = dirname(filePath);
+  for (const importPath of importPaths) {
+    if (!importPath.startsWith(".") && !importPath.startsWith("@/") && !importPath.startsWith("~/")) {
+      const aliasResolved = resolvePathAlias(importPath, aliases);
+      if (!aliasResolved) continue;
+      const resolved = resolveImportToFile(aliasResolved, projectRoot);
+      if (resolved && !visited.has(resolved)) {
+        const nested = await traceImports(resolved, projectRoot, aliases, maxDepth - 1, visited);
+        for (const [path, content] of nested) {
+          results.set(path, content);
+        }
+      }
+    } else if (importPath.startsWith(".")) {
+      const resolved = resolveImportToFile(importPath, fileDir);
+      if (resolved && !visited.has(resolved)) {
+        const nested = await traceImports(resolved, projectRoot, aliases, maxDepth - 1, visited);
+        for (const [path, content] of nested) {
+          results.set(path, content);
+        }
+      }
+    } else {
+      const aliasResolved = resolvePathAlias(importPath, aliases);
+      if (aliasResolved) {
+        const resolved = resolveImportToFile(aliasResolved, projectRoot);
+        if (resolved && !visited.has(resolved)) {
+          const nested = await traceImports(resolved, projectRoot, aliases, maxDepth - 1, visited);
+          for (const [path, content] of nested) {
+            results.set(path, content);
+          }
+        }
+      }
+    }
+  }
+  return results;
+}
+function estimateTokens(text) {
+  return Math.ceil(text.length / CHARS_PER_TOKEN);
+}
+function hasApiCalls(source) {
+  return /\bfetch\s*\(/.test(source) || /\baxios\b/.test(source) || /\buseQuery\b/.test(source) || /\buseMutation\b/.test(source) || /\bapiRequest\b/.test(source) || /\bgetServerSideProps\b/.test(source) || /\bgetStaticProps\b/.test(source) || /API_BASE_URL/.test(source) || /['"]\/api\//.test(source) || /from\s+['"].*api[-_]?client.*['"]/.test(source) || /from\s+['"].*\/api['"]/.test(source) || /from\s+['"].*\/services\//.test(source);
+}
+async function analyzePage(route, options) {
+  const { projectRoot, maxTokensPerPage = DEFAULT_MAX_TOKENS } = options;
+  const maxChars = maxTokensPerPage * CHARS_PER_TOKEN;
+  const aliases = await readPathAliases(projectRoot);
+  const tracedFiles = await traceImports(route.filePath, projectRoot, aliases, 2);
+  const resolvedImports = [...tracedFiles.keys()].filter((p) => p !== route.filePath);
+  const allSources = [...tracedFiles.values()];
+  let sourceContext = "";
+  for (const [filePath, content] of tracedFiles) {
+    const relativePath = filePath.startsWith(projectRoot) ? filePath.slice(projectRoot.length + 1) : filePath;
+    const section = `
+// === ${relativePath} ===
+${content}
+`;
+    if (sourceContext.length + section.length > maxChars) {
+      break;
+    }
+    sourceContext += section;
+  }
+  const authConfig = await detectAuth(projectRoot, allSources);
+  const combinedSource = allSources.join("\n");
+  const hasApi = hasApiCalls(sourceContext) || hasApiCalls(combinedSource);
+  const allImportPaths = allSources.flatMap(extractImportPaths);
+  const resolvedSet = new Set(resolvedImports.map((p) => p));
+  const unresolvedImports = allImportPaths.filter((p) => p.startsWith(".") || p.startsWith("@/") || p.startsWith("~/")).filter((p) => {
+    const aliasResolved = resolvePathAlias(p, aliases);
+    const checkPath = aliasResolved ? resolveImportToFile(aliasResolved, projectRoot) : resolveImportToFile(p, dirname(route.filePath));
+    return !checkPath;
+  });
+  return {
+    route,
+    sourceContext,
+    resolvedImports,
+    unresolvedImports: [...new Set(unresolvedImports)],
+    authConfig,
+    hasApiDependencies: hasApi,
+    estimatedTokens: estimateTokens(sourceContext)
+  };
+}
+
+// ../core/src/mock/types.ts
+var ALL_STATE_VARIANTS = ["success", "empty", "error", "loading"];
+
+// ../core/src/mock/llm-client.ts
+import Anthropic from "@anthropic-ai/sdk";
+var LlmClient = class {
+  client;
+  model;
+  constructor(apiKey, model = "claude-sonnet-4-20250514") {
+    this.client = new Anthropic({ apiKey });
+    this.model = model;
+  }
+  async generate(systemPrompt, userPrompt) {
+    const response = await this.client.messages.create({
+      model: this.model,
+      max_tokens: 4096,
+      system: systemPrompt,
+      messages: [{ role: "user", content: userPrompt }]
+    });
+    const textBlock = response.content.find((block) => block.type === "text");
+    const content = textBlock ? textBlock.text : "";
+    return {
+      content,
+      inputTokens: response.usage.input_tokens,
+      outputTokens: response.usage.output_tokens
+    };
+  }
+};
+
+// ../core/src/mock/prompt-templates.ts
+var SYSTEM_PROMPT = `You are a mock data generator for a UI pre-rendering tool called VibeCanvas.
+Your job is to analyze a Next.js page's source code and generate realistic mock API responses that will make the page render correctly.
+
+Rules:
+1. Output ONLY valid JSON \u2014 no markdown, no code fences, no explanation.
+2. Mock data must match the TypeScript interfaces found in the source code.
+3. Generate contextually appropriate data (e.g., real company names for a finance app, realistic usernames for a social app).
+4. For each API endpoint, generate mock responses for these state variants:
+   - "success": realistic data with multiple items
+   - "empty": empty collections, zero counts
+   - "error": API returns HTTP 500 with error message
+   - "loading": same as success but with a 3000ms delay
+5. Include auth mock data if the page requires authentication.
+6. For dynamic route parameters, generate a realistic sample value.`;
+function buildUserPrompt(analysis) {
+  const parts = [];
+  parts.push(`## Page Route: ${analysis.route.urlPath}`);
+  parts.push(`## Page File: ${analysis.route.filePath}`);
+  if (analysis.route.isDynamic) {
+    parts.push(`## Dynamic Parameters: ${analysis.route.params.map((p) => p.name).join(", ")}`);
+  }
+  parts.push("## Source Code Context");
+  parts.push(analysis.sourceContext);
+  if (analysis.authConfig.hasAuth) {
+    parts.push("## Auth Configuration");
+    parts.push(`- Requires authentication: yes`);
+    if (analysis.authConfig.cookieNames.length > 0) {
+      parts.push(`- Auth cookies: ${analysis.authConfig.cookieNames.join(", ")}`);
+    }
+    if (analysis.authConfig.authCheckEndpoint) {
+      parts.push(`- Auth check endpoint: ${analysis.authConfig.authCheckEndpoint}`);
+    }
+    if (analysis.authConfig.apiBaseUrl) {
+      parts.push(`- API base URL: ${analysis.authConfig.apiBaseUrl}`);
+    }
+  }
+  parts.push(`
+## Required Output Format
+
+Return a JSON object with this exact structure:
+{
+  "routeParams": { "paramName": "sampleValue" },  // only if dynamic route
+  "apiEndpoints": [
+    {
+      "urlPattern": "/api/endpoint",  // the URL path pattern to intercept
+      "method": "GET",                 // HTTP method
+      "states": {
+        "success": { "status": 200, "body": { ... } },
+        "empty": { "status": 200, "body": { ... } },
+        "error": { "status": 500, "body": { "detail": "Internal server error" } },
+        "loading": { "status": 200, "body": { ... }, "delay": 3000 }
+      }
+    }
+  ],
+  "authMock": {                        // only if auth is required
+    "cookies": { "cookie_name": "mock_value" },
+    "authCheckEndpoint": "/auth/me",
+    "authCheckResponse": { "status": 200, "body": { ... } }
+  }
+}
+
+Generate ONLY the JSON. No explanation, no markdown fences.`);
+  return parts.join("\n\n");
+}
+
+// ../core/src/mock/mock-generator.ts
+function parseLlmJson(content) {
+  let cleaned = content.trim();
+  if (cleaned.startsWith("```")) {
+    cleaned = cleaned.replace(/^```(?:json)?\n?/, "").replace(/\n?```$/, "");
+  }
+  try {
+    return JSON.parse(cleaned);
+  } catch {
+    const jsonMatch = cleaned.match(/\{[\s\S]*\}/);
+    if (jsonMatch) {
+      try {
+        return JSON.parse(jsonMatch[0]);
+      } catch {
+        return null;
+      }
+    }
+    return null;
+  }
+}
+function convertToMockConfigs(output, analysis, variants) {
+  const configs = [];
+  for (const variant of variants) {
+    const apiMocks = {};
+    if (output.apiEndpoints) {
+      for (const endpoint of output.apiEndpoints) {
+        const stateData = endpoint.states[variant];
+        if (stateData) {
+          const key = `${endpoint.method} ${endpoint.urlPattern}`;
+          apiMocks[key] = {
+            status: stateData.status,
+            body: stateData.body,
+            delay: stateData.delay
+          };
+        }
+      }
+    }
+    let authMock = null;
+    if (analysis.authConfig.hasAuth && output.authMock) {
+      authMock = {
+        cookies: output.authMock.cookies,
+        authCheckResponse: {
+          status: output.authMock.authCheckResponse.status,
+          body: output.authMock.authCheckResponse.body
+        }
+      };
+    }
+    configs.push({
+      stateName: variant,
+      apiMocks,
+      authMock,
+      routeParams: output.routeParams
+    });
+  }
+  return configs;
+}
+function generateFallbackConfigs(analysis, variants) {
+  return variants.map((variant) => ({
+    stateName: variant,
+    apiMocks: {},
+    authMock: analysis.authConfig.hasAuth ? {
+      cookies: Object.fromEntries(
+        analysis.authConfig.cookieNames.map((name) => [name, "mock_token_c2d"])
+      ),
+      authCheckResponse: variant === "error" ? { status: 401, body: { detail: "Unauthorized" } } : { status: 200, body: { id: "mock_user", email: "demo@c2d.dev", name: "Demo User" } }
+    } : null,
+    routeParams: analysis.route.isDynamic ? Object.fromEntries(analysis.route.params.map((p) => [p.name, "sample-1"])) : void 0
+  }));
+}
+async function generateMocks(analysis, options) {
+  const variants = options.variants ?? ALL_STATE_VARIANTS;
+  if (!analysis.hasApiDependencies) {
+    return {
+      configs: generateFallbackConfigs(analysis, variants),
+      tokenUsage: { input: 0, output: 0 }
+    };
+  }
+  const client = new LlmClient(options.apiKey, options.model);
+  const userPrompt = buildUserPrompt(analysis);
+  try {
+    const response = await client.generate(SYSTEM_PROMPT, userPrompt);
+    const parsed = parseLlmJson(response.content);
+    if (!parsed) {
+      console.warn(`[c2d] Failed to parse LLM response for ${analysis.route.urlPath}, using fallback`);
+      return {
+        configs: generateFallbackConfigs(analysis, variants),
+        tokenUsage: { input: response.inputTokens, output: response.outputTokens }
+      };
+    }
+    const configs = convertToMockConfigs(parsed, analysis, variants);
+    return {
+      configs,
+      tokenUsage: { input: response.inputTokens, output: response.outputTokens }
+    };
+  } catch (error2) {
+    console.warn(`[c2d] LLM call failed for ${analysis.route.urlPath}: ${error2}`);
+    return {
+      configs: generateFallbackConfigs(analysis, variants),
+      tokenUsage: { input: 0, output: 0 }
+    };
+  }
+}
+
+// ../core/src/render/pre-renderer.ts
+import { chromium } from "playwright";
+import { mkdir, writeFile } from "fs/promises";
+import { join as join5 } from "path";
+
+// ../core/src/render/dev-server.ts
+import { spawn } from "child_process";
+import { existsSync as existsSync3 } from "fs";
+import { join as join4 } from "path";
+import { createServer } from "net";
+async function findFreePort() {
+  return new Promise((resolve2, reject) => {
+    const server = createServer();
+    server.listen(0, () => {
+      const address = server.address();
+      if (address && typeof address === "object") {
+        const port = address.port;
+        server.close(() => resolve2(port));
+      } else {
+        server.close(() => reject(new Error("Could not find free port")));
+      }
+    });
+    server.on("error", reject);
+  });
+}
+async function waitForUrl(url, timeoutMs = 3e4) {
+  const start = Date.now();
+  while (Date.now() - start < timeoutMs) {
+    try {
+      const response = await fetch(url, { signal: AbortSignal.timeout(2e3) });
+      if (response.status > 0) return;
+    } catch {
+    }
+    await new Promise((r) => setTimeout(r, 500));
+  }
+  throw new Error(`Dev server did not become ready at ${url} within ${timeoutMs}ms`);
+}
+function detectDevCommand(projectRoot) {
+  if (existsSync3(join4(projectRoot, "next.config.ts")) || existsSync3(join4(projectRoot, "next.config.js")) || existsSync3(join4(projectRoot, "next.config.mjs"))) {
+    return { cmd: "npx", args: ["next", "dev"] };
+  }
+  return { cmd: "npm", args: ["run", "dev"] };
+}
+async function startDevServer(projectRoot, options) {
+  if (options?.devServerUrl) {
+    await waitForUrl(options.devServerUrl, 1e4);
+    return {
+      url: options.devServerUrl,
+      port: 0,
+      process: null,
+      stop: async () => {
+      }
+    };
+  }
+  const port = options?.port ?? await findFreePort();
+  const { cmd, args } = detectDevCommand(projectRoot);
+  const fullArgs = [...args, "--port", String(port)];
+  const child = spawn(cmd, fullArgs, {
+    cwd: projectRoot,
+    stdio: ["ignore", "pipe", "pipe"],
+    env: { ...process.env, PORT: String(port) }
+  });
+  const url = `http://localhost:${port}`;
+  let stderr = "";
+  child.stderr?.on("data", (data) => {
+    stderr += data.toString();
+  });
+  const exitPromise = new Promise((_, reject) => {
+    child.on("exit", (code) => {
+      if (code !== null && code !== 0) {
+        reject(new Error(`Dev server exited with code ${code}.
+${stderr.slice(-500)}`));
+      }
+    });
+  });
+  try {
+    await Promise.race([
+      waitForUrl(url, 6e4),
+      exitPromise
+    ]);
+  } catch (err) {
+    child.kill("SIGTERM");
+    throw err;
+  }
+  return {
+    url,
+    port,
+    process: child,
+    stop: async () => {
+      if (child.exitCode === null) {
+        child.kill("SIGTERM");
+        await new Promise((resolve2) => {
+          const timer = setTimeout(() => {
+            child.kill("SIGKILL");
+            resolve2();
+          }, 5e3);
+          child.on("exit", () => {
+            clearTimeout(timer);
+            resolve2();
+          });
+        });
+      }
+    }
+  };
+}
+
+// ../core/src/render/pre-renderer.ts
+var DEFAULT_CONCURRENCY = 3;
+var DEFAULT_PAGE_TIMEOUT = 15e3;
+var DEFAULT_SETTLE_TIME = 1500;
+var DEFAULT_VIEWPORT = { width: 1440, height: 900 };
+function buildUrlPath(route, mockConfig) {
+  let path = route.urlPath;
+  if (route.isDynamic && mockConfig.routeParams) {
+    for (const param of route.params) {
+      const value = mockConfig.routeParams[param.name] || "sample-1";
+      path = path.replace(`:${param.name}`, value);
+      path = path.replace(`:${param.name}+`, value);
+      path = path.replace(`:${param.name}*`, value);
+    }
+  }
+  return path;
+}
+function slugifyRoute(urlPath) {
+  if (urlPath === "/") return "index";
+  return urlPath.replace(/^\//, "").replace(/\//g, "-").replace(/:/g, "_").replace(/[^a-zA-Z0-9_-]/g, "_");
+}
+async function setupMockInterception(page, devServerUrl, mockConfig, authConfig) {
+  if (mockConfig.authMock) {
+    const cookies = Object.entries(mockConfig.authMock.cookies).map(([name, value]) => ({
+      name,
+      value,
+      domain: new URL(devServerUrl).hostname,
+      path: "/"
+    }));
+    await page.context().addCookies(cookies);
+  } else if (authConfig.hasAuth && authConfig.cookieNames.length > 0) {
+    const cookies = authConfig.cookieNames.map((name) => ({
+      name,
+      value: "c2d_mock_token",
+      domain: new URL(devServerUrl).hostname,
+      path: "/"
+    }));
+    await page.context().addCookies(cookies);
+  }
+  const authMockBody = mockConfig.authMock?.authCheckResponse ? JSON.stringify(mockConfig.authMock.authCheckResponse.body) : JSON.stringify({ id: "mock_user", email: "demo@c2d.dev", name: "Demo User", email_verified: true, avatar_url: null, created_at: "2026-01-01T00:00:00Z" });
+  const AUTH_PATTERNS = ["/auth/me", "/auth/session", "/api/auth/me", "/api/user/me", "/api/auth/session"];
+  await page.route("**/*", async (route) => {
+    const request = route.request();
+    const url = request.url();
+    const method = request.method();
+    const isAuthCheck = AUTH_PATTERNS.some((p) => url.includes(p)) || authConfig.authCheckEndpoint && url.includes(authConfig.authCheckEndpoint);
+    if (isAuthCheck) {
+      const status = mockConfig.authMock?.authCheckResponse?.status ?? 200;
+      return route.fulfill({
+        status,
+        contentType: "application/json",
+        body: authMockBody
+      });
+    }
+    for (const [pattern, mock] of Object.entries(mockConfig.apiMocks)) {
+      const [mockMethod, ...pathParts] = pattern.split(" ");
+      let mockPath = pathParts.join(" ");
+      mockPath = mockPath.replace(/\{[^}]+\}/g, "[^/]+");
+      mockPath = mockPath.replace(/\*/g, "[^/]+");
+      const pathRegex = new RegExp(mockPath.replace(/\//g, "\\/"));
+      if (method === mockMethod && pathRegex.test(url)) {
+        if (mock.delay) await new Promise((r) => setTimeout(r, mock.delay));
+        return route.fulfill({
+          status: mock.status,
+          contentType: "application/json",
+          body: JSON.stringify(mock.body)
+        });
+      }
+    }
+    return route.continue();
+  });
+}
+async function renderPage(context, devServerUrl, task, outputDir, options, viewport) {
+  const { route, mockConfig, authConfig } = task;
+  const routeSlug = slugifyRoute(route.urlPath);
+  const stateDir = join5(outputDir, "renders", routeSlug);
+  await mkdir(stateDir, { recursive: true });
+  const filePrefix = viewport ? `${mockConfig.stateName}_${viewport.name}` : mockConfig.stateName;
+  const htmlRelPath = join5("renders", routeSlug, `${filePrefix}.html`);
+  const pngRelPath = join5("renders", routeSlug, `${filePrefix}.png`);
+  const htmlAbsPath = join5(outputDir, htmlRelPath);
+  const pngAbsPath = join5(outputDir, pngRelPath);
+  const page = await context.newPage();
+  if (viewport) {
+    await page.setViewportSize({ width: viewport.width, height: viewport.height });
+  }
+  try {
+    await setupMockInterception(page, devServerUrl, mockConfig, authConfig);
+    const urlPath = buildUrlPath(route, mockConfig);
+    const fullUrl = `${devServerUrl}${urlPath}`;
+    await page.goto(fullUrl, {
+      waitUntil: "networkidle",
+      timeout: options.pageTimeout
+    });
+    await page.waitForTimeout(options.settleTime);
+    await page.evaluate(`(() => {
+      const links = document.querySelectorAll('link[rel="stylesheet"]');
+      links.forEach(link => {
+        try {
+          const href = link.getAttribute('href');
+          if (!href) return;
+          for (const sheet of document.styleSheets) {
+            if (sheet.href && sheet.href.includes(href.replace(/^\\//, ''))) {
+              const rules = Array.from(sheet.cssRules).map(r => r.cssText).join('\\n');
+              const style = document.createElement('style');
+              style.textContent = rules;
+              link.parentNode.replaceChild(style, link);
+              break;
+            }
+          }
+        } catch (e) {}
+      });
+      document.querySelectorAll('script').forEach(s => s.remove());
+    })()`);
+    const html = await page.content();
+    await writeFile(htmlAbsPath, html, "utf-8");
+    await page.screenshot({ path: pngAbsPath, fullPage: true });
+    return {
+      route,
+      stateName: mockConfig.stateName,
+      htmlPath: htmlRelPath,
+      screenshotPath: pngRelPath,
+      success: true,
+      viewportName: viewport?.name
+    };
+  } catch (err) {
+    const errorMsg = err instanceof Error ? err.message : String(err);
+    const errorHtml = `<!DOCTYPE html><html><body style="display:flex;align-items:center;justify-content:center;height:100vh;font-family:sans-serif;color:#666;">
+      <div style="text-align:center"><h2>Render Failed</h2><p>${route.urlPath} [${mockConfig.stateName}]</p><pre style="color:#c00">${errorMsg}</pre></div>
+    </body></html>`;
+    await writeFile(htmlAbsPath, errorHtml, "utf-8").catch(() => {
+    });
+    return {
+      route,
+      stateName: mockConfig.stateName,
+      htmlPath: htmlRelPath,
+      screenshotPath: pngRelPath,
+      success: false,
+      error: errorMsg,
+      viewportName: viewport?.name
+    };
+  } finally {
+    await page.close();
+  }
+}
+async function processWithConcurrency(items, concurrency, fn) {
+  const results = [];
+  const queue = [...items];
+  async function worker() {
+    while (queue.length > 0) {
+      const item = queue.shift();
+      const result = await fn(item);
+      results.push(result);
+    }
+  }
+  const workers = Array.from({ length: Math.min(concurrency, items.length) }, () => worker());
+  await Promise.all(workers);
+  return results;
+}
+function buildManifest(results, projectName, viewports) {
+  const routeMap = /* @__PURE__ */ new Map();
+  const viewportWidthMap = /* @__PURE__ */ new Map();
+  if (viewports) {
+    for (const vp of viewports) {
+      viewportWidthMap.set(vp.name, vp.width);
+    }
+  }
+  for (const result of results) {
+    const key = result.route.urlPath;
+    if (!routeMap.has(key)) {
+      routeMap.set(key, {
+        urlPath: result.route.urlPath,
+        filePath: result.route.filePath,
+        states: []
+      });
+    }
+    routeMap.get(key).states.push({
+      name: result.viewportName ? `${result.stateName} (${result.viewportName})` : result.stateName,
+      htmlPath: result.htmlPath,
+      screenshotPath: result.screenshotPath,
+      status: result.success ? "ok" : "error",
+      error: result.error,
+      viewport: result.viewportName,
+      viewportWidth: result.viewportName ? viewportWidthMap.get(result.viewportName) : void 0
+    });
+  }
+  return {
+    generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
+    projectName,
+    routes: [...routeMap.values()].sort((a, b) => a.urlPath.localeCompare(b.urlPath))
+  };
+}
+async function preRenderPages(tasks, options) {
+  const {
+    projectRoot,
+    outputDir = join5(projectRoot, ".c2d"),
+    concurrency = DEFAULT_CONCURRENCY,
+    pageTimeout = DEFAULT_PAGE_TIMEOUT,
+    settleTime = DEFAULT_SETTLE_TIME,
+    viewportWidth = DEFAULT_VIEWPORT.width,
+    viewportHeight = DEFAULT_VIEWPORT.height
+  } = options;
+  const viewports = options.viewports;
+  const useMultiViewport = viewports && viewports.length > 0;
+  await mkdir(outputDir, { recursive: true });
+  let devServer = null;
+  try {
+    devServer = await startDevServer(projectRoot, {
+      port: options.devServerPort,
+      devServerUrl: options.devServerUrl
+    });
+    const browser = await chromium.launch({ headless: true });
+    const context = await browser.newContext({
+      viewport: { width: viewportWidth, height: viewportHeight }
+    });
+    try {
+      let results;
+      if (useMultiViewport) {
+        const expandedItems = [];
+        for (const task of tasks) {
+          for (const vp of viewports) {
+            expandedItems.push({ task, viewport: vp });
+          }
+        }
+        results = await processWithConcurrency(
+          expandedItems,
+          concurrency,
+          ({ task, viewport: vp }) => renderPage(context, devServer.url, task, outputDir, { pageTimeout, settleTime }, vp)
+        );
+      } else {
+        results = await processWithConcurrency(
+          tasks,
+          concurrency,
+          (task) => renderPage(context, devServer.url, task, outputDir, { pageTimeout, settleTime })
+        );
+      }
+      let projectName = "unknown";
+      try {
+        const pkg = await import(join5(projectRoot, "package.json"), { with: { type: "json" } });
+        projectName = pkg.default?.name || "unknown";
+      } catch {
+      }
+      const manifest = buildManifest(
+        results,
+        projectName,
+        useMultiViewport ? viewports : void 0
+      );
+      await writeFile(
+        join5(outputDir, "manifest.json"),
+        JSON.stringify(manifest, null, 2),
+        "utf-8"
+      );
+      return { results, manifest };
+    } finally {
+      await context.close();
+      await browser.close();
+    }
+  } finally {
+    if (devServer) {
+      await devServer.stop();
+    }
+  }
+}
+
+// src/server/canvas-server.ts
+import { createServer as createServer2 } from "http";
+import { join as join7 } from "path";
+import sirv from "sirv";
+
+// src/server/api-routes.ts
+import { readFile as readFile3, writeFile as writeFile2, mkdir as mkdir2 } from "fs/promises";
+import { existsSync as existsSync4 } from "fs";
+import { join as join6, dirname as dirname2 } from "path";
+import { randomUUID } from "crypto";
+async function handleApiRequest(req, res, c2dDir) {
+  const url = req.url ?? "/";
+  const method = req.method ?? "GET";
+  if (url === "/api/manifest" && method === "GET") {
+    await handleGetManifest(res, c2dDir);
+    return true;
+  }
+  if (url === "/api/comments" && method === "GET") {
+    await handleGetComments(res, c2dDir);
+    return true;
+  }
+  if (url === "/api/comments" && method === "POST") {
+    await handlePostComment(req, res, c2dDir);
+    return true;
+  }
+  const deleteMatch = url.match(/^\/api\/comments\/(.+)$/);
+  if (deleteMatch && method === "DELETE") {
+    await handleDeleteComment(res, c2dDir, deleteMatch[1]);
+    return true;
+  }
+  if (url === "/api/drawings" && method === "GET") {
+    await handleGetDrawings(res, c2dDir);
+    return true;
+  }
+  if (url === "/api/drawings" && method === "POST") {
+    await handlePostDrawings(req, res, c2dDir);
+    return true;
+  }
+  return false;
+}
+async function handleGetManifest(res, c2dDir) {
+  const manifestPath = join6(c2dDir, "manifest.json");
+  if (!existsSync4(manifestPath)) {
+    sendJson(res, 404, { error: "manifest.json not found" });
+    return;
+  }
+  const data = await readFile3(manifestPath, "utf-8");
+  sendRawJson(res, 200, data);
+}
+async function handleGetComments(res, c2dDir) {
+  const comments = await loadComments(c2dDir);
+  sendJson(res, 200, comments);
+}
+async function handlePostComment(req, res, c2dDir) {
+  const body = await readRequestBody(req);
+  let parsed;
+  try {
+    parsed = JSON.parse(body);
+  } catch {
+    sendJson(res, 400, { error: "Invalid JSON body" });
+    return;
+  }
+  if (!isValidCommentInput(parsed)) {
+    sendJson(res, 400, { error: "Missing required fields: x, y, text, author" });
+    return;
+  }
+  const comment = {
+    id: randomUUID(),
+    x: parsed.x,
+    y: parsed.y,
+    text: parsed.text,
+    author: parsed.author,
+    timestamp: (/* @__PURE__ */ new Date()).toISOString()
+  };
+  const comments = await loadComments(c2dDir);
+  comments.push(comment);
+  await saveComments(c2dDir, comments);
+  sendJson(res, 201, comment);
+}
+async function handleDeleteComment(res, c2dDir, id) {
+  const comments = await loadComments(c2dDir);
+  const index = comments.findIndex((c) => c.id === id);
+  if (index === -1) {
+    sendJson(res, 404, { error: "Comment not found" });
+    return;
+  }
+  comments.splice(index, 1);
+  await saveComments(c2dDir, comments);
+  sendJson(res, 200, { ok: true });
+}
+async function handleGetDrawings(res, c2dDir) {
+  const drawings = await loadDrawings(c2dDir);
+  sendJson(res, 200, drawings);
+}
+async function handlePostDrawings(req, res, c2dDir) {
+  const body = await readRequestBody(req);
+  let parsed;
+  try {
+    parsed = JSON.parse(body);
+  } catch {
+    sendJson(res, 400, { error: "Invalid JSON body" });
+    return;
+  }
+  if (!Array.isArray(parsed)) {
+    sendJson(res, 400, { error: "Body must be an array of strokes" });
+    return;
+  }
+  await saveDrawings(c2dDir, parsed);
+  sendJson(res, 200, { ok: true });
+}
+async function loadDrawings(c2dDir) {
+  const drawingsPath = join6(c2dDir, "drawings.json");
+  if (!existsSync4(drawingsPath)) {
+    return [];
+  }
+  const data = await readFile3(drawingsPath, "utf-8");
+  try {
+    const parsed = JSON.parse(data);
+    return Array.isArray(parsed) ? parsed : [];
+  } catch {
+    return [];
+  }
+}
+async function saveDrawings(c2dDir, drawings) {
+  const drawingsPath = join6(c2dDir, "drawings.json");
+  const dir = dirname2(drawingsPath);
+  if (!existsSync4(dir)) {
+    await mkdir2(dir, { recursive: true });
+  }
+  await writeFile2(drawingsPath, JSON.stringify(drawings, null, 2), "utf-8");
+}
+function isValidCommentInput(value) {
+  if (typeof value !== "object" || value === null) return false;
+  const obj = value;
+  return typeof obj.x === "number" && typeof obj.y === "number" && typeof obj.text === "string" && typeof obj.author === "string";
+}
+async function loadComments(c2dDir) {
+  const commentsPath = join6(c2dDir, "comments.json");
+  if (!existsSync4(commentsPath)) {
+    return [];
+  }
+  const data = await readFile3(commentsPath, "utf-8");
+  try {
+    const parsed = JSON.parse(data);
+    return Array.isArray(parsed) ? parsed : [];
+  } catch {
+    return [];
+  }
+}
+async function saveComments(c2dDir, comments) {
+  const commentsPath = join6(c2dDir, "comments.json");
+  const dir = dirname2(commentsPath);
+  if (!existsSync4(dir)) {
+    await mkdir2(dir, { recursive: true });
+  }
+  await writeFile2(commentsPath, JSON.stringify(comments, null, 2), "utf-8");
+}
+function readRequestBody(req) {
+  return new Promise((resolve2, reject) => {
+    const chunks = [];
+    req.on("data", (chunk) => chunks.push(chunk));
+    req.on("end", () => resolve2(Buffer.concat(chunks).toString("utf-8")));
+    req.on("error", reject);
+  });
+}
+function sendJson(res, status, data) {
+  const body = JSON.stringify(data);
+  res.writeHead(status, {
+    "Content-Type": "application/json",
+    "Access-Control-Allow-Origin": "*"
+  });
+  res.end(body);
+}
+function sendRawJson(res, status, jsonString) {
+  res.writeHead(status, {
+    "Content-Type": "application/json",
+    "Access-Control-Allow-Origin": "*"
+  });
+  res.end(jsonString);
+}
+
+// src/server/canvas-server.ts
+async function startCanvasServer(options) {
+  const { port = 4800, canvasDir, c2dDir } = options;
+  const canvasHandler = sirv(canvasDir, { single: true, dev: true });
+  const rendersDir = join7(c2dDir, "renders");
+  const rendersHandler = sirv(rendersDir, { dev: true });
+  const server = createServer2(async (req, res) => {
+    const url = req.url ?? "/";
+    const method = req.method ?? "GET";
+    res.setHeader("Access-Control-Allow-Origin", "*");
+    res.setHeader("Access-Control-Allow-Methods", "GET, POST, DELETE, OPTIONS");
+    res.setHeader("Access-Control-Allow-Headers", "Content-Type");
+    if (method === "OPTIONS") {
+      res.writeHead(204);
+      res.end();
+      return;
+    }
+    if (url.startsWith("/api/")) {
+      try {
+        const handled = await handleApiRequest(req, res, c2dDir);
+        if (!handled) {
+          res.writeHead(404, { "Content-Type": "application/json" });
+          res.end(JSON.stringify({ error: "Not found" }));
+        }
+      } catch (err) {
+        const message = err instanceof Error ? err.message : "Internal server error";
+        res.writeHead(500, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ error: message }));
+      }
+      return;
+    }
+    if (url.startsWith("/renders/")) {
+      req.url = url.slice("/renders".length) || "/";
+      rendersHandler(req, res, () => {
+        res.writeHead(404, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ error: "Render not found" }));
+      });
+      return;
+    }
+    canvasHandler(req, res, () => {
+      res.writeHead(404);
+      res.end("Not found");
+    });
+  });
+  return new Promise((resolve2, reject) => {
+    server.on("error", reject);
+    server.listen(port, () => {
+      const actualPort = server.address().port;
+      resolve2({
+        url: `http://localhost:${actualPort}`,
+        port: actualPort,
+        close: () => new Promise((resolveClose, rejectClose) => {
+          server.close((err) => {
+            if (err) rejectClose(err);
+            else resolveClose();
+          });
+        })
+      });
+    });
+  });
+}
+
+// src/config.ts
+import { existsSync as existsSync5 } from "fs";
+import { readFile as readFile4 } from "fs/promises";
+import { join as join8 } from "path";
+var DEFAULT_PORT = 4800;
+async function loadConfig(projectRoot) {
+  let fileConfig = {};
+  const configPath = join8(projectRoot, "c2d.config.js");
+  if (existsSync5(configPath)) {
+    try {
+      const mod = await import(configPath);
+      fileConfig = mod.default || mod;
+    } catch {
+    }
+  }
+  const apiKey = process.env.C2D_API_KEY || fileConfig.apiKey || "";
+  return {
+    apiKey,
+    port: fileConfig.port || Number(process.env.C2D_PORT) || DEFAULT_PORT,
+    excludeRoutes: fileConfig.excludeRoutes || [],
+    devServerUrl: fileConfig.devServerUrl || process.env.C2D_DEV_SERVER_URL,
+    devServerCommand: fileConfig.devServerCommand
+  };
+}
+async function detectNextJsProject(projectRoot) {
+  const hasNextConfig = existsSync5(join8(projectRoot, "next.config.ts")) || existsSync5(join8(projectRoot, "next.config.js")) || existsSync5(join8(projectRoot, "next.config.mjs"));
+  const appDir = join8(projectRoot, "app");
+  const hasAppDir = existsSync5(appDir);
+  let projectName = "unknown";
+  try {
+    const pkg = JSON.parse(await readFile4(join8(projectRoot, "package.json"), "utf-8"));
+    projectName = pkg.name || "unknown";
+  } catch {
+  }
+  return {
+    isNextJs: hasNextConfig,
+    appDir: hasAppDir ? appDir : null,
+    projectName
+  };
+}
+
+// src/utils/progress.ts
+var COLORS = {
+  reset: "\x1B[0m",
+  bold: "\x1B[1m",
+  dim: "\x1B[2m",
+  green: "\x1B[32m",
+  yellow: "\x1B[33m",
+  blue: "\x1B[34m",
+  red: "\x1B[31m",
+  cyan: "\x1B[36m"
+};
+function log(message) {
+  console.log(`${COLORS.dim}[c2d]${COLORS.reset} ${message}`);
+}
+function success(message) {
+  console.log(`${COLORS.green}  \u2713${COLORS.reset} ${message}`);
+}
+function warn(message) {
+  console.log(`${COLORS.yellow}  \u26A0${COLORS.reset} ${message}`);
+}
+function error(message) {
+  console.error(`${COLORS.red}  \u2717${COLORS.reset} ${message}`);
+}
+function header(message) {
+  console.log(`
+${COLORS.bold}${COLORS.cyan}${message}${COLORS.reset}`);
+}
+function step(current, total, message) {
+  console.log(`${COLORS.dim}  [${current}/${total}]${COLORS.reset} ${message}`);
+}
+function banner() {
+  console.log(`
+${COLORS.bold}${COLORS.cyan}  Code to Design${COLORS.reset} ${COLORS.dim}v0.1.0${COLORS.reset}
+${COLORS.dim}  AI-powered UI review canvas${COLORS.reset}
+`);
+}
+
+// src/commands/scan.ts
+async function runScan(options) {
+  const { projectRoot, skipRender = false, open = true, watch = false } = options;
+  banner();
+  const config = await loadConfig(projectRoot);
+  header("Detecting project...");
+  const project = await detectNextJsProject(projectRoot);
+  if (!project.isNextJs) {
+    error("Not a Next.js project (no next.config.ts/js/mjs found).");
+    log("Code to Design currently supports Next.js App Router projects only.");
+    process.exit(1);
+  }
+  if (!project.appDir) {
+    error("No app/ directory found. Code to Design requires Next.js App Router.");
+    process.exit(1);
+  }
+  success(`Project: ${project.projectName}`);
+  success(`App directory: ${project.appDir}`);
+  const c2dDir = join9(projectRoot, ".c2d");
+  if (skipRender) {
+    if (!existsSync6(join9(c2dDir, "manifest.json"))) {
+      error("No previous renders found. Run without --skip-render first.");
+      process.exit(1);
+    }
+    log("Skipping render, using existing canvas data...");
+    await startServer(c2dDir, config.port, open);
+    return;
+  }
+  header("Discovering routes...");
+  const routes = await scanRoutes({ appDir: project.appDir });
+  if (routes.length === 0) {
+    error("No routes found in app/ directory.");
+    process.exit(1);
+  }
+  const filteredRoutes = routes.filter(
+    (r) => !config.excludeRoutes.some((pattern) => r.urlPath.includes(pattern))
+  );
+  success(`Found ${filteredRoutes.length} routes`);
+  for (const r of filteredRoutes) {
+    log(`  ${r.urlPath}${r.isDynamic ? " [dynamic]" : ""}`);
+  }
+  if (!config.apiKey) {
+    warn("No API key configured. Mock generation will use fallback data.");
+    log("Set C2D_API_KEY env var or add apiKey to c2d.config.js");
+  }
+  header("Analyzing code and generating mocks...");
+  const renderTasks = [];
+  let totalTokens = { input: 0, output: 0 };
+  const mockOptions = {
+    apiKey: config.apiKey
+  };
+  for (let i = 0; i < filteredRoutes.length; i++) {
+    const route = filteredRoutes[i];
+    step(i + 1, filteredRoutes.length, `${route.urlPath}`);
+    const analysis = await analyzePage(route, { projectRoot });
+    const { configs, tokenUsage } = await generateMocks(analysis, mockOptions);
+    totalTokens.input += tokenUsage.input;
+    totalTokens.output += tokenUsage.output;
+    for (const mockConfig of configs) {
+      renderTasks.push({
+        route,
+        mockConfig,
+        authConfig: analysis.authConfig
+      });
+    }
+  }
+  if (totalTokens.input > 0) {
+    success(`Mock generation complete (${totalTokens.input} input tokens, ${totalTokens.output} output tokens)`);
+  } else {
+    success("Using fallback mocks (no API key or no API dependencies)");
+  }
+  header(`Pre-rendering ${renderTasks.length} page states...`);
+  if (existsSync6(join9(c2dDir, "renders"))) {
+    await rm(join9(c2dDir, "renders"), { recursive: true });
+  }
+  await mkdir3(c2dDir, { recursive: true });
+  const { results, manifest } = await preRenderPages(renderTasks, {
+    projectRoot,
+    outputDir: c2dDir,
+    devServerUrl: config.devServerUrl
+  });
+  const successCount = results.filter((r) => r.success).length;
+  const failCount = results.filter((r) => !r.success).length;
+  success(`Rendered ${successCount}/${results.length} pages`);
+  if (failCount > 0) {
+    warn(`${failCount} pages failed to render`);
+    for (const r of results.filter((r2) => !r2.success)) {
+      error(`  ${r.route.urlPath} [${r.stateName}]: ${r.error}`);
+    }
+  }
+  if (watch) {
+    const server = await startServerNonBlocking(c2dDir, config.port, open);
+    watchAndRerender(projectRoot, project.appDir, c2dDir, config);
+    await new Promise((resolve2) => {
+      const shutdown = async () => {
+        log("\nShutting down...");
+        await server.close();
+        resolve2();
+      };
+      process.on("SIGINT", shutdown);
+      process.on("SIGTERM", shutdown);
+    });
+  } else {
+    await startServer(c2dDir, config.port, open);
+  }
+}
+async function startServer(c2dDir, port, open) {
+  header("Starting canvas server...");
+  const canvasDir = await resolveCanvasDir(c2dDir);
+  if (!canvasDir) {
+    warn("Canvas app not bundled. Using placeholder.");
+  }
+  const server = await startCanvasServer({
+    port,
+    canvasDir,
+    c2dDir
+  });
+  success(`Canvas server running at ${server.url}`);
+  log("Share this URL with your team for collaborative review");
+  log("Press Ctrl+C to stop\n");
+  if (open) {
+    try {
+      const { exec } = await import("child_process");
+      exec(`open ${server.url}`);
+    } catch {
+    }
+  }
+  await new Promise((resolve2) => {
+    const shutdown = async () => {
+      log("\nShutting down...");
+      await server.close();
+      resolve2();
+    };
+    process.on("SIGINT", shutdown);
+    process.on("SIGTERM", shutdown);
+  });
+}
+async function startServerNonBlocking(c2dDir, port, open) {
+  header("Starting canvas server...");
+  const canvasDir = await resolveCanvasDir(c2dDir);
+  if (!canvasDir) {
+    warn("Canvas app not bundled. Using placeholder.");
+  }
+  const server = await startCanvasServer({
+    port,
+    canvasDir,
+    c2dDir
+  });
+  success(`Canvas server running at ${server.url}`);
+  log("Share this URL with your team for collaborative review");
+  log("Watching for file changes...\n");
+  if (open) {
+    try {
+      const { exec } = await import("child_process");
+      exec(`open ${server.url}`);
+    } catch {
+    }
+  }
+  return server;
+}
+async function resolveCanvasDir(c2dDir) {
+  const { fileURLToPath } = await import("url");
+  const { dirname: dirname3 } = await import("path");
+  const __filename = fileURLToPath(import.meta.url);
+  let dir = dirname3(__filename);
+  for (let i = 0; i < 5; i++) {
+    const candidate = join9(dir, "canvas-dist");
+    if (existsSync6(candidate) && existsSync6(join9(candidate, "index.html"))) {
+      return candidate;
+    }
+    dir = dirname3(dir);
+  }
+  const monorepoDev = join9(dirname3(__filename), "..", "..", "..", "..", "apps", "canvas", "dist");
+  if (existsSync6(monorepoDev) && existsSync6(join9(monorepoDev, "index.html"))) {
+    return monorepoDev;
+  }
+  const placeholder = join9(c2dDir, "_canvas");
+  await mkdir3(placeholder, { recursive: true });
+  const { writeFile: writeFile3 } = await import("fs/promises");
+  await writeFile3(join9(placeholder, "index.html"), `<!DOCTYPE html><html><body>
+    <h1>Code to Design</h1>
+    <p>Canvas app not built. Run: <code>cd apps/canvas && npx vite build</code></p>
+    <p><a href="/api/manifest">View Manifest</a></p>
+  </body></html>`);
+  return placeholder;
+}
+var WATCH_EXTENSIONS = /* @__PURE__ */ new Set([".tsx", ".ts", ".jsx", ".js", ".css"]);
+function shouldIgnoreFile(filename) {
+  if (!filename) return true;
+  const ignored = ["node_modules", ".next", ".c2d", ".git"];
+  if (ignored.some((dir) => filename.includes(dir))) return true;
+  const ext = filename.slice(filename.lastIndexOf("."));
+  return !WATCH_EXTENSIONS.has(ext);
+}
+function watchAndRerender(projectRoot, appDir, c2dDir, config) {
+  let debounceTimer;
+  let isRendering = false;
+  log(`Watching ${appDir} for changes...`);
+  fsWatch(appDir, { recursive: true }, (_event, filename) => {
+    if (shouldIgnoreFile(filename)) return;
+    clearTimeout(debounceTimer);
+    debounceTimer = setTimeout(async () => {
+      if (isRendering) return;
+      isRendering = true;
+      log(`
+File changed: ${filename}. Re-rendering...`);
+      try {
+        const routes = await scanRoutes({ appDir });
+        const filteredRoutes = routes.filter(
+          (r) => !config.excludeRoutes.some((pattern) => r.urlPath.includes(pattern))
+        );
+        const renderTasks = [];
+        const mockOptions = { apiKey: config.apiKey };
+        for (const route of filteredRoutes) {
+          const analysis = await analyzePage(route, { projectRoot });
+          const { configs } = await generateMocks(analysis, mockOptions);
+          for (const mockConfig of configs) {
+            renderTasks.push({
+              route,
+              mockConfig,
+              authConfig: analysis.authConfig
+            });
+          }
+        }
+        if (existsSync6(join9(c2dDir, "renders"))) {
+          await rm(join9(c2dDir, "renders"), { recursive: true });
+        }
+        await mkdir3(c2dDir, { recursive: true });
+        const { results } = await preRenderPages(renderTasks, {
+          projectRoot,
+          outputDir: c2dDir,
+          devServerUrl: config.devServerUrl
+        });
+        const successCount = results.filter((r) => r.success).length;
+        success(`Re-render complete. ${successCount} pages updated.`);
+      } catch (err) {
+        error(`Re-render failed: ${err.message || err}`);
+      } finally {
+        isRendering = false;
+      }
+    }, 500);
+  });
+}
+
+export {
+  startCanvasServer,
+  loadConfig,
+  detectNextJsProject,
+  runScan
+};
+//# sourceMappingURL=chunk-QJKUBMF6.js.map