sunpeak 0.20.22 → 0.20.28

package/dist/{inspector-CJNvLoHo.js → inspector-tIphAHtK.js}

@@ -2,7 +2,7 @@ import { L as __require, _ as record, a as array, b as unknown, f as never, i as
 import { B as ResourceLinkSchema, C as ListPromptsRequestSchema, D as ListResourcesRequestSchema, E as ListResourceTemplatesResultSchema, F as PingRequestSchema, G as ToolSchema, I as PromptListChangedNotificationSchema, L as ReadResourceRequestSchema, N as LoggingMessageNotificationSchema, O as ListResourcesResultSchema, R as ReadResourceResultSchema, T as ListResourceTemplatesRequestSchema, V as ResourceListChangedNotificationSchema, W as ToolListChangedNotificationSchema, a as CallToolResultSchema, c as CreateMessageRequestSchema, i as CallToolRequestSchema, j as ListToolsResultSchema, m as EmbeddedResourceSchema, s as ContentBlockSchema, t as Protocol, v as ImplementationSchema, w as ListPromptsResultSchema, x as JSONRPCMessageSchema, z as RequestIdSchema } from "./protocol-kqfS1G0V.js";
 import * as React from "react";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/lib/default-style-variables.ts
 var DEFAULT_STYLE_VARIABLES = {
 	"--color-background-primary": "light-dark(#ffffff, #1a1a1a)",
@@ -4223,7 +4223,7 @@ registerHostShell({
 }`
 });
 //#endregion
-//#region ../../node_modules/.pnpm/@modelcontextprotocol+ext-apps@1.7.1_@modelcontextprotocol+sdk@1.29.0_zod@4.4.3__react-_3f5c1a6a4033ae62a19a2bb834f0e050/node_modules/@modelcontextprotocol/ext-apps/dist/src/app-bridge.js
+//#region ../../node_modules/.pnpm/@modelcontextprotocol+ext-apps@1.7.2_@modelcontextprotocol+sdk@1.29.0_zod@4.4.3__react-_f5b843da9146ebea748e10ad8dfce46a/node_modules/@modelcontextprotocol/ext-apps/dist/src/app-bridge.js
 ((X) => typeof __require < "u" ? __require : typeof Proxy < "u" ? new Proxy(X, { get: (Y, Z) => (typeof __require < "u" ? __require : Y)[Z] }) : X)(function(X) {
 	if (typeof __require < "u") return __require.apply(this, arguments);
 	throw Error("Dynamic require of \"" + X + "\" is not supported");
@@ -5545,6 +5545,145 @@ iframe { border: none; width: 100%; height: 100%; display: block; }
 </body>
 </html>`;
 }
+var SUNPEAK_INLINE_HELPER_SCRIPT = `
+(function() {
+  if (window.sunpeak) return; // already installed (e.g. parent hot-reload)
+  // Opt-out: resource HTML using the real MCP Apps SDK can suppress the
+  // helper to avoid sending two ui/initialize requests. Manual lowercase
+  // comparison so content="off" / "OFF" / "Off" all match (the Selectors
+  // L4 case-insensitive flag isn't supported in all test environments).
+  try {
+    var metas = document.querySelectorAll('meta[name="sunpeak-helper"]');
+    for (var mi = 0; mi < metas.length; mi++) {
+      var contentAttr = metas[mi].getAttribute('content');
+      if (contentAttr && contentAttr.toLowerCase() === 'off') return;
+    }
+  } catch (e) { /* document not ready or querySelector missing */ }
+
+  var listeners = {
+    toolInput: [],
+    toolInputPartial: [],
+    toolResult: [],
+    toolCancelled: [],
+    hostContext: []
+  };
+  var last = {
+    toolInput: undefined,
+    toolInputPartial: undefined,
+    toolResult: undefined,
+    toolCancelled: undefined,
+    hostContext: undefined
+  };
+  function dispatch(channel, value) {
+    last[channel] = value;
+    // Iterate over a SNAPSHOT — callbacks that unsubscribe themselves
+    // mutate the live list, which would skip subsequent callbacks under a
+    // for-by-index loop on the original array.
+    var list = listeners[channel].slice();
+    for (var i = 0; i < list.length; i++) {
+      try { list[i](value); } catch (e) { console.error('[sunpeak] callback error:', e); }
+    }
+  }
+  // Map channel names to the public method name for error messages.
+  var channelMethodName = {
+    toolInput: 'onToolInput',
+    toolInputPartial: 'onToolInputPartial',
+    toolResult: 'onToolResult',
+    toolCancelled: 'onToolCancelled',
+    hostContext: 'onHostContextChange'
+  };
+  function subscribe(channel) {
+    return function(cb) {
+      if (typeof cb !== 'function') {
+        throw new TypeError('window.sunpeak.' + channelMethodName[channel] + ' expects a function');
+      }
+      listeners[channel].push(cb);
+      if (last[channel] !== undefined) {
+        try { cb(last[channel]); } catch (e) { console.error('[sunpeak] callback error:', e); }
+      }
+      return function unsubscribe() {
+        var idx = listeners[channel].indexOf(cb);
+        if (idx >= 0) listeners[channel].splice(idx, 1);
+      };
+    };
+  }
+
+  window.sunpeak = {
+    onToolInput: subscribe('toolInput'),
+    onToolInputPartial: subscribe('toolInputPartial'),
+    onToolResult: subscribe('toolResult'),
+    onToolCancelled: subscribe('toolCancelled'),
+    onHostContextChange: subscribe('hostContext')
+  };
+
+  var nextId = 1;
+  var pending = {};
+
+  function sendRequest(method, params) {
+    var id = nextId++;
+    return new Promise(function(resolve, reject) {
+      pending[id] = { resolve: resolve, reject: reject };
+      try {
+        window.parent.postMessage({ jsonrpc: '2.0', id: id, method: method, params: params }, '*');
+      } catch (e) {
+        delete pending[id];
+        reject(e);
+      }
+    });
+  }
+  function sendNotification(method, params) {
+    try {
+      window.parent.postMessage({ jsonrpc: '2.0', method: method, params: params || {} }, '*');
+    } catch (e) { /* parent detached */ }
+  }
+
+  window.addEventListener('message', function(ev) {
+    // Only trust messages from the actual parent (the sandbox proxy).
+    // Without this guard, a sibling iframe in the same browsing context or
+    // a browser extension content script could forge JSON-RPC notifications
+    // and drive the embedder's onToolResult/onToolInput callbacks with
+    // attacker-controlled data.
+    if (ev.source !== window.parent) return;
+    var msg = ev.data;
+    if (!msg || typeof msg !== 'object' || msg.jsonrpc !== '2.0') return;
+    if (typeof msg.id !== 'undefined' && pending[msg.id]) {
+      var p = pending[msg.id];
+      delete pending[msg.id];
+      if (msg.error) p.reject(new Error((msg.error && msg.error.message) || 'request error'));
+      else p.resolve(msg.result);
+      return;
+    }
+    if (msg.method === 'ui/notifications/tool-input') {
+      dispatch('toolInput', (msg.params && msg.params.arguments) || {});
+    } else if (msg.method === 'ui/notifications/tool-input-partial') {
+      dispatch('toolInputPartial', (msg.params && msg.params.arguments) || {});
+    } else if (msg.method === 'ui/notifications/tool-result') {
+      // tool-result params are the CallToolResult directly per the spec.
+      dispatch('toolResult', msg.params || {});
+    } else if (msg.method === 'ui/notifications/tool-cancelled') {
+      // Clear cached input / partial / result so a late onToolResult
+      // subscriber doesn't get the cancelled-then-stale value replayed.
+      // hostContext stays — the environment hasn't changed.
+      last.toolInput = undefined;
+      last.toolInputPartial = undefined;
+      last.toolResult = undefined;
+      dispatch('toolCancelled', msg.params || {});
+    } else if (msg.method === 'ui/notifications/host-context-changed') {
+      dispatch('hostContext', msg.params || {});
+    }
+  });
+
+  sendRequest('ui/initialize', {
+    appInfo: { name: 'sunpeak-inline-helper', version: '1.0.0' },
+    appCapabilities: {},
+    protocolVersion: '2026-01-26'
+  }).then(function() {
+    sendNotification('ui/notifications/initialized');
+  }).catch(function(err) {
+    console.warn('[sunpeak] ui/initialize failed:', err && err.message);
+  });
+})();
+`.trim();
 //#endregion
 //#region src/inspector/iframe-resource.tsx
 /**
@@ -5683,6 +5822,23 @@ requestAnimationFrame(function(){
 e.source.postMessage({jsonrpc:"2.0",method:"sunpeak/fence-ack",params:{fenceId:fid}},"*");
 });}});`;
 /**
+* Inject the paint-fence responder and (optionally) a platform runtime script
+* into a user-provided HTML document. Used for the `html` prop mode where the
+* embedder hands us a complete document from `mcpClient.readResource(...)` and
+* we need to splice in the same infrastructure that the `scriptSrc` wrapper
+* provides. The injection is placed before `</head>` when present, falling
+* back to the start of `<body>` or the document start.
+*/
+function injectInfraScripts(html, platformScript) {
+	const fenceTag = `<script data-sunpeak-fence>${PAINT_FENCE_SCRIPT}<\/script>`;
+	const injection = `${platformScript ? `<script>${platformScript}<\/script>` : ""}${fenceTag}${`<script data-sunpeak-helper>${SUNPEAK_INLINE_HELPER_SCRIPT}<\/script>`}`;
+	const headMatch = html.match(/<\/head\s*>/i);
+	if (headMatch) return html.replace(headMatch[0], `${injection}${headMatch[0]}`);
+	const bodyMatch = html.match(/<body([^>]*)>/i);
+	if (bodyMatch) return html.replace(bodyMatch[0], `${bodyMatch[0]}${injection}`);
+	return injection + html;
+}
+/**
 * Generates HTML wrapper for a script URL.
 * The MCP Apps SDK in the loaded script handles communication via PostMessageTransport.
 */
@@ -5746,7 +5902,7 @@ function buildIframeAllow(permissions) {
 * connects via PostMessageTransport to window.parent. The parent side uses
 * McpAppHost (wrapping AppBridge) to communicate.
 */
-function IframeResource({ src, scriptSrc, hostContext, toolInput, toolInputPartial, toolResult, hostOptions, csp, permissions, prefersBorder, className, style, onDisplayModeReady, debugInjectState, injectOpenAIRuntime, sandboxUrl }) {
+function IframeResource({ src, scriptSrc, html, hostContext, toolInput, toolInputPartial, toolResult, hostOptions, csp, permissions, prefersBorder, className, style, onDisplayModeReady, debugInjectState, injectOpenAIRuntime, sandboxUrl }) {
 	const iframeRef = useRef(null);
 	const hostRef = useRef(null);
 	const resourceUrl = src ?? scriptSrc;
@@ -5754,6 +5910,8 @@ function IframeResource({ src, scriptSrc, hostContext, toolInput, toolInputParti
 	srcRef.current = src;
 	const scriptSrcRef = useRef(scriptSrc);
 	scriptSrcRef.current = scriptSrc;
+	const htmlRef = useRef(html);
+	htmlRef.current = html;
 	const cspRef = useRef(csp);
 	cspRef.current = csp;
 	const hostContextRef = useRef(hostContext);
@@ -5803,9 +5961,20 @@ function IframeResource({ src, scriptSrc, hostContext, toolInput, toolInputParti
 		onSandboxReady: () => {
 			const currentSrc = srcRef.current;
 			const currentScriptSrc = scriptSrcRef.current;
+			const currentHtml = htmlRef.current;
 			const currentHost = hostRef.current;
 			if (!currentHost) return;
-			if (currentScriptSrc) {
+			if (currentHtml) {
+				const finalHtml = injectInfraScripts(currentHtml, injectOpenAIRuntimeRef.current ? MOCK_OPENAI_RUNTIME_SCRIPT : void 0);
+				currentHost.sendSandboxResourceReady({
+					html: finalHtml,
+					sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox"
+				});
+				if (iframeRef.current) {
+					iframeRef.current.style.opacity = "1";
+					iframeRef.current.style.transition = "opacity 100ms";
+				}
+			} else if (currentScriptSrc) {
 				const absoluteScriptSrc = currentScriptSrc.startsWith("/") ? `${window.location.origin}${currentScriptSrc}` : currentScriptSrc;
 				const cspPolicy = generateCSP(cspRef.current, absoluteScriptSrc);
 				const appHtml = generateScriptHtml(absoluteScriptSrc, hostContextRef.current?.theme ?? "dark", cspPolicy, injectOpenAIRuntimeRef.current ? MOCK_OPENAI_RUNTIME_SCRIPT : void 0);
@@ -5876,7 +6045,17 @@ function IframeResource({ src, scriptSrc, hostContext, toolInput, toolInputParti
 	const borderStyle = prefersBorder ? { border: "1px solid var(--color-border-primary, #e5e7eb)" } : { border: "none" };
 	const sandboxSrc = useMemo(() => {
 		if (!sandboxUrl) return void 0;
-		const url = new URL("/proxy", sandboxUrl);
+		let url;
+		try {
+			const parsed = new URL(sandboxUrl);
+			url = parsed.pathname && parsed.pathname !== "/" ? parsed : new URL("/proxy", sandboxUrl);
+		} catch {
+			return;
+		}
+		if (url.protocol !== "http:" && url.protocol !== "https:") {
+			console.warn("[IframeResource] Ignoring non-http(s) sandboxUrl:", sandboxUrl);
+			return;
+		}
 		if (injectOpenAIRuntime) url.searchParams.set("platform", "chatgpt");
 		return url.toString();
 	}, [sandboxUrl, injectOpenAIRuntime]);
@@ -6316,6 +6495,7 @@ function useInspectorState({ simulations, defaultHost = "chatgpt" }) {
 	}, [toolResult, modelContext]);
 	const resourceUrl = selectedSim?.resourceUrl;
 	const resourceScript = selectedSim?.resourceScript;
+	const resourceHtml = selectedSim?.resourceHtml;
 	const csp = selectedSim?.resource ? extractResourceCSP(selectedSim.resource) : void 0;
 	const resourceMeta = (selectedSim?.resource?._meta)?.ui;
 	return {
@@ -6382,6 +6562,7 @@ function useInspectorState({ simulations, defaultHost = "chatgpt" }) {
 		handleUpdateModelContext,
 		resourceUrl,
 		resourceScript,
+		resourceHtml,
 		csp,
 		permissions: resourceMeta?.permissions,
 		prefersBorder: resourceMeta?.prefersBorder ?? false,
@@ -6484,7 +6665,14 @@ function useMcpConnection(initialServerUrl) {
 //#endregion
 //#region src/inspector/theme-provider.tsx
 var ThemeProviderContext = React.createContext(void 0);
-/** Default theme applier: sets data-theme attribute on document.documentElement */
+/**
+* Default theme applier: sets `data-theme` on `document.documentElement`.
+* Kept for callers using `ThemeProvider` outside the bundled `<Inspector />`
+* (e.g. custom-inspector builds composed from this package's primitives).
+* The bundled Inspector overrides this with a no-op applier and applies
+* theme to its own root element, so embedding it inside a host React app
+* leaves the host's document attributes untouched.
+*/
 function defaultApplyTheme(theme) {
 	if (typeof document !== "undefined") document.documentElement.setAttribute("data-theme", theme);
 }
@@ -6527,7 +6715,7 @@ function ChevronRightIcon() {
 		})
 	});
 }
-function SimpleSidebar({ children, controls, headerRight }) {
+function SimpleSidebar({ children, controls, headerRight, rootRef, fillParent = false }) {
 	const [isDrawerOpen, setIsDrawerOpen] = React.useState(false);
 	const [sidebarWidth, setSidebarWidth] = React.useState(DEFAULT_SIDEBAR_WIDTH);
 	const [isResizing, setIsResizing] = React.useState(false);
@@ -6552,7 +6740,8 @@ function SimpleSidebar({ children, controls, headerRight }) {
 		};
 	}, [isResizing]);
 	return /* @__PURE__ */ jsxs("div", {
-		className: "sunpeak-inspector-root flex h-screen w-full overflow-hidden relative",
+		ref: rootRef,
+		className: `sunpeak-inspector-root flex ${fillParent ? "h-full w-full" : "h-screen w-full"} overflow-hidden relative`,
 		children: [
 			isResizing && /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-50 cursor-col-resize" }),
 			isDrawerOpen && /* @__PURE__ */ jsx("div", {
@@ -6882,13 +7071,85 @@ function resolveServerToolResult(mock, args) {
 	for (const entry of mock) if (Object.entries(entry.when).every(([key, value]) => args != null && args[key] === value)) return entry.result;
 }
 //#endregion
+//#region src/inspector/app-flatten.ts
+/** Pull the output-template URI off a tool's _meta, if present. */
+function getOutputTemplate(toolMeta) {
+	if (!toolMeta || typeof toolMeta !== "object") return void 0;
+	const openai = toolMeta.openai;
+	if (!openai || typeof openai !== "object") return void 0;
+	const template = openai.outputTemplate;
+	return typeof template === "string" ? template : void 0;
+}
+/** Build an MCP-shaped `Resource` from the embedder's input. Used purely for
+* sidebar metadata (CSP, permissions, prefersBorder); the actual HTML render
+* goes through `resourceHtml` on the resulting Simulation. */
+function toMcpResource(r) {
+	return {
+		uri: r.uri,
+		mimeType: r.mimeType ?? "text/html",
+		name: r.uri,
+		...r._meta ? { _meta: r._meta } : {}
+	};
+}
+/**
+* Flatten an `InspectorApp` to the `Record<string, Simulation>` shape the
+* Inspector consumes internally. Returns an empty map if `app` is missing.
+*/
+function flattenAppToSimulations(app) {
+	if (!app) return {};
+	const result = {};
+	const resourcesByUri = /* @__PURE__ */ new Map();
+	for (const r of app.resources) {
+		if (resourcesByUri.has(r.uri)) console.warn(`[Inspector] Duplicate resource URI '${r.uri}' in app.resources — the second entry replaces the first.`);
+		resourcesByUri.set(r.uri, r);
+	}
+	for (const appTool of app.tools) {
+		const uri = getOutputTemplate(appTool.tool._meta);
+		if (!uri) continue;
+		const resource = resourcesByUri.get(uri);
+		if (!resource) continue;
+		const mcpResource = toMcpResource(resource);
+		const sims = appTool.simulations && appTool.simulations.length > 0 ? appTool.simulations : [{ name: appTool.tool.name }];
+		for (const sim of sims) {
+			const key = `${appTool.tool.name}__${sim.name}`;
+			if (key in result) console.warn(`[Inspector] Duplicate simulation name '${sim.name}' under tool '${appTool.tool.name}' — the second entry replaces the first.`);
+			result[key] = {
+				name: key,
+				displayName: sim.name,
+				resourceHtml: resource.html,
+				userMessage: sim.userMessage,
+				tool: appTool.tool,
+				resource: mcpResource,
+				toolInput: sim.toolInput,
+				toolResult: sim.toolResult,
+				serverTools: sim.serverTools
+			};
+		}
+	}
+	return result;
+}
+//#endregion
 //#region src/inspector/inspector.tsx
 var DOCS_BASE_URL = "https://sunpeak.ai/docs";
 /** Check whether a simulation has user-authored fixture data. */
 function hasFixtureData(sim) {
 	return sim.toolResult != null || sim.toolInput != null || sim.serverTools != null;
 }
-function Inspector({ children, simulations: initialSimulations = {}, appName = "Sunpeak", appIcon, defaultHost = "chatgpt", onCallTool, onCallToolDirect, defaultProdResources = false, hideInspectorModes = false, demoMode = false, sandboxUrl, mcpServerUrl }) {
+var EMPTY_SIMULATIONS = Object.freeze({});
+function Inspector({ children, app, simulations: initialSimulationsProp = EMPTY_SIMULATIONS, appName: appNameProp, appIcon: appIconProp, defaultHost = "chatgpt", onCallTool, onCallToolDirect, defaultProdResources = false, hideInspectorModes = false, demoMode = false, sandboxUrl, mcpServerUrl }) {
+	const initialSimulations = React.useMemo(() => app ? flattenAppToSimulations(app) : initialSimulationsProp, [app, initialSimulationsProp]);
+	const appName = app?.name ?? appNameProp ?? "Sunpeak";
+	const appIcon = app?.icon ?? appIconProp;
+	const isEmbedded = !!app;
+	const conflictWarnedRef = React.useRef(false);
+	React.useEffect(() => {
+		if (conflictWarnedRef.current) return;
+		if (app && initialSimulationsProp && Object.keys(initialSimulationsProp).length > 0) {
+			conflictWarnedRef.current = true;
+			console.warn("[Inspector] Both `app` and `simulations` were provided. `app` takes precedence; `simulations` is ignored.");
+		}
+	}, [app, initialSimulationsProp]);
+	const rootRef = React.useRef(null);
 	const [simulations, setSimulations] = React.useState(initialSimulations);
 	React.useEffect(() => {
 		setSimulations(initialSimulations);
@@ -6971,7 +7232,7 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 	const [oauthClientSecret, setOauthClientSecret] = React.useState("");
 	const [oauthStatus, setOauthStatus] = React.useState("none");
 	const [oauthError, setOauthError] = React.useState();
-	const connection = useMcpConnection(mcpServerUrl || void 0);
+	const connection = useMcpConnection(isEmbedded ? void 0 : mcpServerUrl || void 0);
 	const [prodResources, setProdResources] = React.useState(state.urlProdResources ?? defaultProdResources);
 	const showSidebar = state.urlSidebar !== false;
 	const showDevOverlay = state.urlDevOverlay !== false;
@@ -7045,12 +7306,22 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 				return;
 			}
 			if (data.status === "redirect" && data.authUrl) {
+				let parsedAuthUrl = null;
+				try {
+					parsedAuthUrl = new URL(data.authUrl);
+				} catch {}
+				if (!parsedAuthUrl || parsedAuthUrl.protocol !== "http:" && parsedAuthUrl.protocol !== "https:") {
+					popup?.close();
+					setOauthError("OAuth authorization URL is not a valid http(s) URL.");
+					setOauthStatus("error");
+					return;
+				}
 				if (!popup || popup.closed) {
 					setOauthError("Popup was blocked. Allow popups for this site and try again.");
 					setOauthStatus("error");
 					return;
 				}
-				popup.location.href = data.authUrl;
+				popup.location.href = parsedAuthUrl.toString();
 				let checkClosed;
 				let bc;
 				const cleanup = () => {
@@ -7239,15 +7510,23 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 		displayMode,
 		setDisplayMode
 	]);
-	React.useLayoutEffect(() => {
-		const vars = activeShell?.styleVariables;
-		if (!vars) return;
-		const root = document.documentElement;
-		for (const [key, value] of Object.entries(vars)) if (value) root.style.setProperty(key, value);
-	}, [activeShell]);
+	const prevStyleVarKeysRef = React.useRef([]);
 	const prevPageStyleKeysRef = React.useRef([]);
 	React.useLayoutEffect(() => {
-		const root = document.documentElement;
+		const root = rootRef.current;
+		if (!root) return;
+		root.setAttribute("data-theme", state.theme);
+		root.style.colorScheme = state.theme;
+		for (const key of prevStyleVarKeysRef.current) root.style.removeProperty(key);
+		const vars = activeShell?.styleVariables;
+		if (vars) {
+			const keys = [];
+			for (const [key, value] of Object.entries(vars)) if (value) {
+				root.style.setProperty(key, value);
+				keys.push(key);
+			}
+			prevStyleVarKeysRef.current = keys;
+		} else prevStyleVarKeysRef.current = [];
 		for (const key of prevPageStyleKeysRef.current) root.style.removeProperty(key);
 		const pageStyles = activeShell?.pageStyles;
 		if (pageStyles) {
@@ -7258,7 +7537,7 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 			}
 			prevPageStyleKeysRef.current = keys;
 		} else prevPageStyleKeysRef.current = [];
-	}, [activeShell]);
+	}, [activeShell, state.theme]);
 	React.useLayoutEffect(() => {
 		const fontCss = activeShell?.fontCss;
 		const id = "sunpeak-host-fonts";
@@ -7349,7 +7628,7 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 			children: /* @__PURE__ */ jsx("span", {
 				className: "text-sm text-center max-w-xs",
 				style: { color: "var(--color-text-secondary)" },
-				children: isError ? "Could not connect to MCP server" : isConnected ? "No tools with UI resources found on this server" : serverUrl ? "Connecting…" : "Enter an MCP server URL to get started"
+				children: isEmbedded ? "No tools with UI resources in this app" : isError ? "Could not connect to MCP server" : isConnected ? "No tools with UI resources found on this server" : serverUrl ? "Connecting…" : "Enter an MCP server URL to get started"
 			})
 		});
 	} else if (showEmptyState) content = /* @__PURE__ */ jsx("div", {
@@ -7374,6 +7653,30 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 			children: "Building…"
 		})
 	});
+	else if (state.resourceHtml) content = /* @__PURE__ */ jsx("div", {
+		className: "h-full w-full",
+		style: { background: iframeBg },
+		children: /* @__PURE__ */ jsx(IframeResource, {
+			html: state.resourceHtml,
+			hostContext,
+			toolInput: state.toolInput,
+			toolResult: state.effectiveToolResult,
+			hostOptions: {
+				hostInfo: activeShell?.hostInfo,
+				hostCapabilities: activeShell?.hostCapabilities,
+				onDisplayModeChange: state.handleDisplayModeChange,
+				onUpdateModelContext: state.handleUpdateModelContext,
+				onCallTool: handleCallTool
+			},
+			permissions: state.permissions,
+			prefersBorder: state.prefersBorder,
+			onDisplayModeReady: state.handleDisplayModeReady,
+			debugInjectState: state.modelContext,
+			injectOpenAIRuntime: state.activeHost === "chatgpt",
+			sandboxUrl,
+			className: "h-full w-full"
+		}, `${state.activeHost}-${state.selectedSimulationName}-html`)
+	});
 	else if (effectiveResourceUrl) content = /* @__PURE__ */ jsx("div", {
 		className: "h-full w-full",
 		style: { background: iframeBg },
@@ -7424,7 +7727,7 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 		}, `${state.activeHost}-${state.selectedSimulationName}-${state.resourceScript}`)
 	});
 	else content = children;
-	const applyTheme = activeShell?.applyTheme;
+	const applyTheme = React.useCallback((_theme) => {}, []);
 	const runButton = !demoMode && onCallTool && currentSim && activeSimulationName === null ? /* @__PURE__ */ jsxs("button", {
 		type: "button",
 		onClick: handleRun,
@@ -7464,11 +7767,13 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 		headerAction: runButton,
 		children: content
 	}) : content;
+	const rootSizing = isEmbedded ? "h-full w-full" : "h-screen w-screen";
 	if (!showSidebar) return /* @__PURE__ */ jsx(ThemeProvider, {
 		theme: state.theme,
 		applyTheme,
 		children: /* @__PURE__ */ jsx("div", {
-			className: "flex h-screen w-screen",
+			ref: rootRef,
+			className: `sunpeak-inspector-root flex ${rootSizing}`,
 			children: conversationContent
 		})
 	});
@@ -7476,10 +7781,12 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 		theme: state.theme,
 		applyTheme,
 		children: [/* @__PURE__ */ jsx(SimpleSidebar, {
+			rootRef,
+			fillParent: isEmbedded,
 			controls: /* @__PURE__ */ jsxs("div", {
 				className: "space-y-1",
 				children: [
-					/* @__PURE__ */ jsx(SidebarControl, {
+					!isEmbedded && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SidebarControl, {
 						label: /* @__PURE__ */ jsxs("span", {
 							className: "flex items-center gap-1.5",
 							children: ["MCP Server", serverUrl && !demoMode && /* @__PURE__ */ jsx("span", {
@@ -7498,8 +7805,7 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 							placeholder: "http://localhost:8000/mcp",
 							disabled: demoMode
 						})
-					}),
-					!demoMode && /* @__PURE__ */ jsx(SidebarCollapsibleControl, {
+					}), !demoMode && /* @__PURE__ */ jsx(SidebarCollapsibleControl, {
 						label: "Authentication",
 						defaultCollapsed: authType === "none",
 						children: /* @__PURE__ */ jsxs("div", {
@@ -7584,8 +7890,8 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 								})
 							]
 						})
-					}, `auth-${authType === "none" ? "none" : "active"}`),
-					!hideInspectorModes && !demoMode && /* @__PURE__ */ jsx(SidebarCheckbox, {
+					}, `auth-${authType === "none" ? "none" : "active"}`)] }),
+					!hideInspectorModes && !demoMode && !isEmbedded && /* @__PURE__ */ jsx(SidebarCheckbox, {
 						checked: prodResources,
 						onChange: setProdResources,
 						label: "Prod Resources",
@@ -7636,7 +7942,7 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 									label: selectedToolInfo && selectedToolInfo.fixtureSimNames.length > 0 ? "None (call server)" : "None"
 								}], ...(selectedToolInfo?.fixtureSimNames ?? []).map((simName) => ({
 									value: simName,
-									label: simName
+									label: simulations[simName]?.displayName ?? simName
 								}))]
 							})
 						})]
@@ -8016,6 +8322,6 @@ function Inspector({ children, simulations: initialSimulations = {}, appName = "
 	});
 }
 //#endregion
-export { DEFAULT_STYLE_VARIABLES as C, cn as S, McpAppHost as _, SidebarControl as a, getRegisteredHosts as b, SidebarTextarea as c, ThemeProvider as d, useThemeContext as f, extractResourceCSP as g, IframeResource as h, SidebarCollapsibleControl as i, SidebarToggle as l, useInspectorState as m, resolveServerToolResult as n, SidebarInput as o, useMcpConnection as p, SidebarCheckbox as r, SidebarSelect as s, Inspector as t, SimpleSidebar as u, SCREEN_WIDTHS as v, registerHostShell as x, getHostShell as y };
+export { cn as C, registerHostShell as S, extractResourceCSP as _, SidebarCollapsibleControl as a, getHostShell as b, SidebarSelect as c, SimpleSidebar as d, ThemeProvider as f, IframeResource as g, useInspectorState as h, SidebarCheckbox as i, SidebarTextarea as l, useMcpConnection as m, flattenAppToSimulations as n, SidebarControl as o, useThemeContext as p, resolveServerToolResult as r, SidebarInput as s, Inspector as t, SidebarToggle as u, McpAppHost as v, DEFAULT_STYLE_VARIABLES as w, getRegisteredHosts as x, SCREEN_WIDTHS as y };
 
-//# sourceMappingURL=inspector-CJNvLoHo.js.map
+//# sourceMappingURL=inspector-tIphAHtK.js.map