@_davideast/stitch-mcp 0.3.2 → 0.5.0

package/dist/chunk-nxpzt33t.js

@@ -0,0 +1,278 @@
+import {
+  require_jsx_dev_runtime
+} from "./chunk-wz8d5vzb.js";
+import {
+  Box_default,
+  Text,
+  use_app_default,
+  use_input_default
+} from "./chunk-2cetsfw4.js";
+import {
+  require_react
+} from "./chunk-4jwmvjb4.js";
+import {
+  StitchViteServer
+} from "./chunk-7xh1y383.js";
+import"./chunk-w8q7nsm7.js";
+import {
+  downloadText
+} from "./chunk-4vxy1qce.js";
+import {
+  clipboardy_default
+} from "./chunk-384jmtpy.js";
+import"./chunk-mv9ssgmx.js";
+import"./chunk-4jygt4d6.js";
+import"./chunk-tz7wnw4s.js";
+import"./chunk-3sfn889r.js";
+import {
+  __toESM
+} from "./chunk-9wyra8hs.js";
+
+// src/commands/screens/ScreensView.tsx
+var import_react = __toESM(require_react(), 1);
+var jsx_dev_runtime = __toESM(require_jsx_dev_runtime(), 1);
+import { spawn } from "child_process";
+function ScreensView({ projectId, projectTitle, screens, client }) {
+  const { exit } = use_app_default();
+  const [selectedIndex, setSelectedIndex] = import_react.useState(0);
+  const [windowStart, setWindowStart] = import_react.useState(0);
+  const [status, setStatus] = import_react.useState("");
+  const [serverUrl, setServerUrl] = import_react.useState(null);
+  const serverRef = import_react.useRef(null);
+  const VIEW_HEIGHT = 10;
+  import_react.default.useEffect(() => {
+    if (selectedIndex < windowStart) {
+      setWindowStart(selectedIndex);
+    } else if (selectedIndex >= windowStart + VIEW_HEIGHT) {
+      setWindowStart(selectedIndex - VIEW_HEIGHT + 1);
+    }
+  }, [selectedIndex, windowStart, VIEW_HEIGHT]);
+  import_react.useEffect(() => {
+    return () => {
+      if (serverRef.current)
+        serverRef.current.stop();
+    };
+  }, []);
+  async function serveScreen(screen) {
+    if (!screen.hasCode || !screen.codeUrl) {
+      setStatus("No HTML to serve");
+      return;
+    }
+    setStatus("Preparing server...");
+    let srv = serverRef.current;
+    let url = serverUrl;
+    let justStarted = false;
+    if (!srv) {
+      srv = new StitchViteServer;
+      url = await srv.start(0);
+      serverRef.current = srv;
+      setServerUrl(url);
+      justStarted = true;
+    }
+    if (!url)
+      return;
+    try {
+      const html = await downloadText(screen.codeUrl);
+      const route = `/screens/${screen.screenId}`;
+      srv.mount(route, html);
+      const fullUrl = `${url}${route}`;
+      if (justStarted) {
+        const start = process.platform == "darwin" ? "open" : process.platform == "win32" ? "start" : "xdg-open";
+        if (process.platform === "win32") {
+          spawn("cmd", ["/c", "start", fullUrl], { detached: true, stdio: "ignore" }).unref();
+        } else {
+          spawn(start, [fullUrl], { detached: true, stdio: "ignore" }).unref();
+        }
+      } else {
+        srv.navigate(fullUrl);
+      }
+      setStatus(`Serving at ${fullUrl}`);
+    } catch (e) {
+      setStatus("Error serving screen");
+    }
+  }
+  use_input_default((input, key) => {
+    if (input === "q") {
+      exit();
+      return;
+    }
+    if (key.upArrow || input === "k") {
+      setSelectedIndex((prev) => Math.max(0, prev - 1));
+      setStatus("");
+    }
+    if (key.downArrow || input === "j") {
+      setSelectedIndex((prev) => Math.min(screens.length - 1, prev + 1));
+      setStatus("");
+    }
+    if (input === "c") {
+      const screen = screens[selectedIndex];
+      if (screen?.hasCode && screen.codeUrl) {
+        setStatus("Copying...");
+        downloadText(screen.codeUrl).then((code) => {
+          clipboardy_default.write(code);
+          setStatus("HTML copied!");
+        }).catch(() => setStatus("Failed to copy"));
+      } else {
+        setStatus("No HTML available");
+      }
+    }
+    if (input === "i") {
+      const screen = screens[selectedIndex];
+      if (screen?.hasImage) {
+        setStatus("Image copy not implemented");
+      } else {
+        setStatus("No image available");
+      }
+    }
+    if (input === "s") {
+      const screen = screens[selectedIndex];
+      if (screen) {
+        serveScreen(screen);
+      }
+    }
+  });
+  const visibleScreens = screens.slice(windowStart, windowStart + VIEW_HEIGHT);
+  return /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Box_default, {
+    flexDirection: "column",
+    padding: 1,
+    children: [
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+        bold: true,
+        children: [
+          projectTitle,
+          " (",
+          screens.length,
+          " screens)"
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+        dimColor: true,
+        children: [
+          "projectId: ",
+          projectId
+        ]
+      }, undefined, true, undefined, this),
+      serverUrl && /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+        dimColor: true,
+        children: [
+          "Server: ",
+          /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+            color: "green",
+            children: serverUrl
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+        children: " "
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Box_default, {
+        flexDirection: "column",
+        borderStyle: "single",
+        borderColor: "yellow",
+        paddingX: 1,
+        children: [
+          windowStart > 0 && /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+            dimColor: true,
+            children: [
+              "... ",
+              windowStart,
+              " more above ..."
+            ]
+          }, undefined, true, undefined, this),
+          visibleScreens.map((screen, index) => {
+            const absoluteIndex = windowStart + index;
+            const isSelected = absoluteIndex === selectedIndex;
+            const num = String(absoluteIndex + 1).padStart(2, " ");
+            const selector = isSelected ? "▸" : " ";
+            return /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Box_default, {
+              flexDirection: "column",
+              children: [
+                /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Box_default, {
+                  justifyContent: "space-between",
+                  children: [
+                    /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Box_default, {
+                      children: [
+                        /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                          dimColor: true,
+                          children: num
+                        }, undefined, false, undefined, this),
+                        /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                          color: isSelected ? "cyan" : undefined,
+                          children: [
+                            " ",
+                            selector,
+                            " "
+                          ]
+                        }, undefined, true, undefined, this),
+                        /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                          color: isSelected ? "cyan" : undefined,
+                          bold: isSelected,
+                          children: screen.title.slice(0, 28)
+                        }, undefined, false, undefined, this)
+                      ]
+                    }, undefined, true, undefined, this),
+                    /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Box_default, {
+                      children: [
+                        /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                          dimColor: true,
+                          children: "html"
+                        }, undefined, false, undefined, this),
+                        /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                          color: screen.hasCode ? "green" : "gray",
+                          children: screen.hasCode ? "[✓]" : "[ ]"
+                        }, undefined, false, undefined, this),
+                        /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                          children: "  "
+                        }, undefined, false, undefined, this),
+                        /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                          dimColor: true,
+                          children: "img"
+                        }, undefined, false, undefined, this),
+                        /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                          color: screen.hasImage ? "green" : "gray",
+                          children: screen.hasImage ? "[✓]" : "[ ]"
+                        }, undefined, false, undefined, this)
+                      ]
+                    }, undefined, true, undefined, this)
+                  ]
+                }, undefined, true, undefined, this),
+                /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                  dimColor: true,
+                  color: "gray",
+                  children: [
+                    "     screenId: ",
+                    screen.screenId
+                  ]
+                }, undefined, true, undefined, this),
+                /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+                  children: " "
+                }, undefined, false, undefined, this)
+              ]
+            }, screen.screenId, true, undefined, this);
+          }),
+          windowStart + VIEW_HEIGHT < screens.length && /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+            dimColor: true,
+            children: [
+              "... ",
+              screens.length - (windowStart + VIEW_HEIGHT),
+              " more below ..."
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+        dimColor: true,
+        children: "[c]opy html  [i]mage  [s]erve  [q]uit"
+      }, undefined, false, undefined, this),
+      status && /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+        color: "yellow",
+        children: status
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+export {
+  ScreensView
+};
+
+//# debugId=D62549CBA4CF5F8B64756E2164756E21

