sunpeak 0.17.4 → 0.17.6

package/bin/commands/dev.mjs

@@ -159,11 +159,11 @@ export async function dev(projectRoot = process.cwd(), args = []) {
   // Parse --no-begging flag
   const noBegging = args.includes('--no-begging');
 
-  // Parse --prod-tools and --prod-resources flags
+  // Parse flags
   const isProdTools = args.includes('--prod-tools');
   const isProdResources = args.includes('--prod-resources');
 
-  if (isProdTools) console.log('Prod Tools enabled by default (toggle in simulator sidebar)');
+  if (isProdTools) console.log('Prod Tools: MCP tool calls will use real handlers instead of simulation mocks');
   if (isProdResources) console.log('Prod Resources: resources will use production-built HTML from dist/');
 
   console.log(`Starting dev server on port ${port}...`);
@@ -496,6 +496,8 @@ if (import.meta.hot) {
     // In --prod-resources mode, don't pass viteServer so the MCP server serves pre-built HTML.
     // Otherwise, pass it so ChatGPT gets Vite HMR.
     viteServer: isProdResources ? undefined : mcpViteServer,
+    // When --prod-tools is set, UI tool calls use real handlers instead of simulation mocks.
+    prodTools: isProdTools,
   });
 
   // Wait for the MCP server to be listening before starting the inspector
