@sidecar-ai/cli 0.1.0-alpha.10 → 0.1.0-alpha.11

package/dist/index.js

@@ -1,45 +1,25 @@
 #!/usr/bin/env node
 
 // packages/cli/src/index.ts
-import { existsSync as existsSync7, realpathSync } from "fs";
+import { existsSync as existsSync8, realpathSync } from "fs";
 import { mkdir as mkdir10, readFile as readFile8, writeFile as writeFile10 } from "fs/promises";
-import { createServer as createServer2 } from "http";
-import path20 from "path";
+import { spawn as spawn2 } from "child_process";
+import { createServer as createServer3 } from "http";
+import path21 from "path";
 import { createInterface as createInterface2 } from "readline/promises";
-import { fileURLToPath, pathToFileURL as pathToFileURL3 } from "url";
-import { cwd, exit, stdin as stdin2, stdout as stdout2 } from "process";
+import { fileURLToPath as fileURLToPath2, pathToFileURL as pathToFileURL3 } from "url";
+import { cwd, execPath, exit, stdin as stdin2, stdout as stdout2 } from "process";
 import { tsImport as tsImport2 } from "tsx/esm/api";
 
-// packages/auth/src/core.ts
-var authBrand = /* @__PURE__ */ Symbol.for("sidecar.auth");
-function isSidecarAuth(value) {
-  return Boolean(
-    value && typeof value === "object" && (value[authBrand] || value.kind === "sidecar.auth")
-  );
-}
-
 // packages/core/src/index.ts
-var MCP_APP_RESOURCE_MIME_TYPE = "text/html;profile=mcp-app";
 var toolBrand = /* @__PURE__ */ Symbol.for("sidecar.tool");
 var toolResultBrand = /* @__PURE__ */ Symbol.for("sidecar.toolResult");
-var resourceBrand = /* @__PURE__ */ Symbol.for("sidecar.resource");
 var resourceResultBrand = /* @__PURE__ */ Symbol.for("sidecar.resourceResult");
-var promptBrand = /* @__PURE__ */ Symbol.for("sidecar.prompt");
 function isSidecarTool(value) {
   return Boolean(
     value && typeof value === "object" && (value[toolBrand] || value.kind === "sidecar.tool")
   );
 }
-function isSidecarResource(value) {
-  return Boolean(
-    value && typeof value === "object" && (value[resourceBrand] || value.kind === "sidecar.resource")
-  );
-}
-function isSidecarPrompt(value) {
-  return Boolean(
-    value && typeof value === "object" && (value[promptBrand] || value.kind === "sidecar.prompt")
-  );
-}
 var toolResult = Object.assign(
   createToolResult,
   {
@@ -94,57 +74,6 @@ function createResourceResult(input) {
   });
   return resultEnvelope;
 }
-function isToolResult(value) {
-  return Boolean(
-    value && typeof value === "object" && value[toolResultBrand] === true
-  );
-}
-function isResourceResult(value) {
-  return Boolean(
-    value && typeof value === "object" && value[resourceResultBrand] === true
-  );
-}
-function normalizeToolResult(value) {
-  if (!isToolResult(value)) {
-    throw new SidecarRuntimeError(
-      "Tool execute() must return toolResult({ structuredContent, content, meta }).",
-      "invalid_tool_result"
-    );
-  }
-  return stripUndefined({
-    structuredContent: stripJsonUndefined(value.structuredContent),
-    content: value.content ?? [],
-    _meta: stripJsonUndefined(value._meta),
-    isError: value.isError
-  });
-}
-function normalizeResourceResult(value, uri, defaultMimeType) {
-  if (!isResourceResult(value)) {
-    throw new SidecarRuntimeError(
-      "Resource read() must return resourceResult(...).",
-      "invalid_resource_result"
-    );
-  }
-  return {
-    contents: value.contents.map(
-      (content) => normalizeResourceContent(content, uri, defaultMimeType)
-    )
-  };
-}
-async function executeTool(sidecarTool, params, ctx) {
-  const parsedParams = validateParams(sidecarTool, params);
-  const value = await sidecarTool.execute(parsedParams, ctx);
-  return normalizeToolResult(value);
-}
-async function executeResource(sidecarResource, ctx, options) {
-  const value = await sidecarResource.read(ctx);
-  return normalizeResourceResult(value, options.uri, sidecarResource.mimeType ?? options.mimeType);
-}
-async function executePrompt(sidecarPrompt, args, ctx) {
-  const parsedArgs = validatePromptArgs(sidecarPrompt, args);
-  const value = await sidecarPrompt.run(parsedArgs, ctx);
-  return normalizePromptResult(value, sidecarPrompt.description);
-}
 function createToolDescriptor(definition) {
   const machineName = definition.id ?? toMachineName(definition.name);
   validateToolId(machineName);
@@ -309,16 +238,6 @@ var SidecarRuntimeError = class extends Error {
   }
   code;
 };