package/dist/chunk-nxpzt33t.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/commands/screens/ScreensView.tsx"],
+  "sourcesContent": [
+    "import React, { useState, useEffect, useRef } from 'react';\nimport { Box, Text, useInput, useApp } from 'ink';\nimport type { StitchMCPClient } from '../../services/mcp-client/client.js';\nimport { downloadText } from '../../ui/copy-behaviors/clipboard.js';\nimport clipboard from 'clipboardy';\nimport { StitchViteServer } from '../../lib/server/vite/StitchViteServer.js';\nimport { spawn } from 'child_process';\n\ninterface Screen {\n  screenId: string;\n  title: string;\n  hasCode: boolean;\n  codeUrl: string | null;\n  hasImage: boolean;\n}\n\ninterface ScreensViewProps {\n  projectId: string;\n  projectTitle: string;\n  screens: Screen[];\n  client: StitchMCPClient;\n}\n\nexport function ScreensView({ projectId, projectTitle, screens, client }: ScreensViewProps) {\n  const { exit } = useApp();\n  const [selectedIndex, setSelectedIndex] = useState(0);\n  const [windowStart, setWindowStart] = useState(0);\n  const [status, setStatus] = useState('');\n  const [serverUrl, setServerUrl] = useState<string | null>(null);\n\n  const serverRef = useRef<StitchViteServer | null>(null);\n\n  const VIEW_HEIGHT = 10;\n\n  // Helper to sync window with selection\n  React.useEffect(() => {\n    if (selectedIndex < windowStart) {\n      setWindowStart(selectedIndex);\n    } else if (selectedIndex >= windowStart + VIEW_HEIGHT) {\n      setWindowStart(selectedIndex - VIEW_HEIGHT + 1);\n    }\n  }, [selectedIndex, windowStart, VIEW_HEIGHT]);\n\n  useEffect(() => {\n      return () => {\n          if (serverRef.current) serverRef.current.stop();\n      };\n  }, []);\n\n  async function serveScreen(screen: Screen) {\n      if (!screen.hasCode || !screen.codeUrl) {\n          setStatus('No HTML to serve');\n          return;\n      }\n\n      setStatus('Preparing server...');\n      let srv = serverRef.current;\n      let url = serverUrl;\n      let justStarted = false;\n\n      if (!srv) {\n          srv = new StitchViteServer();\n          url = await srv.start(0);\n          serverRef.current = srv;\n          setServerUrl(url);\n          justStarted = true;\n      }\n\n      if (!url) return; // Should not happen\n\n      try {\n          const html = await downloadText(screen.codeUrl);\n          const route = `/screens/${screen.screenId}`;\n          srv.mount(route, html);\n\n          const fullUrl = `${url}${route}`;\n\n          if (justStarted) {\n               const start = (process.platform == 'darwin'? 'open': process.platform == 'win32'? 'start': 'xdg-open');\n               if (process.platform === 'win32') {\n                   spawn('cmd', ['/c', 'start', fullUrl], { detached: true, stdio: 'ignore' }).unref();\n               } else {\n                   spawn(start, [fullUrl], { detached: true, stdio: 'ignore' }).unref();\n               }\n          } else {\n              srv.navigate(fullUrl);\n          }\n          setStatus(`Serving at ${fullUrl}`);\n      } catch (e) {\n          setStatus('Error serving screen');\n      }\n  }\n\n  useInput((input, key) => {\n    if (input === 'q') {\n      exit();\n      return;\n    }\n\n    if (key.upArrow || input === 'k') {\n      setSelectedIndex(prev => Math.max(0, prev - 1));\n      setStatus('');\n    }\n\n    if (key.downArrow || input === 'j') {\n      setSelectedIndex(prev => Math.min(screens.length - 1, prev + 1));\n      setStatus('');\n    }\n\n    // Copy code\n    if (input === 'c') {\n      const screen = screens[selectedIndex];\n      if (screen?.hasCode && screen.codeUrl) {\n        setStatus('Copying...');\n        downloadText(screen.codeUrl)\n          .then(code => {\n            clipboard.write(code);\n            setStatus('HTML copied!');\n          })\n          .catch(() => setStatus('Failed to copy'));\n      } else {\n        setStatus('No HTML available');\n      }\n    }\n\n    // Copy image (placeholder)\n    if (input === 'i') {\n      const screen = screens[selectedIndex];\n      if (screen?.hasImage) {\n        setStatus('Image copy not implemented');\n      } else {\n        setStatus('No image available');\n      }\n    }\n\n    // Serve\n    if (input === 's') {\n      const screen = screens[selectedIndex];\n      if (screen) {\n          serveScreen(screen);\n      }\n    }\n  });\n\n  const visibleScreens = screens.slice(windowStart, windowStart + VIEW_HEIGHT);\n\n  return (\n    <Box flexDirection=\"column\" padding={1}>\n      {/* Header */}\n      <Text bold>{projectTitle} ({screens.length} screens)</Text>\n      <Text dimColor>projectId: {projectId}</Text>\n      {serverUrl && <Text dimColor>Server: <Text color=\"green\">{serverUrl}</Text></Text>}\n      <Text> </Text>\n\n      {/* Screen List */}\n      <Box flexDirection=\"column\" borderStyle=\"single\" borderColor=\"yellow\" paddingX={1}>\n        {windowStart > 0 && <Text dimColor>... {windowStart} more above ...</Text>}\n\n        {visibleScreens.map((screen, index) => {\n          // Adjust index for absolute position\n          const absoluteIndex = windowStart + index;\n          const isSelected = absoluteIndex === selectedIndex;\n          const num = String(absoluteIndex + 1).padStart(2, ' ');\n          const selector = isSelected ? '▸' : ' ';\n\n          return (\n            <Box key={screen.screenId} flexDirection=\"column\">\n              {/* Row 1: Title + Checkboxes */}\n              <Box justifyContent=\"space-between\">\n                <Box>\n                  <Text dimColor>{num}</Text>\n                  <Text color={isSelected ? 'cyan' : undefined}> {selector} </Text>\n                  <Text color={isSelected ? 'cyan' : undefined} bold={isSelected}>\n                    {screen.title.slice(0, 28)}\n                  </Text>\n                </Box>\n                <Box>\n                  <Text dimColor>html</Text>\n                  <Text color={screen.hasCode ? 'green' : 'gray'}>\n                    {screen.hasCode ? '[✓]' : '[ ]'}\n                  </Text>\n                  <Text>  </Text>\n                  <Text dimColor>img</Text>\n                  <Text color={screen.hasImage ? 'green' : 'gray'}>\n                    {screen.hasImage ? '[✓]' : '[ ]'}\n                  </Text>\n                </Box>\n              </Box>\n              {/* Row 2: screenId */}\n              <Text dimColor color=\"gray\">     screenId: {screen.screenId}</Text>\n              <Text> </Text>\n            </Box>\n          );\n        })}\n\n        {windowStart + VIEW_HEIGHT < screens.length && (\n          <Text dimColor>... {screens.length - (windowStart + VIEW_HEIGHT)} more below ...</Text>\n        )}\n      </Box>\n\n      {/* Footer */}\n      <Text dimColor>[c]opy html  [i]mage  [s]erve  [q]uit</Text>\n      {status && <Text color=\"yellow\">{status}</Text>}\n    </Box>\n  );\n}\n"
+  ],
+  "mappings": "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",
+  "debugId": "D62549CBA4CF5F8B64756E2164756E21",
+  "names": []
+}