@@ -520,7 +522,6 @@ if (import.meta.hot) {
     name: serverDisplayName,
     sandboxUrl: sandbox.url,
     frameworkMode: true,
-    defaultProdTools: isProdTools,
     defaultProdResources: isProdResources,
     projectRoot,
     noBegging,

package/bin/commands/inspect.mjs

@@ -206,11 +206,11 @@ function mergeSimulationFixtures(dir, simulations) {
  * Vite plugin that serves virtual modules for the inspect entry point.
  *
  * @param {Record<string, object>} simulations - Simulation objects
- * @param {string|null} serverUrl - MCP server URL (null in framework mode to hide server UI)
+ * @param {string} serverUrl - MCP server URL
  * @param {string} appName - Display name
  * @param {string|null} appIcon - Icon URL or emoji
  * @param {string} sandboxUrl - Sandbox server URL
- * @param {{ defaultProdTools?: boolean, defaultProdResources?: boolean }} [modeFlags] - Mode toggles
+ * @param {{ defaultProdResources?: boolean, hideSimulatorModes?: boolean }} [modeFlags] - Mode toggles
  */
 function sunpeakInspectVirtualPlugin(simulations, serverUrl, appName, appIcon, sandboxUrl, modeFlags = {}) {
   const ENTRY_ID = 'virtual:sunpeak-inspect-entry';
@@ -224,13 +224,6 @@ function sunpeakInspectVirtualPlugin(simulations, serverUrl, appName, appIcon, s
     load(id) {
       if (id !== RESOLVED_ENTRY_ID) return;
 
-      // In framework mode (serverUrl is null), don't pass mcpServerUrl to the
-      // Simulator — this enables the prod-tools/prod-resources toggles and hides
-      // the server URL input in the sidebar.
-      const mcpServerUrlProp = serverUrl != null
-        ? `mcpServerUrl: ${JSON.stringify(serverUrl)},`
-        : '';
-
       return `
 import { createElement, StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
@@ -242,8 +235,8 @@ const simulations = ${JSON.stringify(simulations)};
 const appName = ${JSON.stringify(appName ?? 'MCP Inspector')};
 const appIcon = ${JSON.stringify(appIcon ?? null)};
 const sandboxUrl = ${JSON.stringify(sandboxUrl)};
-const defaultProdTools = ${JSON.stringify(modeFlags.defaultProdTools ?? false)};
 const defaultProdResources = ${JSON.stringify(modeFlags.defaultProdResources ?? false)};
+const hideSimulatorModes = ${JSON.stringify(modeFlags.hideSimulatorModes ?? false)};
 
 const onCallTool = async (params) => {
   const res = await fetch('/__sunpeak/call-tool', {
@@ -268,14 +261,14 @@ root.render(
   createElement(StrictMode, null,
     createElement(Simulator, {
       simulations,
-      ${mcpServerUrlProp}
+      mcpServerUrl: ${JSON.stringify(serverUrl)},
       appName,
       appIcon,
       sandboxUrl,
       onCallTool,
       onCallToolDirect,
-      defaultProdTools,
       defaultProdResources,
+      hideSimulatorModes,
     })
   )
 );
@@ -287,9 +280,10 @@ root.render(
 /**
  * Vite plugin for MCP server proxy endpoints.
  * @param {() => import('@modelcontextprotocol/sdk/client/index.js').Client} getClient
- * @param {{ callToolDirect?: (name: string, args: Record<string, unknown>) => Promise<object> }} [pluginOpts]
+ * @param {(client: import('@modelcontextprotocol/sdk/client/index.js').Client) => void} setClient
+ * @param {{ callToolDirect?: (name: string, args: Record<string, unknown>) => Promise<object>, simulationsDir?: string | null }} [pluginOpts]
  */
-function sunpeakInspectEndpointsPlugin(getClient, pluginOpts = {}) {
+function sunpeakInspectEndpointsPlugin(getClient, setClient, pluginOpts = {}) {
   return {
     name: 'sunpeak-inspect-endpoints',
     configureServer(server) {
@@ -390,11 +384,8 @@ function sunpeakInspectEndpointsPlugin(getClient, pluginOpts = {}) {
         }
       });
 
-      // Reconnect to a new server URL.
-      // Currently acknowledges without actually reconnecting — the MCP client
-      // connection is established at startup. Changing the URL in the sidebar
-      // requires restarting the inspect server. This endpoint exists so the
-      // useMcpConnection hook can verify the server is reachable.
+      // Reconnect to a new MCP server URL.
+      // Creates a new MCP client connection and replaces the current one.
       server.middlewares.use('/__sunpeak/connect', async (req, res) => {
         if (req.method !== 'POST') {
           res.writeHead(405);
@@ -402,12 +393,47 @@ function sunpeakInspectEndpointsPlugin(getClient, pluginOpts = {}) {
           return;
         }
 
+        const body = await readRequestBody(req);
+        let parsed;
         try {
-          // Verify the MCP client is still connected by listing tools
-          const client = getClient();
-          await client.listTools();
+          parsed = JSON.parse(body);
+        } catch {
+          res.writeHead(400, { 'Content-Type': 'application/json' });
+          res.end(JSON.stringify({ error: 'Invalid JSON' }));
+          return;
+        }
+
+        const url = parsed.url;
+        if (!url) {
+          // No URL provided — just verify current connection
+          try {
+            const client = getClient();
+            await client.listTools();
+            res.writeHead(200, { 'Content-Type': 'application/json' });
+            res.end(JSON.stringify({ status: 'ok' }));
+          } catch (err) {
+            res.writeHead(500, { 'Content-Type': 'application/json' });
+            res.end(JSON.stringify({ error: err.message }));
+          }
+          return;
+        }
+
+        try {
+          // Close old connection (best effort)
+          try { await getClient().close(); } catch { /* ignore */ }
+
+          // Create new connection
+          const newConnection = await createMcpConnection(url);
+          setClient(newConnection.client);
+
+          // Discover tools and resources from the new server
+          const simulations = await discoverSimulations(newConnection.client);
+          // Merge fixture data so simulations have mock toolInput/toolResult
+          if (pluginOpts.simulationsDir) {
+            mergeSimulationFixtures(pluginOpts.simulationsDir, simulations);
+          }
           res.writeHead(200, { 'Content-Type': 'application/json' });
-          res.end(JSON.stringify({ status: 'ok' }));
+          res.end(JSON.stringify({ status: 'ok', simulations }));
         } catch (err) {
           res.writeHead(500, { 'Content-Type': 'application/json' });
           res.end(JSON.stringify({ error: err.message }));
@@ -476,8 +502,7 @@ function readRequestBody(req) {
  * @param {number} [opts.port] - Dev server port (default: 3000)
  * @param {string} [opts.name] - App name override
  * @param {string} [opts.sandboxUrl] - Existing sandbox server URL (skips creating one)
- * @param {boolean} [opts.frameworkMode] - If true, hide server URL UI and show mode toggles
- * @param {boolean} [opts.defaultProdTools] - Initial prod tools state
+ * @param {boolean} [opts.frameworkMode] - If true, show framework-only controls (Prod Resources)
  * @param {boolean} [opts.defaultProdResources] - Initial prod resources state
  * @param {string} [opts.projectRoot] - Project directory for serving /dist/ files (prod resources)
  * @param {boolean} [opts.noBegging] - Suppress star message
@@ -493,7 +518,6 @@ export async function inspectServer(opts) {
     name: nameOverride,
     sandboxUrl: existingSandboxUrl,
     frameworkMode = false,
-    defaultProdTools = false,
     defaultProdResources = false,
     projectRoot = null,
     noBegging = false,
@@ -552,6 +576,7 @@ export async function inspectServer(opts) {
     mergeSimulationFixtures(simulationsDir, simulations);
   }
 
+
   // Start or reuse sandbox server
   let sandbox;
   let ownsSandbox = false;
@@ -590,9 +615,7 @@ export async function inspectServer(opts) {
 </body>
 </html>`;
 
-  // In framework mode, don't pass serverUrl to the Simulator (hides the server
-  // URL input in the sidebar, enables prod-tools/prod-resources toggles).
-  const simulatorServerUrl = frameworkMode ? null : serverArg;
+  const simulatorServerUrl = serverArg;
 
   // Create the Vite server.
   // Use the sunpeak package dir as root to avoid scanning the user's project
@@ -608,11 +631,13 @@ export async function inspectServer(opts) {
         serverAppName,
         serverAppIcon,
         sandbox.url,
-        { defaultProdTools, defaultProdResources }
+        { defaultProdResources, hideSimulatorModes: !frameworkMode }
+      ),
+      sunpeakInspectEndpointsPlugin(
+        () => mcpConnection.client,
+        (newClient) => { mcpConnection.client = newClient; },
+        { callToolDirect: opts.callToolDirect, simulationsDir }
       ),
-      sunpeakInspectEndpointsPlugin(() => mcpConnection.client, {
-        callToolDirect: opts.callToolDirect,
-      }),
       // Serve /dist/{name}/{name}.html from the project directory (for Prod Resources mode).
       // The Simulator polls these paths via HEAD to check if built resources exist.
       // Only intercepts .html files under /dist/ — other /dist/ paths (like sunpeak's

package/dist/chatgpt/globals.css

@@ -80,6 +80,7 @@
     --color-black: #000;
     --color-white: #fff;
     --spacing: .25rem;
+    --container-xs: 20rem;
     --text-xs: .75rem;
     --text-xs--line-height: calc(1 / .75);
     --text-sm: .875rem;
@@ -901,6 +902,10 @@
     max-width: 100%;
   }
 
+  .max-w-xs {
+    max-width: var(--container-xs);
+  }
+
   .min-w-0 {
     min-width: calc(var(--spacing) * 0);
   }

package/dist/chatgpt/index.cjs

@@ -1,8 +1,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_chunk = require("../chunk-9hOWP6kD.cjs");
 require("../protocol-jbxhzcnS.cjs");
-const require_simulator = require("../simulator-CH9hs0N6.cjs");
-const require_simulator_url = require("../simulator-url-CozKF1jf.cjs");
+const require_simulator = require("../simulator-DqWETA_1.cjs");
+const require_simulator_url = require("../simulator-url-3ATCsPOT.cjs");
 const require_discovery = require("../discovery-Clu4uHp1.cjs");
 //#region src/chatgpt/index.ts
 var chatgpt_exports = /* @__PURE__ */ require_chunk.__exportAll({

package/dist/chatgpt/index.js

@@ -1,7 +1,7 @@
 import { r as __exportAll } from "../chunk-D6g4UhsZ.js";
 import "../protocol-DJmRaBzO.js";
-import { _ as McpAppHost, d as ThemeProvider, f as useThemeContext, g as extractResourceCSP, h as IframeResource, n as resolveServerToolResult, t as Simulator, v as SCREEN_WIDTHS } from "../simulator-Dl8B-Ljb.js";
-import { t as createSimulatorUrl } from "../simulator-url-KoS_ToP6.js";
+import { _ as McpAppHost, d as ThemeProvider, f as useThemeContext, g as extractResourceCSP, h as IframeResource, n as resolveServerToolResult, t as Simulator, v as SCREEN_WIDTHS } from "../simulator-BijjlOXb.js";
+import { t as createSimulatorUrl } from "../simulator-url-BbuuWa7S.js";
 import { c as toPascalCase, i as findResourceKey, n as extractSimulationKey, r as findResourceDirs, s as getComponentName, t as extractResourceKey } from "../discovery-Cgoegt62.js";
 //#region src/chatgpt/index.ts
 var chatgpt_exports = /* @__PURE__ */ __exportAll({

package/dist/claude/index.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 require("../chunk-9hOWP6kD.cjs");
 require("../protocol-jbxhzcnS.cjs");
-const require_simulator = require("../simulator-CH9hs0N6.cjs");
+const require_simulator = require("../simulator-DqWETA_1.cjs");
 exports.Simulator = require_simulator.Simulator;

package/dist/claude/index.js

@@ -1,3 +1,3 @@
 import "../protocol-DJmRaBzO.js";
-import { t as Simulator } from "../simulator-Dl8B-Ljb.js";
+import { t as Simulator } from "../simulator-BijjlOXb.js";
 export { Simulator };

package/dist/index.cjs

@@ -2,7 +2,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_chunk = require("./chunk-9hOWP6kD.cjs");
 const require_protocol = require("./protocol-jbxhzcnS.cjs");
 const require_use_app = require("./use-app-D2h-aiyr.cjs");
-const require_simulator = require("./simulator-CH9hs0N6.cjs");
+const require_simulator = require("./simulator-DqWETA_1.cjs");
 const require_host_index = require("./host/index.cjs");
 const require_simulator_index = require("./simulator/index.cjs");
 const require_chatgpt_index = require("./chatgpt/index.cjs");

package/dist/index.js

@@ -1,6 +1,6 @@
 import { $ as literal, L as RequestIdSchema, Q as boolean, R as ResourceLinkSchema, U as ToolSchema, X as _undefined, Z as array, _ as ImplementationSchema, a as CallToolResultSchema, at as unknown, et as number, it as union, nt as record, p as EmbeddedResourceSchema, rt as string, s as ContentBlockSchema, tt as object } from "./protocol-DJmRaBzO.js";
 import { $ as w, A as UX, B as g, C as PQ, D as T, E as S, F as _Q, G as m, H as jQ, I as a, J as p, K as n, L as b, M as W, N as WQ, O as TQ, P as _, Q as t, R as d, S as P, T as RX, U as k, V as h, W as l, X as r, Y as q, Z as s, _ as K, a as B, b as NQ, c as CQ, d as FQ, et as wQ, f as G, g as J, h as IQ, i as AQ, j as V, k as U, l as EQ, m as I, n as AppProvider, nt as z, o as BQ, p as GQ, q as o, r as A, rt as zQ, s as C, t as useApp, tt as x, u as F, v as L, w as R, x as O, y as LQ, z as e } from "./use-app-X7JbGskk.js";
-import { S as DEFAULT_STYLE_VARIABLES } from "./simulator-Dl8B-Ljb.js";
+import { S as DEFAULT_STYLE_VARIABLES } from "./simulator-BijjlOXb.js";
 import { detectHost, detectPlatform, isChatGPT, isClaude } from "./host/index.js";
 import { t as simulator_exports } from "./simulator/index.js";
 import { t as chatgpt_exports } from "./chatgpt/index.js";

package/dist/mcp/index.cjs

@@ -9192,7 +9192,7 @@ function createAppServer(config, simulations, viteMode) {
 				const argsStr = argKeys.length > 0 ? `{${argKeys.join(", ")}}` : "{}";
 				const hasMockResult = toolResult?.structuredContent != null;
 				const realHandler = simulation.handler;
-				if (realHandler && !hasMockResult) {
+				if (realHandler && (config.prodTools || !hasMockResult)) {
 					console.log(`[MCP] CallTool: ${tool.name}${argsStr} → live handler`);
 					try {
 						const result = await realHandler(args, extra);