-function validateParams(sidecarTool, params) {
-  if (!sidecarTool.params) {
-    return params ?? {};
-  }
-  const parsed = sidecarTool.params.safeParse(params ?? {});
-  if (parsed.success) {
-    return parsed.data;
-  }
-  throw new SidecarRuntimeError(`Invalid parameters for tool "${sidecarTool.name}".`, "invalid_tool_params");
-}
 function normalizeRequiredContent(content) {
   if (typeof content === "string") {
     return [toolResult.text(content)];
@@ -332,49 +251,6 @@ function normalizeRequiredContent(content) {
     "invalid_tool_result"
   );
 }
-function normalizeResourceContent(content, uri, defaultMimeType) {
-  const annotations = normalizeAnnotations(content.annotations);
-  const meta = content.meta;
-  if (isBinaryLike(content.content)) {
-    return stripUndefined({
-      uri,
-      mimeType: content.mimeType ?? defaultMimeType ?? "application/octet-stream",
-      blob: bytesToBase64(content.content),
-      annotations,
-      _meta: meta
-    });
-  }
-  if (typeof content.content === "string") {
-    return stripUndefined({
-      uri,
-      mimeType: content.mimeType ?? defaultMimeType ?? "text/plain",
-      text: content.content,
-      annotations,
-      _meta: meta
-    });
-  }
-  return stripUndefined({
-    uri,
-    mimeType: content.mimeType ?? defaultMimeType ?? "application/json",
-    text: JSON.stringify(content.content),
-    annotations,
-    _meta: meta
-  });
-}
-function isBinaryLike(value) {
-  return value instanceof ArrayBuffer || value instanceof Uint8Array;
-}
-function bytesToBase64(value) {
-  const bytes = value instanceof ArrayBuffer ? new Uint8Array(value) : value;
-  if (typeof Buffer !== "undefined") {
-    return Buffer.from(bytes).toString("base64");
-  }
-  let binary = "";
-  for (const byte of bytes) {
-    binary += String.fromCharCode(byte);
-  }
-  return btoa(binary);
-}
 function normalizeAnnotations(annotations) {
   if (!annotations) {
     return void 0;
@@ -411,45 +287,6 @@ function promptArguments(args) {
 function isReadonlyArray(value) {
   return Array.isArray(value);
 }
-function validatePromptArgs(promptDefinition, args) {
-  const input = args && typeof args === "object" && !Array.isArray(args) ? args : {};
-  for (const argument of promptArguments(promptDefinition.args) ?? []) {
-    if (argument.required !== false && !(argument.name in input)) {
-      throw new SidecarRuntimeError(
-        `Prompt "${promptDefinition.name ?? promptDefinition.title}" is missing required argument "${argument.name}".`,
-        "invalid_prompt_args"
-      );
-    }
-  }
-  return input;
-}
-function normalizePromptResult(value, defaultDescription) {
-  if (typeof value === "string") {
-    return {
-      description: defaultDescription,
-      messages: [{
-        role: "user",
-        content: toolResult.text(value)
-      }]
-    };
-  }
-  if (Array.isArray(value)) {
-    return {
-      description: defaultDescription,
-      messages: value
-    };
-  }
-  if ("messages" in value) {
-    return {
-      description: value.description ?? defaultDescription,
-      messages: value.messages
-    };
-  }
-  return {
-    description: defaultDescription,
-    messages: [value]
-  };
-}
 function stripUndefined(value) {
   return Object.fromEntries(Object.entries(value).filter(([, entry]) => entry !== void 0));
 }
@@ -991,6 +828,83 @@ createRoot(document.getElementById("root")!).render(
     entry.descriptor._meta = mergeWidgetMeta(entry.descriptor._meta, widgetMeta(resourceUri, entry.widget.options, entry.target));
   }
 }
+async function buildCodeModeWidget(rootDir, outDir, tools, target, config = void 0) {
+  const renderable = tools.filter(
+    (entry) => Boolean(entry.widget)
+  );
+  if (!renderable.length) {
+    return void 0;
+  }
+  const cacheDir = path4.join(rootDir, ".sidecar", "cache", "widgets");
+  await mkdir(cacheDir, { recursive: true });
+  const appStyle = await prepareAppStyle(rootDir, cacheDir);
+  const configure = await loadWidgetBundlerHook(rootDir, cacheDir, config?.configure);
+  const safeId = "code-mode";
+  const entryFile = path4.join(cacheDir, `${safeId}.entry.tsx`);
+  await writeFile(entryFile, renderCodeModeWidgetEntry(rootDir, entryFile, renderable, appStyle));
+  const baseOptions = enforceWidgetBuildInvariants({
+    absWorkingDir: rootDir,
+    alias: sidecarWidgetAliases(rootDir),
+    bundle: true,
+    define: {
+      "process.env.NODE_ENV": JSON.stringify("production")
+    },
+    entryPoints: [entryFile],
+    format: "iife",
+    jsx: "automatic",
+    minify: true,
+    nodePaths: [
+      path4.join(rootDir, "node_modules"),
+      path4.join(process.cwd(), "node_modules")
+    ],
+    outfile: "widget.js",
+    platform: "browser",
+    sourcemap: false,
+    write: false
+  });
+  const staticOptions = widgetBuildOptionsFromConfig(rootDir, config);
+  const configuredOptions = configure ? await configureWidgetBuild(configure, {
+    rootDir,
+    outDir,
+    entryFile,
+    widget: {
+      toolId: "execute_code",
+      toolName: "Execute Code",
+      target,
+      sourceFile: path4.relative(rootDir, entryFile)
+    },
+    esbuildOptions: mergeWidgetBuildOptions(baseOptions, staticOptions)
+  }) : void 0;
+  const bundled = await esbuild(enforceWidgetBuildInvariants(
+    mergeWidgetBuildOptions(baseOptions, staticOptions, configuredOptions),
+    { rootDir, entryFile }
+  ));
+  const outputFiles = bundled.outputFiles ?? [];
+  const javascript = outputFiles.find((file) => file.path.endsWith(".js"))?.text ?? "";
+  const css = outputFiles.filter((file) => file.path.endsWith(".css")).map((file) => file.text).join("\n");
+  const html = renderWidgetHtml("Execute Code", javascript, css);
+  const hash = createHash("sha256").update(html).digest("hex").slice(0, 12);
+  const outputDir = path4.join(outDir, "public", "widgets", safeId);
+  const outputFile = path4.join(outputDir, `widget.${hash}.html`);
+  const resourceUri = `ui://${safeId}/widget.${hash}.html`;
+  const options = {
+    description: "Renders the selected result from a Sidecar code-mode execution.",
+    csp: {
+      connectDomains: [],
+      resourceDomains: []
+    }
+  };
+  await mkdir(outputDir, { recursive: true });
+  await writeFile(outputFile, html);
+  return {
+    sourceFile: path4.relative(rootDir, entryFile),
+    variant: "shared",
+    resourceUri,
+    resourceMeta: widgetResourceMeta(options, target),
+    outputFile: path4.relative(outDir, outputFile),
+    options
+  };
+}
 function widgetBuildOptionsFromConfig(rootDir, config) {
   const esbuildConfig = config?.esbuild;
   if (!esbuildConfig) {
@@ -1087,6 +1001,105 @@ function enforceWidgetBuildInvariants(options, required) {
     write: false
   };
 }
+function renderCodeModeWidgetEntry(rootDir, entryFile, entries, appStyle) {
+  const entryDir = path4.dirname(entryFile);
+  const imports = entries.map((entry, index) => {
+    const sourceFile = path4.join(rootDir, entry.widget.sourceFile);
+    return `import Widget${index} from ${JSON.stringify(toImportSpecifier(entryDir, sourceFile))};`;
+  }).join("\n");
+  const registry = entries.map((entry, index) => `${JSON.stringify(entry.id)}: Widget${index}`).join(",\n  ");
+  return `import React, { useMemo } from "react";
+import { createRoot } from "react-dom/client";
+import {
+  SidecarWidgetProvider,
+  SidecarWidgetRoot,
+  browserBridge,
+  useToolResult
+} from "@sidecar-ai/react";
+import { Heading, Stack, Surface, Text } from "@sidecar-ai/native/components";
+import "@sidecar-ai/native/styles.css";
+${appStyle ? `import ${JSON.stringify(toImportSpecifier(entryDir, appStyle))};` : ""}
+${imports}
+
+const registry = {
+  ${registry}
+};
+
+function nestedResult(result, payload) {
+  return {
+    ...result,
+    structuredContent: payload?.result ?? payload?.value,
+    structured: payload?.result ?? payload?.value,
+    content: payload?.content ?? result.content ?? [],
+    meta: payload?.meta ?? result.meta ?? {},
+    _meta: payload?.meta ?? result._meta ?? {},
+  };
+}
+
+function createNestedBridge(result, payload) {
+  return {
+    ...browserBridge,
+    getToolResult() {
+      return nestedResult(result, payload);
+    },
+    subscribeToolResult(listener) {
+      return browserBridge.subscribeToolResult((next) => {
+        const nextPayload = next?.structuredContent?.codeMode;
+        listener(nestedResult(next, nextPayload));
+      });
+    },
+  };
+}
+
+function GenericCodeModeResult({ payload }) {
+  return React.createElement("main", { className: "sidecar-code-mode" },
+    React.createElement(Stack, { gap: "md" },
+      React.createElement(Heading, { level: 1 }, "Code result"),
+      React.createElement(Surface, { variant: "card" },
+        React.createElement("pre", {
+          style: {
+            margin: 0,
+            overflowWrap: "anywhere",
+            whiteSpace: "pre-wrap"
+          }
+        }, JSON.stringify(payload?.value ?? payload ?? {}, null, 2))
+      )
+    )
+  );
+}
+
+function CodeModeWidget() {
+  const result = useToolResult();
+  const payload = result.structuredContent?.codeMode;
+  const renderer = payload?.renderer;
+  const Component = renderer ? registry[renderer] : undefined;
+  const bridge = useMemo(() => createNestedBridge(result, payload), [result, payload]);
+
+  if (Component) {
+    return React.createElement(
+      SidecarWidgetProvider,
+      { bridge },
+      React.createElement(Component)
+    );
+  }
+
+  if (payload?.ok === false) {
+    return React.createElement("main", { className: "sidecar-code-mode" },
+      React.createElement(Stack, { gap: "sm" },
+        React.createElement(Heading, { level: 1 }, "Code failed"),
+        React.createElement(Text, { tone: "muted" }, "The generated code did not complete successfully.")
+      )
+    );
+  }
+
+  return React.createElement(GenericCodeModeResult, { payload });
+}
+
+createRoot(document.getElementById("root")).render(
+  React.createElement(SidecarWidgetRoot, null, React.createElement(CodeModeWidget))
+);
+`;
+}
 function sidecarWidgetAliases(rootDir) {
   return {
     ...devSidecarBundleAliases(rootDir) ?? {},
@@ -1135,6 +1148,7 @@ function devSidecarBundleAliases(rootDir) {
     return void 0;
   }
   return {
+    "sidecar-ai/remote": path4.join(repoRoot, "packages", "sidecar-ai", "src", "remote.ts"),
     "sidecar-ai": path4.join(repoRoot, "packages", "sidecar-ai", "src", "index.ts"),
     "@sidecar-ai/client": path4.join(repoRoot, "packages", "client", "src", "index.ts"),
     "@sidecar-ai/core": path4.join(repoRoot, "packages", "core", "src", "index.ts"),
@@ -1896,6 +1910,7 @@ function readStringArrayProperty2(definition, propertyName) {
 
 // packages/compiler/src/build.ts
 import { mkdir as mkdir9, writeFile as writeFile9 } from "fs/promises";
+import { existsSync as existsSync7 } from "fs";
 import path19 from "path";
 
 // packages/compiler/src/config.ts
@@ -1937,6 +1952,10 @@ function analyzeProjectConfig(rootDir) {
     pagination: {
       pageSize: readNumberNested(definition, "pagination", "pageSize") ?? 50,
       hasOverride: hasProperty(readObjectProperty3(definition, "pagination"), "override")
+    },
+    codeMode: readCodeModeConfig(definition),
+    remoteExecution: {
+      enabled: readBooleanProperty3(definition, "remoteExecution") ?? false
     }
   };
 }
@@ -1994,9 +2013,75 @@ function defaultCompilerConfig() {
     pagination: {
       pageSize: 50,
       hasOverride: false
+    },
+    codeMode: {
+      enabled: false,
+      unsafe: false,
+      render: {
+        enabled: true,
+        strategy: "last-renderable"
+      }
+    },
+    remoteExecution: {
+      enabled: false
     }
   };
 }
+function readCodeModeConfig(definition) {
+  const defaults = defaultCompilerConfig().codeMode;
+  const property = definition.getProperty("codeMode");
+  if (!property || !Node5.isPropertyAssignment(property)) {
+    return defaults;
+  }
+  const initializer = unwrapExpression(property.getInitializer());
+  if (!initializer) {
+    return defaults;
+  }
+  if (initializer.getKind() === SyntaxKind3.TrueKeyword) {
+    return { ...defaults, enabled: true };
+  }
+  if (initializer.getKind() === SyntaxKind3.FalseKeyword) {
+    return { ...defaults, enabled: false };
+  }
+  if (!Node5.isObjectLiteralExpression(initializer)) {
+    return defaults;
+  }
+  return {
+    enabled: true,
+    unsafe: readBooleanProperty3(initializer, "unsafe") ?? false,
+    render: readCodeModeRenderConfig(initializer) ?? defaults.render
+  };
+}
+function readCodeModeRenderConfig(definition) {
+  const property = definition.getProperty("render");
+  if (!property || !Node5.isPropertyAssignment(property)) {
+    return void 0;
+  }
+  const initializer = unwrapExpression(property.getInitializer());
+  if (!initializer) {
+    return void 0;
+  }
+  if (initializer.getKind() === SyntaxKind3.TrueKeyword) {
+    return { enabled: true, strategy: "last-renderable" };
+  }
+  if (initializer.getKind() === SyntaxKind3.FalseKeyword) {
+    return { enabled: false, strategy: "last-renderable" };
+  }
+  if (!Node5.isObjectLiteralExpression(initializer)) {
+    return void 0;
+  }
+  return {
+    enabled: readBooleanProperty3(initializer, "enabled") ?? true,
+    strategy: readRenderStrategy(initializer) ?? "last-renderable"
+  };
+}
+function readRenderStrategy(definition) {
+  const value = readStringProperty3(definition, "strategy");
+  if (value === "last-renderable" || value === "first-renderable" || value === "explicit") {
+    return value;
+  }
+  return void 0;
+}
 function readTargetNested(definition, section, propertyName) {
   const value = readStringNested(definition, section, propertyName);
   return value === "mcp" || value === "chatgpt" || value === "claude" ? value : void 0;
@@ -2017,7 +2102,10 @@ function readBooleanNested(definition, section, propertyName) {
   if (!object) {
     return void 0;
   }
-  const property = object.getProperty(propertyName);
+  return readBooleanProperty3(object, propertyName);
+}
+function readBooleanProperty3(definition, propertyName) {
+  const property = definition.getProperty(propertyName);
   if (!property || !Node5.isPropertyAssignment(property)) {
     return void 0;
   }
@@ -3046,12 +3134,12 @@ function readArgInput(node) {
   if (Node7.isObjectLiteralExpression(initializer)) {
     return {
       description: getOptionalStringProperty2(initializer, "description"),
-      required: readBooleanProperty3(initializer, "required")
+      required: readBooleanProperty4(initializer, "required")
     };
   }
   return void 0;
 }
-function readBooleanProperty3(definition, propertyName) {
+function readBooleanProperty4(definition, propertyName) {
   const property = definition.getProperty(propertyName);
   if (!property || !Node7.isPropertyAssignment(property)) {
     return void 0;
@@ -3170,7 +3258,7 @@ function analyzeResourceFile(sourceFile, rootDir) {
     mimeType: descriptor.mimeType,
     size: descriptor.size,
     annotations: descriptor.annotations,
-    subscribe: readBooleanProperty4(definition, "subscribe"),
+    subscribe: readBooleanProperty5(definition, "subscribe"),
     descriptor
   };
 }
@@ -3231,7 +3319,7 @@ function getOptionalNumberProperty(definition, propertyName) {
   const initializer = unwrapExpression(property.getInitializer());
   return initializer && Node8.isNumericLiteral(initializer) ? Number(initializer.getLiteralText()) : void 0;
 }
-function readBooleanProperty4(definition, propertyName) {
+function readBooleanProperty5(definition, propertyName) {
   const property = definition.getProperty(propertyName);
   if (!property || !Node8.isPropertyAssignment(property)) {
     return void 0;
@@ -3379,7 +3467,7 @@ function renderServerEntry(rootDir, entryFile, manifest, identity) {
     `import { pathToFileURL } from "node:url";`,
     `import { createSidecarHttpHandler } from "@sidecar-ai/server";`,
     `import { isSidecarAuth } from "@sidecar-ai/auth";`,
-    `import { isSidecarPrompt, isSidecarResource, isSidecarTool } from "@sidecar-ai/core";`,
+    `import { isSidecarPrompt, isSidecarRemote, isSidecarResource, isSidecarTool } from "@sidecar-ai/core";`,
     `import { isSidecarProxy } from "@sidecar-ai/server/proxy";`,
     ...tools.map(
       (entry, index) => `import tool${index} from ${JSON.stringify(toImportSpecifier(entryDir, path18.join(rootDir, entry.sourceFile)))};`
@@ -3392,6 +3480,7 @@ function renderServerEntry(rootDir, entryFile, manifest, identity) {
     ),
     existsSync6(path18.join(rootDir, "auth.ts")) ? `import authExport from ${JSON.stringify(toImportSpecifier(entryDir, path18.join(rootDir, "auth.ts")))};` : `const authExport = undefined;`,
     existsSync6(path18.join(rootDir, "proxy.ts")) ? `import proxyExport from ${JSON.stringify(toImportSpecifier(entryDir, path18.join(rootDir, "proxy.ts")))};` : `const proxyExport = undefined;`,
+    existsSync6(path18.join(rootDir, "remote.ts")) ? `import remoteExport from ${JSON.stringify(toImportSpecifier(entryDir, path18.join(rootDir, "remote.ts")))};` : `const remoteExport = undefined;`,
     existsSync6(path18.join(rootDir, "sidecar.config.ts")) ? `import configExport from ${JSON.stringify(toImportSpecifier(entryDir, path18.join(rootDir, "sidecar.config.ts")))};` : `const configExport = undefined;`
   ].join("\n");
   return `${imports}
@@ -3404,6 +3493,9 @@ const auth = loadedAuth && process.env.SIDECAR_MCP_URL
   ? loadedAuth.withResource(process.env.SIDECAR_MCP_URL)
   : loadedAuth;
 const proxy = proxyExport === undefined ? undefined : assertProxy(proxyExport);
+const remoteExecution = manifest.codeMode?.remoteExecution
+  ? assertRemote(remoteExport)
+  : undefined;
 const runtimeConfig = configExport && typeof configExport === "object" ? configExport : undefined;
 
 if (auth && !process.env.SIDECAR_MCP_URL) {
@@ -3417,6 +3509,21 @@ export const handler = createSidecarHttpHandler({
   publicUrl: process.env.SIDECAR_PUBLIC_URL ?? process.env.SIDECAR_MCP_URL,
   auth,
   proxy,
+  codeMode: manifest.codeMode
+    ? {
+        enabled: true,
+        unsafe: manifest.codeMode.unsafe,
+        render: manifest.codeMode.render,
+        widgetMeta: manifest.codeMode.widget?.resourceUri
+          ? {
+              ui: { resourceUri: manifest.codeMode.widget.resourceUri },
+              "ui/resourceUri": manifest.codeMode.widget.resourceUri,
+              ...(manifest.target === "chatgpt" ? { "openai/outputTemplate": manifest.codeMode.widget.resourceUri } : {}),
+            }
+          : undefined,
+      }
+    : undefined,
+  remoteExecution,
   tools: [
 ${tools.map((entry, index) => `    loadTool(${JSON.stringify(entry.sourceFile)}, tool${index}, manifest.tools[${index}].descriptor),`).join("\n")}
   ],
@@ -3448,12 +3555,23 @@ if (isDirectRun()) {
   server.listen(port, host, () => {
     const localHost = host === "0.0.0.0" ? "127.0.0.1" : host;
     console.log(\`MCP running on Streamable HTTP at http://\${localHost}:\${port}\${process.env.SIDECAR_MCP_PATH ?? "/mcp"}\`);
+    printRuntimeUrls(localHost, port);
   });
 
   process.on("SIGTERM", () => shutdown());
   process.on("SIGINT", () => shutdown());
 }
 
+function printRuntimeUrls(localHost, port) {
+  const mcpPath = process.env.SIDECAR_MCP_PATH ?? "/mcp";
+  console.log("Sidecar URLs:");
+  console.log(\`  Local MCP: http://\${localHost}:\${port}\${mcpPath}\`);
+  console.log(\`  Public MCP: \${process.env.SIDECAR_MCP_URL ?? "set SIDECAR_MCP_URL=https://your-host.example.com" + mcpPath}\`);
+  if (process.env.SIDECAR_PUBLIC_URL) {
+    console.log(\`  Public base: \${process.env.SIDECAR_PUBLIC_URL}\`);
+  }
+}
+
 function loadTool(sourceFile, value, descriptor) {
   const tool = unwrapRuntimeDefault(value);
   if (!isSidecarTool(tool)) {
@@ -3498,6 +3616,14 @@ function assertProxy(value) {
   return proxyValue;
 }
 
+function assertRemote(value) {
+  const remoteValue = unwrapRuntimeDefault(value);
+  if (!isSidecarRemote(remoteValue)) {
+    throw new Error("remote.ts must default-export remote({ execute }) from sidecar-ai/remote.");
+  }
+  return remoteValue;
+}
+
 function unwrapRuntimeDefault(value) {
   if (
     value &&
@@ -3538,7 +3664,7 @@ function shutdown() {
 `;
 }
 function renderWidgetResources(manifest) {
-  return manifest.tools.filter((entry) => entry.widget?.outputFile).map((entry) => `    {
+  const toolWidgets = manifest.tools.filter((entry) => entry.widget?.outputFile).map((entry) => `    {
       uri: ${JSON.stringify(entry.widget?.resourceUri)},
       name: ${JSON.stringify(entry.name)},
       description: ${JSON.stringify(entry.widget?.options?.description)},
@@ -3546,6 +3672,15 @@ function renderWidgetResources(manifest) {
       text: readWidget(${JSON.stringify(entry.widget?.outputFile)}),
       _meta: ${JSON.stringify(entry.widget?.resourceMeta ?? void 0)},
     },`).join("\n");
+  const codeModeWidget = manifest.codeMode?.widget?.outputFile ? `    {
+      uri: ${JSON.stringify(manifest.codeMode.widget.resourceUri)},
+      name: "Execute Code",
+      description: ${JSON.stringify(manifest.codeMode.widget.options?.description)},
+      mimeType: "text/html;profile=mcp-app",
+      text: readWidget(${JSON.stringify(manifest.codeMode.widget.outputFile)}),
+      _meta: ${JSON.stringify(manifest.codeMode.widget.resourceMeta ?? void 0)},
+    },` : "";
+  return [codeModeWidget, toolWidgets].filter(Boolean).join("\n");
 }
 function renderServerPackage(identity) {
   return `${JSON.stringify({
@@ -3595,6 +3730,7 @@ function sidecarBundleAliases(rootDir) {
     return void 0;
   }
   return {
+    "sidecar-ai/remote": path18.join(repoRoot, "packages", "sidecar-ai", "src", "remote.ts"),
     "sidecar-ai": path18.join(repoRoot, "packages", "sidecar-ai", "src", "index.ts"),
     "@sidecar-ai/auth": path18.join(repoRoot, "packages", "auth", "src", "index.ts"),
     "@sidecar-ai/core": path18.join(repoRoot, "packages", "core", "src", "index.ts"),
@@ -3638,6 +3774,12 @@ async function buildProject(options) {
   const target = options.target ?? config.build.target ?? "mcp";
   const host = options.host ?? config.build.host ?? "node";
   const plugins = options.plugins ?? config.build.plugins ?? false;
+  if (config.codeMode.enabled && !config.codeMode.unsafe && !config.remoteExecution.enabled) {
+    throw new Error("Code mode requires remoteExecution: true, or codeMode: { unsafe: true } for trusted local use.");
+  }
+  if (config.codeMode.enabled && config.remoteExecution.enabled && !existsSync7(path19.join(rootDir, "remote.ts"))) {
+    throw new Error("remoteExecution: true requires a reserved remote.ts file at the project root.");
+  }
   const tools = await analyzeProjectTools(rootDir, { target });
   const resources = await analyzeProjectResources(rootDir);
   const resourceTemplates = [];
@@ -3656,6 +3798,7 @@ async function buildProject(options) {
   const outDir = resolveInsideRoot(rootDir, options.outDir ?? config.build.outDir ?? defaultBuildOutDir(host, target));
   const runtimeOutDir = resolveRuntimeOutputDir(outDir, host);
   await buildWidgets(rootDir, runtimeOutDir, tools, config.build.widgets);
+  const codeModeWidget = config.codeMode.enabled && config.codeMode.render.enabled ? await buildCodeModeWidget(rootDir, runtimeOutDir, tools, target, config.build.widgets) : void 0;
   const manifest = {
     version: 1,
     target,
@@ -3664,6 +3807,13 @@ async function buildProject(options) {
     generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
     config,
     tools,
+    codeMode: config.codeMode.enabled ? {
+      enabled: true,
+      unsafe: config.codeMode.unsafe,
+      remoteExecution: config.remoteExecution.enabled,
+      render: config.codeMode.render,
+      widget: codeModeWidget
+    } : void 0,
     resources,
     resourceTemplates,
     prompts,
@@ -3768,1359 +3918,1723 @@ This output uses Vercel's Build Output API. The MCP function is emitted at \`${V
 
 // packages/server/src/index.ts
 import { createServer } from "http";
-import { randomUUID as randomUUID2 } from "crypto";
+import {
+  createCipheriv,
+  createDecipheriv,
+  createHash as createHash2,
+  randomBytes,
+  randomUUID as randomUUID2
+} from "crypto";
 
 // packages/server/src/proxy.ts
 import { randomUUID } from "crypto";
-var proxyBrand = /* @__PURE__ */ Symbol.for("sidecar.proxy");
-function isSidecarProxy(value) {
-  return Boolean(
-    value && typeof value === "object" && (value[proxyBrand] === true || value.kind === "sidecar.proxy")
-  );
-}
-async function runProxy(proxyConfig, request) {
-  for (const middleware of proxyConfig?.before ?? []) {
-    const result = await middleware(request);
-    if (result) {
-      return result;
-    }
-  }
-  return void 0;
-}
 
 // packages/server/src/sse.ts
 import { JSONRPC_VERSION } from "@modelcontextprotocol/sdk/types.js";
-var sseEventCounter = 0;
-function createSseHub() {
-  const streams = /* @__PURE__ */ new Set();
-  return {
-    open(response) {
-      const stream = createSseStream(response);
-      streams.add(stream);
-      response.on("close", () => {
-        streams.delete(stream);
-      });
-      return stream;
-    },
-    send(method, params) {
-      const stream = streams.values().next().value;
-      stream?.send(method, params);
-    }
+
+// packages/server/src/index.ts
+import { JSONRPC_VERSION as JSONRPC_VERSION2 } from "@modelcontextprotocol/sdk/types.js";
+var CODE_MODE_CALLBACK_TOKEN_TTL_MS = 5 * 60 * 1e3;
+
+// packages/cli/src/dev-harness.ts
+import { randomUUID as randomUUID3 } from "crypto";
+import { readFileSync } from "fs";
+import { createServer as createServer2 } from "http";
+import { createRequire as createRequire2 } from "module";
+import path20 from "path";
+import { fileURLToPath } from "url";
+var require2 = createRequire2(import.meta.url);
+var OPENAI_CHAT_COMPLETIONS_URL = "https://api.openai.com/v1/chat/completions";
+var MCP_PROTOCOL_VERSION = "2025-11-25";
+var MCP_APPS_PROTOCOL_VERSION = "2026-01-26";
+var MAX_CHAT_TOOL_ITERATIONS = 4;
+var streamdownClientScriptPromise;
+async function startDevHarness(options) {
+  const state = {
+    host: options.host,
+    theme: options.theme,
+    device: options.device,
+    target: options.target,
+    model: options.model
   };
-}
-function createSseStream(response, options = {}) {
-  let closed = false;
-  response.writeHead(200, {
-    "content-type": "text/event-stream",
-    "cache-control": "no-cache, no-transform",
-    "connection": "keep-alive",
-    "x-accel-buffering": "no"
-  });
-  response.flushHeaders?.();
-  const keepAlive = setInterval(() => {
-    writeRaw(": keepalive\n\n");
-  }, 3e4);
-  keepAlive.unref?.();
-  response.on("close", () => {
-    closed = true;
-    clearInterval(keepAlive);
+  const stateClients = /* @__PURE__ */ new Set();
+  const server = createServer2(async (request, response) => {
+    try {
+      const url = new URL(request.url ?? "/", "http://127.0.0.1");
+      if (request.method === "GET" && url.pathname === "/") {
+        sendHtml(response, renderDevHarnessHtml(state, { initialBearerToken: options.initialBearerToken }));
+        return;
+      }
+      if (request.method === "GET" && url.pathname === "/__sidecar/dev/streamdown-client.js") {
+        response.writeHead(200, {
+          "cache-control": "no-cache",
+          "content-type": "text/javascript; charset=utf-8"
+        });
+        response.end(await streamdownClientScript());
+        return;
+      }
+      if (request.method === "GET" && url.pathname === "/__sidecar/dev/state") {
+        sendJson(response, devStatePayload(state, options.mcpUrl));
+        return;
+      }
+      if (request.method === "POST" && url.pathname === "/__sidecar/dev/state") {
+        const body = await readJson(request);
+        updateDevState(state, body);
+        sendJson(response, devStatePayload(state, options.mcpUrl));
+        broadcastState(stateClients, state, options.mcpUrl);
+        return;
+      }
+      if (request.method === "GET" && url.pathname === "/__sidecar/dev/events") {
+        openStateEvents(response, stateClients, state, options.mcpUrl);
+        return;
+      }
+      if (request.method === "GET" && url.pathname === "/__sidecar/dev/resource") {
+        const uri = url.searchParams.get("uri");
+        const authToken = readBearerFromCookie(request);
+        if (!uri) {
+          sendJson(response, { error: "missing_resource_uri" }, 400);
+          return;
+        }
+        const resource = await readMcpResource(options.mcpUrl, uri, authToken);
+        response.writeHead(200, { "content-type": resource.mimeType ?? "text/html; charset=utf-8" });
+        response.end(resource.text ?? "");
+        return;
+      }
+      if (request.method === "POST" && url.pathname === "/__sidecar/dev/rpc") {
+        const body = await readJson(request);
+        const method = typeof body.method === "string" ? body.method : void 0;
+        if (!method) {
+          sendJson(response, { error: "missing_method" }, 400);
+          return;
+        }
+        const result = await callMcp(options.mcpUrl, method, body.params, readAuthToken(body.authToken));
+        sendJson(response, { result });
+        return;
+      }
+      if (request.method === "POST" && url.pathname === "/__sidecar/dev/chat") {
+        await handleChatRequest(request, response, options);
+        return;
+      }
+      sendJson(response, { error: "not_found" }, 404);
+    } catch (error) {
+      sendJson(response, normalizeHttpError(error), error instanceof HttpError ? error.status : 500);
+    }
   });
-  writeRaw(`id: ${nextSseEventId()}
-data:
-
-`);
-  function writeRaw(frame) {
-    if (!closed && !response.destroyed) {
-      response.write(frame);
-    }
-  }
-  function sendJson(value) {
-    writeRaw([
-      `id: ${nextSseEventId()}`,
-      "event: message",
-      `data: ${JSON.stringify(value)}`,
-      "",
-      ""
-    ].join("\n"));
-  }
+  const port = await listenOnLocalhost(server, options.port);
   return {
-    supportsRequestProgress: options.supportsRequestProgress,
-    send(method, params) {
-      sendJson(omitUndefined({
-        jsonrpc: JSONRPC_VERSION,
-        method,
-        params
-      }));
-    },
-    sendJson,
-    end() {
-      closed = true;
-      clearInterval(keepAlive);
-      response.end();
-    }
+    port,
+    url: `http://127.0.0.1:${port}`,
+    close: () => closeServer(server)
   };
 }
-function nextSseEventId() {
-  sseEventCounter += 1;
-  return `sidecar-${Date.now()}-${sseEventCounter}`;
+function mcpToolsToOpenAiTools(tools) {
+  const used = /* @__PURE__ */ new Set();
+  const byOpenAiName = /* @__PURE__ */ new Map();
+  const openAiTools = tools.map((tool) => {
+    const name = uniqueOpenAiToolName(tool.name, used);
+    byOpenAiName.set(name, tool);
+    return {
+      type: "function",
+      function: {
+        name,
+        description: tool.description ?? tool.title ?? tool.name,
+        parameters: normalizeToolParameters(tool.inputSchema)
+      }
+    };
+  });
+  return { byOpenAiName, tools: openAiTools };
 }
-function omitUndefined(value) {
-  return Object.fromEntries(
-    Object.entries(value).filter(([, entry]) => entry !== void 0)
-  );
+function toolResourceUri(tool) {
+  const meta = tool._meta;
+  const nested = meta?.ui && typeof meta.ui === "object" ? meta.ui.resourceUri : void 0;
+  const uri = nested ?? meta?.["ui/resourceUri"] ?? meta?.["openai/outputTemplate"];
+  return typeof uri === "string" && uri ? uri : void 0;
 }
-
-// packages/server/src/index.ts
-import { JSONRPC_VERSION as JSONRPC_VERSION2 } from "@modelcontextprotocol/sdk/types.js";
-var SIDECAR_MCP_PROTOCOL_VERSION = "2025-11-25";
-var SidecarMcpServer = class {
-  constructor(options) {
-    this.options = options;
-    for (const loaded of options.tools) {
-      const descriptorProvided = Boolean(loaded.descriptor);
-      const descriptor = loaded.descriptor ?? createToolDescriptor(loaded.tool);
-      if (this.tools.has(descriptor.name)) {
-        throw new Error(`Duplicate Sidecar tool id "${descriptor.name}".`);
+function renderDevHarnessHtml(state, options = {}) {
+  return `<!doctype html>
+<html lang="en" data-sidecar-host="${state.host}" data-sidecar-theme="${state.theme}" data-sidecar-device="${state.device}">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>Sidecar dev</title>
+    <style>
+      :root {
+        color-scheme: light dark;
+        --radius: 14px;
+        --bg: oklch(0.971 0.025 97.1);
+        --text: oklch(0.145 0 0);
+        --panel: oklch(1 0 0);
+        --panel-soft: oklch(0.903 0.033 93.5);
+        --muted: oklch(0.537 0.022 97.1);
+        --border: oklch(0.911 0.035 96.3);
+        --sidebar: oklch(0.959 0.035 96.3);
+        --accent: oklch(0.651 0.055 65.6);
+        --accent-text: oklch(0.984 0.014 78.3);
+        --control-bg: oklch(0.145 0 0);
+        --control-text: oklch(0.985 0 0);
+        --send-bg: oklch(0.145 0 0);
+        --send-text: oklch(0.985 0 0);
+        --ring: oklch(0.708 0 0 / 28%);
+        --widget-bg: oklch(1 0 0);
+        --sidebar-width: 80px;
+        --chat-width: 420px;
+        --mobile-width: min(430px, calc(100vw - 28px));
+        --shadow: 0 24px 70px rgb(15 23 42 / 13%);
       }
-      this.tools.set(descriptor.name, { ...loaded, descriptor, descriptorProvided });
-    }
-    for (const resource of options.resources ?? []) {
-      if (this.resources.has(resource.uri)) {
-        throw new Error(`Duplicate Sidecar resource uri "${resource.uri}".`);
+      :root[data-sidecar-theme="dark"] {
+        --bg: oklch(0.218 0 0);
+        --text: oklch(0.985 0 0);
+        --panel: oklch(0.205 0 0);
+        --panel-soft: oklch(0.269 0 0);
+        --muted: oklch(0.708 0 0);
+        --border: oklch(1 0 0 / 10%);
+        --sidebar: oklch(0.264 0 0);
+        --accent: oklch(0.755 0.049 61.8);
+        --accent-text: oklch(0.218 0 0);
+        --control-bg: oklch(0.985 0 0);
+        --control-text: oklch(0.218 0 0);
+        --send-bg: oklch(0.985 0 0);
+        --send-text: oklch(0.218 0 0);
+        --ring: oklch(0.556 0 0 / 34%);
+        --widget-bg: oklch(0.205 0 0);
+        --shadow: 0 24px 70px rgb(0 0 0 / 34%);
       }
-      const descriptor = resource.descriptor ?? {
-        uri: resource.uri,
-        name: resource.name ?? resource.uri,
-        description: resource.description,
-        mimeType: resource.mimeType,
-        _meta: resource._meta
-      };
-      this.resources.set(resource.uri, { ...resource, descriptor });
-    }
-    for (const loaded of options.prompts ?? []) {
-      const descriptor = loaded.descriptor ?? {
-        name: loaded.prompt.name ?? loaded.prompt.title,
-        title: loaded.prompt.title,
-        description: loaded.prompt.description
-      };
-      if (this.prompts.has(descriptor.name)) {
-        throw new Error(`Duplicate Sidecar prompt name "${descriptor.name}".`);
+      :root[data-sidecar-host="claude"] {
+        --accent: #c96442;
+        --accent-text: #fffaf4;
+        --ring: rgb(201 100 66 / 24%);
       }
-      this.prompts.set(descriptor.name, { ...loaded, descriptor });
-    }
-    this.resourceTemplates = options.resourceTemplates ?? [];
-  }
-  options;
-  tools = /* @__PURE__ */ new Map();
-  resources = /* @__PURE__ */ new Map();
-  prompts = /* @__PURE__ */ new Map();
-  resourceTemplates;
-  activeRequests = /* @__PURE__ */ new Map();
-  subscribedResourceUris = /* @__PURE__ */ new Set();
-  /** Returns all tool descriptors exposed through `tools/list`. */
-  descriptors() {
-    return [...this.tools.values()].map((loaded) => loaded.descriptor);
-  }
-  /** Returns all resource descriptors exposed through `resources/list`. */
-  resourceDescriptors() {
-    return [...this.resources.values()].map((loaded) => loaded.descriptor);
-  }
-  /** Returns all prompt descriptors exposed through `prompts/list`. */
-  promptDescriptors() {
-    return [...this.prompts.values()].map((loaded) => loaded.descriptor);
-  }
-  /** Handles a JSON-RPC request or notification. */
-  async handle(request, context = {}) {
-    if (request.id === void 0) {
-      await this.authorizeEndpoint(context);
-      await this.handleNotification(request);
-      return void 0;
-    }
-    try {
-      const authSession = await this.authorizeEndpoint(context);
-      const authorizedContext = { ...context, authSession };
-      const result = await this.dispatch(request, authorizedContext);
-      return {
-        jsonrpc: JSONRPC_VERSION2,
-        id: request.id,
-        result
-      };
-    } catch (error) {
-      if (error instanceof RequestCancelledError) {
-        return void 0;
+      :root[data-sidecar-host="claude"][data-sidecar-theme="dark"] {
+        --accent: #d97757;
+        --accent-text: #ffffff;
+        --ring: rgb(217 119 87 / 28%);
       }
-      return {
-        jsonrpc: JSONRPC_VERSION2,
-        id: request.id,
-        error: normalizeError(error)
-      };
-    }
-  }
-  /** Routes an MCP method to its implementation. */
-  async dispatch(request, context) {
-    switch (request.method) {
-      case "initialize":
-        return {
-          protocolVersion: SIDECAR_MCP_PROTOCOL_VERSION,
-          capabilities: this.capabilities(),
-          serverInfo: {
-            name: this.options.name ?? "sidecar",
-            version: this.options.version ?? "0.0.0-dev"
-          }
-        };
-      case "ping":
-        return {};
-      case "tools/list":
-        return this.listTools(request, context);
-      case "tools/call":
-        return this.callTool(request, context);
-      case "resources/list":
-        return this.listResources(request, context);
-      case "resources/read":
-        return this.readResource(request, context);
-      case "resources/templates/list":
-        return this.listResourceTemplates(request, context);
-      case "resources/subscribe":
-        return this.subscribeResource(request);
-      case "resources/unsubscribe":
-        return this.unsubscribeResource(request);
-      case "prompts/list":
-        return this.listPrompts(request, context);
-      case "prompts/get":
-        return this.getPrompt(request, context);
-      default:
-        throw new JsonRpcError(-32601, `Unsupported method "${request.method}".`);
-    }
-  }
-  /** Builds the MCP server capability object from implemented runtime features. */
-  capabilities() {
-    const configured = this.options.capabilities ?? {};
-    return stripUndefined4({
-      tools: stripUndefined4({
-        listChanged: configured.tools?.listChanged || void 0
-      }),
-      resources: stripUndefined4({
-        subscribe: configured.resources?.subscribe || void 0,
-        listChanged: configured.resources?.listChanged || void 0
-      }),
-      prompts: this.prompts.size || configured.prompts?.listChanged ? stripUndefined4({
-        listChanged: configured.prompts?.listChanged || void 0
-      }) : void 0
-    });
-  }
-  /** Lists tools with MCP cursor pagination. */
-  async listTools(request, context) {
-    const page = await this.paginate("tools/list", this.descriptors(), request, context);
-    return stripUndefined4({
-      tools: [...page.items],
-      nextCursor: page.nextCursor
-    });
-  }
-  /** Lists resources with MCP cursor pagination. */
-  async listResources(request, context) {
-    const page = await this.paginate("resources/list", this.resourceDescriptors(), request, context);
-    return stripUndefined4({
-      resources: [...page.items],
-      nextCursor: page.nextCursor
-    });
-  }
-  /** Lists resource templates with MCP cursor pagination. */
-  async listResourceTemplates(request, context) {
-    const page = await this.paginate(
-      "resources/templates/list",
-      this.resourceTemplates.map((entry) => entry.descriptor),
-      request,
-      context
-    );
-    return stripUndefined4({
-      resourceTemplates: [...page.items],
-      nextCursor: page.nextCursor
-    });
-  }
-  /** Lists prompts with MCP cursor pagination. */
-  async listPrompts(request, context) {
-    const page = await this.paginate("prompts/list", this.promptDescriptors(), request, context);
-    return stripUndefined4({
-      prompts: [...page.items],
-      nextCursor: page.nextCursor
-    });
-  }
-  /** Applies configured or default cursor pagination to one supported list operation. */
-  async paginate(operation, items, request, context) {
-    const cursor = readCursorParam(request);
-    const pageSize = this.pageSize();
-    const override = selectPaginationOverride(this.options.pagination?.override, operation);
-    if (override) {
-      return override({
-        operation,
-        items,
-        cursor,
-        pageSize,
-        auth: context.authSession
-      });
-    }
-    return defaultPagination(items, cursor, pageSize);
-  }
-  /** Returns the server-chosen page size for all built-in list pagination. */
-  pageSize() {
-    const configured = this.options.pagination?.pageSize;
-    return configured && configured > 0 ? Math.floor(configured) : 50;
-  }
-  /** Executes a tool after request-level and tool-level auth checks. */
-  async callTool(request, context) {
-    const params = request.params;
-    const name = typeof params?.name === "string" ? params.name : void 0;
-    if (!name) {
-      throw new JsonRpcError(-32602, "tools/call requires params.name.");
-    }
-    const loaded = this.tools.get(name);
-    if (!loaded) {
-      throw new JsonRpcError(-32602, `Unknown tool "${name}".`);
-    }
-    const authSession = await this.authorizeTool(loaded, context);
-    const ctx = this.options.createContext ? await this.options.createContext(request) : createDefaultContext(request);
-    if (authSession !== void 0) {
-      ctx.auth = authSession;
-    }
-    ctx.notify = this.createNotifications(context, request);
-    const controller = new AbortController();
-    if (request.id !== null && request.id !== void 0) {
-      this.activeRequests.set(request.id, controller);
-    }
-    ctx.request = {
-      ...ctx.request,
-      signal: controller.signal
-    };
-    try {
-      const args = loaded.descriptorProvided ? validateAgainstSchema(
-        loaded.descriptor.inputSchema,
-        params?.arguments ?? {},
-        `Invalid parameters for tool "${name}".`
-      ) : params?.arguments ?? {};
-      const result = await withTimeout(
-        executeTool(loaded.tool, args, ctx),
-        this.options.toolTimeoutMs,
-        controller
-      );
-      if (loaded.descriptorProvided) {
-        validateAgainstSchema(
-          loaded.descriptor.outputSchema,
-          result.structuredContent,
-          `Invalid structuredContent returned by tool "${name}".`
-        );
+      :root[data-sidecar-host="chatgpt"] {
+        --accent: #10a37f;
+        --accent-text: #ffffff;
+        --ring: rgb(16 163 127 / 20%);
       }
-      return result;
-    } finally {
-      if (request.id !== null && request.id !== void 0) {
-        this.activeRequests.delete(request.id);
+      * { box-sizing: border-box; }
+      *::-webkit-scrollbar { height: 8px; width: 8px; }
+      *::-webkit-scrollbar-track { background: transparent; }
+      *::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--muted) 55%, transparent); border-radius: 999px; }
+      body {
+        background: var(--bg);
+        color: var(--text);
+        font: 14px/1.45 ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+        margin: 0;
       }
-    }
-  }
-  /** Authenticates the whole HTTP MCP request when auth.ts is configured. */
-  async authorizeEndpoint(context) {
-    if (context.authSession !== void 0) {
-      return context.authSession;
-    }
-    if (!this.options.auth) {
-      return void 0;
-    }
-    const request = context.request ?? new Request(this.options.auth.resource);
-    const requestAuth = await this.options.auth.authorizeRequest(request);
-    if (!requestAuth.ok) {
-      throw authJsonRpcError(requestAuth);
-    }
-    return requestAuth.auth;
-  }
-  /** Applies Sidecar auth policy for a tool call. */
-  async authorizeTool(loaded, context) {
-    const policy = loaded.tool.auth;
-    if (!this.options.auth) {
-      if (policy && policy.public !== true) {
-        throw new JsonRpcError(
-          -32001,
-          `Tool "${loaded.descriptor?.name ?? loaded.tool.name}" requires auth, but no auth.ts configuration is loaded.`
-        );
+      .shell {
+        display: flex;
+        height: 100vh;
+        min-height: 0;
       }
-      return void 0;
-    }
-    const authSession = context.authSession ?? await this.authorizeEndpoint(context);
-    const toolAuth = this.options.auth.authorizeTool(policy, authSession);
-    if (!toolAuth.ok) {
-      throw authJsonRpcError(toolAuth);
-    }
-    return toolAuth.auth;
-  }
-  /** Reads a generated widget or authored resource by URI. */
-  async readResource(request, context) {
-    const params = request.params;
-    const uri = typeof params?.uri === "string" ? params.uri : void 0;
-    if (!uri) {
-      throw new JsonRpcError(-32602, "resources/read requires params.uri.");
-    }
-    const resource = this.resources.get(uri);
-    if (!resource) {
-      throw new JsonRpcError(-32002, `Resource not found: "${uri}".`, { uri });
-    }
-    if (resource.resource) {
-      const toolContext = this.options.createContext ? await this.options.createContext(request) : createDefaultContext(request);
-      if (context.authSession !== void 0) {
-        toolContext.auth = context.authSession;
+      .content-shell {
+        display: flex;
+        flex-direction: column;
+        flex: 1 1 auto;
+        min-height: 0;
+        min-width: 0;
       }
-      toolContext.notify = this.createNotifications(context, request);
-      return executeResource(resource.resource, toResourceContext(toolContext), {
-        uri,
-        mimeType: resource.descriptor.mimeType
-      });
-    }
-    return {
-      _meta: resource._meta,
-      contents: [
-        {
-          uri,
-          mimeType: resource.mimeType ?? "text/plain",
-          text: resource.text ?? "",
-          _meta: resource._meta
-        }
-      ]
-    };
-  }
-  /** Accepts a resource subscription when server-level support is enabled. */
-  subscribeResource(request) {
-    if (!this.options.capabilities?.resources?.subscribe) {
-      throw new JsonRpcError(-32601, "Resource subscriptions are not enabled.");
-    }
-    const uri = readUriParam(request, "resources/subscribe");
-    if (!this.resources.has(uri)) {
-      throw new JsonRpcError(-32002, `Resource not found: "${uri}".`, { uri });
-    }
-    this.subscribedResourceUris.add(uri);
-    return {};
-  }
-  /** Accepts a resource unsubscription when server-level support is enabled. */
-  unsubscribeResource(request) {
-    if (!this.options.capabilities?.resources?.subscribe) {
-      throw new JsonRpcError(-32601, "Resource subscriptions are not enabled.");
-    }
-    const uri = readUriParam(request, "resources/unsubscribe");
-    if (!this.resources.has(uri)) {
-      throw new JsonRpcError(-32002, `Resource not found: "${uri}".`, { uri });
-    }
-    this.subscribedResourceUris.delete(uri);
-    return {};
-  }
-  /** Renders one named prompt with validated arguments. */
-  async getPrompt(request, context) {
-    const params = request.params;
-    const name = typeof params?.name === "string" ? params.name : void 0;
-    if (!name) {
-      throw new JsonRpcError(-32602, "prompts/get requires params.name.");
-    }
-    const loaded = this.prompts.get(name);
-    if (!loaded) {
-      throw new JsonRpcError(-32602, `Unknown prompt "${name}".`);
-    }
-    const toolContext = this.options.createContext ? await this.options.createContext(request) : createDefaultContext(request);
-    if (context.authSession !== void 0) {
-      toolContext.auth = context.authSession;
-    }
-    toolContext.notify = this.createNotifications(context, request);
-    return executePrompt(loaded.prompt, params?.arguments ?? {}, toPromptContext(toolContext));
-  }
-  /** Creates notification helpers scoped by advertised server capabilities. */
-  createNotifications(context, request) {
-    const configured = this.options.capabilities ?? {};
-    return createRuntimeNotifications(
-      context.notifications,
-      readProgressToken(request),
-      {
-        toolsListChanged: Boolean(configured.tools?.listChanged),
-        resourcesListChanged: Boolean(configured.resources?.listChanged),
-        promptsListChanged: Boolean(configured.prompts?.listChanged),
-        isResourceSubscribed: (uri) => this.subscribedResourceUris.has(uri)
+      .topbar {
+        align-items: center;
+        background: color-mix(in srgb, var(--bg) 92%, var(--panel));
+        border-bottom: 1px solid var(--border);
+        display: flex;
+        gap: 16px;
+        justify-content: space-between;
+        min-height: 64px;
+        padding: 12px 18px;
       }
-    );
-  }
-  /** Accepts notifications without side effects for client compatibility. */
-  async handleNotification(request) {
-    if (request.method === "notifications/cancelled") {
-      this.cancelRequest(request);
-    }
-  }
-  /** Applies a client cancellation notification to an active request. */
-  cancelRequest(request) {
-    const params = request.params;
-    const requestId = params?.requestId;
-    if (typeof requestId !== "string" && typeof requestId !== "number") {
-      return;
-    }
-    const controller = this.activeRequests.get(requestId);
-    if (!controller || controller.signal.aborted) {
-      return;
-    }
-    const reason = typeof params?.reason === "string" ? params.reason : "Request cancelled.";
-    controller.abort(new RequestCancelledError(reason));
-  }
-};
-function createSidecarMcpServer(options) {
-  return new SidecarMcpServer(options);
-}
-function createSidecarHttpServer(options) {
-  return createServer(createSidecarHttpHandler(options));
-}
-function createSidecarHttpHandler(options) {
-  const endpoint = options.path ?? "/mcp";
-  const maxBodyBytes = options.maxBodyBytes ?? 1e6;
-  const streamHub = createSseHub();
-  const mcp = createSidecarMcpServer(options);
-  return async (request, response) => {
-    const pathname = request.url?.split("?")[0];
-    const requestLog = createHttpRequestLog(request, pathname);
-    response.once("finish", () => {
-      logHttpRequest(requestLog, response.statusCode);
-    });
-    if (isRejectedOrigin(request, options.allowedOrigins)) {
-      response.writeHead(403, { "content-type": "application/json" });
-      response.end(JSON.stringify({ error: "forbidden_origin" }));
-      return;
-    }
-    const proxyResult = await runProxy(options.proxy, request);
-    if (proxyResult) {
-      response.writeHead(proxyResult.status, proxyResult.headers);
-      response.end(proxyResult.body ?? "");
-      return;
-    }
-    if (options.auth && request.method === "GET" && isProtectedResourceMetadataPath(pathname, endpoint)) {
-      response.writeHead(200, { "content-type": "application/json" });
-      response.end(JSON.stringify(options.auth.metadata()));
-      return;
-    }
-    if (options.auth && request.method === "GET" && pathname === "/.well-known/oauth-authorization-server") {
-      await proxyAuthorizationServerMetadata(options.auth, response);
-      return;
-    }
-    if (request.method === "GET" && pathname === endpoint) {
-      try {
-        const fetchRequest = toFetchRequest(request, options.publicUrl ?? options.auth?.resource);
-        if (options.auth) {
-          const authSession = await authorizeHttpRequest(options.auth, fetchRequest, response);
-          if (authSession === AUTH_RESPONSE_SENT) {
-            return;
-          }
-        }
-        validateProtocolVersion(request);
-        validateGetHeaders(request);
-        streamHub.open(response);
-      } catch (error) {
-        const status = error instanceof JsonRpcHttpError ? error.status : 400;
-        response.writeHead(status, { "content-type": "application/json" });
-        response.end(
-          JSON.stringify({
-            jsonrpc: JSONRPC_VERSION2,
-            id: null,
-            error: normalizeHttpError(error)
-          })
-        );
+      .brand { display: grid; gap: 1px; min-width: 180px; }
+      h1 { font-size: 15px; line-height: 1.1; margin: 0; }
+      .subtitle { color: var(--muted); font-size: 12px; }
+      .controls { align-items: center; display: flex; flex-wrap: wrap; gap: 14px; justify-content: flex-end; }
+      .control-group { align-items: center; display: flex; }
+      .segmented {
+        background: var(--panel-soft);
+        border: 1px solid var(--border);
+        border-radius: 15px;
+        display: grid;
+        gap: 0;
+        grid-template-columns: repeat(var(--segments, 2), 38px);
+        padding: 3px;
+        position: relative;
       }
-      return;
-    }
-    if (pathname === endpoint && request.method !== "POST") {
-      response.writeHead(405, {
-        "allow": "GET, POST",
-        "content-type": "application/json"
-      });
-      response.end(JSON.stringify({ error: "method_not_allowed" }));
-      return;
-    }
-    if (pathname !== endpoint) {
-      response.writeHead(404, { "content-type": "application/json" });
-      response.end(JSON.stringify({ error: "not_found" }));
-      return;
-    }
-    try {
-      const fetchRequest = toFetchRequest(request, options.publicUrl ?? options.auth?.resource);
-      const authSession = options.auth ? await authorizeHttpRequest(options.auth, fetchRequest, response) : void 0;
-      if (options.auth && authSession === AUTH_RESPONSE_SENT) {
-        return;
+      .segmented::before {
+        background: var(--panel);
+        border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
+        border-radius: 12px;
+        box-shadow: 0 1px 8px rgb(0 0 0 / 16%);
+        content: "";
+        inset: 3px auto 3px 3px;
+        position: absolute;
+        transform: translateX(calc(var(--active-index, 0) * 38px));
+        transition: transform 170ms cubic-bezier(.2, .8, .2, 1);
+        width: 38px;
       }
-      validateProtocolVersion(request);
-      validatePostHeaders(request);
-      const body = await readJson(request, maxBodyBytes);
-      if (Array.isArray(body)) {
-        throw new JsonRpcHttpError(400, -32600, "JSON-RPC batches are not supported by MCP Streamable HTTP.");
+      .segmented button, .send, .icon-button, .workspace-pill, .auth-trigger, .modal-button {
+        appearance: none;
+        cursor: pointer;
+        font: inherit;
       }
-      if (isJsonRpcResponseMessage(body)) {
-        response.writeHead(202);
-        response.end();
-        return;
+      .segmented button {
+        align-items: center;
+        background: transparent;
+        border: 0;
+        border-radius: 12px;
+        color: var(--muted);
+        display: inline-flex;
+        font-weight: 650;
+        justify-content: center;
+        min-height: 38px;
+        min-width: 38px;
+        padding: 0;
+        position: relative;
+        transition: color 140ms ease;
+        z-index: 1;
       }
-      const rpcRequest = assertJsonRpcRequest(body);
-      if (rpcRequest.id !== void 0 && hasProgressToken(rpcRequest)) {
-        const stream = createSseStream(response, { supportsRequestProgress: true });
-        const payload2 = await mcp.handle(rpcRequest, {
-          request: fetchRequest,
-          authSession,
-          notifications: stream
-        });
-        if (payload2) {
-          stream.sendJson(payload2);
-        }
-        stream.end();
-        return;
+      .segmented button[aria-pressed="true"] {
+        background: transparent;
+        box-shadow: none;
+        color: var(--text);
       }
-      const payload = await mcp.handle(rpcRequest, {
-        request: fetchRequest,
-        authSession,
-        notifications: streamHub
-      }) ?? null;
-      const responses = payload === null ? [] : [payload];
-      if (!responses.length) {
-        response.writeHead(202);
-        response.end();
-        return;
+      .auth-trigger {
+        align-items: center;
+        background: var(--panel);
+        border: 1px solid var(--border);
+        border-radius: 13px;
+        color: var(--text);
+        display: inline-flex;
+        font-weight: 700;
+        min-height: 42px;
+        padding: 0 18px;
       }
-      const authError = httpAuthError(payload);
-      response.writeHead(authError?.status ?? 200, {
-        "content-type": "application/json",
-        ...authError?.headers ?? {}
-      });
-      response.end(JSON.stringify(payload));
-    } catch (error) {
-      const status = error instanceof JsonRpcHttpError ? error.status : 400;
-      response.writeHead(status, { "content-type": "application/json" });
-      response.end(
-        JSON.stringify({
-          jsonrpc: JSONRPC_VERSION2,
-          id: null,
-          error: normalizeHttpError(error)
-        })
-      );
-    }
-  };
-}
-var DEFAULT_ALLOWED_ORIGINS = [
-  "https://chatgpt.com",
-  "https://chat.openai.com",
-  "https://claude.ai",
-  "https://*.claude.ai"
-];
-function isRejectedOrigin(request, allowedOrigins = []) {
-  const origin = request.headers.origin;
-  if (!origin) {
-    return false;
+      .auth-trigger:hover { background: color-mix(in srgb, var(--panel) 88%, var(--panel-soft)); }
+      .auth-trigger:focus-visible, .modal-button:focus-visible, .modal-close:focus-visible {
+        outline: 0;
+        box-shadow: 0 0 0 3px var(--ring);
+      }
+      .icon {
+        align-items: center;
+        display: inline-flex;
+        height: 17px;
+        justify-content: center;
+        line-height: 1;
+        width: 17px;
+      }
+      .icon svg {
+        display: block;
+        height: 17px;
+        stroke: currentColor;
+        width: 17px;
+      }
+      .button-text { display: none; }
+      .modal-input, textarea {
+        background: var(--panel);
+        border: 1px solid var(--border);
+        border-radius: 10px;
+        color: var(--text);
+        font: inherit;
+        outline: 0;
+      }
+      .modal-input:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--ring); }
+      .modal-input { min-height: 40px; padding: 0 11px; width: 100%; }
+      .modal-overlay {
+        align-items: center;
+        background: rgb(0 0 0 / 42%);
+        display: flex;
+        inset: 0;
+        justify-content: center;
+        opacity: 0;
+        padding: 20px;
+        pointer-events: none;
+        position: fixed;
+        transition: opacity 150ms ease;
+        z-index: 30;
+      }
+      .modal-overlay[data-open="true"] {
+        opacity: 1;
+        pointer-events: auto;
+      }
+      .modal-panel {
+        background: var(--panel);
+        border: 1px solid var(--border);
+        border-radius: 12px;
+        box-shadow: var(--shadow);
+        display: grid;
+        gap: 16px;
+        max-width: min(440px, calc(100vw - 32px));
+        opacity: 0;
+        padding: 20px;
+        transform: translateY(10px) scale(.98);
+        transition: opacity 150ms ease, transform 150ms ease;
+        width: 100%;
+      }
+      .modal-overlay[data-open="true"] .modal-panel {
+        opacity: 1;
+        transform: translateY(0) scale(1);
+      }
+      .modal-head {
+        align-items: start;
+        display: flex;
+        gap: 16px;
+        justify-content: space-between;
+      }
+      .modal-title { font-size: 17px; font-weight: 800; margin: 0; }
+      .modal-description { color: var(--muted); font-size: 13px; margin: 6px 0 0; }
+      .modal-close {
+        align-items: center;
+        appearance: none;
+        background: transparent;
+        border: 0;
+        border-radius: 999px;
+        color: var(--muted);
+        cursor: pointer;
+        display: inline-flex;
+        height: 28px;
+        justify-content: center;
+        padding: 0;
+        width: 28px;
+      }
+      .modal-close svg {
+        display: block;
+        height: 16px;
+        width: 16px;
+      }
+      .modal-field { display: grid; gap: 7px; }
+      .modal-label { font-size: 13px; font-weight: 700; }
+      .modal-error { color: #c43b32; display: none; font-size: 13px; }
+      .modal-error[data-visible="true"] { display: block; }
+      .modal-actions {
+        display: flex;
+        gap: 10px;
+        justify-content: flex-end;
+      }
+      .modal-button {
+        border-radius: 9px;
+        font-weight: 750;
+        min-height: 38px;
+        padding: 0 13px;
+      }
+      .modal-button[data-variant="secondary"] {
+        background: transparent;
+        border: 1px solid var(--border);
+        color: var(--text);
+      }
+      .modal-button[data-variant="primary"] {
+        background: var(--control-bg);
+        border: 1px solid var(--control-bg);
+        color: var(--control-text);
+      }
+      .modal-button:disabled {
+        cursor: wait;
+        opacity: .68;
+      }
+      .stage {
+        display: flex;
+        flex: 1 1 auto;
+        min-height: 0;
+        overflow: hidden;
+      }
+      .surface {
+        background: var(--bg);
+        box-shadow: none;
+        display: flex;
+        flex-direction: column;
+        height: 100%;
+        min-height: 0;
+        overflow: hidden;
+        transition: width 160ms ease, height 160ms ease, border-radius 160ms ease, box-shadow 160ms ease;
+        width: 100%;
+      }
+      :root[data-sidecar-device="mobile"] .surface {
+        border: 1px solid var(--border);
+        border-radius: 28px;
+        box-shadow: var(--shadow);
+        height: min(820px, calc(100dvh - 112px));
+        width: var(--mobile-width);
+      }
+      :root[data-sidecar-device="mobile"] .stage {
+        align-items: center;
+        display: flex;
+        justify-content: center;
+        padding: 18px;
+      }
+      .surface-bar {
+        align-items: center;
+        background: var(--bg);
+        border-bottom: 1px solid var(--border);
+        display: flex;
+        gap: 10px;
+        justify-content: space-between;
+        min-height: 50px;
+        padding: 0 16px;
+      }
+      .surface-title { align-items: center; display: flex; gap: 8px; font-weight: 760; }
+      .surface-dot {
+        background: var(--accent);
+        border-radius: 999px;
+        box-shadow: 0 0 0 4px var(--ring);
+        height: 8px;
+        width: 8px;
+      }
+      .surface-meta { color: var(--muted); font-size: 12px; }
+      .messages {
+        display: flex;
+        flex-direction: column;
+        flex: 1 1 auto;
+        gap: 14px;
+        min-height: 0;
+        overflow: auto;
+        padding: 18px 16px;
+        width: 100%;
+      }
+      .message {
+        display: grid;
+        gap: 8px;
+      }
+      .message[data-role="user"] {
+        background: color-mix(in srgb, var(--accent) 13%, transparent);
+        border-radius: 18px 18px 4px 18px;
+        color: var(--text);
+        justify-self: end;
+        margin-left: auto;
+        max-width: 85%;
+        padding: 9px 12px;
+      }
+      :root[data-sidecar-device="mobile"] .message[data-role="user"] { max-width: 92%; }
+      .message[data-role="assistant"], .tool-card { width: 100%; }
+      .role { display: none; }
+      .tool-title {
+        color: var(--muted);
+        font-size: 11px;
+        font-weight: 800;
+        letter-spacing: .05em;
+        text-transform: uppercase;
+      }
+      .content { font-size: 14px; overflow-wrap: anywhere; white-space: pre-wrap; }
+      .content.markdown { display: grid; gap: 10px; white-space: normal; }
+      .content.markdown > * { margin-block: 0; }
+      .content.markdown p { margin: 0; }
+      .content.markdown ul, .content.markdown ol { margin: 0; padding-left: 20px; }
+      .content.markdown pre {
+        background: color-mix(in srgb, var(--panel-soft) 78%, black);
+        border: 1px solid var(--border);
+        border-radius: 10px;
+        overflow: auto;
+        padding: 10px;
+      }
+      .content.markdown code {
+        background: var(--panel-soft);
+        border-radius: 5px;
+        font-size: .93em;
+        padding: 1px 4px;
+      }
+      .content.markdown pre code { background: transparent; padding: 0; }
+      .content.markdown table {
+        border-collapse: collapse;
+        display: block;
+        max-width: 100%;
+        overflow-x: auto;
+      }
+      .content.markdown th, .content.markdown td {
+        border: 1px solid var(--border);
+        padding: 6px 8px;
+        text-align: left;
+      }
+      .tool-card {
+        background: transparent;
+        border: 1px solid var(--border);
+        border-radius: 12px;
+        overflow: hidden;
+      }
+      .tool-head {
+        align-items: center;
+        background: color-mix(in srgb, var(--panel-soft) 58%, transparent);
+        border-bottom: 1px solid var(--border);
+        display: flex;
+        justify-content: space-between;
+        padding: 7px 10px;
+      }
+      .tool-body { display: grid; gap: 10px; padding: 12px; }
+      iframe {
+        background: var(--widget-bg);
+        border: 1px solid var(--border);
+        border-radius: 14px;
+        min-height: 380px;
+        width: 100%;
+      }
+      :root[data-sidecar-device="mobile"] iframe { min-height: 520px; }
+      .composer {
+        background: var(--bg);
+        padding: 10px 16px 14px;
+        flex: 0 0 auto;
+      }
+      form {
+        align-items: end;
+        display: flex;
+        gap: 8px;
+      }
+      textarea {
+        background: color-mix(in srgb, var(--panel-soft) 35%, transparent);
+        border: 0;
+        min-height: 56px;
+        max-height: 124px;
+        padding: 10px 44px 10px 12px;
+        resize: none;
+        width: 100%;
+      }
+      .send {
+        align-items: center;
+        aspect-ratio: 1;
+        align-self: center;
+        background: var(--send-bg);
+        border-radius: 999px;
+        color: var(--send-text);
+        display: inline-flex;
+        height: 36px;
+        justify-content: center;
+        margin-left: -52px;
+        min-height: 36px;
+        padding: 0;
+        width: 36px;
+      }
+      .send:hover { filter: brightness(.96); }
+      :root[data-sidecar-theme="dark"] .send:hover { filter: brightness(1.08); }
+      .send svg {
+        display: block;
+        height: 18px;
+        stroke-width: 2.4;
+        width: 18px;
+      }
+      .status { color: var(--muted); font-size: 12px; }
+      .error { color: #c43b32; }
+      .empty {
+        align-self: center;
+        color: var(--muted);
+        display: grid;
+        gap: 8px;
+        justify-self: center;
+        margin: auto 0;
+        padding: 24px 12px;
+        text-align: center;
+      }
+      .empty strong { color: var(--text); font-size: 16px; }
+      pre {
+        background: var(--panel-soft);
+        border-radius: 12px;
+        margin: 0;
+        overflow: auto;
+        padding: 12px;
+      }
+      @media (max-width: 760px) {
+        .shell { display: flex; flex-direction: column; }
+        .topbar { align-items: stretch; flex-direction: column; min-height: 0; padding: 12px; }
+        .brand { min-width: 0; }
+        .controls { justify-content: flex-start; }
+        .auth-trigger { min-height: 38px; }
+        .stage { display: flex; justify-content: center; padding: 12px; }
+        .surface { border: 1px solid var(--border); border-radius: 20px; box-shadow: var(--shadow); width: calc(100vw - 24px); }
+        .send { flex: 0 0 32px; }
+      }
+    </style>
+  </head>
+	  <body>
+	    <main class="shell">
+	      <section class="content-shell">
+	        <div class="topbar">
+	          <div class="brand">
+	            <h1>Sidecar dev</h1>
+	            <div class="subtitle">Local MCP app simulator</div>
+	          </div>
+	          <div class="controls">
+	            <div class="control-group">
+	              <div class="segmented" aria-label="Host">
+	                <button type="button" data-host="chatgpt" aria-label="ChatGPT preview" title="ChatGPT"><span class="icon">${iconSvg("chatgpt")}</span><span class="button-text">ChatGPT</span></button>
+	                <button type="button" data-host="claude" aria-label="Claude preview" title="Claude"><span class="icon">${iconSvg("claude")}</span><span class="button-text">Claude</span></button>
+	                <button type="button" data-host="generic" aria-label="Generic MCP preview" title="MCP"><span class="icon">${iconSvg("braces")}</span><span class="button-text">MCP</span></button>
+	              </div>
+	            </div>
+	            <div class="control-group">
+	              <div class="segmented" aria-label="Theme">
+	                <button type="button" data-theme="light" aria-label="Light theme" title="Light"><span class="icon">${iconSvg("sun")}</span><span class="button-text">Light</span></button>
+	                <button type="button" data-theme="dark" aria-label="Dark theme" title="Dark"><span class="icon">${iconSvg("moon")}</span><span class="button-text">Dark</span></button>
+	              </div>
+	            </div>
+	            <div class="control-group">
+	              <div class="segmented" aria-label="Device">
+	                <button type="button" data-device="desktop" aria-label="Desktop preview" title="Desktop"><span class="icon">${iconSvg("monitor")}</span><span class="button-text">Desktop</span></button>
+	                <button type="button" data-device="mobile" aria-label="Mobile preview" title="Mobile"><span class="icon">${iconSvg("phone")}</span><span class="button-text">Mobile</span></button>
+	              </div>
+	            </div>
+	            <button id="authTrigger" class="auth-trigger" type="button" data-token-set="false">
+	              <span>Set Bearer Token</span>
+	            </button>
+	          </div>
+	        </div>
+	        <section class="stage">
+	          <aside class="surface" aria-label="Sidecar chat preview">
+	            <div class="surface-bar">
+	              <div class="surface-title"><span class="surface-dot"></span><span id="surfaceTitle">Claude preview</span></div>
+	              <div id="surfaceMeta" class="surface-meta">Desktop</div>
+	            </div>
+	            <section id="messages" class="messages">
+	              <div class="empty"><strong>Start a local MCP run.</strong><span>Ask for a tool call, then inspect model text and widget output here.</span></div>
+	            </section>
+	            <section class="composer">
+	              <form id="chatForm">
+	                <textarea id="prompt" placeholder="Ask a question or request a tool call..."></textarea>
+	                <button class="send" type="submit" aria-label="Send">
+	                  <svg aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round">
+	                    <path d="M12 19V5" />
+	                    <path d="m5 12 7-7 7 7" />
+	                  </svg>
+	                </button>
+	              </form>
+	              <div id="status" class="status"></div>
+	            </section>
+	          </aside>
+	        </section>
+	      </section>
+	    </main>
+	    <div id="authModal" class="modal-overlay" data-open="false" aria-hidden="true">
+	      <section class="modal-panel" role="dialog" aria-modal="true" aria-labelledby="authModalTitle" aria-describedby="authModalDescription">
+	        <div class="modal-head">
+	          <div>
+	            <h2 id="authModalTitle" class="modal-title">Set bearer token</h2>
+	            <p id="authModalDescription" class="modal-description">Sidecar will test this token against the local MCP server before saving it.</p>
+	          </div>
+	          <button id="authClose" class="modal-close" type="button" aria-label="Close bearer token dialog">${iconSvg("x")}</button>
+	        </div>
+	        <label class="modal-field" for="authToken">
+	          <span class="modal-label">Bearer token</span>
+	          <input id="authToken" class="modal-input" type="password" autocomplete="off" placeholder="Paste a bearer token" />
+	        </label>
+	        <div id="authError" class="modal-error" role="status"></div>
+	        <div class="modal-actions">
+	          <button id="authCancel" class="modal-button" data-variant="secondary" type="button">Cancel</button>
+	          <button id="authSave" class="modal-button" data-variant="primary" type="button">Save</button>
+	        </div>
+	      </section>
+	    </div>
+    <script>
+      ${devHarnessBrowserScript(options.initialBearerToken)}
+    </script>
+  </body>
+	</html>`;
+}
+var lobeIconCache = /* @__PURE__ */ new Map();
+function iconSvg(name) {
+  const common = `viewBox="0 0 24 24" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"`;
+  switch (name) {
+    case "chatgpt":
+      return lobeIconSvg("openai.svg") ?? `<svg ${common}><path d="M7.5 8.5a5 5 0 0 1 8.6-3.5 4.2 4.2 0 0 1 5.1 5.1 5 5 0 0 1-3.6 8.5 4.2 4.2 0 0 1-6.8 2.2 5 5 0 0 1-8-4.3 4.2 4.2 0 0 1-1-6.9 5 5 0 0 1 5.7-1.1Z"/></svg>`;
+    case "claude":
+      return lobeIconSvg("claude.svg") ?? `<svg ${common}><path d="M12 3v18"/><path d="m5.6 5.6 12.8 12.8"/><path d="M3 12h18"/><path d="M5.6 18.4 18.4 5.6"/></svg>`;
+    case "braces":
+      return `<svg ${common}><path d="M8 4c-2 1.3-3 2.8-3 4.7v1.1c0 1-.7 1.8-1.7 2.2C4.3 12.4 5 13.2 5 14.2v1.1c0 1.9 1 3.4 3 4.7"/><path d="M16 4c2 1.3 3 2.8 3 4.7v1.1c0 1 .7 1.8 1.7 2.2-1 .4-1.7 1.2-1.7 2.2v1.1c0 1.9-1 3.4-3 4.7"/></svg>`;
+    case "sun":
+      return `<svg ${common}><circle cx="12" cy="12" r="4"/><path d="M12 2v2"/><path d="M12 20v2"/><path d="m4.93 4.93 1.41 1.41"/><path d="m17.66 17.66 1.41 1.41"/><path d="M2 12h2"/><path d="M20 12h2"/><path d="m6.34 17.66-1.41 1.41"/><path d="m19.07 4.93-1.41 1.41"/></svg>`;
+    case "moon":
+      return `<svg ${common}><path d="M20.5 14.5A8.5 8.5 0 0 1 9.5 3.5 7 7 0 1 0 20.5 14.5Z"/></svg>`;
+    case "monitor":
+      return `<svg ${common}><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M8 20h8"/><path d="M12 16v4"/></svg>`;
+    case "phone":
+      return `<svg ${common}><rect x="7" y="2.5" width="10" height="19" rx="2"/><path d="M11 18.5h2"/></svg>`;
+    case "x":
+      return `<svg ${common}><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>`;
+  }
+}
+function lobeIconSvg(fileName) {
+  const cached = lobeIconCache.get(fileName);
+  if (cached) {
+    return cached;
   }
-  const host = request.headers.host ?? "";
-  let originUrl;
   try {
-    originUrl = new URL(origin);
+    const file = require2.resolve(`@lobehub/icons-static-svg/icons/${fileName}`);
+    const svg = readFileSync(file, "utf8").replace(/\s+xmlns="[^"]*"/, "").replace("<svg ", '<svg aria-hidden="true" ');
+    lobeIconCache.set(fileName, svg);
+    return svg;
   } catch {
-    return true;
-  }
-  if (isLocalHost(host)) {
-    return !isLocalHost(originUrl.host);
-  }
-  const requestOrigin = `https://${host}`;
-  const allowed = [requestOrigin, ...DEFAULT_ALLOWED_ORIGINS, ...allowedOrigins];
-  return !allowed.some((pattern) => matchesOrigin(pattern, originUrl.origin));
-}
-function isLocalHost(host) {
-  if (host.startsWith("[::1]")) {
-    return true;
-  }
-  const hostname = host.split(":")[0]?.toLowerCase();
-  return hostname === "localhost" || hostname === "127.0.0.1" || hostname === "::1";
-}
-function matchesOrigin(pattern, origin) {
-  if (pattern === origin) {
-    return true;
-  }
-  if (!pattern.includes("*")) {
-    return false;
-  }
-  const escaped = pattern.split("*").map(escapeRegExp).join("[^.]+");
-  return new RegExp(`^${escaped}$`).test(origin);
-}
-function escapeRegExp(value) {
-  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-}
-function isProtectedResourceMetadataPath(pathname, endpoint) {
-  return pathname === "/.well-known/oauth-protected-resource" || pathname === `/.well-known/oauth-protected-resource${endpoint}`;
-}
-function createHttpRequestLog(request, pathname) {
-  return {
-    method: request.method,
-    path: pathname,
-    host: truncateHeader(singleHeader(request.headers.host)),
-    accept: truncateHeader(singleHeader(request.headers.accept)),
-    contentType: truncateHeader(singleHeader(request.headers["content-type"])),
-    contentLength: truncateHeader(singleHeader(request.headers["content-length"])),
-    mcpProtocolVersion: truncateHeader(singleHeader(request.headers["mcp-protocol-version"])),
-    origin: truncateHeader(singleHeader(request.headers.origin)),
-    userAgent: truncateHeader(singleHeader(request.headers["user-agent"])),
-    authorization: request.headers.authorization ? "present" : "absent",
-    cookie: request.headers.cookie ? "present" : "absent"
-  };
-}
-function logHttpRequest(metadata, status) {
-  const debug = process.env.SIDECAR_DEBUG === "1" || process.env.SIDECAR_LOG_LEVEL === "debug";
-  if (!debug && status < 400) {
-    return;
-  }
-  const message = JSON.stringify({
-    event: "sidecar.mcp.http",
-    status,
-    ...stripUndefined4(metadata)
-  });
-  if (status >= 500) {
-    console.error(message);
-  } else if (status >= 400) {
-    console.warn(message);
-  } else {
-    console.info(message);
-  }
-}
-function singleHeader(value) {
-  return Array.isArray(value) ? value.join(", ") : value;
-}
-function truncateHeader(value) {
-  if (!value) {
     return void 0;
   }
-  return value.length > 240 ? `${value.slice(0, 237)}...` : value;
 }
-async function proxyAuthorizationServerMetadata(auth, response) {
-  const [authorizationServer] = auth.authorizationServers;
-  if (!authorizationServer) {
-    response.writeHead(404, { "content-type": "application/json" });
-    response.end(JSON.stringify({ error: "authorization_server_not_configured" }));
+async function handleChatRequest(request, response, options) {
+  const body = await readJson(request);
+  const messages = readChatMessages(body.messages);
+  const authToken = readAuthToken(body.authToken);
+  const apiKey = options.openAiApiKey ?? process.env.OPENAI_API_KEY;
+  response.writeHead(200, {
+    "cache-control": "no-cache, no-transform",
+    "connection": "keep-alive",
+    "content-type": "text/event-stream; charset=utf-8",
+    "x-accel-buffering": "no"
+  });
+  const sink = createSseSink(response);
+  if (!apiKey) {
+    sink.send("error", {
+      message: "OPENAI_API_KEY is required for sidecar dev chat."
+    });
+    response.end();
     return;
   }
   try {
-    const url = new URL("/.well-known/oauth-authorization-server", authorizationServer);
-    const upstream = await fetch(url, { headers: { accept: "application/json" } });
-    const body = await upstream.text();
-    response.writeHead(upstream.ok ? 200 : 502, {
-      "content-type": upstream.headers.get("content-type") ?? "application/json"
+    const mcpTools = await listAllMcpTools(options.mcpUrl, authToken);
+    const toolMap = mcpToolsToOpenAiTools(mcpTools);
+    await streamChatWithTools({
+      apiKey,
+      baseUrl: options.openAiBaseUrl ?? process.env.OPENAI_BASE_URL ?? OPENAI_CHAT_COMPLETIONS_URL,
+      model: options.model,
+      messages: toOpenAiMessages(messages),
+      tools: toolMap,
+      mcpUrl: options.mcpUrl,
+      authToken,
+      sink
     });
-    response.end(body);
+    sink.send("done", {});
   } catch (error) {
-    console.warn(JSON.stringify({
-      event: "sidecar.mcp.authorization_metadata_proxy_failed",
-      authorizationServer,
-      message: error instanceof Error ? error.message : "Unknown error"
-    }));
-    response.writeHead(502, { "content-type": "application/json" });
-    response.end(JSON.stringify({ error: "authorization_metadata_unavailable" }));
+    sink.send("error", normalizeHttpError(error));
+  } finally {
+    response.end();
+  }
+}
+async function streamChatWithTools(options) {
+  const messages = [...options.messages];
+  for (let iteration = 0; iteration < MAX_CHAT_TOOL_ITERATIONS; iteration += 1) {
+    const assistant = await streamOpenAiChat({
+      apiKey: options.apiKey,
+      baseUrl: options.baseUrl,
+      model: options.model,
+      messages,
+      tools: options.tools.tools,
+      sink: options.sink
+    });
+    messages.push(assistant.message);
+    if (!assistant.toolCalls.length) {
+      return;
+    }
+    for (const toolCall of assistant.toolCalls) {
+      const descriptor = options.tools.byOpenAiName.get(toolCall.function.name);
+      if (!descriptor) {
+        throw new HttpError(500, `Unknown model tool call "${toolCall.function.name}".`);
+      }
+      const args = parseToolArguments(toolCall.function.arguments);
+      options.sink.send("tool_start", {
+        id: toolCall.id,
+        name: descriptor.name,
+        title: descriptor.title ?? descriptor.name,
+        arguments: args
+      });
+      const result = await callMcp(
+        options.mcpUrl,
+        "tools/call",
+        { name: descriptor.name, arguments: args },
+        options.authToken
+      );
+      options.sink.send("tool_result", {
+        id: toolCall.id,
+        tool: {
+          name: descriptor.name,
+          title: descriptor.title ?? descriptor.name,
+          resourceUri: toolResourceUri(descriptor)
+        },
+        result
+      });
+      messages.push({
+        role: "tool",
+        tool_call_id: toolCall.id,
+        content: toolResultForModel(result)
+      });
+    }
   }
+  throw new HttpError(500, "The model kept requesting tools and hit the dev harness iteration limit.");
 }
-var JsonRpcError = class extends Error {
-  constructor(code, message, data) {
-    super(message);
-    this.code = code;
-    this.data = data;
-    this.name = "JsonRpcError";
-  }
-  code;
-  data;
-};
-var JsonRpcHttpError = class extends JsonRpcError {
-  constructor(status, code, message, data) {
-    super(code, message, data);
-    this.status = status;
-    this.name = "JsonRpcHttpError";
-  }
-  status;
-};
-var RequestCancelledError = class extends Error {
-  constructor(message = "Request cancelled.") {
-    super(message);
-    this.name = "RequestCancelledError";
-  }
-};
-var AUTH_RESPONSE_SENT = /* @__PURE__ */ Symbol("sidecar.auth.response-sent");
-async function authorizeHttpRequest(auth, request, response) {
-  const result = await auth.authorizeRequest(request);
-  if (result.ok) {
-    return result.auth;
-  }
-  response.writeHead(result.status, {
-    "content-type": "application/json",
-    ...headersToRecord(result.headers)
+async function streamOpenAiChat(options) {
+  const response = await fetch(options.baseUrl, {
+    method: "POST",
+    headers: {
+      "authorization": `Bearer ${options.apiKey}`,
+      "content-type": "application/json"
+    },
+    body: JSON.stringify({
+      model: options.model,
+      messages: options.messages,
+      stream: true,
+      tools: options.tools,
+      tool_choice: "auto"
+    })
   });
-  response.end(
-    JSON.stringify({
-      jsonrpc: JSONRPC_VERSION2,
-      id: null,
-      error: {
-        code: result.status === 401 ? -32001 : -32003,
-        message: result.body.error_description ?? result.body.error,
-        data: {
-          status: result.status,
-          body: result.body
+  if (!response.ok || !response.body) {
+    throw new HttpError(
+      response.status,
+      `OpenAI chat request failed with HTTP ${response.status}: ${await response.text()}`
+    );
+  }
+  let content = "";
+  const toolCalls = /* @__PURE__ */ new Map();
+  for await (const event of readOpenAiSse(response.body)) {
+    if (event === "[DONE]") {
+      break;
+    }
+    const parsed = JSON.parse(event);
+    const delta = parsed.choices?.[0]?.delta;
+    if (!delta) {
+      continue;
+    }
+    if (delta.content) {
+      content += delta.content;
+      options.sink.send("delta", { text: delta.content });
+    }
+    for (const chunk of delta.tool_calls ?? []) {
+      const current = toolCalls.get(chunk.index) ?? {
+        id: chunk.id ?? `call_${chunk.index}`,
+        type: "function",
+        function: {
+          name: "",
+          arguments: ""
         }
-      }
-    })
-  );
-  return AUTH_RESPONSE_SENT;
-}
-function createDefaultContext(request) {
-  const memory = /* @__PURE__ */ new Map();
+      };
+      current.id = chunk.id ?? current.id;
+      current.type = chunk.type ?? current.type;
+      current.function.name += chunk.function?.name ?? "";
+      current.function.arguments += chunk.function?.arguments ?? "";
+      toolCalls.set(chunk.index, current);
+    }
+  }
+  const calls = [...toolCalls.entries()].sort(([left], [right]) => left - right).map(([, call]) => call);
   return {
-    auth: void 0,
-    request: {
-      id: String(request.id ?? randomUUID2()),
-      signal: new AbortController().signal,
-      host: "unknown",
-      transport: "streamable-http"
-    },
-    services: {},
-    tools: {},
-    log: consoleLogger,
-    trace: {
-      async span(_name, run) {
-        return run();
-      }
-    },
-    storage: {
-      async get(key) {
-        return memory.get(key);
-      },
-      async set(key, value) {
-        memory.set(key, value);
-      },
-      async delete(key) {
-        memory.delete(key);
-      }
+    message: {
+      role: "assistant",
+      content: content || null,
+      ...calls.length ? { tool_calls: calls } : {}
     },
-    notify: noopNotifications,
-    env: process.env
+    toolCalls: calls
   };
 }
-var noopNotifications = {
-  async progress() {
-  },
-  async toolsChanged() {
-  },
-  async resourcesChanged() {
-  },
-  async promptsChanged() {
-  },
-  async resourceUpdated() {
-  }
-};
-function createRuntimeNotifications(sink, progressToken, options) {
-  return {
-    async progress(update) {
-      if (!sink?.supportsRequestProgress || progressToken === void 0) {
-        return;
-      }
-      sink.send("notifications/progress", stripUndefined4({
-        progressToken,
-        progress: update.progress,
-        total: update.total,
-        message: update.message
-      }));
-    },
-    async toolsChanged() {
-      if (options.toolsListChanged) {
-        sink?.send("notifications/tools/list_changed");
-      }
-    },
-    async resourcesChanged() {
-      if (options.resourcesListChanged) {
-        sink?.send("notifications/resources/list_changed");
-      }
-    },
-    async promptsChanged() {
-      if (options.promptsListChanged) {
-        sink?.send("notifications/prompts/list_changed");
+async function* readOpenAiSse(body) {
+  const decoder = new TextDecoder();
+  let buffer = "";
+  const reader = body.getReader();
+  while (true) {
+    const { done, value } = await reader.read();
+    if (done) {
+      break;
+    }
+    const chunk = value;
+    buffer += decoder.decode(chunk, { stream: true });
+    let boundary = buffer.indexOf("\n\n");
+    while (boundary !== -1) {
+      const raw = buffer.slice(0, boundary);
+      buffer = buffer.slice(boundary + 2);
+      for (const line of raw.split(/\r?\n/)) {
+        if (line.startsWith("data:")) {
+          yield line.slice(5).trim();
+        }
       }
-    },
-    async resourceUpdated(uri) {
-      if (options.isResourceSubscribed(uri)) {
-        sink?.send("notifications/resources/updated", { uri });
+      boundary = buffer.indexOf("\n\n");
+    }
+  }
+  buffer += decoder.decode();
+  if (buffer.trim()) {
+    for (const line of buffer.split(/\r?\n/)) {
+      if (line.startsWith("data:")) {
+        yield line.slice(5).trim();
       }
     }
-  };
-}
-function toResourceContext(ctx) {
-  return {
-    auth: ctx.auth,
-    request: ctx.request,
-    services: ctx.services,
-    log: ctx.log,
-    storage: ctx.storage,
-    notify: ctx.notify,
-    env: ctx.env
-  };
+  }
 }
-function toPromptContext(ctx) {
+async function listAllMcpTools(mcpUrl, authToken) {
+  const tools = [];
+  let cursor;
+  do {
+    const result = await callMcp(
+      mcpUrl,
+      "tools/list",
+      cursor ? { cursor } : {},
+      authToken
+    );
+    tools.push(...result.tools ?? []);
+    cursor = result.nextCursor;
+  } while (cursor);
+  return tools;
+}
+async function readMcpResource(mcpUrl, uri, authToken) {
+  const result = await callMcp(mcpUrl, "resources/read", { uri }, authToken);
+  const content = result.contents?.find((entry) => typeof entry.text === "string") ?? result.contents?.[0];
   return {
-    auth: ctx.auth,
-    request: ctx.request,
-    services: ctx.services,
-    log: ctx.log,
-    storage: ctx.storage,
-    notify: ctx.notify,
-    env: ctx.env
+    text: content?.text ?? "",
+    mimeType: content?.mimeType
   };
 }
-function readCursorParam(request) {
-  const params = request.params;
-  if (params?.cursor === void 0) {
-    return void 0;
+async function callMcp(mcpUrl, method, params, authToken) {
+  const response = await fetch(mcpUrl, {
+    method: "POST",
+    headers: {
+      "accept": "application/json, text/event-stream",
+      "content-type": "application/json",
+      "mcp-protocol-version": MCP_PROTOCOL_VERSION,
+      ...authToken ? { authorization: `Bearer ${authToken}` } : {}
+    },
+    body: JSON.stringify({
+      jsonrpc: "2.0",
+      id: randomUUID3(),
+      method,
+      params
+    })
+  });
+  const text = await response.text();
+  if (!response.ok) {
+    throw new HttpError(response.status, `MCP ${method} failed with HTTP ${response.status}: ${text}`);
   }
-  if (typeof params.cursor !== "string" || !params.cursor) {
-    throw new JsonRpcError(-32602, "Pagination cursor must be a non-empty string.");
+  const json = JSON.parse(text);
+  if (json.error) {
+    throw new HttpError(502, json.error.message ?? `MCP ${method} returned an error.`);
   }
-  return params.cursor;
+  return json.result;
+}
+function toOpenAiMessages(messages) {
+  return [
+    {
+      role: "system",
+      content: [
+        "You are Sidecar dev, a local test harness for an MCP server.",
+        "Use the available MCP tools whenever they are relevant.",
+        "When a tool renders UI, keep your text concise because the harness displays the widget separately.",
+        "Do not claim to be ChatGPT or Claude; the host selector only changes widget styling."
+      ].join(" ")
+    },
+    ...messages.map((message) => ({
+      role: message.role,
+      content: message.content
+    }))
+  ];
 }
-function readUriParam(request, method) {
-  const params = request.params;
-  const uri = typeof params?.uri === "string" ? params.uri : void 0;
-  if (!uri) {
-    throw new JsonRpcError(-32602, `${method} requires params.uri.`);
+function readChatMessages(value) {
+  if (!Array.isArray(value)) {
+    return [];
   }
-  return uri;
+  return value.flatMap((entry) => {
+    if (!entry || typeof entry !== "object") {
+      return [];
+    }
+    const role = entry.role;
+    const content = entry.content;
+    if (role !== "user" && role !== "assistant" || typeof content !== "string") {
+      return [];
+    }
+    return [{ role, content }];
+  });
 }
-function readProgressToken(request) {
-  const params = request.params;
-  if (!params || typeof params !== "object") {
-    return void 0;
+function normalizeToolParameters(schema) {
+  if (!schema || typeof schema !== "object" || Array.isArray(schema)) {
+    return { type: "object", properties: {} };
   }
-  const meta = params._meta;
-  if (!meta || typeof meta !== "object") {
-    return void 0;
+  const record = schema;
+  if (record.type === "object" || record.properties) {
+    return record;
+  }
+  return {
+    type: "object",
+    properties: {}
+  };
+}
+function uniqueOpenAiToolName(name, used) {
+  const base = name.replace(/[^A-Za-z0-9_-]/g, "_").replace(/_+/g, "_").replace(/^[-_]+/, "").slice(0, 58) || "tool";
+  let candidate = base;
+  let suffix = 2;
+  while (used.has(candidate)) {
+    const tag = `_${suffix}`;
+    candidate = `${base.slice(0, 64 - tag.length)}${tag}`;
+    suffix += 1;
   }
-  const progressToken = meta.progressToken;
-  if (typeof progressToken === "string") {
-    return progressToken;
+  used.add(candidate);
+  return candidate;
+}
+function parseToolArguments(value) {
+  if (!value.trim()) {
+    return {};
   }
-  if (typeof progressToken === "number" && Number.isInteger(progressToken)) {
-    return progressToken;
+  const parsed = JSON.parse(value);
+  if (!parsed || typeof parsed !== "object" || Array.isArray(parsed)) {
+    return {};
   }
-  return void 0;
+  return parsed;
 }
-function hasProgressToken(request) {
-  return readProgressToken(request) !== void 0;
+function toolResultForModel(result) {
+  const text = (result.content ?? []).map((block) => {
+    if (typeof block === "string") return block;
+    if (block && typeof block === "object" && typeof block.text === "string") {
+      return block.text;
+    }
+    return JSON.stringify(block);
+  }).filter(Boolean).join("\n");
+  const structured = result.structuredContent === void 0 ? "" : `
+
+structuredContent:
+${JSON.stringify(result.structuredContent, null, 2)}`;
+  return `${text || "Tool returned no model-visible content."}${structured}`.slice(0, 8e4);
 }
-function selectPaginationOverride(override, operation) {
-  if (!override) {
-    return void 0;
+function createSseSink(response) {
+  return {
+    send(event, data) {
+      response.write(`event: ${event}
+`);
+      response.write(`data: ${JSON.stringify(data)}
+
+`);
+    }
+  };
+}
+function updateDevState(state, body) {
+  if (body.host === "chatgpt" || body.host === "claude" || body.host === "generic") {
+    state.host = body.host;
   }
-  if (typeof override === "function") {
-    return override;
+  if (body.theme === "light" || body.theme === "dark") {
+    state.theme = body.theme;
   }
-  const key = operationToPaginationKey(operation);
-  return override[key] ?? override.default;
-}
-function operationToPaginationKey(operation) {
-  switch (operation) {
-    case "tools/list":
-      return "toolsList";
-    case "resources/list":
-      return "resourcesList";
-    case "resources/templates/list":
-      return "resourceTemplatesList";
-    case "prompts/list":
-      return "promptsList";
+  if (body.device === "desktop" || body.device === "mobile") {
+    state.device = body.device;
   }
 }
-function defaultPagination(items, cursor, pageSize) {
-  const offset = cursor ? decodeCursor(cursor) : 0;
-  const page = items.slice(offset, offset + pageSize);
-  const nextOffset = offset + page.length;
+function devStatePayload(state, mcpUrl) {
   return {
-    items: page,
-    nextCursor: nextOffset < items.length ? encodeCursor(nextOffset) : void 0
+    host: state.host,
+    theme: state.theme,
+    device: state.device,
+    target: state.target,
+    model: state.model,
+    mcpUrl
   };
 }
-function encodeCursor(offset) {
-  return Buffer.from(JSON.stringify({ offset }), "utf8").toString("base64url");
+function openStateEvents(response, clients, state, mcpUrl) {
+  response.writeHead(200, {
+    "cache-control": "no-cache, no-transform",
+    "connection": "keep-alive",
+    "content-type": "text/event-stream; charset=utf-8"
+  });
+  clients.add(response);
+  createSseSink(response).send("state", devStatePayload(state, mcpUrl));
+  response.on("close", () => clients.delete(response));
 }
-function decodeCursor(cursor) {
-  try {
-    const decoded = JSON.parse(Buffer.from(cursor, "base64url").toString("utf8"));
-    const offset = decoded.offset;
-    if (!Number.isInteger(offset) || typeof offset !== "number" || offset < 0) {
-      throw new Error("invalid offset");
-    }
-    return offset;
-  } catch {
-    throw new JsonRpcError(-32602, "Invalid pagination cursor.");
+function broadcastState(clients, state, mcpUrl) {
+  for (const client of clients) {
+    createSseSink(client).send("state", devStatePayload(state, mcpUrl));
   }
 }
-function authJsonRpcError(result) {
-  return new JsonRpcError(
-    result.status === 401 ? -32001 : -32003,
-    result.body.error_description ?? result.body.error,
-    {
-      status: result.status,
-      headers: headersToRecord(result.headers),
-      body: result.body
-    }
-  );
+function sendHtml(response, html) {
+  response.writeHead(200, { "content-type": "text/html; charset=utf-8" });
+  response.end(html);
 }
-function validateProtocolVersion(request) {
-  const value = request.headers["mcp-protocol-version"];
-  const version = Array.isArray(value) ? value[0] : value;
-  if (!version) {
-    return;
-  }
-  const supported = /* @__PURE__ */ new Set([SIDECAR_MCP_PROTOCOL_VERSION]);
-  if (!supported.has(version)) {
-    throw new JsonRpcHttpError(
-      400,
-      -32600,
-      `Unsupported MCP-Protocol-Version "${version}".`
-    );
-  }
+function sendJson(response, body, status = 200) {
+  response.writeHead(status, { "content-type": "application/json; charset=utf-8" });
+  response.end(JSON.stringify(body));
 }
-function validatePostHeaders(request) {
-  const contentType = request.headers["content-type"];
-  const contentTypeValue = Array.isArray(contentType) ? contentType[0] : contentType;
-  if (!contentTypeValue?.toLowerCase().includes("application/json")) {
-    throw new JsonRpcHttpError(415, -32600, "POST Content-Type must be application/json.");
-  }
-  const accept = request.headers.accept;
-  const acceptValue = Array.isArray(accept) ? accept.join(",") : accept;
-  if (!acceptValue || !acceptValue.toLowerCase().includes("application/json") || !acceptValue.toLowerCase().includes("text/event-stream")) {
-    throw new JsonRpcHttpError(
-      406,
-      -32600,
-      "POST Accept must include application/json and text/event-stream."
-    );
+async function readJson(request) {
+  const chunks = [];
+  let size = 0;
+  for await (const chunk of request) {
+    const buffer = Buffer.isBuffer(chunk) ? chunk : Buffer.from(chunk);
+    size += buffer.byteLength;
+    if (size > 2e6) {
+      throw new HttpError(413, "Request body is too large.");
+    }
+    chunks.push(buffer);
   }
+  const text = Buffer.concat(chunks).toString("utf8");
+  return text ? JSON.parse(text) : {};
 }
-function validateGetHeaders(request) {
-  const accept = request.headers.accept;
-  const acceptValue = Array.isArray(accept) ? accept.join(",") : accept;
-  if (!acceptValue || !acceptValue.toLowerCase().includes("text/event-stream")) {
-    throw new JsonRpcHttpError(
-      406,
-      -32600,
-      "GET Accept must include text/event-stream."
-    );
+function readAuthToken(value) {
+  return typeof value === "string" && value.trim() ? value.trim() : void 0;
+}
+function readBearerFromCookie(request) {
+  const cookie = request.headers.cookie;
+  if (!cookie) {
+    return void 0;
   }
+  const match = cookie.match(/(?:^|;\s*)sidecar_dev_bearer=([^;]+)/);
+  return match?.[1] ? decodeURIComponent(match[1]) : void 0;
 }
-async function withTimeout(promise, timeoutMs, controller) {
-  let abortListener;
-  const abortPromise = new Promise((_resolve, reject) => {
-    abortListener = () => {
-      reject(abortReason(controller.signal.reason));
+function normalizeHttpError(error) {
+  if (error instanceof HttpError) {
+    return {
+      error: "sidecar_dev_error",
+      status: error.status,
+      message: error.message
     };
-    if (controller.signal.aborted) {
-      abortListener();
-      return;
-    }
-    controller.signal.addEventListener("abort", abortListener, { once: true });
+  }
+  return {
+    error: "sidecar_dev_error",
+    message: error instanceof Error ? error.message : String(error)
+  };
+}
+function listenOnLocalhost(server, port) {
+  return new Promise((resolve, reject) => {
+    const onError = (error) => reject(error);
+    server.once("error", onError);
+    server.listen(port, "127.0.0.1", () => {
+      server.off("error", onError);
+      const address = server.address();
+      if (!address) {
+        reject(new Error("Dev harness did not expose a bound address."));
+        return;
+      }
+      resolve(address.port);
+    });
   });
-  if (!timeoutMs || timeoutMs <= 0) {
-    try {
-      return await Promise.race([promise, abortPromise]);
-    } finally {
-      if (abortListener) {
-        controller.signal.removeEventListener("abort", abortListener);
+}
+function closeServer(server) {
+  return new Promise((resolve, reject) => {
+    server.close((error) => {
+      if (error) {
+        reject(error);
+        return;
       }
-    }
-  }
-  let timeout;
-  try {
-    return await Promise.race([
-      promise,
-      abortPromise,
-      new Promise((_resolve, reject) => {
-        timeout = setTimeout(() => {
-          const error = new JsonRpcError(-32e3, "Tool execution timed out.");
-          controller.abort(error);
-          reject(error);
-        }, timeoutMs);
-      })
-    ]);
-  } finally {
-    if (timeout) {
-      clearTimeout(timeout);
-    }
-    if (abortListener) {
-      controller.signal.removeEventListener("abort", abortListener);
-    }
-  }
+      resolve();
+    });
+  });
 }
-function abortReason(reason) {
-  if (reason instanceof Error) {
-    return reason;
-  }
-  return new RequestCancelledError();
+async function streamdownClientScript() {
+  streamdownClientScriptPromise ??= buildStreamdownClientScript();
+  return await streamdownClientScriptPromise;
 }
-function validateAgainstSchema(schema, value, message, options = {}) {
-  if (!schema || value === void 0 && options.optional) {
-    return value;
-  }
-  const failure = schemaFailure(schema, value, "$");
-  if (failure) {
-    throw new JsonRpcError(-32602, message, { validation: failure });
+async function buildStreamdownClientScript() {
+  const { build } = await import("esbuild");
+  const result = await build({
+    bundle: true,
+    define: {
+      "process.env.NODE_ENV": JSON.stringify("development")
+    },
+    format: "iife",
+    globalName: "SidecarStreamdownBundle",
+    jsx: "automatic",
+    platform: "browser",
+    stdin: {
+      contents: `
+        import React from "react";
+        import { createRoot } from "react-dom/client";
+        import { Streamdown } from "streamdown";
+
+        const roots = new WeakMap();
+        window.SidecarStreamdown = {
+          render(element, markdown) {
+            let root = roots.get(element);
+            if (!root) {
+              root = createRoot(element);
+              roots.set(element, root);
+            }
+            root.render(React.createElement(Streamdown, { parseIncompleteMarkdown: true }, markdown));
+          }
+        };
+      `,
+      loader: "tsx",
+      resolveDir: path20.dirname(fileURLToPath(import.meta.url))
+    },
+    write: false
+  });
+  const output = result.outputFiles[0]?.text;
+  if (!output) {
+    throw new Error("Failed to build the Sidecar dev markdown renderer.");
   }
-  return value;
+  return output;
 }
-function schemaFailure(schema, value, path21) {
-  if (schema.anyOf?.length && !schema.anyOf.some((entry) => !schemaFailure(entry, value, path21))) {
-    return `${path21} must match one anyOf schema.`;
+var HttpError = class extends Error {
+  constructor(status, message) {
+    super(message);
+    this.status = status;
+    this.name = "HttpError";
   }
-  if (schema.oneOf?.length && schema.oneOf.filter((entry) => !schemaFailure(entry, value, path21)).length !== 1) {
-    return `${path21} must match exactly one oneOf schema.`;
+  status;
+};
+function devHarnessBrowserScript(initialBearerToken) {
+  return String.raw`
+const MCP_APPS_PROTOCOL_VERSION = ${JSON.stringify(MCP_APPS_PROTOCOL_VERSION)};
+const state = {
+  host: document.documentElement.dataset.sidecarHost || "chatgpt",
+  theme: document.documentElement.dataset.sidecarTheme || "light",
+  device: document.documentElement.dataset.sidecarDevice || "desktop",
+};
+const messages = [];
+const frameContexts = new Map();
+const markdownSources = new WeakMap();
+let markdownRendererPromise;
+const messagesEl = document.getElementById("messages");
+const form = document.getElementById("chatForm");
+const promptEl = document.getElementById("prompt");
+const statusEl = document.getElementById("status");
+const authEl = document.getElementById("authToken");
+const authTriggerEl = document.getElementById("authTrigger");
+const authModalEl = document.getElementById("authModal");
+const authCloseEl = document.getElementById("authClose");
+const authCancelEl = document.getElementById("authCancel");
+const authSaveEl = document.getElementById("authSave");
+const authErrorEl = document.getElementById("authError");
+const surfaceTitleEl = document.getElementById("surfaceTitle");
+const surfaceMetaEl = document.getElementById("surfaceMeta");
+const workspaceTargetEl = document.getElementById("workspaceTarget");
+const workspaceDeviceEl = document.getElementById("workspaceDevice");
+const initialBearerToken = ${JSON.stringify(initialBearerToken ?? "")};
+let bearerToken = initialBearerToken || localStorage.getItem("sidecar.dev.bearer") || "";
+
+authEl.value = bearerToken;
+setAuthCookie(bearerToken);
+updateAuthTrigger();
+authTriggerEl.addEventListener("click", openAuthModal);
+authCloseEl.addEventListener("click", closeAuthModal);
+authCancelEl.addEventListener("click", closeAuthModal);
+authSaveEl.addEventListener("click", saveBearerToken);
+authModalEl.addEventListener("click", (event) => {
+  if (event.target === authModalEl) {
+    closeAuthModal();
   }
-  if (schema.allOf?.length) {
-    for (const entry of schema.allOf) {
-      const failure = schemaFailure(entry, value, path21);
-      if (failure) return failure;
-    }
+});
+document.addEventListener("keydown", (event) => {
+  if (event.key === "Escape" && authModalEl.dataset.open === "true") {
+    closeAuthModal();
   }
-  if (schema.const !== void 0 && value !== schema.const) {
-    return `${path21} must equal ${JSON.stringify(schema.const)}.`;
+});
+
+document.querySelectorAll("[data-host]").forEach((button) => {
+  button.addEventListener("click", () => setState({ host: button.dataset.host }));
+});
+document.querySelectorAll("[data-theme]").forEach((button) => {
+  button.addEventListener("click", () => setState({ theme: button.dataset.theme }));
+});
+document.querySelectorAll("[data-device]").forEach((button) => {
+  button.addEventListener("click", () => setState({ device: button.dataset.device }));
+});
+
+const events = new EventSource("/__sidecar/dev/events");
+events.addEventListener("state", (event) => {
+  applyState(JSON.parse(event.data));
+});
+
+form.addEventListener("submit", async (event) => {
+  event.preventDefault();
+  const text = promptEl.value.trim();
+  if (!text) return;
+  promptEl.value = "";
+  clearEmpty();
+  messages.push({ role: "user", content: text });
+  appendMessage("user", text);
+  const assistant = appendMessage("assistant", "");
+  statusEl.textContent = "Thinking...";
+  try {
+    await streamChat(assistant.querySelector(".content"));
+    statusEl.textContent = "";
+  } catch (error) {
+    statusEl.textContent = error instanceof Error ? error.message : String(error);
+    statusEl.classList.add("error");
   }
-  if (schema.enum && !schema.enum.some((entry) => JSON.stringify(entry) === JSON.stringify(value))) {
-    return `${path21} must be one of the declared enum values.`;
+});
+
+window.addEventListener("message", async (event) => {
+  const message = event.data;
+  if (!message || message.jsonrpc !== "2.0" || typeof message.method !== "string") {
+    return;
   }
-  if (schema.type) {
-    const types = Array.isArray(schema.type) ? schema.type : [schema.type];
-    if (!types.some((type) => matchesJsonSchemaType(type, value))) {
-      return `${path21} must be ${types.join(" or ")}.`;
+  const frame = [...frameContexts.entries()].find(([source]) => source === event.source);
+  const context = frame?.[1];
+  try {
+    if (message.method === "ui/initialize") {
+      respond(event.source, message.id, {
+        protocolVersion: MCP_APPS_PROTOCOL_VERSION,
+        hostInfo: { name: "Sidecar dev", version: "0.0.0-dev" },
+        hostCapabilities: hostCapabilities(),
+        hostContext: hostContext(),
+      });
+      return;
     }
-  }
-  if (schema.type === "object" || schema.properties || schema.required) {
-    if (!value || typeof value !== "object" || Array.isArray(value)) {
-      return `${path21} must be an object.`;
+    if (message.method === "ui/notifications/initialized") {
+      sendFrameContext(event.source);
+      return;
     }
-    const record = value;
-    for (const required of schema.required ?? []) {
-      if (!(required in record)) {
-        return `${path21}.${required} is required.`;
-      }
+    if (message.method === "tools/call") {
+      const result = await rpc("tools/call", message.params);
+      respond(event.source, message.id, result);
+      return;
     }
-    for (const [key, propertySchema] of Object.entries(schema.properties ?? {})) {
-      if (key in record) {
-        const failure = schemaFailure(propertySchema, record[key], `${path21}.${key}`);
-        if (failure) return failure;
-      }
+    if (message.method === "resources/list" || message.method === "resources/read") {
+      const result = await rpc(message.method, message.params);
+      respond(event.source, message.id, result);
+      return;
     }
-    const allowed = new Set(Object.keys(schema.properties ?? {}));
-    if (schema.additionalProperties === false) {
-      const extra = Object.keys(record).find((key) => !allowed.has(key));
-      if (extra) {
-        return `${path21}.${extra} is not allowed.`;
-      }
-    } else if (schema.additionalProperties && typeof schema.additionalProperties === "object") {
-      for (const [key, entry] of Object.entries(record)) {
-        if (!allowed.has(key)) {
-          const failure = schemaFailure(schema.additionalProperties, entry, `${path21}.${key}`);
-          if (failure) return failure;
-        }
+    if (message.method === "ui/open-link") {
+      const url = message.params?.url;
+      if (typeof url === "string" && /^(https?:|mailto:)/.test(url)) {
+        window.open(url, "_blank", "noopener,noreferrer");
+        respond(event.source, message.id, { isError: false });
+      } else {
+        respond(event.source, message.id, { isError: true });
       }
+      return;
     }
-  }
-  if (schema.type === "array" || schema.items) {
-    if (!Array.isArray(value)) {
-      return `${path21} must be an array.`;
-    }
-    if (schema.minItems !== void 0 && value.length < schema.minItems) {
-      return `${path21} must contain at least ${schema.minItems} items.`;
-    }
-    if (schema.maxItems !== void 0 && value.length > schema.maxItems) {
-      return `${path21} must contain at most ${schema.maxItems} items.`;
+    if (message.method === "ui/request-display-mode") {
+      respond(event.source, message.id, { mode: message.params?.mode || "inline" });
+      return;
     }
-    if (schema.items) {
-      for (const [index, entry] of value.entries()) {
-        const failure = schemaFailure(schema.items, entry, `${path21}[${index}]`);
-        if (failure) return failure;
-      }
+    if (message.method === "ui/message" || message.method === "ui/update-model-context") {
+      respond(event.source, message.id, { isError: false });
+      return;
     }
-  }
-  if (typeof value === "string") {
-    if (schema.minLength !== void 0 && value.length < schema.minLength) {
-      return `${path21} is shorter than ${schema.minLength}.`;
+    if (message.method.startsWith("ui/notifications/") || message.method === "notifications/message") {
+      return;
     }
-    if (schema.maxLength !== void 0 && value.length > schema.maxLength) {
-      return `${path21} is longer than ${schema.maxLength}.`;
+    if (message.id !== undefined) {
+      respondError(event.source, message.id, -32601, "Unsupported dev harness method: " + message.method);
     }
-    if (schema.pattern !== void 0 && !new RegExp(schema.pattern).test(value)) {
-      return `${path21} must match pattern ${schema.pattern}.`;
+  } catch (error) {
+    if (message.id !== undefined) {
+      respondError(event.source, message.id, -32000, error instanceof Error ? error.message : String(error));
     }
   }
-  if (typeof value === "number") {
-    if (schema.minimum !== void 0 && value < schema.minimum) {
-      return `${path21} is less than ${schema.minimum}.`;
-    }
-    if (schema.maximum !== void 0 && value > schema.maximum) {
-      return `${path21} is greater than ${schema.maximum}.`;
+});
+
+async function streamChat(contentEl) {
+  const response = await fetch("/__sidecar/dev/chat", {
+    method: "POST",
+    headers: { "content-type": "application/json" },
+    body: JSON.stringify({
+      messages,
+      authToken: currentAuthToken(),
+    }),
+  });
+  if (!response.ok || !response.body) {
+    throw new Error("Chat request failed.");
+  }
+  const reader = response.body.getReader();
+  const decoder = new TextDecoder();
+  let buffer = "";
+  let assistantText = "";
+  while (true) {
+    const { done, value } = await reader.read();
+    if (done) break;
+    buffer += decoder.decode(value, { stream: true });
+    let boundary = buffer.indexOf("\n\n");
+    while (boundary !== -1) {
+      const raw = buffer.slice(0, boundary);
+      buffer = buffer.slice(boundary + 2);
+      const parsed = parseEvent(raw);
+      if (parsed) {
+        if (parsed.event === "delta") {
+          assistantText += parsed.data.text || "";
+          renderMarkdown(contentEl, assistantText);
+        } else if (parsed.event === "tool_start") {
+          appendToolStart(parsed.data);
+        } else if (parsed.event === "tool_result") {
+          appendToolResult(parsed.data);
+        } else if (parsed.event === "error") {
+          throw new Error(parsed.data.message || "Sidecar dev chat failed.");
+        }
+      }
+      boundary = buffer.indexOf("\n\n");
     }
   }
-  return void 0;
-}
-function matchesJsonSchemaType(type, value) {
-  switch (type) {
-    case "object":
-      return Boolean(value && typeof value === "object" && !Array.isArray(value));
-    case "array":
-      return Array.isArray(value);
-    case "string":
-      return typeof value === "string";
-    case "number":
-      return typeof value === "number" && Number.isFinite(value);
-    case "integer":
-      return Number.isInteger(value);
-    case "boolean":
-      return typeof value === "boolean";
-    case "null":
-      return value === null;
-    default:
-      return true;
+  if (assistantText.trim()) {
+    messages.push({ role: "assistant", content: assistantText });
   }
 }
-function headersToRecord(headers) {
-  const record = {};
-  headers.forEach((value, key) => {
-    record[key] = value;
-  });
-  return record;
-}
-function stripUndefined4(value) {
-  return Object.fromEntries(
-    Object.entries(value).filter(([, entry]) => entry !== void 0)
-  );
+
+function parseEvent(raw) {
+  let event = "message";
+  let data = "";
+  for (const line of raw.split(/\r?\n/)) {
+    if (line.startsWith("event:")) event = line.slice(6).trim();
+    if (line.startsWith("data:")) data += line.slice(5).trim();
+  }
+  if (!data) return null;
+  return { event, data: JSON.parse(data) };
 }
-function httpAuthError(value) {
-  if (!value || typeof value !== "object" || !("error" in value)) {
-    return void 0;
+
+function appendMessage(role, content) {
+  clearEmpty();
+  const article = document.createElement("article");
+  article.className = "message";
+  article.dataset.role = role;
+  article.innerHTML = '<div class="role"></div><div class="content"></div>';
+  article.querySelector(".role").textContent = role;
+  const contentEl = article.querySelector(".content");
+  if (role === "assistant") {
+    contentEl.classList.add("markdown");
+    renderMarkdown(contentEl, content);
+  } else {
+    contentEl.textContent = content;
   }
-  const error = value.error;
-  const data = error?.data;
-  if (!data || typeof data !== "object") {
-    return void 0;
+  messagesEl.append(article);
+  article.scrollIntoView({ block: "end" });
+  return article;
+}
+
+function renderMarkdown(element, markdown) {
+  markdownSources.set(element, markdown);
+  if (window.SidecarStreamdown?.render) {
+    window.SidecarStreamdown.render(element, markdown);
+    return;
   }
-  const status = data.status;
-  const headers = data.headers;
-  if (status !== 401 && status !== 403 || !headers || typeof headers !== "object") {
-    return void 0;
+  element.textContent = markdown;
+  if (!markdownRendererPromise) {
+    markdownRendererPromise = import("/__sidecar/dev/streamdown-client.js")
+      .then(() => {
+        document.querySelectorAll(".content.markdown").forEach((target) => {
+          window.SidecarStreamdown?.render(target, markdownSources.get(target) || "");
+        });
+      })
+      .catch((error) => {
+        console.warn("Sidecar dev markdown renderer failed to load", error);
+      });
   }
-  return {
-    status,
-    headers
-  };
 }
-var consoleLogger = {
-  debug(message, data) {
-    console.debug(message, data ?? "");
-  },
-  info(message, data) {
-    console.info(message, data ?? "");
-  },
-  warn(message, data) {
-    console.warn(message, data ?? "");
-  },
-  error(message, data) {
-    console.error(message, data ?? "");
+
+function appendToolStart(tool) {
+  const article = document.createElement("article");
+  article.className = "tool-card";
+  article.dataset.toolCallId = tool.id;
+  article.innerHTML = '<div class="tool-head"><div class="tool-title"></div><div class="status">Running</div></div><div class="tool-body"></div>';
+  article.querySelector(".tool-title").textContent = tool.title || tool.name;
+  messagesEl.append(article);
+}
+
+function appendToolResult(event) {
+  const article = document.querySelector('[data-tool-call-id="' + CSS.escape(event.id) + '"]') || document.createElement("article");
+  if (!article.parentElement) {
+    article.className = "tool-card";
+    article.dataset.toolCallId = event.id;
+    article.innerHTML = '<div class="tool-head"><div class="tool-title"></div><div class="status"></div></div><div class="tool-body"></div>';
+    messagesEl.append(article);
+  }
+  article.querySelector(".tool-title").textContent = event.tool.title || event.tool.name;
+  article.querySelector(".status").textContent = event.result?.isError ? "Error" : "Done";
+  const body = article.querySelector(".tool-body");
+  body.innerHTML = "";
+  if (event.tool.resourceUri) {
+    const iframe = document.createElement("iframe");
+    iframe.src = "/__sidecar/dev/resource?uri=" + encodeURIComponent(event.tool.resourceUri);
+    iframe.title = event.tool.title || event.tool.name;
+    frameContexts.set(iframe.contentWindow, {
+      result: event.result,
+      tool: event.tool,
+      arguments: event.arguments || {},
+    });
+    iframe.addEventListener("load", () => {
+      frameContexts.set(iframe.contentWindow, {
+        result: event.result,
+        tool: event.tool,
+        arguments: event.arguments || {},
+      });
+      window.setTimeout(() => sendFrameContext(iframe.contentWindow), 120);
+    });
+    body.append(iframe);
+  } else {
+    const pre = document.createElement("pre");
+    pre.textContent = toolText(event.result);
+    body.append(pre);
   }
-};
-async function readJson(request, maxBodyBytes) {
-  const chunks = [];
-  let size = 0;
-  for await (const chunk of request) {
-    const buffer = Buffer.isBuffer(chunk) ? chunk : Buffer.from(chunk);
-    size += buffer.byteLength;
-    if (size > maxBodyBytes) {
-      throw new JsonRpcHttpError(413, -32600, "Request body is too large.");
-    }
-    chunks.push(buffer);
+  article.scrollIntoView({ block: "end" });
+}
+
+function toolText(result) {
+  const blocks = result?.content || [];
+  const text = blocks.map((block) => typeof block === "string" ? block : block?.text || JSON.stringify(block)).join("\n");
+  return text || JSON.stringify(result?.structuredContent || result || {}, null, 2);
+}
+
+async function rpc(method, params) {
+  const response = await fetch("/__sidecar/dev/rpc", {
+    method: "POST",
+    headers: { "content-type": "application/json" },
+    body: JSON.stringify({ method, params, authToken: currentAuthToken() }),
+  });
+  const json = await response.json();
+  if (!response.ok) {
+    throw new Error(json.message || json.error || "MCP request failed.");
   }
-  return JSON.parse(Buffer.concat(chunks).toString("utf8"));
+  return json.result;
 }
-function toFetchRequest(request, baseUrl) {
-  const headers = new Headers();
-  for (const [key, value] of Object.entries(request.headers)) {
-    if (Array.isArray(value)) {
-      for (const entry of value) {
-        headers.append(key, entry);
-      }
-    } else if (value !== void 0) {
-      headers.set(key, value);
+
+function openAuthModal() {
+  authEl.value = bearerToken;
+  authErrorEl.textContent = "";
+  authErrorEl.dataset.visible = "false";
+  authModalEl.dataset.open = "true";
+  authModalEl.setAttribute("aria-hidden", "false");
+  window.setTimeout(() => authEl.focus(), 40);
+}
+
+function closeAuthModal() {
+  authModalEl.dataset.open = "false";
+  authModalEl.setAttribute("aria-hidden", "true");
+  window.setTimeout(() => authTriggerEl.focus(), 40);
+}
+
+async function saveBearerToken() {
+  const nextToken = authEl.value.trim();
+  authErrorEl.textContent = "";
+  authErrorEl.dataset.visible = "false";
+  authSaveEl.disabled = true;
+  authSaveEl.textContent = nextToken ? "Testing..." : "Saving...";
+  try {
+    if (nextToken) {
+      await testBearerToken(nextToken);
+    }
+    bearerToken = nextToken;
+    if (bearerToken) {
+      localStorage.setItem("sidecar.dev.bearer", bearerToken);
+    } else {
+      localStorage.removeItem("sidecar.dev.bearer");
     }
+    setAuthCookie(bearerToken);
+    updateAuthTrigger();
+    closeAuthModal();
+  } catch (error) {
+    authErrorEl.textContent = error instanceof Error ? error.message : String(error);
+    authErrorEl.dataset.visible = "true";
+  } finally {
+    authSaveEl.disabled = false;
+    authSaveEl.textContent = "Save";
   }
-  const url = baseUrl ? new URL(request.url ?? "/", baseUrl) : new URL(
-    request.url ?? "/",
-    `${headers.get("x-forwarded-proto") ?? "http"}://${headers.get("host") ?? "127.0.0.1"}`
-  );
-  return new Request(url, {
-    headers,
-    method: request.method
+}
+
+async function testBearerToken(token) {
+  const response = await fetch("/__sidecar/dev/rpc", {
+    method: "POST",
+    headers: { "content-type": "application/json" },
+    body: JSON.stringify({ method: "tools/list", params: {}, authToken: token }),
   });
+  const json = await response.json().catch(() => ({}));
+  if (!response.ok) {
+    throw new Error(json.message || json.error || "Bearer token test failed.");
+  }
 }
-function assertJsonRpcRequest(value) {
-  if (!value || typeof value !== "object") {
-    throw new JsonRpcError(-32600, "Request must be a JSON object.");
+
+function currentAuthToken() {
+  return bearerToken.trim() || undefined;
+}
+
+function updateAuthTrigger() {
+  authTriggerEl.dataset.tokenSet = String(Boolean(currentAuthToken()));
+  authTriggerEl.title = currentAuthToken() ? "Bearer token is set" : "Set bearer token";
+}
+
+async function setState(next) {
+  await fetch("/__sidecar/dev/state", {
+    method: "POST",
+    headers: { "content-type": "application/json" },
+    body: JSON.stringify(next),
+  });
+}
+
+function applyState(next) {
+  state.host = next.host || state.host;
+  state.theme = next.theme || state.theme;
+  state.device = next.device || state.device;
+  document.documentElement.dataset.sidecarHost = state.host;
+  document.documentElement.dataset.sidecarTheme = state.theme;
+  document.documentElement.dataset.sidecarDevice = state.device;
+  document.querySelectorAll("[data-host]").forEach((button) => {
+    button.setAttribute("aria-pressed", String(button.dataset.host === state.host));
+  });
+  document.querySelectorAll("[data-theme]").forEach((button) => {
+    button.setAttribute("aria-pressed", String(button.dataset.theme === state.theme));
+  });
+  document.querySelectorAll("[data-device]").forEach((button) => {
+    button.setAttribute("aria-pressed", String(button.dataset.device === state.device));
+  });
+  syncSegmentedControl("[data-host]", state.host, "host");
+  syncSegmentedControl("[data-theme]", state.theme, "theme");
+  syncSegmentedControl("[data-device]", state.device, "device");
+  surfaceTitleEl.textContent = (state.host === "generic" ? "MCP" : state.host === "chatgpt" ? "ChatGPT" : "Claude") + " preview";
+  surfaceMetaEl.textContent = state.device === "mobile" ? "Mobile" : "Desktop";
+  if (workspaceTargetEl) {
+    workspaceTargetEl.textContent = state.host === "generic" ? "MCP" : state.host === "chatgpt" ? "ChatGPT" : "Claude";
   }
-  const record = value;
-  if (record.jsonrpc !== JSONRPC_VERSION2 || typeof record.method !== "string") {
-    throw new JsonRpcError(-32600, "Invalid JSON-RPC request.");
+  if (workspaceDeviceEl) {
+    workspaceDeviceEl.textContent = state.device === "mobile" ? "Mobile" : "Desktop";
   }
-  if ("id" in record && record.id !== void 0 && record.id !== null && typeof record.id !== "string" && typeof record.id !== "number") {
-    throw new JsonRpcError(-32600, "JSON-RPC id must be a string, number, or null.");
+  for (const source of frameContexts.keys()) {
+    notify(source, "ui/notifications/host-context-changed", hostContext());
   }
-  return {
-    jsonrpc: JSONRPC_VERSION2,
-    id: typeof record.id === "string" || typeof record.id === "number" || record.id === null ? record.id : void 0,
-    method: record.method,
-    params: record.params
-  };
 }
-function isJsonRpcResponseMessage(value) {
-  if (!value || typeof value !== "object") {
-    return false;
-  }
-  const record = value;
-  if (record.jsonrpc !== JSONRPC_VERSION2 || !("id" in record) || !("result" in record || "error" in record)) {
-    return false;
+
+function syncSegmentedControl(selector, value, datasetKey) {
+  const buttons = [...document.querySelectorAll(selector)];
+  const segmented = buttons[0]?.closest(".segmented");
+  if (!segmented) {
+    return;
   }
-  return record.id === null || typeof record.id === "string" || typeof record.id === "number";
+  const activeIndex = Math.max(0, buttons.findIndex((button) => button.dataset[datasetKey] === value));
+  segmented.style.setProperty("--segments", String(buttons.length));
+  segmented.style.setProperty("--active-index", String(activeIndex));
 }
-function normalizeError(error) {
-  if (error instanceof JsonRpcError) {
-    return {
-      code: error.code,
-      message: error.message,
-      data: error.data
-    };
-  }
-  if (error instanceof SidecarRuntimeError && error.code === "invalid_pagination_cursor") {
-    return {
-      code: -32602,
-      message: error.message
-    };
-  }
-  if (error instanceof Error) {
-    return {
-      code: -32e3,
-      message: "Internal server error."
-    };
+
+function sendFrameContext(source) {
+  const context = frameContexts.get(source);
+  if (!context) {
+    return;
   }
+  notify(source, "ui/notifications/host-context-changed", hostContext());
+  notify(source, "ui/notifications/tool-input", { arguments: context.arguments || {} });
+  notify(source, "ui/notifications/tool-result", context.result);
+}
+
+function hostContext() {
   return {
-    code: -32e3,
-    message: "Unknown server error.",
-    data: error
+    theme: state.theme,
+    device: state.device,
+    userAgent: "Sidecar Dev " + state.host,
+    displayMode: "inline",
+    availableDisplayModes: ["inline", "fullscreen", "pip"],
+    platform: "web",
+    styles: { variables: hostVariables() },
   };
 }
-function normalizeHttpError(error) {
-  if (error instanceof JsonRpcError) {
-    return {
-      code: error.code,
-      message: error.message,
-      data: error.data
-    };
+
+function hostVariables() {
+  if (state.host === "claude") {
+    return state.theme === "dark"
+      ? { "--font-sans": '"Anthropic Sans", ui-sans-serif, system-ui, sans-serif', "--color-background-primary": "#30302e", "--color-text-primary": "#faf9f5" }
+      : { "--font-sans": '"Anthropic Sans", ui-sans-serif, system-ui, sans-serif', "--color-background-primary": "#ffffff", "--color-text-primary": "#141413" };
   }
+  return {};
+}
+
+function hostCapabilities() {
   return {
-    code: -32700,
-    message: "Invalid JSON request body."
+    serverTools: {},
+    serverResources: {},
+    openLinks: {},
+    logging: {},
+    message: { text: {}, structuredContent: {} },
+    updateModelContext: { structuredContent: {} },
+    downloadFile: {},
   };
 }
 
+function respond(source, id, result) {
+  if (id === undefined) return;
+  source?.postMessage({ jsonrpc: "2.0", id, result }, "*");
+}
+
+function respondError(source, id, code, message) {
+  source?.postMessage({ jsonrpc: "2.0", id, error: { code, message } }, "*");
+}
+
+function notify(source, method, params) {
+  source?.postMessage({ jsonrpc: "2.0", method, params }, "*");
+}
+
+function setAuthCookie(token) {
+  document.cookie = "sidecar_dev_bearer=" + encodeURIComponent(token || "") + "; path=/; SameSite=Lax";
+}
+
+function clearEmpty() {
+  const empty = messagesEl.querySelector(".empty");
+  empty?.remove();
+}
+
+applyState(state);
+`;
+}
+
 // packages/cli/src/tunnel.ts
 import { spawn, spawnSync } from "child_process";
 import { createInterface } from "readline/promises";
@@ -5128,11 +5642,11 @@ import { stdin, stdout } from "process";
 async function startTunnel(options) {
   const provider = await resolveProvider(options.provider);
   const localUrl = `http://127.0.0.1:${options.port}`;
-  const path21 = options.path ?? "/mcp";
+  const path22 = options.path ?? "/mcp";
   if (provider === "cloudflared") {
-    return startCloudflared(localUrl, path21, options.timeoutMs);
+    return startCloudflared(localUrl, path22, options.timeoutMs);
   }
-  return startWrangler(localUrl, path21, options.timeoutMs);
+  return startWrangler(localUrl, path22, options.timeoutMs);
 }
 async function validateTunnelEndpoint(options) {
   const timeoutMs = options.timeoutMs ?? 1e4;
@@ -5256,7 +5770,7 @@ function assertNpxAvailable() {
     throw new Error(tunnelInstallMessage("wrangler"));
   }
 }
-async function startCloudflared(localUrl, path21, timeoutMs = 2e4) {
+async function startCloudflared(localUrl, path22, timeoutMs = 2e4) {
   const child = spawn("cloudflared", ["tunnel", "--url", localUrl, "--no-autoupdate"], {
     stdio: ["ignore", "pipe", "pipe"]
   });
@@ -5264,13 +5778,13 @@ async function startCloudflared(localUrl, path21, timeoutMs = 2e4) {
   return {
     provider: "cloudflared",
     publicUrl,
-    mcpUrl: appendPath(publicUrl, path21),
+    mcpUrl: appendPath(publicUrl, path22),
     close() {
       child.kill("SIGTERM");
     }
   };
 }
-async function startWrangler(localUrl, path21, timeoutMs = 2e4) {
+async function startWrangler(localUrl, path22, timeoutMs = 2e4) {
   const child = spawn("npx", ["--yes", "wrangler", "tunnel", "quick-start", localUrl], {
     stdio: ["ignore", "pipe", "pipe"]
   });
@@ -5278,7 +5792,7 @@ async function startWrangler(localUrl, path21, timeoutMs = 2e4) {
   return {
     provider: "wrangler",
     publicUrl,
-    mcpUrl: appendPath(publicUrl, path21),
+    mcpUrl: appendPath(publicUrl, path22),
     close() {
       child.kill("SIGTERM");
     }
@@ -5539,8 +6053,8 @@ function runInherited(command, args) {
     });
   });
 }
-function appendPath(origin, path21) {
-  return `${origin.replace(/\/+$/, "")}/${path21.replace(/^\/+/, "")}`;
+function appendPath(origin, path22) {
+  return `${origin.replace(/\/+$/, "")}/${path22.replace(/^\/+/, "")}`;
 }
 function isRecord3(value) {
   return Boolean(value && typeof value === "object" && !Array.isArray(value));
@@ -5568,10 +6082,17 @@ async function main(argv) {
       );
       console.log(`Host runtime: ${manifest.host}`);
       if (manifest.host === "vercel") {
-        console.log(`Vercel MCP function: ${path20.join(resolvedOutDir, VERCEL_ENTRYPOINT)}`);
+        console.log(`Vercel MCP function: ${path21.join(resolvedOutDir, VERCEL_ENTRYPOINT)}`);
       } else {
-        console.log(`Hostable MCP server: ${path20.join(resolvedOutDir, SERVER_ENTRYPOINT)}`);
+        console.log(`Hostable MCP server: ${path21.join(resolvedOutDir, SERVER_ENTRYPOINT)}`);
       }
+      console.log(renderBuildUrlSummary({
+        host: manifest.host,
+        mcpPath: process.env.SIDECAR_MCP_PATH,
+        publicMcpUrl: process.env.SIDECAR_MCP_URL,
+        publicUrl: process.env.SIDECAR_PUBLIC_URL,
+        port: process.env.SIDECAR_PORT ?? process.env.PORT
+      }));
       if (plugins ?? manifest.config.build.plugins) {
         console.log("Built claude-plugin package.");
       }
@@ -5599,70 +6120,69 @@ async function main(argv) {
       return;
     }
     case "dev": {
-      const port = Number(readOption(argv, "--port") ?? "3001");
+      await loadProjectEnv(rootDir);
+      const port = Number(readOption(argv, "--mcp-port") ?? readOption(argv, "--port") ?? "3101");
+      const harnessPort = Number(readOption(argv, "--harness-port") ?? "3000");
       const target = readTarget(argv);
+      const devHost = readDevHost(argv);
+      const devTheme = readDevTheme(argv);
+      const devDevice = readDevDevice(argv);
+      const model = readOption(argv, "--model") ?? process.env.SIDECAR_DEV_MODEL ?? "gpt-4.1-mini";
       const tunnelProvider = readTunnelProvider(argv);
       const outDir = `.sidecar/dev/${target}`;
-      const loadedAuth = await loadRuntimeAuth(rootDir);
-      const runtimeConfig = await loadRuntimeConfig(rootDir);
-      const proxy = await loadRuntimeProxy(rootDir);
-      const runtimeToolEntries = await analyzeProjectTools(rootDir, { target });
-      const runtimeTools = await loadRuntimeTools(rootDir, runtimeToolEntries);
-      const manifest = await buildProject({ rootDir, outDir, target });
+      const localMcpUrl = `http://127.0.0.1:${port}/mcp`;
+      process.env.SIDECAR_MCP_URL = localMcpUrl;
+      const manifest = await buildProject({ rootDir, outDir, target, host: "node" });
       printDiagnostics(manifest.diagnostics ?? []);
-      const tools = attachBuiltToolDescriptors(runtimeTools, manifest);
       let tunnel;
       if (tunnelProvider) {
         tunnel = await startTunnel({ provider: tunnelProvider, port, path: "/mcp" });
         process.env.SIDECAR_MCP_URL = tunnel.mcpUrl;
       }
-      const auth = loadedAuth && tunnel ? loadedAuth.withResource(tunnel.mcpUrl) : loadedAuth;
-      const resources = await loadResources(rootDir, outDir, manifest);
-      const prompts = await loadRuntimePrompts(rootDir, manifest);
-      const server = createSidecarHttpServer({
-        name: "sidecar-dev",
-        version: "0.0.0-dev",
-        path: "/mcp",
-        auth,
-        proxy,
-        tools,
-        resources,
-        prompts,
-        capabilities: {
-          tools: runtimeConfig?.tools ?? manifest.config.tools,
-          resources: runtimeConfig?.resources ?? manifest.config.resources,
-          prompts: runtimeConfig?.prompts ?? manifest.config.prompts
-        },
-        pagination: runtimeConfig?.pagination ?? {
-          pageSize: manifest.config.pagination.pageSize
-        }
-      });
-      let listening = false;
+      const runtimeMcpUrl = tunnel?.mcpUrl ?? localMcpUrl;
+      let mcpProcess;
+      let harness;
       try {
-        await listenOnLocalhost(server, port);
-        listening = true;
+        mcpProcess = await startBuiltMcpServer({
+          rootDir,
+          outDir,
+          port,
+          mcpUrl: runtimeMcpUrl
+        });
         if (tunnel) {
           await validateTunnelEndpoint({
             mcpUrl: tunnel.mcpUrl,
-            auth: Boolean(auth)
+            auth: existsSync8(path21.join(rootDir, "auth.ts"))
           });
         }
-        console.log(`MCP running on Streamable HTTP (${target}) at http://127.0.0.1:${port}/mcp`);
-        console.log(`Loaded ${tools.length} tool${tools.length === 1 ? "" : "s"}, ${resources.length} resource${resources.length === 1 ? "" : "s"}, and ${prompts.length} prompt${prompts.length === 1 ? "" : "s"}.`);
-        if (tunnel) {
-          console.log(`HTTPS tunnel (${tunnel.provider}) validated: ${tunnel.mcpUrl}`);
-          console.log("Use this HTTPS MCP URL in ChatGPT, Claude, or a Claude plugin install.");
-        }
+        console.log(`MCP running on Streamable HTTP (${target}).`);
+        console.log(`Loaded ${manifest.tools.length} tool${manifest.tools.length === 1 ? "" : "s"}, ${manifest.resources.length} resource${manifest.resources.length === 1 ? "" : "s"}, and ${manifest.prompts.length} prompt${manifest.prompts.length === 1 ? "" : "s"}.`);
+        harness = await startDevHarness({
+          rootDir,
+          mcpUrl: localMcpUrl,
+          host: devHost,
+          theme: devTheme,
+          device: devDevice,
+          target,
+          port: harnessPort,
+          model,
+          initialBearerToken: process.env.MCP_BEARER
+        });
+        console.log(renderDevUrlSummary({
+          localMcpUrl,
+          runtimeMcpUrl,
+          tunnelProvider: tunnel?.provider,
+          harnessUrl: harness.url
+        }));
       } catch (error) {
         tunnel?.close();
-        if (listening) {
-          await closeServer(server);
-        }
+        await harness?.close();
+        await stopBuiltMcpServer(mcpProcess);
         throw error;
       }
       const shutdown = () => {
         tunnel?.close();
-        server.close(() => exit(0));
+        void harness?.close().then(() => stopBuiltMcpServer(mcpProcess)).finally(() => exit(0));
       };
       process.once("SIGINT", shutdown);
       process.once("SIGTERM", shutdown);
@@ -5683,9 +6203,13 @@ async function main(argv) {
       return;
     }
     case "preview": {
-      if (argv[3] !== "components") {
-        throw new Error("Only `sidecar preview components` is supported right now.");
-      }
+      await previewProject({
+        rootDir,
+        targets: readPreviewTargets(argv)
+      });
+      return;
+    }
+    case "component-preview": {
       await previewComponents({
         rootDir,
         host: readOption(argv, "--host") ?? "chatgpt",
@@ -5704,9 +6228,10 @@ async function main(argv) {
 Usage:
   sidecar build [--cwd <dir>] [--target mcp|chatgpt|claude] [--host node|vercel] [--out <dir>] [--plugins|--no-plugins] [--strict]
   sidecar check [--cwd <dir>] [--target mcp|chatgpt|claude] [--strict]
-  sidecar dev [--cwd <dir>] [--target mcp|chatgpt|claude] [--port <port>] [--tunnel [cloudflared|wrangler]]
+  sidecar dev [--cwd <dir>] [--target mcp|chatgpt|claude] [--port <mcp-port>] [--mcp-port <port>] [--harness-port <port>] [--host chatgpt|claude|generic] [--theme light|dark] [--device desktop|mobile] [--model <model>] [--tunnel [cloudflared|wrangler]]
   sidecar inspect [--cwd <dir>] [--target mcp|chatgpt|claude]
-  sidecar preview components [--cwd <dir>] [--host chatgpt|claude|generic] [--compare native,openai] [--components representative|all] [--theme light|dark|both] [--port <port>] [--no-approve]
+  sidecar preview [--cwd <dir>] [--target mcp|chatgpt|claude]
+  sidecar component-preview [--cwd <dir>] [--host chatgpt|claude|generic] [--compare native,openai] [--components representative|all] [--theme light|dark|both] [--port <port>] [--no-approve]
 `);
   }
 }
@@ -5740,12 +6265,59 @@ function readOptionalHost(argv) {
   }
   throw new Error(`Unsupported Sidecar host "${host}". Expected node or vercel.`);
 }
+function readDevHost(argv) {
+  const host = readOption(argv, "--host") ?? "chatgpt";
+  if (host === "chatgpt" || host === "claude" || host === "generic") {
+    return host;
+  }
+  throw new Error(`Unsupported dev host "${host}". Expected chatgpt, claude, or generic.`);
+}
+function readDevTheme(argv) {
+  const theme = readOption(argv, "--theme") ?? "light";
+  if (theme === "light" || theme === "dark") {
+    return theme;
+  }
+  throw new Error(`Unsupported dev theme "${theme}". Expected light or dark.`);
+}
+function readDevDevice(argv) {
+  const device = readOption(argv, "--device") ?? "desktop";
+  if (device === "desktop" || device === "mobile") {
+    return device;
+  }
+  throw new Error(`Unsupported dev device "${device}". Expected desktop or mobile.`);
+}
 function detectHostFromEnvironment() {
   if (process.env.VERCEL === "1") {
     return "vercel";
   }
   return void 0;
 }
+async function loadProjectEnv(rootDir) {
+  for (const filename of [".env", ".env.local", ".envb"]) {
+    const text = await readFile8(path21.join(rootDir, filename), "utf8").catch(() => void 0);
+    if (!text) {
+      continue;
+    }
+    for (const line of text.split(/\r?\n/)) {
+      const match = line.match(/^\s*(?:export\s+)?([A-Za-z_][A-Za-z0-9_]*)\s*=\s*(.*)?\s*$/);
+      if (!match) {
+        continue;
+      }
+      const [, key, rawValue = ""] = match;
+      if (!key || process.env[key] !== void 0) {
+        continue;
+      }
+      process.env[key] = parseEnvValue(rawValue);
+    }
+  }
+}
+function parseEnvValue(value) {
+  const trimmed = value.trim();
+  if (trimmed.startsWith('"') && trimmed.endsWith('"') || trimmed.startsWith("'") && trimmed.endsWith("'")) {
+    return trimmed.slice(1, -1).replace(/\\n/g, "\n");
+  }
+  return trimmed.replace(/\s+#.*$/, "");
+}
 function readOptionalPlugins(argv) {
   if (argv.includes("--plugins")) {
     return true;
@@ -5755,9 +6327,87 @@ function readOptionalPlugins(argv) {
   }
   return void 0;
 }
+function renderBuildUrlSummary(options) {
+  const mcpPath = options.mcpPath ?? "/mcp";
+  const lines = ["Sidecar URLs:"];
+  if (options.host === "vercel") {
+    lines.push(`  Vercel MCP route: https://<project>.vercel.app${mcpPath}`);
+  } else {
+    lines.push(`  Local Node MCP: http://127.0.0.1:${options.port ?? "3101"}${mcpPath}`);
+  }
+  lines.push(`  Public MCP: ${options.publicMcpUrl ?? `set SIDECAR_MCP_URL=https://your-host.example.com${mcpPath}`}`);
+  lines.push(`  Public base: ${options.publicUrl ?? "set SIDECAR_PUBLIC_URL=https://your-host.example.com when callbacks need a base URL"}`);
+  return lines.join("\n");
+}
+function renderDevUrlSummary(options) {
+  const stateUrl = `${options.harnessUrl}/__sidecar/dev/state`;
+  const lines = [
+    "Sidecar URLs:",
+    `  Local MCP: ${options.localMcpUrl}`,
+    `  Dev harness: ${options.harnessUrl}`,
+    `  Dev harness state: ${stateUrl}`
+  ];
+  if (options.runtimeMcpUrl !== options.localMcpUrl) {
+    lines.push(`  Public MCP (${options.tunnelProvider ?? "tunnel"}): ${options.runtimeMcpUrl}`);
+    lines.push(`  ChatGPT/Claude connector URL: ${options.runtimeMcpUrl}`);
+  } else {
+    lines.push(`  Harness connector URL: ${options.localMcpUrl}`);
+  }
+  return lines.join("\n");
+}
+async function previewProject(options) {
+  const builds = [];
+  for (const target of options.targets) {
+    const outDir = `.sidecar/preview/${target}`;
+    const manifest = await buildProject({ rootDir: options.rootDir, outDir, target });
+    printDiagnostics(manifest.diagnostics ?? []);
+    builds.push({ target, outDir, manifest });
+  }
+  const server = createServer3(async (request, response) => {
+    try {
+      const url2 = new URL(request.url ?? "/", "http://127.0.0.1");
+      if (url2.pathname === "/") {
+        response.writeHead(200, { "content-type": "text/html; charset=utf-8" });
+        response.end(renderProjectPreviewHtml(builds));
+        return;
+      }
+      if (url2.pathname === "/widget") {
+        const target = url2.searchParams.get("target");
+        const tool = url2.searchParams.get("tool");
+        const theme = url2.searchParams.get("theme") === "dark" ? "dark" : "light";
+        const build = builds.find((entry2) => entry2.target === target);
+        const entry = build?.manifest.tools.find((item) => item.id === tool);
+        if (!build || !entry?.widget?.outputFile) {
+          response.writeHead(404, { "content-type": "text/plain; charset=utf-8" });
+          response.end("Widget not found.");
+          return;
+        }
+        const html = await readFile8(path21.join(options.rootDir, build.outDir, entry.widget.outputFile), "utf8");
+        response.writeHead(200, { "content-type": "text/html; charset=utf-8" });
+        response.end(injectProjectPreviewBridge(html, entry, build.target, theme));
+        return;
+      }
+      response.writeHead(404, { "content-type": "text/plain; charset=utf-8" });
+      response.end("Not found.");
+    } catch (error) {
+      response.writeHead(500, { "content-type": "text/plain; charset=utf-8" });
+      response.end(error instanceof Error ? error.message : String(error));
+    }
+  });
+  const port = await listenOnAnyPort(server);
+  const url = `http://127.0.0.1:${port}`;
+  console.log(`Sidecar preview running at ${url}`);
+  console.log(`Targets: ${options.targets.join(", ")}`);
+  console.log("Press Ctrl+C to stop.");
+  const shutdown = () => {
+    server.close(() => exit(0));
+  };
+  process.once("SIGINT", shutdown);
+  process.once("SIGTERM", shutdown);
+}
 async function previewComponents(options) {
-  const cliDir = path20.dirname(fileURLToPath(import.meta.url));
-  const css = await readFile8(path20.join(cliDir, "../../native/src/styles.css"), "utf8").catch(() => readFile8(path20.join(process.cwd(), "packages/native/src/styles.css"), "utf8")).catch(() => "");
+  const cliDir = path21.dirname(fileURLToPath2(import.meta.url));
+  const css = await readFile8(path21.join(cliDir, "../../native/src/styles.css"), "utf8").catch(() => readFile8(path21.join(process.cwd(), "packages/native/src/styles.css"), "utf8")).catch(() => "");
   const html = renderComponentPreviewHtml(
     options.host,
     options.compare,
@@ -5765,7 +6415,7 @@ async function previewComponents(options) {
     options.themes,
     options.componentSet
   );
-  const server = createServer2((_request, response) => {
+  const server = createServer3((_request, response) => {
     response.writeHead(200, { "content-type": "text/html; charset=utf-8" });
     response.end(html);
   });
@@ -5796,11 +6446,229 @@ async function previewComponents(options) {
   }
   server.close();
 }
+function renderProjectPreviewHtml(builds) {
+  const themes = ["light", "dark"];
+  const sections = themes.map((theme) => renderProjectPreviewTheme(builds, theme)).join("");
+  const toolCount = new Set(
+    builds.flatMap((build) => build.manifest.tools.filter((tool) => tool.widget).map((tool) => tool.id))
+  ).size;
+  return `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>Sidecar preview</title>
+    <style>
+      :root { color-scheme: light dark; }
+      * { box-sizing: border-box; }
+      body { background: #f4f4f5; color: #18181b; font: 14px/1.45 ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; margin: 0; }
+      header { align-items: baseline; background: rgb(255 255 255 / 92%); border-bottom: 1px solid rgb(0 0 0 / 10%); display: flex; gap: 14px; padding: 14px 18px; position: sticky; top: 0; z-index: 1; }
+      h1 { font-size: 18px; margin: 0; }
+      .summary { color: #5f5f66; }
+      .theme-section { display: grid; gap: 12px; padding: 18px; }
+      .theme-title { color: #3f3f46; font-size: 12px; font-weight: 800; letter-spacing: .05em; margin: 0; text-transform: uppercase; }
+      .target-grid { align-items: start; display: grid; gap: 14px; grid-template-columns: repeat(${Math.max(builds.length, 1)}, minmax(320px, 1fr)); overflow-x: auto; padding-bottom: 8px; }
+      .target-column { background: rgb(255 255 255 / 72%); border: 1px solid rgb(0 0 0 / 10%); border-radius: 10px; display: grid; gap: 12px; min-width: 320px; padding: 12px; }
+      .target-title { font-size: 13px; font-weight: 800; margin: 0; text-transform: uppercase; }
+      .widget-card { border: 1px solid rgb(0 0 0 / 10%); border-radius: 9px; display: grid; gap: 8px; overflow: hidden; }
+      .widget-label { align-items: baseline; background: rgb(250 250 250 / 92%); border-bottom: 1px solid rgb(0 0 0 / 8%); display: flex; justify-content: space-between; padding: 8px 10px; }
+      .widget-name { font-weight: 700; }
+      .widget-id { color: #71717a; font: 12px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; }
+      iframe { background: transparent; border: 0; height: 360px; width: 100%; }
+      .empty { border: 1px dashed rgb(0 0 0 / 18%); border-radius: 9px; color: #71717a; padding: 18px; }
+      .theme-section[data-theme="light"] { background: #f4f4f5; color: #18181b; }
+      .theme-section[data-theme="dark"] { background: #111113; color: #f4f4f5; }
+      .theme-section[data-theme="dark"] .theme-title { color: #d4d4d8; }
+      .theme-section[data-theme="dark"] .target-column,
+      .theme-section[data-theme="dark"] .widget-card { background: rgb(24 24 27 / 72%); border-color: rgb(255 255 255 / 12%); }
+      .theme-section[data-theme="dark"] .widget-label { background: rgb(39 39 42 / 72%); border-bottom-color: rgb(255 255 255 / 10%); }
+      .theme-section[data-theme="dark"] .widget-id,
+      .theme-section[data-theme="dark"] .empty { color: #a1a1aa; }
+    </style>
+  </head>
+  <body>
+    <header>
+      <h1>Sidecar preview</h1>
+      <span class="summary">${toolCount} widget${toolCount === 1 ? "" : "s"} across ${builds.length} target${builds.length === 1 ? "" : "s"}</span>
+    </header>
+    ${sections}
+  </body>
+</html>`;
+}
+function renderProjectPreviewTheme(builds, theme) {
+  const columns = builds.map((build) => renderProjectPreviewTarget(build, theme)).join("");
+  return `<section class="theme-section" data-theme="${theme}">
+    <h2 class="theme-title">${escapeHtml2(theme)}</h2>
+    <div class="target-grid">${columns}</div>
+  </section>`;
+}
+function renderProjectPreviewTarget(build, theme) {
+  const widgets = build.manifest.tools.filter((tool) => tool.widget?.outputFile).map((tool) => renderProjectPreviewWidget(build.target, tool, theme)).join("");
+  return `<section class="target-column">
+    <h3 class="target-title">${escapeHtml2(previewTargetLabel(build.target))}</h3>
+    ${widgets || `<div class="empty">No widgets found for ${escapeHtml2(build.target)}.</div>`}
+  </section>`;
+}
+function renderProjectPreviewWidget(target, tool, theme) {
+  const src = `/widget?target=${encodeURIComponent(target)}&tool=${encodeURIComponent(tool.id)}&theme=${theme}`;
+  return `<article class="widget-card">
+    <div class="widget-label">
+      <span class="widget-name">${escapeHtml2(tool.name)}</span>
+      <span class="widget-id">${escapeHtml2(tool.id)}</span>
+    </div>
+    <iframe title="${escapeHtml2(`${tool.name} ${target} ${theme}`)}" src="${escapeHtml2(src)}"></iframe>
+  </article>`;
+}
+function injectProjectPreviewBridge(html, tool, target, theme) {
+  const host = previewHostName(target);
+  const preview = {
+    hostContext: {
+      name: host,
+      theme,
+      source: "mcp-apps",
+      raw: {
+        theme,
+        userAgent: `Sidecar Preview ${previewTargetLabel(target)}`,
+        displayMode: "inline",
+        availableDisplayModes: ["inline", "fullscreen", "pip"]
+      }
+    },
+    hostCapabilities: {
+      openLinks: {},
+      serverTools: {},
+      serverResources: {},
+      logging: {},
+      message: { text: {}, structuredContent: {} },
+      updateModelContext: { structuredContent: {} }
+    },
+    toolInput: {
+      arguments: previewToolArguments(tool)
+    },
+    toolResult: previewToolResult(tool)
+  };
+  const script = `<script>window.__sidecarPreview=${escapeScriptJson(preview)};</script>`;
+  return html.replace('<html lang="en"', `<html lang="en" data-sidecar-host="${host}" data-sidecar-theme="${theme}" data-theme="${theme}"`).replace("</head>", `${script}
+  </head>`);
+}
+function previewToolResult(tool) {
+  const content = [
+    `# ${tool.name}`,
+    "",
+    tool.description,
+    "",
+    "| Field | Value |",
+    "| --- | --- |",
+    `| Tool | ${escapeMarkdownTableCell(tool.id)} |`,
+    "| Preview | Ready |"
+  ].join("\n");
+  const structuredContent = {
+    tool: tool.id,
+    ok: true,
+    text: content,
+    preview: {
+      kind: previewKind(tool),
+      title: tool.name,
+      summary: tool.description,
+      content,
+      items: [
+        {
+          title: `${tool.name} preview`,
+          body: tool.description
+        },
+        {
+          title: "Table rendering",
+          body: "Preview data includes a Markdown table."
+        }
+      ]
+    },
+    upstream: {
+      isError: false
+    }
+  };
+  return {
+    structuredContent,
+    content: [{ type: "text", text: tool.description }],
+    _meta: {
+      sidecarPreview: true,
+      tool: tool.id
+    },
+    isError: false
+  };
+}
+function previewToolArguments(tool) {
+  const properties = tool.descriptor.inputSchema?.properties;
+  if (!properties || typeof properties !== "object" || Array.isArray(properties)) {
+    return {};
+  }
+  return Object.fromEntries(
+    Object.entries(properties).map(([key, schema]) => [key, previewValueForSchema(schema)])
+  );
+}
+function previewValueForSchema(schema) {
+  if (!schema || typeof schema !== "object") {
+    return "preview";
+  }
+  const record = schema;
+  if (Array.isArray(record.enum) && record.enum.length) {
+    return record.enum[0];
+  }
+  switch (record.type) {
+    case "number":
+    case "integer":
+      return 1;
+    case "boolean":
+      return true;
+    case "array":
+      return [];
+    case "object":
+      return {};
+    default:
+      return "preview";
+  }
+}
+function previewKind(tool) {
+  const id = tool.id.toLowerCase();
+  if (id.includes("search") || id.includes("query")) {
+    return "search";
+  }
+  if (id.includes("create") || id.includes("update") || id.includes("move") || id.includes("duplicate")) {
+    return "write";
+  }
+  if (id.includes("fetch") || id.includes("read") || id.includes("get")) {
+    return "read";
+  }
+  return "metadata";
+}
+function previewHostName(target) {
+  if (target === "chatgpt") {
+    return "chatgpt";
+  }
+  if (target === "claude") {
+    return "claude";
+  }
+  return "generic";
+}
+function previewTargetLabel(target) {
+  switch (target) {
+    case "chatgpt":
+      return "ChatGPT";
+    case "claude":
+      return "Claude";
+    default:
+      return "MCP";
+  }
+}
+function escapeScriptJson(value) {
+  return JSON.stringify(value).replace(/</g, "\\u003c").replace(/\u2028/g, "\\u2028").replace(/\u2029/g, "\\u2029");
+}
+function escapeMarkdownTableCell(value) {
+  return value.replace(/\|/g, "\\|");
+}
 async function writeComponentApproval(rootDir, approval) {
-  const dir = path20.join(rootDir, ".sidecar", "approvals");
+  const dir = path21.join(rootDir, ".sidecar", "approvals");
   await mkdir10(dir, { recursive: true });
   await writeFile10(
-    path20.join(dir, `components.${approval.host}.json`),
+    path21.join(dir, `components.${approval.host}.json`),
     `${JSON.stringify(approval, null, 2)}
 `
   );
@@ -6094,6 +6962,28 @@ function previewComponentNames(componentSet) {
     "TextLink"
   ];
 }
+function readPreviewTargets(argv) {
+  const values = [];
+  for (let index = 0; index < argv.length; index += 1) {
+    if (argv[index] !== "--target") {
+      continue;
+    }
+    const value = argv[index + 1];
+    if (value) {
+      values.push(...value.split(",").map((entry) => entry.trim()).filter(Boolean));
+    }
+  }
+  if (!values.length) {
+    return ["mcp", "chatgpt", "claude"];
+  }
+  const targets = values.map((target) => {
+    if (target === "mcp" || target === "chatgpt" || target === "claude") {
+      return target;
+    }
+    throw new Error(`Unsupported Sidecar target "${target}". Expected mcp, chatgpt, or claude.`);
+  });
+  return Array.from(new Set(targets));
+}
 function readPreviewComponentSet(value) {
   if (!value || value === "representative") {
     return "representative";
@@ -6151,174 +7041,85 @@ function printDiagnostics(diagnostics) {
     console.warn(formatDiagnostic(diagnostic));
   }
 }
-async function loadRuntimeAuth(rootDir) {
-  const authPath = path20.join(rootDir, "auth.ts");
-  if (!existsSync7(authPath)) {
-    return void 0;
-  }
-  const parentURL = pathToFileURL3(path20.join(rootDir, "sidecar.config.ts")).href;
-  const tsconfigPath = path20.join(rootDir, "tsconfig.json");
-  const tsconfig = existsSync7(tsconfigPath) ? tsconfigPath : false;
-  const module = await tsImport2(pathToFileURL3(authPath).href, {
-    parentURL,
-    tsconfig
-  });
-  const defaultExport = unwrapRuntimeDefault2(module.default);
-  if (!isSidecarAuth(defaultExport)) {
-    throw new Error("auth.ts must default-export auth({ ... }) from sidecar-ai.");
-  }
-  return defaultExport;
-}
-async function loadRuntimeProxy(rootDir) {
-  const proxyPath = path20.join(rootDir, "proxy.ts");
-  if (!existsSync7(proxyPath)) {
-    return void 0;
-  }
-  const parentURL = pathToFileURL3(path20.join(rootDir, "sidecar.config.ts")).href;
-  const tsconfigPath = path20.join(rootDir, "tsconfig.json");
-  const tsconfig = existsSync7(tsconfigPath) ? tsconfigPath : false;
-  const module = await tsImport2(pathToFileURL3(proxyPath).href, {
-    parentURL,
-    tsconfig
+async function startBuiltMcpServer(options) {
+  const rootDir = path21.resolve(options.rootDir);
+  const entrypoint = path21.join(rootDir, options.outDir, SERVER_ENTRYPOINT);
+  const child = spawn2(execPath, [entrypoint], {
+    cwd: rootDir,
+    env: {
+      ...process.env,
+      HOST: "127.0.0.1",
+      PORT: String(options.port),
+      SIDECAR_HOST: "127.0.0.1",
+      SIDECAR_MCP_URL: options.mcpUrl,
+      SIDECAR_PORT: String(options.port)
+    },
+    stdio: ["ignore", "pipe", "pipe"]
   });
-  const defaultExport = unwrapRuntimeDefault2(module.default);
-  if (!isSidecarProxy(defaultExport)) {
-    throw new Error("proxy.ts must default-export proxy({ ... }) from @sidecar-ai/server/proxy.");
+  const output = [];
+  child.stdout?.on("data", (chunk) => output.push(String(chunk)));
+  child.stderr?.on("data", (chunk) => output.push(String(chunk)));
+  try {
+    await waitForBuiltMcpServer(child, options.port, output);
+  } catch (error) {
+    await stopBuiltMcpServer(child);
+    throw error;
   }
-  return defaultExport;
+  return child;
 }
-async function loadRuntimeConfig(rootDir) {
-  const configPath = path20.join(rootDir, "sidecar.config.ts");
-  if (!existsSync7(configPath)) {
-    return void 0;
-  }
-  const parentURL = pathToFileURL3(configPath).href;
-  const tsconfigPath = path20.join(rootDir, "tsconfig.json");
-  const tsconfig = existsSync7(tsconfigPath) ? tsconfigPath : false;
-  const module = await tsImport2(pathToFileURL3(configPath).href, {
-    parentURL,
-    tsconfig
-  });
-  const defaultExport = unwrapRuntimeDefault2(module.default);
-  if (!defaultExport || typeof defaultExport !== "object") {
-    throw new Error("sidecar.config.ts must default-export defineConfig({ ... }) from sidecar-ai.");
+async function stopBuiltMcpServer(child) {
+  if (!child || child.exitCode !== null || child.signalCode !== null) {
+    return;
   }
-  return defaultExport;
-}
-async function loadRuntimeTools(rootDir, entries) {
-  const parentURL = pathToFileURL3(path20.join(rootDir, "sidecar.config.ts")).href;
-  const tsconfigPath = path20.join(rootDir, "tsconfig.json");
-  const tsconfig = existsSync7(tsconfigPath) ? tsconfigPath : false;
-  const loaded = [];
-  for (const entry of entries) {
-    const sourcePath = path20.join(rootDir, entry.sourceFile);
-    const module = await tsImport2(pathToFileURL3(sourcePath).href, {
-      parentURL,
-      tsconfig
-    });
-    const defaultExport = unwrapRuntimeDefault2(module.default);
-    if (!isSidecarTool(defaultExport)) {
-      throw new Error(`${entry.sourceFile} did not default-export a Sidecar tool.`);
-    }
-    loaded.push({
-      sourceFile: entry.sourceFile,
-      tool: defaultExport,
-      descriptor: entry.descriptor
+  child.kill("SIGTERM");
+  await new Promise((resolve) => {
+    const timeout = setTimeout(() => {
+      child.kill("SIGKILL");
+      resolve();
+    }, 2e3);
+    child.once("exit", () => {
+      clearTimeout(timeout);
+      resolve();
     });
-  }
-  return loaded;
-}
-function attachBuiltToolDescriptors(loadedTools, manifest) {
-  const descriptorsBySource = new Map(
-    manifest.tools.map((entry) => [entry.sourceFile, entry.descriptor])
-  );
-  return loadedTools.map(({ sourceFile, tool, descriptor }) => ({
-    tool,
-    descriptor: descriptorsBySource.get(sourceFile) ?? descriptor
-  }));
+  });
 }
-async function loadResources(rootDir, outDir, manifest) {
-  const resources = [];
-  for (const entry of manifest.tools) {
-    if (!entry.widget?.outputFile) {
-      continue;
+async function waitForBuiltMcpServer(child, port, output) {
+  const deadline = Date.now() + 2e4;
+  while (Date.now() < deadline) {
+    if (child.exitCode !== null || child.signalCode !== null) {
+      throw new Error(`Sidecar dev MCP process exited before startup.
+${output.join("").trim()}`);
     }
-    const text = await readFile8(path20.join(rootDir, outDir, entry.widget.outputFile), "utf8");
-    resources.push({
-      uri: entry.widget.resourceUri,
-      name: entry.name,
-      description: entry.widget.options?.description,
-      mimeType: MCP_APP_RESOURCE_MIME_TYPE,
-      text,
-      _meta: entry.widget.resourceMeta
-    });
-  }
-  const parentURL = pathToFileURL3(path20.join(rootDir, "sidecar.config.ts")).href;
-  const tsconfigPath = path20.join(rootDir, "tsconfig.json");
-  const tsconfig = existsSync7(tsconfigPath) ? tsconfigPath : false;
-  for (const entry of manifest.resources) {
-    const sourcePath = path20.join(rootDir, entry.sourceFile);
-    const module = await tsImport2(pathToFileURL3(sourcePath).href, {
-      parentURL,
-      tsconfig
-    });
-    const defaultExport = unwrapRuntimeDefault2(module.default);
-    if (!isSidecarResource(defaultExport)) {
-      throw new Error(`${entry.sourceFile} did not default-export a Sidecar resource.`);
-    }
-    resources.push({
-      uri: entry.uri,
-      descriptor: entry.descriptor,
-      resource: defaultExport
-    });
-  }
-  return resources;
-}
-async function loadRuntimePrompts(rootDir, manifest) {
-  const parentURL = pathToFileURL3(path20.join(rootDir, "sidecar.config.ts")).href;
-  const tsconfigPath = path20.join(rootDir, "tsconfig.json");
-  const tsconfig = existsSync7(tsconfigPath) ? tsconfigPath : false;
-  const loaded = [];
-  for (const entry of manifest.prompts) {
-    const sourcePath = path20.join(rootDir, entry.sourceFile);
-    const module = await tsImport2(pathToFileURL3(sourcePath).href, {
-      parentURL,
-      tsconfig
-    });
-    const defaultExport = unwrapRuntimeDefault2(module.default);
-    if (!isSidecarPrompt(defaultExport)) {
-      throw new Error(`${entry.sourceFile} did not default-export a Sidecar prompt.`);
+    try {
+      await fetch(`http://127.0.0.1:${port}/mcp`, {
+        method: "GET",
+        headers: { accept: "application/json, text/event-stream" }
+      });
+      return;
+    } catch {
+      await new Promise((resolve) => setTimeout(resolve, 100));
     }
-    loaded.push({
-      prompt: defaultExport,
-      descriptor: entry.descriptor
-    });
   }
-  return loaded;
-}
-function unwrapRuntimeDefault2(value) {
-  if (value && typeof value === "object" && "default" in value && Object.keys(value).every((key) => key === "default" || key === "__esModule")) {
-    return unwrapRuntimeDefault2(value.default);
-  }
-  return value;
+  throw new Error(`Timed out waiting for Sidecar dev MCP server on 127.0.0.1:${port}.
+${output.join("").trim()}`);
 }
-function listenOnLocalhost(server, port) {
+function listenOnAnyPort(server) {
   return new Promise((resolve, reject) => {
     const onError = (error) => {
       reject(error);
     };
     server.once("error", onError);
-    server.listen(port, "127.0.0.1", () => {
+    server.listen(0, "127.0.0.1", () => {
       server.off("error", onError);
-      resolve();
+      const address = server.address();
+      if (!address) {
+        reject(new Error("Preview server did not expose a bound address."));
+        return;
+      }
+      resolve(address.port);
     });
   });
 }
-function closeServer(server) {
-  return new Promise((resolve) => {
-    server.close(() => resolve());
-  });
-}
 function readOption(argv, name) {
   const index = argv.indexOf(name);
   if (index === -1) {
@@ -6341,11 +7142,16 @@ if (isDirectRun()) {
   });
 }
 export {
+  injectProjectPreviewBridge,
   main,
   previewComponentNames,
   readPreviewComponentSet,
+  readPreviewTargets,
   readPreviewThemes,
+  renderBuildUrlSummary,
   renderComponentPreviewFrame,
-  renderComponentPreviewHtml
+  renderComponentPreviewHtml,
+  renderDevUrlSummary,
+  renderProjectPreviewHtml
 };
 //# sourceMappingURL=index.js.map