package/dist/chunk-pfyjtfex.js

@@ -0,0 +1,172 @@
+import {
+  require_jsx_dev_runtime
+} from "./chunk-wz8d5vzb.js";
+import {
+  Box_default,
+  Text,
+  use_app_default,
+  use_input_default
+} from "./chunk-2cetsfw4.js";
+import {
+  require_react
+} from "./chunk-4jwmvjb4.js";
+import {
+  StitchViteServer
+} from "./chunk-7xh1y383.js";
+import"./chunk-w8q7nsm7.js";
+import {
+  downloadText
+} from "./chunk-4vxy1qce.js";
+import"./chunk-384jmtpy.js";
+import"./chunk-mv9ssgmx.js";
+import"./chunk-4jygt4d6.js";
+import"./chunk-tz7wnw4s.js";
+import"./chunk-3sfn889r.js";
+import {
+  __toESM
+} from "./chunk-9wyra8hs.js";
+
+// src/commands/serve/ServeView.tsx
+var import_react = __toESM(require_react(), 1);
+var jsx_dev_runtime = __toESM(require_jsx_dev_runtime(), 1);
+import { spawn } from "child_process";
+function ServeView({ projectId, projectTitle, screens }) {
+  const { exit } = use_app_default();
+  const [selectedIndex, setSelectedIndex] = import_react.useState(0);
+  const [serverUrl, setServerUrl] = import_react.useState(null);
+  const [status, setStatus] = import_react.useState("Starting server...");
+  const [server, setServer] = import_react.useState(null);
+  import_react.useEffect(() => {
+    const srv = new StitchViteServer;
+    setServer(srv);
+    let mounted = true;
+    async function init() {
+      try {
+        const url = await srv.start(0);
+        if (mounted)
+          setServerUrl(url);
+        await Promise.all(screens.map(async (screen) => {
+          try {
+            const html = await downloadText(screen.codeUrl);
+            srv.mount(`/screens/${screen.screenId}`, html);
+          } catch (e) {
+            console.error(`Failed to load ${screen.screenId}`);
+          }
+        }));
+        const indexHtml = `<!DOCTYPE html>
+<html>
+<head>
+  <title>${projectTitle}</title>
+  <style>
+    body { font-family: system-ui, sans-serif; max-width: 800px; margin: 40px auto; padding: 20px; background: #1a1a1a; color: #fff; }
+    ul { list-style: none; padding: 0; }
+    li { margin: 12px 0; padding: 16px; background: #252525; border-radius: 8px; }
+    a { color: #4fc3f7; text-decoration: none; font-size: 18px; display: block; }
+    a:hover { text-decoration: underline; }
+  </style>
+</head>
+<body>
+  <h1>${projectTitle}</h1>
+  <ul>
+    ${screens.map((s) => `<li>
+      <a href="/screens/${s.screenId}">${s.title}</a>
+    </li>`).join(`
+`)}
+  </ul>
+</body>
+</html>`;
+        srv.mount("/", indexHtml);
+        if (mounted)
+          setStatus("Ready");
+      } catch (e) {
+        if (mounted)
+          setStatus(`Error: ${e.message}`);
+      }
+    }
+    init();
+    return () => {
+      mounted = false;
+      srv.stop();
+    };
+  }, []);
+  use_input_default((input, key) => {
+    if (input === "q") {
+      exit();
+      return;
+    }
+    if (key.upArrow || input === "k") {
+      setSelectedIndex((prev) => Math.max(0, prev - 1));
+    }
+    if (key.downArrow || input === "j") {
+      setSelectedIndex((prev) => Math.min(screens.length, prev + 1));
+    }
+    if (key.return && serverUrl) {
+      const start = process.platform == "darwin" ? "open" : process.platform == "win32" ? "start" : "xdg-open";
+      let target = serverUrl;
+      if (selectedIndex > 0) {
+        const screen = screens[selectedIndex - 1];
+        if (screen) {
+          target = `${serverUrl}/screens/${screen.screenId}`;
+        }
+      }
+      if (process.platform === "win32") {
+        spawn("cmd", ["/c", "start", target], { detached: true, stdio: "ignore" }).unref();
+      } else {
+        spawn(start, [target], { detached: true, stdio: "ignore" }).unref();
+      }
+    }
+  });
+  return /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Box_default, {
+    flexDirection: "column",
+    padding: 1,
+    children: [
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+        bold: true,
+        children: projectTitle
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+        color: "green",
+        children: serverUrl || "Starting..."
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+        children: status
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Box_default, {
+        marginTop: 1,
+        flexDirection: "column",
+        children: [
+          /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+            color: selectedIndex === 0 ? "cyan" : undefined,
+            children: [
+              selectedIndex === 0 ? "> " : "  ",
+              " Index (/)"
+            ]
+          }, undefined, true, undefined, this),
+          screens.map((s, i) => /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+            color: selectedIndex === i + 1 ? "cyan" : undefined,
+            children: [
+              selectedIndex === i + 1 ? "> " : "  ",
+              " ",
+              s.title,
+              " (/screens/",
+              s.screenId,
+              ")"
+            ]
+          }, s.screenId, true, undefined, this))
+        ]
+      }, undefined, true, undefined, this),
+      /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Box_default, {
+        marginTop: 1,
+        children: /* @__PURE__ */ jsx_dev_runtime.jsxDEV(Text, {
+          dimColor: true,
+          children: "[Enter] Open | [q] Quit"
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+export {
+  ServeView
+};
+
+//# debugId=F724BF91C05C95AB64756E2164756E21

package/dist/chunk-pfyjtfex.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/commands/serve/ServeView.tsx"],
+  "sourcesContent": [
+    "import React, { useState, useEffect } from 'react';\nimport { Box, Text, useInput, useApp } from 'ink';\nimport { StitchViteServer } from '../../lib/server/vite/StitchViteServer.js';\nimport { downloadText } from '../../ui/copy-behaviors/clipboard.js';\nimport { spawn } from 'child_process';\n\ninterface CodeScreen {\n  screenId: string;\n  title: string;\n  codeUrl: string;\n}\n\ninterface ServeViewProps {\n  projectId: string;\n  projectTitle: string;\n  screens: CodeScreen[];\n}\n\nexport function ServeView({ projectId, projectTitle, screens }: ServeViewProps) {\n  const { exit } = useApp();\n  const [selectedIndex, setSelectedIndex] = useState(0);\n  const [serverUrl, setServerUrl] = useState<string | null>(null);\n  const [status, setStatus] = useState('Starting server...');\n  const [server, setServer] = useState<StitchViteServer | null>(null);\n\n  useEffect(() => {\n    const srv = new StitchViteServer();\n    setServer(srv);\n    let mounted = true;\n\n    async function init() {\n      try {\n        const url = await srv.start(0);\n        if (mounted) setServerUrl(url);\n\n        // Fetch and mount screens\n        await Promise.all(screens.map(async (screen) => {\n             try {\n                 const html = await downloadText(screen.codeUrl);\n                 srv.mount(`/screens/${screen.screenId}`, html);\n             } catch (e) {\n                 console.error(`Failed to load ${screen.screenId}`);\n             }\n        }));\n\n        // Generate Index\n        const indexHtml = `<!DOCTYPE html>\n<html>\n<head>\n  <title>${projectTitle}</title>\n  <style>\n    body { font-family: system-ui, sans-serif; max-width: 800px; margin: 40px auto; padding: 20px; background: #1a1a1a; color: #fff; }\n    ul { list-style: none; padding: 0; }\n    li { margin: 12px 0; padding: 16px; background: #252525; border-radius: 8px; }\n    a { color: #4fc3f7; text-decoration: none; font-size: 18px; display: block; }\n    a:hover { text-decoration: underline; }\n  </style>\n</head>\n<body>\n  <h1>${projectTitle}</h1>\n  <ul>\n    ${screens.map(s => `<li>\n      <a href=\"/screens/${s.screenId}\">${s.title}</a>\n    </li>`).join('\\n')}\n  </ul>\n</body>\n</html>`;\n        srv.mount('/', indexHtml);\n\n        if (mounted) setStatus('Ready');\n      } catch (e: any) {\n        if (mounted) setStatus(`Error: ${e.message}`);\n      }\n    }\n\n    init();\n\n    return () => {\n        mounted = false;\n        srv.stop();\n    };\n  }, []);\n\n  useInput((input, key) => {\n      if (input === 'q') {\n          exit();\n          return;\n      }\n\n      if (key.upArrow || input === 'k') {\n          setSelectedIndex(prev => Math.max(0, prev - 1));\n      }\n      if (key.downArrow || input === 'j') {\n          setSelectedIndex(prev => Math.min(screens.length, prev + 1));\n      }\n\n      if (key.return && serverUrl) {\n          const start = (process.platform == 'darwin'? 'open': process.platform == 'win32'? 'start': 'xdg-open');\n          let target = serverUrl;\n          if (selectedIndex > 0) {\n              const screen = screens[selectedIndex - 1];\n              if (screen) {\n                  target = `${serverUrl}/screens/${screen.screenId}`;\n              }\n          }\n          if (process.platform === 'win32') {\n             spawn('cmd', ['/c', 'start', target], { detached: true, stdio: 'ignore' }).unref();\n          } else {\n             spawn(start, [target], { detached: true, stdio: 'ignore' }).unref();\n          }\n      }\n  });\n\n  return (\n    <Box flexDirection=\"column\" padding={1}>\n        <Text bold>{projectTitle}</Text>\n        <Text color=\"green\">{serverUrl || 'Starting...'}</Text>\n        <Text>{status}</Text>\n        <Box marginTop={1} flexDirection=\"column\">\n            <Text color={selectedIndex === 0 ? 'cyan' : undefined}>\n                {selectedIndex === 0 ? '> ' : '  '} Index (/)\n            </Text>\n            {screens.map((s, i) => (\n                <Text key={s.screenId} color={selectedIndex === i + 1 ? 'cyan' : undefined}>\n                    {selectedIndex === i + 1 ? '> ' : '  '} {s.title} (/screens/{s.screenId})\n                </Text>\n            ))}\n        </Box>\n        <Box marginTop={1}>\n            <Text dimColor>[Enter] Open | [q] Quit</Text>\n        </Box>\n    </Box>\n  );\n}\n"
+  ],
+  "mappings": "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",
+  "debugId": "F724BF91C05C95AB64756E2164756E21",
+  "names": []
+}