@frontmcp/uipack 0.12.2 → 1.0.0-beta.10

package/esm/adapters/index.mjs

@@ -1,514 +1,2429 @@
-// libs/uipack/src/adapters/platform-meta.constants.ts
-var DISPLAY_MODE_MAP = {
-  // Standard MCP Apps modes
-  inline: "inline",
-  fullscreen: "fullscreen",
-  pip: "pip",
-  // OpenAI-style aliases
-  widget: "inline",
-  panel: "fullscreen"
-};
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined") return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
 
-// libs/uipack/src/adapters/platform-meta.ts
-function getExtAppsMimeType(variant = "standard") {
-  switch (variant) {
-    case "profile":
-      return "text/html;profile=mcp-app";
-    case "standard":
-    default:
-      return "text/html+mcp";
-  }
-}
-function isExtAppsMimeType(mimeType) {
-  return mimeType === "text/html+mcp" || mimeType === "text/html;profile=mcp-app";
-}
-function buildUIMeta(options) {
-  const { uiConfig, platformType, html, token, directUrl, rendererType, contentHash, manifestUri } = options;
-  const meta = {};
-  switch (platformType) {
-    case "openai":
-      meta["openai/html"] = html;
-      meta["openai/mimeType"] = "text/html+skybridge";
-      if (rendererType) meta["openai/type"] = rendererType;
-      if (contentHash) meta["openai/contentHash"] = contentHash;
-      if (manifestUri) meta["openai/manifestUri"] = manifestUri;
-      if (token) meta["openai/widgetToken"] = token;
-      if (directUrl) meta["openai/directUrl"] = directUrl;
-      return buildOpenAIMeta(meta, uiConfig);
-    case "ext-apps":
-      meta["ui/html"] = html;
-      meta["ui/mimeType"] = "text/html+mcp";
-      if (rendererType) meta["ui/type"] = rendererType;
-      if (contentHash) meta["ui/contentHash"] = contentHash;
-      if (manifestUri) meta["ui/manifestUri"] = manifestUri;
-      if (token) meta["ui/widgetToken"] = token;
-      if (directUrl) meta["ui/directUrl"] = directUrl;
-      return buildExtAppsMeta(meta, uiConfig);
-    case "claude":
-    case "cursor":
-    case "continue":
-    case "cody":
-    case "generic-mcp":
-    case "gemini":
-    default:
-      meta["ui/html"] = html;
-      meta["ui/mimeType"] = "text/html+mcp";
-      if (rendererType) meta["ui/type"] = rendererType;
-      if (contentHash) meta["ui/contentHash"] = contentHash;
-      if (manifestUri) meta["ui/manifestUri"] = manifestUri;
-      if (token) meta["ui/widgetToken"] = token;
-      if (directUrl) meta["ui/directUrl"] = directUrl;
-      if (platformType === "claude") {
-        return buildClaudeMeta(meta, uiConfig);
-      } else if (platformType === "gemini") {
-        return buildGeminiMeta(meta, uiConfig);
-      } else if (platformType === "cursor" || platformType === "continue" || platformType === "cody") {
-        return buildIDEMeta(meta, uiConfig);
-      } else if (platformType === "generic-mcp") {
-        return buildGenericMeta(meta, uiConfig);
-      }
-      return meta;
-  }
-}
-function buildOpenAIMeta(meta, uiConfig) {
-  if (uiConfig.invocationStatus?.invoking) {
-    meta["openai/toolInvocation/invoking"] = uiConfig.invocationStatus.invoking;
+// libs/uipack/src/adapters/constants.ts
+var MCP_APPS_MIME_TYPE = "text/html;profile=mcp-app";
+var MCP_APPS_EXTENSION_ID = "io.modelcontextprotocol/ui";
+
+// libs/uipack/src/adapters/serving-mode.ts
+function resolveServingMode(options) {
+  const { configuredMode, platformType } = options;
+  if (platformType === "gemini") {
+    return {
+      mode: configuredMode,
+      supportsUI: false,
+      effectiveMode: null,
+      useStructuredContent: false,
+      reason: "Gemini does not support MCP Apps UI"
+    };
   }
-  if (uiConfig.invocationStatus?.invoked) {
-    meta["openai/toolInvocation/invoked"] = uiConfig.invocationStatus.invoked;
+  const effectiveMode = configuredMode === "auto" ? "inline" : configuredMode;
+  if (effectiveMode === "hybrid") {
+    const hybridCapable = platformType === "openai" || platformType === "ext-apps" || platformType === "cursor";
+    if (!hybridCapable) {
+      return {
+        mode: configuredMode,
+        supportsUI: false,
+        effectiveMode: null,
+        useStructuredContent: false,
+        reason: `Platform ${platformType} does not support hybrid serving mode`
+      };
+    }
   }
-  return meta;
+  const useStructuredContent = platformType === "openai" || platformType === "ext-apps" || platformType === "generic-mcp" || platformType === "unknown";
+  return {
+    mode: configuredMode,
+    supportsUI: true,
+    effectiveMode,
+    useStructuredContent,
+    reason: `Platform ${platformType} supports UI, mode: ${effectiveMode}`
+  };
 }
-function buildOpenAICSP(csp) {
-  const result = {};
-  if (csp.connectDomains?.length) {
-    result.connect_domains = csp.connectDomains;
+
+// libs/uipack/src/adapters/response-builder.ts
+function buildToolResponseContent(options) {
+  const { rawOutput, htmlContent, servingMode, useStructuredContent, platformType } = options;
+  const textSummary = typeof rawOutput === "string" ? rawOutput : rawOutput !== null && rawOutput !== void 0 ? JSON.stringify(rawOutput) : "";
+  const result = {
+    content: [{ type: "text", text: textSummary }]
+  };
+  if (useStructuredContent && rawOutput !== null && rawOutput !== void 0) {
+    const structured = typeof rawOutput === "object" && !Array.isArray(rawOutput) ? rawOutput : { value: rawOutput };
+    result.structuredContent = structured;
   }
-  if (csp.resourceDomains?.length) {
-    result.resource_domains = csp.resourceDomains;
+  if (htmlContent && servingMode === "inline") {
+    const htmlKey = "ui/html";
+    result._meta = {
+      [htmlKey]: htmlContent
+    };
+    result.format = "html";
   }
   return result;
 }
-function buildClaudeMeta(meta, uiConfig) {
-  if (uiConfig.widgetDescription) {
-    meta["claude/widgetDescription"] = uiConfig.widgetDescription;
+
+// libs/uipack/src/adapters/render-failure.ts
+function isUIRenderFailure(result) {
+  if (typeof result !== "object" || result === null) {
+    return false;
   }
-  if (uiConfig.displayMode) {
-    meta["claude/displayMode"] = uiConfig.displayMode;
+  const rec = result;
+  return typeof rec["reason"] === "string" && !("meta" in rec);
+}
+
+// libs/uipack/src/shell/csp.ts
+var DEFAULT_CDN_DOMAINS = [
+  "https://cdn.jsdelivr.net",
+  "https://cdnjs.cloudflare.com",
+  "https://fonts.googleapis.com",
+  "https://fonts.gstatic.com",
+  "https://esm.sh"
+];
+var DEFAULT_CSP_DIRECTIVES = [
+  "default-src 'none'",
+  `script-src 'self' 'unsafe-inline' ${DEFAULT_CDN_DOMAINS.join(" ")}`,
+  `style-src 'self' 'unsafe-inline' ${DEFAULT_CDN_DOMAINS.join(" ")}`,
+  `img-src 'self' data: ${DEFAULT_CDN_DOMAINS.join(" ")}`,
+  `font-src 'self' data: ${DEFAULT_CDN_DOMAINS.join(" ")}`,
+  `connect-src ${DEFAULT_CDN_DOMAINS.join(" ")}`,
+  "object-src 'self' data:"
+];
+function buildCSPDirectives(csp) {
+  if (!csp) {
+    return [...DEFAULT_CSP_DIRECTIVES];
   }
-  if (uiConfig.widgetAccessible) {
-    meta["claude/widgetAccessible"] = true;
+  const validResourceDomains = sanitizeCSPDomains(csp.resourceDomains);
+  const validConnectDomains = sanitizeCSPDomains(csp.connectDomains);
+  const allResourceDomains = [.../* @__PURE__ */ new Set([...DEFAULT_CDN_DOMAINS, ...validResourceDomains])];
+  const directives = [
+    "default-src 'none'",
+    `script-src 'self' 'unsafe-inline' ${allResourceDomains.join(" ")}`,
+    `style-src 'self' 'unsafe-inline' ${allResourceDomains.join(" ")}`
+  ];
+  const imgSources = ["'self'", "data:", ...allResourceDomains];
+  directives.push(`img-src ${imgSources.join(" ")}`);
+  const fontSources = ["'self'", "data:", ...allResourceDomains];
+  directives.push(`font-src ${fontSources.join(" ")}`);
+  if (validConnectDomains.length) {
+    directives.push(`connect-src ${validConnectDomains.join(" ")}`);
+  } else {
+    directives.push(`connect-src ${allResourceDomains.join(" ")}`);
   }
-  if (uiConfig.prefersBorder !== void 0) {
-    meta["claude/prefersBorder"] = uiConfig.prefersBorder;
+  directives.push("object-src 'self' data:");
+  return directives;
+}
+function buildCSPMetaTag(csp) {
+  const directives = buildCSPDirectives(csp);
+  const content = directives.join("; ");
+  return `<meta http-equiv="Content-Security-Policy" content="${escapeAttribute(content)}">`;
+}
+function validateCSPDomain(domain) {
+  if (domain.startsWith("https://*.")) {
+    const rest = domain.slice(10);
+    return /^[a-zA-Z0-9]([a-zA-Z0-9-]*[a-zA-Z0-9])?\.[a-zA-Z]{2,}$/.test(rest);
   }
-  if (uiConfig.resourceUri) {
-    meta["ui/resourceUri"] = uiConfig.resourceUri;
+  try {
+    const url = new URL(domain);
+    return url.protocol === "https:";
+  } catch {
+    return false;
   }
-  if (uiConfig.csp) {
-    const csp = {};
-    if (uiConfig.csp.connectDomains?.length) {
-      csp.connectDomains = uiConfig.csp.connectDomains;
+}
+function sanitizeCSPDomains(domains) {
+  if (!domains) return [];
+  const valid = [];
+  for (const domain of domains) {
+    if (validateCSPDomain(domain)) {
+      valid.push(domain);
+    } else {
+      console.warn(`Invalid CSP domain ignored: ${domain}`);
     }
-    if (uiConfig.csp.resourceDomains?.length) {
-      csp.resourceDomains = uiConfig.csp.resourceDomains;
+  }
+  return valid;
+}
+function escapeAttribute(str) {
+  return str.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/'/g, "&#39;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+
+// libs/uipack/src/utils/index.ts
+function escapeHtml(str) {
+  if (str === null || str === void 0) {
+    return "";
+  }
+  const s = String(str);
+  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;").replace(/\u2028/g, "\\u2028").replace(/\u2029/g, "\\u2029");
+}
+function escapeScriptClose(jsonString) {
+  return jsonString.replace(/<\//g, "<\\/");
+}
+function safeJsonForScript(value) {
+  if (value === void 0) {
+    return "null";
+  }
+  try {
+    const jsonString = JSON.stringify(value, (_key, val) => {
+      if (typeof val === "bigint") {
+        return val.toString();
+      }
+      return val;
+    });
+    if (jsonString === void 0) {
+      return "null";
     }
-    if (Object.keys(csp).length > 0) {
-      meta["ui/csp"] = csp;
+    return escapeScriptClose(jsonString);
+  } catch {
+    return '{"error":"Value could not be serialized"}';
+  }
+}
+
+// libs/uipack/src/shell/data-injector.ts
+function buildDataInjectionScript(options) {
+  const { toolName, input, output, structuredContent } = options;
+  const lines = [
+    `window.__mcpToolName = ${safeJsonForScript(toolName)};`,
+    `window.__mcpToolInput = ${safeJsonForScript(input ?? null)};`,
+    `window.__mcpToolOutput = ${safeJsonForScript(output ?? null)};`,
+    `window.__mcpStructuredContent = ${safeJsonForScript(structuredContent ?? null)};`
+  ];
+  return `<script>
+${lines.join("\n")}
+</script>`;
+}
+var _uniqueIdCounter = 0;
+function createTemplateHelpers() {
+  return {
+    escapeHtml: (str) => escapeHtml(str),
+    formatDate: (date, format) => {
+      const d = date instanceof Date ? date : new Date(date);
+      if (isNaN(d.getTime())) return String(date);
+      if (format === "iso") return d.toISOString();
+      if (format === "date") return d.toLocaleDateString();
+      if (format === "time") return d.toLocaleTimeString();
+      return d.toLocaleString();
+    },
+    formatCurrency: (amount, currency = "USD") => {
+      return new Intl.NumberFormat("en-US", {
+        style: "currency",
+        currency
+      }).format(amount);
+    },
+    uniqueId: (prefix = "mcp") => {
+      return `${prefix}-${++_uniqueIdCounter}`;
+    },
+    jsonEmbed: (data) => {
+      return escapeScriptClose(JSON.stringify(data));
     }
+  };
+}
+
+// libs/uipack/src/bridge-runtime/iife-generator.ts
+function generateBridgeIIFE(options = {}) {
+  const { debug = false, trustedOrigins = [], minify = false } = options;
+  const adapters = options.adapters || ["openai", "ext-apps", "claude", "gemini", "generic"];
+  const parts = [];
+  parts.push("(function() {");
+  parts.push('"use strict";');
+  parts.push("");
+  if (debug) {
+    parts.push('function log(msg) { console.log("[FrontMcpBridge] " + msg); }');
+  } else {
+    parts.push("function log() {}");
+  }
+  parts.push("");
+  parts.push("var DEFAULT_SAFE_AREA = { top: 0, bottom: 0, left: 0, right: 0 };");
+  parts.push("");
+  parts.push(generateContextDetection());
+  parts.push("");
+  parts.push(generateBaseCapabilities());
+  parts.push("");
+  if (adapters.includes("openai")) {
+    parts.push(generateOpenAIAdapter());
+    parts.push("");
+  }
+  if (adapters.includes("ext-apps")) {
+    parts.push(generateExtAppsAdapter(trustedOrigins));
+    parts.push("");
+  }
+  if (adapters.includes("claude")) {
+    parts.push(generateClaudeAdapter());
+    parts.push("");
   }
-  return meta;
+  if (adapters.includes("gemini")) {
+    parts.push(generateGeminiAdapter());
+    parts.push("");
+  }
+  if (adapters.includes("generic")) {
+    parts.push(generateGenericAdapter());
+    parts.push("");
+  }
+  parts.push(generatePlatformDetection(adapters));
+  parts.push("");
+  parts.push(generateBridgeClass());
+  parts.push("");
+  parts.push("var bridge = new FrontMcpBridge();");
+  parts.push("bridge.initialize().then(function() {");
+  parts.push('  log("Bridge initialized with adapter: " + bridge.adapterId);');
+  parts.push('  window.dispatchEvent(new CustomEvent("bridge:ready", { detail: { adapter: bridge.adapterId } }));');
+  parts.push("}).catch(function(err) {");
+  parts.push('  console.error("[FrontMcpBridge] Init failed:", err);');
+  parts.push('  window.dispatchEvent(new CustomEvent("bridge:error", { detail: { error: err } }));');
+  parts.push("});");
+  parts.push("");
+  parts.push("window.FrontMcpBridge = bridge;");
+  parts.push("})();");
+  const code = parts.join("\n");
+  if (minify) {
+    return minifyJS(code);
+  }
+  return code;
 }
-function buildGeminiMeta(meta, uiConfig) {
-  if (uiConfig.widgetDescription) {
-    meta["gemini/widgetDescription"] = uiConfig.widgetDescription;
+function generateContextDetection() {
+  return `
+function detectTheme() {
+  if (typeof window !== 'undefined' && window.matchMedia) {
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
   }
-  return meta;
+  return 'light';
 }
-function buildIDEMeta(meta, uiConfig) {
-  if (uiConfig.widgetDescription) {
-    meta["ide/widgetDescription"] = uiConfig.widgetDescription;
+
+function detectLocale() {
+  if (typeof navigator !== 'undefined') {
+    return navigator.language || 'en-US';
   }
-  return meta;
+  return 'en-US';
 }
-function buildFrontMCPCSP(csp) {
-  const result = {};
-  if (csp.connectDomains?.length) {
-    result.connectDomains = csp.connectDomains;
+
+function detectUserAgent() {
+  if (typeof navigator === 'undefined') {
+    return { type: 'web', hover: true, touch: false };
   }
-  if (csp.resourceDomains?.length) {
-    result.resourceDomains = csp.resourceDomains;
+  var ua = navigator.userAgent || '';
+  var isMobile = /iPhone|iPad|iPod|Android/i.test(ua);
+  var hasTouch = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
+  var hasHover = window.matchMedia && window.matchMedia('(hover: hover)').matches;
+  return { type: isMobile ? 'mobile' : 'web', hover: hasHover !== false, touch: hasTouch };
+}
+
+function detectViewport() {
+  if (typeof window !== 'undefined') {
+    return { width: window.innerWidth, height: window.innerHeight };
   }
-  return result;
+  return undefined;
+}
+
+function readInjectedData() {
+  var data = { toolInput: {}, toolOutput: undefined, structuredContent: undefined };
+  if (typeof window !== 'undefined') {
+    if (window.__mcpToolInput) data.toolInput = window.__mcpToolInput;
+    if (window.__mcpToolOutput) data.toolOutput = window.__mcpToolOutput;
+    if (window.__mcpStructuredContent) data.structuredContent = window.__mcpStructuredContent;
+  }
+  return data;
+}
+`.trim();
+}
+function generateBaseCapabilities() {
+  return `
+var DEFAULT_CAPABILITIES = {
+  canCallTools: false,
+  canSendMessages: false,
+  canOpenLinks: false,
+  canPersistState: true,
+  hasNetworkAccess: true,
+  supportsDisplayModes: false,
+  supportsTheme: true
+};
+`.trim();
 }
-function buildGenericMeta(meta, uiConfig) {
-  if (uiConfig.csp) {
-    const csp = {};
-    if (uiConfig.csp.connectDomains?.length) {
-      csp.connectDomains = uiConfig.csp.connectDomains;
+function generateOpenAIAdapter() {
+  return `
+var OpenAIAdapter = {
+  id: 'openai',
+  name: 'OpenAI ChatGPT',
+  priority: 100,
+  capabilities: Object.assign({}, DEFAULT_CAPABILITIES, {
+    canCallTools: true,
+    canSendMessages: true,
+    canOpenLinks: true,
+    supportsDisplayModes: true
+  }),
+  canHandle: function() {
+    if (typeof window === 'undefined') return false;
+    // Check for window.openai.callTool (the actual OpenAI SDK API)
+    if (window.openai && typeof window.openai.callTool === 'function') return true;
+    // Also check if we're being injected with tool metadata (OpenAI injects toolOutput)
+    if (window.openai && (window.openai.toolOutput !== undefined || window.openai.toolInput !== undefined)) return true;
+    return false;
+  },
+  initialize: function(context) {
+    var sdk = window.openai;
+    context.sdk = sdk;
+    // OpenAI SDK exposes theme and displayMode directly as properties
+    if (sdk.theme) {
+      context.hostContext.theme = sdk.theme;
     }
-    if (uiConfig.csp.resourceDomains?.length) {
-      csp.resourceDomains = uiConfig.csp.resourceDomains;
+    if (sdk.displayMode) {
+      context.hostContext.displayMode = sdk.displayMode;
     }
-    if (Object.keys(csp).length > 0) {
-      meta["ui/csp"] = csp;
+    // Note: OpenAI SDK does not have an onContextChange equivalent
+    return Promise.resolve();
+  },
+  callTool: function(context, name, args) {
+    return context.sdk.callTool(name, args);
+  },
+  sendMessage: function(context, content) {
+    if (typeof context.sdk.sendFollowUpMessage === 'function') {
+      return context.sdk.sendFollowUpMessage(content);
     }
+    return Promise.reject(new Error('Messages not supported'));
+  },
+  openLink: function(context, url) {
+    window.open(url, '_blank', 'noopener,noreferrer');
+    return Promise.resolve();
+  },
+  requestDisplayMode: function(context, mode) {
+    return Promise.resolve();
+  },
+  requestClose: function(context) {
+    return Promise.resolve();
   }
-  if (uiConfig.displayMode) {
-    const mappedMode = DISPLAY_MODE_MAP[uiConfig.displayMode];
-    if (mappedMode) {
-      meta["ui/displayMode"] = mappedMode;
+};
+`.trim();
+}
+function generateExtAppsAdapter(trustedOrigins) {
+  const originsArray = trustedOrigins.length > 0 ? JSON.stringify(trustedOrigins) : "[]";
+  return `
+var ExtAppsAdapter = {
+  id: 'ext-apps',
+  name: 'ext-apps (SEP-1865)',
+  priority: 80,
+  capabilities: Object.assign({}, DEFAULT_CAPABILITIES, { canPersistState: true, hasNetworkAccess: true }),
+  trustedOrigins: ${originsArray},
+  trustedOrigin: null,
+  originTrustPending: false,
+  pendingRequests: {},
+  requestId: 0,
+  hostCapabilities: {},
+  canHandle: function() {
+    if (typeof window === 'undefined') return false;
+    if (window.parent === window) return false;
+
+    // Check for OpenAI SDK - defer to OpenAIAdapter
+    if (window.openai && window.openai.canvas) return false;
+    if (window.openai && typeof window.openai.callTool === 'function') return false;
+
+    // Explicit ext-apps marker
+    if (window.__mcpPlatform === 'ext-apps') return true;
+    if (window.__extAppsInitialized) return true;
+
+    // Claude MCP Apps mode (2026+) - uses ext-apps protocol
+    if (window.__mcpAppsEnabled) return true;
+
+    // Legacy Claude detection - defer to ClaudeAdapter
+    if (window.claude) return false;
+    if (window.__claudeArtifact) return false;
+    if (window.__mcpPlatform === 'claude') return false;
+    if (typeof location !== 'undefined') {
+      try {
+        var url = new URL(location.href);
+        var hostname = url.hostname.toLowerCase();
+        var isClaudeHost = hostname === 'claude.ai' || (hostname.length > 10 && hostname.slice(-10) === '.claude.ai');
+        var isAnthropicHost = hostname === 'anthropic.com' || (hostname.length > 14 && hostname.slice(-14) === '.anthropic.com');
+        if (isClaudeHost || isAnthropicHost) return false;
+      } catch (e) {
+        // If URL parsing fails, fall through to other checks
+      }
     }
+
+    // Do NOT default to true for any iframe
+    return false;
+  },
+  initialize: function(context) {
+    var self = this;
+    context.extApps = this;
+
+    window.addEventListener('message', function(event) {
+      self.handleMessage(context, event);
+    });
+
+    return self.performHandshake(context);
+  },
+  handleMessage: function(context, event) {
+    if (!this.isOriginTrusted(event.origin)) return;
+    var data = event.data;
+    if (!data || typeof data !== 'object' || data.jsonrpc !== '2.0') return;
+
+    if ('id' in data && (data.result !== undefined || data.error !== undefined)) {
+      var pending = this.pendingRequests[data.id];
+      if (pending) {
+        clearTimeout(pending.timeout);
+        delete this.pendingRequests[data.id];
+        if (data.error) {
+          pending.reject(new Error(data.error.message + ' (code: ' + data.error.code + ')'));
+        } else {
+          pending.resolve(data.result);
+        }
+      }
+      return;
+    }
+
+    if ('method' in data && !('id' in data)) {
+      this.handleNotification(context, data);
+    }
+  },
+  handleNotification: function(context, notification) {
+    var params = notification.params || {};
+    switch (notification.method) {
+      case 'ui/notifications/tool-input':
+        context.toolInput = params.arguments || {};
+        window.dispatchEvent(new CustomEvent('tool:input', { detail: { arguments: context.toolInput } }));
+        break;
+      case 'ui/notifications/tool-input-partial':
+        // Streaming: merge partial input with existing
+        context.toolInput = Object.assign({}, context.toolInput, params.arguments || {});
+        window.dispatchEvent(new CustomEvent('tool:input-partial', { detail: { arguments: context.toolInput } }));
+        break;
+      case 'ui/notifications/tool-result':
+        context.toolOutput = params.content;
+        context.structuredContent = params.structuredContent;
+        context.notifyToolResult(params.content);
+        window.dispatchEvent(new CustomEvent('tool:result', { detail: params }));
+        break;
+      case 'ui/notifications/host-context-changed':
+        Object.assign(context.hostContext, params);
+        context.notifyContextChange(params);
+        break;
+      case 'ui/notifications/cancelled':
+        window.dispatchEvent(new CustomEvent('tool:cancelled', { detail: { reason: params.reason } }));
+        break;
+    }
+  },
+  isOriginTrusted: function(origin) {
+    if (this.trustedOrigins.length > 0) {
+      return this.trustedOrigins.indexOf(origin) !== -1;
+    }
+    // Trust-on-first-use: trust first message origin.
+    // SECURITY WARNING: For production, always configure trustedOrigins.
+    if (!this.trustedOrigin) {
+      // Guard against race condition where multiple messages arrive simultaneously
+      if (this.originTrustPending) {
+        return false;
+      }
+      if (window.parent !== window && origin) {
+        this.originTrustPending = true;
+        this.trustedOrigin = origin;
+        this.originTrustPending = false; // Reset after successful trust establishment
+        return true;
+      }
+      return false;
+    }
+    return this.trustedOrigin === origin;
+  },
+  sendRequest: function(method, params) {
+    var self = this;
+    return new Promise(function(resolve, reject) {
+      // Security: Require trusted origin before sending requests to prevent message leaks
+      if (!self.trustedOrigin && self.trustedOrigins.length === 0) {
+        reject(new Error('Cannot send request: no trusted origin established'));
+        return;
+      }
+
+      var id = ++self.requestId;
+      var timeout = setTimeout(function() {
+        delete self.pendingRequests[id];
+        reject(new Error('Request ' + method + ' timed out'));
+      }, 10000);
+
+      self.pendingRequests[id] = { resolve: resolve, reject: reject, timeout: timeout };
+
+      var targetOrigin = self.trustedOrigin || self.trustedOrigins[0];
+      window.parent.postMessage({ jsonrpc: '2.0', id: id, method: method, params: params }, targetOrigin);
+    });
+  },
+  performHandshake: function(context) {
+    var self = this;
+    var params = {
+      appInfo: { name: 'FrontMCP Widget', version: '1.0.0' },
+      appCapabilities: { tools: { listChanged: false } },
+      protocolVersion: '2024-11-05'
+    };
+
+    return this.sendRequest('ui/initialize', params).then(function(result) {
+      self.hostCapabilities = result.hostCapabilities || {};
+      self.capabilities = Object.assign({}, self.capabilities, {
+        canCallTools: Boolean(self.hostCapabilities.serverToolProxy),
+        canSendMessages: true,
+        canOpenLinks: Boolean(self.hostCapabilities.openLink),
+        supportsDisplayModes: true
+      });
+      if (result.hostContext) {
+        Object.assign(context.hostContext, result.hostContext);
+      }
+    });
+  },
+  callTool: function(context, name, args) {
+    if (!this.hostCapabilities.serverToolProxy) {
+      return Promise.reject(new Error('Server tool proxy not supported'));
+    }
+    return this.sendRequest('ui/callServerTool', { name: name, arguments: args });
+  },
+  sendMessage: function(context, content) {
+    return this.sendRequest('ui/message', { content: content });
+  },
+  openLink: function(context, url) {
+    if (!this.hostCapabilities.openLink) {
+      window.open(url, '_blank', 'noopener,noreferrer');
+      return Promise.resolve();
+    }
+    return this.sendRequest('ui/openLink', { url: url });
+  },
+  requestDisplayMode: function(context, mode) {
+    return this.sendRequest('ui/setDisplayMode', { mode: mode });
+  },
+  requestClose: function(context) {
+    return this.sendRequest('ui/close', {});
+  },
+  // Extended ext-apps methods (full specification)
+  updateModelContext: function(context, data, merge) {
+    if (!this.hostCapabilities.modelContextUpdate) {
+      return Promise.reject(new Error('Model context update not supported'));
+    }
+    return this.sendRequest('ui/updateModelContext', { context: data, merge: merge !== false });
+  },
+  log: function(context, level, message, data) {
+    if (!this.hostCapabilities.logging) {
+      // Fallback to console logging if host doesn't support it
+      var logFn = console[level] || console.log;
+      logFn('[Widget] ' + message, data);
+      return Promise.resolve();
+    }
+    return this.sendRequest('ui/log', { level: level, message: message, data: data });
+  },
+  registerTool: function(context, name, description, inputSchema) {
+    if (!this.hostCapabilities.widgetTools) {
+      return Promise.reject(new Error('Widget tool registration not supported'));
+    }
+    return this.sendRequest('ui/registerTool', { name: name, description: description, inputSchema: inputSchema });
+  },
+  unregisterTool: function(context, name) {
+    if (!this.hostCapabilities.widgetTools) {
+      return Promise.reject(new Error('Widget tool unregistration not supported'));
+    }
+    return this.sendRequest('ui/unregisterTool', { name: name });
   }
-  if (uiConfig.prefersBorder !== void 0) {
-    meta["ui/prefersBorder"] = uiConfig.prefersBorder;
-  }
-  if (uiConfig.sandboxDomain) {
-    meta["ui/domain"] = uiConfig.sandboxDomain;
+};
+`.trim();
+}
+function generateClaudeAdapter() {
+  return `
+var ClaudeAdapter = {
+  id: 'claude',
+  name: 'Claude (Anthropic)',
+  priority: 60,
+  capabilities: Object.assign({}, DEFAULT_CAPABILITIES, {
+    canCallTools: false,
+    canSendMessages: false,
+    canOpenLinks: true,
+    hasNetworkAccess: false,
+    supportsDisplayModes: false
+  }),
+  canHandle: function() {
+    if (typeof window === 'undefined') return false;
+
+    // If MCP Apps is enabled, let ext-apps adapter handle it
+    if (window.__mcpAppsEnabled) return false;
+    if (window.__mcpPlatform === 'ext-apps') return false;
+    if (window.__extAppsInitialized) return false;
+
+    // Legacy Claude detection
+    if (window.__mcpPlatform === 'claude') return true;
+    if (window.claude) return true;
+    if (window.__claudeArtifact) return true;
+    if (typeof location !== 'undefined') {
+      try {
+        var url = new URL(location.href);
+        var hostname = url.hostname.toLowerCase();
+        var isClaudeHost = hostname === 'claude.ai' || (hostname.length > 10 && hostname.slice(-10) === '.claude.ai');
+        var isAnthropicHost = hostname === 'anthropic.com' || (hostname.length > 14 && hostname.slice(-14) === '.anthropic.com');
+        if (isClaudeHost || isAnthropicHost) return true;
+      } catch (e) {
+        // If URL parsing fails, fall through
+      }
+    }
+    return false;
+  },
+  initialize: function(context) {
+    return Promise.resolve();
+  },
+  callTool: function() {
+    return Promise.reject(new Error('Tool calls not supported in Claude'));
+  },
+  sendMessage: function() {
+    return Promise.reject(new Error('Messages not supported in Claude'));
+  },
+  openLink: function(context, url) {
+    window.open(url, '_blank', 'noopener,noreferrer');
+    return Promise.resolve();
+  },
+  requestDisplayMode: function() {
+    return Promise.resolve();
+  },
+  requestClose: function() {
+    return Promise.resolve();
   }
-  return meta;
+};
+`.trim();
 }
-function buildExtAppsMeta(meta, uiConfig) {
-  meta["ui/mimeType"] = "text/html+mcp";
-  if (uiConfig.csp) {
-    const csp = {};
-    if (uiConfig.csp.connectDomains?.length) {
-      csp.connectDomains = uiConfig.csp.connectDomains;
+function generateGeminiAdapter() {
+  return `
+var GeminiAdapter = {
+  id: 'gemini',
+  name: 'Google Gemini',
+  priority: 40,
+  capabilities: Object.assign({}, DEFAULT_CAPABILITIES, {
+    canOpenLinks: true,
+    hasNetworkAccess: true
+  }),
+  canHandle: function() {
+    if (typeof window === 'undefined') return false;
+    if (window.__mcpPlatform === 'gemini') return true;
+    if (window.gemini) return true;
+    if (typeof location !== 'undefined') {
+      var href = location.href;
+      if (href.indexOf('gemini.google.com') !== -1 || href.indexOf('bard.google.com') !== -1) return true;
     }
-    if (uiConfig.csp.resourceDomains?.length) {
-      csp.resourceDomains = uiConfig.csp.resourceDomains;
+    return false;
+  },
+  initialize: function(context) {
+    if (window.gemini && window.gemini.ui && window.gemini.ui.getTheme) {
+      context.hostContext.theme = window.gemini.ui.getTheme() === 'dark' ? 'dark' : 'light';
     }
-    if (Object.keys(csp).length > 0) {
-      meta["ui/csp"] = csp;
+    return Promise.resolve();
+  },
+  callTool: function() {
+    return Promise.reject(new Error('Tool calls not supported in Gemini'));
+  },
+  sendMessage: function(context, content) {
+    if (window.gemini && window.gemini.ui && window.gemini.ui.sendMessage) {
+      return window.gemini.ui.sendMessage(content);
     }
-  }
-  if (uiConfig.displayMode) {
-    const mappedMode = DISPLAY_MODE_MAP[uiConfig.displayMode];
-    if (mappedMode) {
-      meta["ui/displayMode"] = mappedMode;
+    return Promise.reject(new Error('Messages not supported in Gemini'));
+  },
+  openLink: function(context, url) {
+    if (window.gemini && window.gemini.ui && window.gemini.ui.openLink) {
+      return window.gemini.ui.openLink(url);
     }
+    window.open(url, '_blank', 'noopener,noreferrer');
+    return Promise.resolve();
+  },
+  requestDisplayMode: function() {
+    return Promise.resolve();
+  },
+  requestClose: function() {
+    return Promise.resolve();
   }
-  if (uiConfig.prefersBorder !== void 0) {
-    meta["ui/prefersBorder"] = uiConfig.prefersBorder;
+};
+`.trim();
+}
+function generateGenericAdapter() {
+  return `
+var GenericAdapter = {
+  id: 'generic',
+  name: 'Generic Web',
+  priority: 0,
+  capabilities: Object.assign({}, DEFAULT_CAPABILITIES, {
+    canOpenLinks: true,
+    hasNetworkAccess: true
+  }),
+  canHandle: function() {
+    return typeof window !== 'undefined';
+  },
+  initialize: function(context) {
+    return Promise.resolve();
+  },
+  callTool: function() {
+    return Promise.reject(new Error('Tool calls not supported'));
+  },
+  sendMessage: function() {
+    return Promise.reject(new Error('Messages not supported'));
+  },
+  openLink: function(context, url) {
+    window.open(url, '_blank', 'noopener,noreferrer');
+    return Promise.resolve();
+  },
+  requestDisplayMode: function() {
+    return Promise.resolve();
+  },
+  requestClose: function() {
+    return Promise.resolve();
   }
-  if (uiConfig.sandboxDomain) {
-    meta["ui/domain"] = uiConfig.sandboxDomain;
+};
+`.trim();
+}
+function generatePlatformDetection(adapters) {
+  const adapterVars = adapters.map((a) => {
+    switch (a) {
+      case "openai":
+        return "OpenAIAdapter";
+      case "ext-apps":
+        return "ExtAppsAdapter";
+      case "claude":
+        return "ClaudeAdapter";
+      case "gemini":
+        return "GeminiAdapter";
+      case "generic":
+        return "GenericAdapter";
+      default:
+        return "";
+    }
+  }).filter(Boolean);
+  return `
+var ADAPTERS = [${adapterVars.join(", ")}].sort(function(a, b) { return b.priority - a.priority; });
+
+function detectPlatform() {
+  for (var i = 0; i < ADAPTERS.length; i++) {
+    if (ADAPTERS[i].canHandle()) {
+      log('Detected platform: ' + ADAPTERS[i].id);
+      return ADAPTERS[i];
+    }
   }
-  return meta;
+  log('No platform detected, using generic');
+  return GenericAdapter;
 }
-function buildToolDiscoveryMeta(options) {
-  const { uiConfig, platformType, staticWidgetUri } = options;
-  const meta = {};
-  switch (platformType) {
-    case "openai":
-      meta["openai/outputTemplate"] = staticWidgetUri;
-      meta["openai/resultCanProduceWidget"] = true;
-      if (uiConfig.widgetAccessible) {
-        meta["openai/widgetAccessible"] = true;
-      }
-      if (uiConfig.csp) {
-        meta["openai/widgetCSP"] = buildOpenAICSP(uiConfig.csp);
-      }
-      if (uiConfig.displayMode) {
-        meta["openai/displayMode"] = uiConfig.displayMode;
+`.trim();
+}
+function generateBridgeClass() {
+  return `
+function FrontMcpBridge() {
+  this._adapter = null;
+  this._initialized = false;
+  this._context = {
+    hostContext: {
+      theme: detectTheme(),
+      displayMode: 'inline',
+      locale: detectLocale(),
+      userAgent: detectUserAgent(),
+      safeArea: DEFAULT_SAFE_AREA,
+      viewport: detectViewport()
+    },
+    toolInput: {},
+    toolOutput: undefined,
+    structuredContent: undefined,
+    widgetState: {},
+    contextListeners: [],
+    toolResultListeners: [],
+    notifyContextChange: function(changes) {
+      Object.assign(this.hostContext, changes);
+      for (var i = 0; i < this.contextListeners.length; i++) {
+        try { this.contextListeners[i](changes); } catch(e) {}
       }
-      if (uiConfig.widgetDescription) {
-        meta["openai/widgetDescription"] = uiConfig.widgetDescription;
+    },
+    notifyToolResult: function(result) {
+      this.toolOutput = result;
+      for (var i = 0; i < this.toolResultListeners.length; i++) {
+        try { this.toolResultListeners[i](result); } catch(e) {}
       }
-      break;
-    case "generic-mcp":
-      meta["openai/outputTemplate"] = staticWidgetUri;
-      meta["openai/resultCanProduceWidget"] = true;
-      if (uiConfig.widgetAccessible) {
-        meta["openai/widgetAccessible"] = true;
+    }
+  };
+
+  var injected = readInjectedData();
+  this._context.toolInput = injected.toolInput;
+  this._context.toolOutput = injected.toolOutput;
+  this._context.structuredContent = injected.structuredContent;
+
+  this._loadWidgetState();
+}
+
+FrontMcpBridge.prototype._loadWidgetState = function() {
+  try {
+    var key = 'frontmcp:widget:' + (window.__mcpToolName || 'unknown');
+    var stored = localStorage.getItem(key);
+    if (stored) this._context.widgetState = JSON.parse(stored);
+  } catch(e) {}
+};
+
+FrontMcpBridge.prototype._saveWidgetState = function() {
+  try {
+    var key = 'frontmcp:widget:' + (window.__mcpToolName || 'unknown');
+    localStorage.setItem(key, JSON.stringify(this._context.widgetState));
+  } catch(e) {}
+};
+
+FrontMcpBridge.prototype.initialize = function() {
+  if (this._initialized) return Promise.resolve();
+  var self = this;
+  this._adapter = detectPlatform();
+  return this._adapter.initialize(this._context).then(function() {
+    self._initialized = true;
+    // Set up the data-tool-call click handler after initialization
+    self._setupDataToolCallHandler();
+  });
+};
+
+Object.defineProperty(FrontMcpBridge.prototype, 'initialized', { get: function() { return this._initialized; } });
+Object.defineProperty(FrontMcpBridge.prototype, 'adapterId', { get: function() { return this._adapter ? this._adapter.id : undefined; } });
+Object.defineProperty(FrontMcpBridge.prototype, 'capabilities', { get: function() { return this._adapter ? this._adapter.capabilities : DEFAULT_CAPABILITIES; } });
+
+FrontMcpBridge.prototype.getTheme = function() { return this._context.hostContext.theme; };
+FrontMcpBridge.prototype.getDisplayMode = function() { return this._context.hostContext.displayMode; };
+FrontMcpBridge.prototype.getToolInput = function() { return this._context.toolInput; };
+FrontMcpBridge.prototype.getToolOutput = function() { return this._context.toolOutput; };
+FrontMcpBridge.prototype.getStructuredContent = function() { return this._context.structuredContent; };
+FrontMcpBridge.prototype.getWidgetState = function() { return this._context.widgetState; };
+FrontMcpBridge.prototype.getHostContext = function() { return Object.assign({}, this._context.hostContext); };
+FrontMcpBridge.prototype.hasCapability = function(cap) { return this._adapter && this._adapter.capabilities[cap] === true; };
+
+// Get tool response metadata (platform-agnostic)
+// Used by inline mode widgets to detect when ui/html arrives
+FrontMcpBridge.prototype.getToolResponseMetadata = function() {
+  // OpenAI injects toolResponseMetadata for widget-producing tools
+  if (typeof window !== 'undefined' && window.openai && window.openai.toolResponseMetadata) {
+    return window.openai.toolResponseMetadata;
+  }
+  // Claude (future support)
+  if (typeof window !== 'undefined' && window.claude && window.claude.toolResponseMetadata) {
+    return window.claude.toolResponseMetadata;
+  }
+  // FrontMCP direct injection (for testing/ext-apps)
+  if (typeof window !== 'undefined' && window.__mcpToolResponseMetadata) {
+    return window.__mcpToolResponseMetadata;
+  }
+  return null;
+};
+
+// Subscribe to tool response metadata changes (for inline mode injection)
+FrontMcpBridge.prototype.onToolResponseMetadata = function(callback) {
+  var self = this;
+  var called = false;
+
+  // Check if already available
+  var existing = self.getToolResponseMetadata();
+  if (existing) {
+    called = true;
+    callback(existing);
+  }
+
+  // Set up property interceptors for OpenAI
+  if (typeof window !== 'undefined') {
+    // OpenAI: Intercept toolResponseMetadata assignment
+    if (!window.__frontmcpMetadataIntercepted) {
+      window.__frontmcpMetadataIntercepted = true;
+      window.__frontmcpMetadataCallbacks = [];
+
+      // Create openai object if it doesn't exist
+      if (!window.openai) window.openai = {};
+
+      var originalMetadata = window.openai.toolResponseMetadata;
+      Object.defineProperty(window.openai, 'toolResponseMetadata', {
+        get: function() { return originalMetadata; },
+        set: function(val) {
+          originalMetadata = val;
+          log('toolResponseMetadata set, notifying ' + window.__frontmcpMetadataCallbacks.length + ' listeners');
+          for (var i = 0; i < window.__frontmcpMetadataCallbacks.length; i++) {
+            try { window.__frontmcpMetadataCallbacks[i](val); } catch(e) {}
+          }
+        },
+        configurable: true
+      });
+    }
+
+    // Register callback wrapper (store reference for unsubscribe)
+    var wrapper = function(metadata) {
+      if (!called) {
+        called = true;
+        callback(metadata);
       }
-      if (uiConfig.csp) {
-        meta["openai/widgetCSP"] = buildOpenAICSP(uiConfig.csp);
+    };
+    window.__frontmcpMetadataCallbacks.push(wrapper);
+
+    // Return unsubscribe function that removes the wrapper (not the original callback)
+    return function() {
+      if (window.__frontmcpMetadataCallbacks) {
+        var idx = window.__frontmcpMetadataCallbacks.indexOf(wrapper);
+        if (idx !== -1) window.__frontmcpMetadataCallbacks.splice(idx, 1);
       }
-      break;
-    case "ext-apps":
-      meta["ui/resourceUri"] = staticWidgetUri;
-      meta["ui/mimeType"] = "text/html+mcp";
-      if (uiConfig.csp) {
-        const csp = {};
-        if (uiConfig.csp.connectDomains?.length) {
-          csp.connectDomains = uiConfig.csp.connectDomains;
+    };
+  }
+
+  // Return no-op unsubscribe for non-window environments
+  return function() {};
+};
+
+FrontMcpBridge.prototype.callTool = function(name, args) {
+  // Priority 1: Direct OpenAI SDK call (most reliable in OpenAI iframe)
+  // This bypasses adapter abstraction for maximum compatibility
+  if (typeof window !== 'undefined' && window.openai && typeof window.openai.callTool === 'function') {
+    log('callTool: Using OpenAI SDK directly');
+    return window.openai.callTool(name, args);
+  }
+
+  // Priority 2: Use adapter (if initialized and supports tool calls)
+  if (this._adapter && this._adapter.capabilities && this._adapter.capabilities.canCallTools) {
+    log('callTool: Using adapter ' + this._adapter.id);
+    return this._adapter.callTool(this._context, name, args);
+  }
+
+  // Not initialized or no tool support
+  if (!this._adapter) {
+    return Promise.reject(new Error('Bridge not initialized. Wait for bridge:ready event.'));
+  }
+  return Promise.reject(new Error('Tool calls not supported on this platform (' + this._adapter.id + ')'));
+};
+
+FrontMcpBridge.prototype.sendMessage = function(content) {
+  if (!this._adapter) return Promise.reject(new Error('Not initialized'));
+  return this._adapter.sendMessage(this._context, content);
+};
+
+FrontMcpBridge.prototype.openLink = function(url) {
+  if (!this._adapter) return Promise.reject(new Error('Not initialized'));
+  return this._adapter.openLink(this._context, url);
+};
+
+FrontMcpBridge.prototype.requestDisplayMode = function(mode) {
+  if (!this._adapter) return Promise.reject(new Error('Not initialized'));
+  var self = this;
+  return this._adapter.requestDisplayMode(this._context, mode).then(function() {
+    self._context.hostContext.displayMode = mode;
+  });
+};
+
+FrontMcpBridge.prototype.requestClose = function() {
+  if (!this._adapter) return Promise.reject(new Error('Not initialized'));
+  return this._adapter.requestClose(this._context);
+};
+
+// Extended ext-apps methods (full specification)
+FrontMcpBridge.prototype.updateModelContext = function(context, merge) {
+  if (!this._adapter) return Promise.reject(new Error('Not initialized'));
+  if (!this._adapter.updateModelContext) {
+    return Promise.reject(new Error('updateModelContext not supported on this platform'));
+  }
+  return this._adapter.updateModelContext(this._context, context, merge);
+};
+
+FrontMcpBridge.prototype.log = function(level, message, data) {
+  if (!this._adapter) return Promise.reject(new Error('Not initialized'));
+  if (!this._adapter.log) {
+    // Fallback to console
+    var logFn = console[level] || console.log;
+    logFn('[Widget] ' + message, data);
+    return Promise.resolve();
+  }
+  return this._adapter.log(this._context, level, message, data);
+};
+
+FrontMcpBridge.prototype.registerTool = function(name, description, inputSchema) {
+  if (!this._adapter) return Promise.reject(new Error('Not initialized'));
+  if (!this._adapter.registerTool) {
+    return Promise.reject(new Error('registerTool not supported on this platform'));
+  }
+  return this._adapter.registerTool(this._context, name, description, inputSchema);
+};
+
+FrontMcpBridge.prototype.unregisterTool = function(name) {
+  if (!this._adapter) return Promise.reject(new Error('Not initialized'));
+  if (!this._adapter.unregisterTool) {
+    return Promise.reject(new Error('unregisterTool not supported on this platform'));
+  }
+  return this._adapter.unregisterTool(this._context, name);
+};
+
+FrontMcpBridge.prototype.setWidgetState = function(state) {
+  Object.assign(this._context.widgetState, state);
+  this._saveWidgetState();
+};
+
+FrontMcpBridge.prototype.onContextChange = function(callback) {
+  var listeners = this._context.contextListeners;
+  listeners.push(callback);
+  return function() {
+    var idx = listeners.indexOf(callback);
+    if (idx !== -1) listeners.splice(idx, 1);
+  };
+};
+
+FrontMcpBridge.prototype.onToolResult = function(callback) {
+  var listeners = this._context.toolResultListeners;
+  listeners.push(callback);
+  return function() {
+    var idx = listeners.indexOf(callback);
+    if (idx !== -1) listeners.splice(idx, 1);
+  };
+};
+
+// ==================== data-tool-call Click Handler ====================
+
+FrontMcpBridge.prototype._setupDataToolCallHandler = function() {
+  var self = this;
+
+  document.addEventListener('click', function(e) {
+    // Find the closest element with data-tool-call attribute
+    var target = e.target;
+    while (target && target !== document) {
+      if (target.hasAttribute && target.hasAttribute('data-tool-call')) {
+        var toolName = target.getAttribute('data-tool-call');
+        var argsAttr = target.getAttribute('data-tool-args');
+        var args = {};
+
+        try {
+          if (argsAttr) {
+            args = JSON.parse(argsAttr);
+          }
+        } catch (parseErr) {
+          console.error('[frontmcp] Failed to parse data-tool-args:', parseErr);
         }
-        if (uiConfig.csp.resourceDomains?.length) {
-          csp.resourceDomains = uiConfig.csp.resourceDomains;
+
+        log('data-tool-call clicked: ' + toolName);
+
+        // Show loading state - save original content first
+        var originalContent = target.innerHTML;
+        var originalDisabled = target.disabled;
+        target.disabled = true;
+        target.classList.add('opacity-50', 'cursor-not-allowed');
+
+        // Add spinner for buttons
+        var spinner = '<svg class="animate-spin -ml-1 mr-2 h-4 w-4 inline" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>';
+        if (target.tagName === 'BUTTON') {
+          target.innerHTML = spinner + 'Loading...';
         }
-        if (Object.keys(csp).length > 0) {
-          meta["ui/csp"] = csp;
+
+        // Helper to reset button state
+        function resetButton() {
+          target.innerHTML = originalContent;
+          target.disabled = originalDisabled;
+          target.classList.remove('opacity-50', 'cursor-not-allowed');
         }
-      }
-      if (uiConfig.displayMode) {
-        const mappedMode = DISPLAY_MODE_MAP[uiConfig.displayMode];
-        if (mappedMode) {
-          meta["ui/displayMode"] = mappedMode;
+
+        // Determine how to call the tool
+        var toolCallPromise;
+
+        // Priority 1: Direct OpenAI SDK call (bypasses adapter abstraction)
+        if (typeof window !== 'undefined' && window.openai && typeof window.openai.callTool === 'function') {
+          log('Using OpenAI SDK directly for tool call');
+          toolCallPromise = window.openai.callTool(toolName, args);
+        }
+        // Priority 2: Use adapter (if it supports tool calls)
+        else if (self.hasCapability('canCallTools')) {
+          log('Using adapter for tool call');
+          toolCallPromise = self.callTool(toolName, args);
+        }
+        // No tool call capability
+        else {
+          console.error('[frontmcp] Tool calls not supported on this platform (' + self.adapterId + ')');
+          resetButton();
+          target.dispatchEvent(new CustomEvent('tool:error', {
+            detail: { name: toolName, args: args, error: 'Tool calls not supported on this platform' },
+            bubbles: true
+          }));
+          e.preventDefault();
+          return;
         }
+
+        // Handle the tool call result
+        toolCallPromise.then(function(result) {
+          log('Tool call succeeded: ' + toolName);
+          resetButton();
+
+          // Update bridge state to trigger widget re-render
+          // React isn't hydrated in OpenAI iframe, so useState doesn't work
+          // Instead, we use the bridge's reactive state system
+          if (result && window.__frontmcp && window.__frontmcp.bridge && typeof window.__frontmcp.bridge.setWidgetState === 'function') {
+            var newData = result.structuredContent || result;
+            log('Updating bridge state with new data');
+            window.__frontmcp.bridge.setWidgetState(newData);
+          }
+
+          // Dispatch success event
+          target.dispatchEvent(new CustomEvent('tool:success', {
+            detail: { name: toolName, args: args, result: result },
+            bubbles: true
+          }));
+        }).catch(function(err) {
+          console.error('[frontmcp] Tool call failed: ' + toolName, err);
+          resetButton();
+          // Dispatch error event
+          target.dispatchEvent(new CustomEvent('tool:error', {
+            detail: { name: toolName, args: args, error: err.message || err },
+            bubbles: true
+          }));
+        });
+
+        // Prevent default behavior (e.g., form submission)
+        e.preventDefault();
+        return;
       }
-      if (uiConfig.prefersBorder !== void 0) {
-        meta["ui/prefersBorder"] = uiConfig.prefersBorder;
+      target = target.parentElement;
+    }
+  }, true); // Use capture phase to handle before React handlers
+};
+`.trim();
+}
+var MAX_MINIFY_CODE_LENGTH = 5e5;
+function minifyJS(code) {
+  if (code.length > MAX_MINIFY_CODE_LENGTH) {
+    return code;
+  }
+  return code.replace(/\/\*[\s\S]*?\*\//g, "").replace(/(^|[^:])\/\/.*$/gm, "$1").replace(/\s+/g, " ").replace(/\s*([{};,:()[\]])\s*/g, "$1").replace(/;\}/g, "}").trim();
+}
+function generatePlatformBundle(platform, options = {}) {
+  const platformAdapters = {
+    chatgpt: ["openai", "generic"],
+    claude: ["claude", "generic"],
+    gemini: ["gemini", "generic"],
+    universal: ["openai", "ext-apps", "claude", "gemini", "generic"]
+  };
+  return generateBridgeIIFE({
+    ...options,
+    adapters: platformAdapters[platform]
+  });
+}
+var UNIVERSAL_BRIDGE_SCRIPT = generateBridgeIIFE();
+var BRIDGE_SCRIPT_TAGS = {
+  universal: `<script>${UNIVERSAL_BRIDGE_SCRIPT}</script>`,
+  chatgpt: `<script>${generatePlatformBundle("chatgpt")}</script>`,
+  claude: `<script>${generatePlatformBundle("claude")}</script>`,
+  gemini: `<script>${generatePlatformBundle("gemini")}</script>`
+};
+
+// libs/uipack/src/shell/custom-shell-types.ts
+var SHELL_PLACEHOLDER_NAMES = ["CSP", "DATA", "BRIDGE", "CONTENT", "TITLE"];
+var SHELL_PLACEHOLDERS = {
+  CSP: "{{CSP}}",
+  DATA: "{{DATA}}",
+  BRIDGE: "{{BRIDGE}}",
+  CONTENT: "{{CONTENT}}",
+  TITLE: "{{TITLE}}"
+};
+var REQUIRED_PLACEHOLDERS = ["CONTENT"];
+var OPTIONAL_PLACEHOLDERS = ["CSP", "DATA", "BRIDGE", "TITLE"];
+
+// libs/uipack/src/shell/custom-shell-validator.ts
+function validateShellTemplate(template) {
+  const found = {};
+  for (const name of SHELL_PLACEHOLDER_NAMES) {
+    found[name] = template.includes(SHELL_PLACEHOLDERS[name]);
+  }
+  const missingRequired = REQUIRED_PLACEHOLDERS.filter((name) => !found[name]);
+  const missingOptional = OPTIONAL_PLACEHOLDERS.filter((name) => !found[name]);
+  return {
+    valid: missingRequired.length === 0,
+    found,
+    missingRequired,
+    missingOptional
+  };
+}
+
+// libs/uipack/src/shell/custom-shell-applier.ts
+function applyShellTemplate(template, values) {
+  let result = template;
+  result = result.replaceAll(SHELL_PLACEHOLDERS.CSP, values.csp);
+  result = result.replaceAll(SHELL_PLACEHOLDERS.DATA, values.data);
+  result = result.replaceAll(SHELL_PLACEHOLDERS.BRIDGE, values.bridge);
+  result = result.replaceAll(SHELL_PLACEHOLDERS.CONTENT, values.content);
+  result = result.replaceAll(SHELL_PLACEHOLDERS.TITLE, values.title);
+  return result;
+}
+
+// libs/uipack/src/shell/builder.ts
+function buildShell(content, config) {
+  const { toolName, csp, withShell = true, input, output, structuredContent, includeBridge = true, title } = config;
+  const { customShell } = config;
+  const dataScript = buildDataInjectionScript({ toolName, input, output, structuredContent });
+  if (!withShell) {
+    const html2 = `${dataScript}
+${content}`;
+    return {
+      html: html2,
+      hash: simpleHash(html2),
+      size: Buffer.byteLength(html2, "utf-8")
+    };
+  }
+  if (customShell) {
+    return buildCustomShell(content, customShell, {
+      csp,
+      toolName,
+      input,
+      output,
+      structuredContent,
+      includeBridge,
+      title
+    });
+  }
+  const headParts = [
+    '<meta charset="UTF-8">',
+    '<meta name="viewport" content="width=device-width, initial-scale=1.0">'
+  ];
+  if (title) {
+    headParts.push(`<title>${escapeHtmlForTag(title)}</title>`);
+  }
+  headParts.push(buildCSPMetaTag(csp));
+  headParts.push(dataScript);
+  if (includeBridge) {
+    const bridgeScript = generateBridgeIIFE({ minify: true });
+    headParts.push(`<script>${bridgeScript}</script>`);
+  }
+  const html = `<!DOCTYPE html>
+<html lang="en">
+<head>
+${headParts.map((p) => `  ${p}`).join("\n")}
+</head>
+<body>
+${content}
+</body>
+</html>`;
+  return {
+    html,
+    hash: simpleHash(html),
+    size: Buffer.byteLength(html, "utf-8")
+  };
+}
+function buildCustomShell(content, customShell, ctx) {
+  let template;
+  if (typeof customShell === "string") {
+    const validation = validateShellTemplate(customShell);
+    if (!validation.valid) {
+      throw new Error(
+        `Custom shell template is missing required placeholder(s): ${validation.missingRequired.map((n) => `{{${n}}}`).join(", ")}`
+      );
+    }
+    template = customShell;
+  } else {
+    template = customShell.template;
+  }
+  const cspTag = buildCSPMetaTag(ctx.csp);
+  const dataScript = buildDataInjectionScript({
+    toolName: ctx.toolName,
+    input: ctx.input,
+    output: ctx.output,
+    structuredContent: ctx.structuredContent
+  });
+  let bridgeHtml = "";
+  if (ctx.includeBridge) {
+    const bridgeScript = generateBridgeIIFE({ minify: true });
+    bridgeHtml = `<script>${bridgeScript}</script>`;
+  }
+  const html = applyShellTemplate(template, {
+    csp: cspTag,
+    data: dataScript,
+    bridge: bridgeHtml,
+    content,
+    title: ctx.title ? escapeHtmlForTag(ctx.title) : ""
+  });
+  return {
+    html,
+    hash: simpleHash(html),
+    size: Buffer.byteLength(html, "utf-8")
+  };
+}
+function simpleHash(str) {
+  let hash = 0;
+  for (let i = 0; i < str.length; i++) {
+    const char = str.charCodeAt(i);
+    hash = (hash << 5) - hash + char | 0;
+  }
+  return Math.abs(hash).toString(16).padStart(8, "0");
+}
+function escapeHtmlForTag(str) {
+  return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+
+// libs/uipack/src/resolver/cdn-registry.ts
+var DEFAULT_CDN_REGISTRY = {
+  react: {
+    packageName: "react",
+    defaultVersion: "19.2.4",
+    providers: {
+      cloudflare: {
+        url: "https://cdnjs.cloudflare.com/ajax/libs/react/19.2.4/umd/react.production.min.js",
+        global: "React",
+        crossorigin: "anonymous"
+      },
+      jsdelivr: {
+        url: "https://cdn.jsdelivr.net/npm/react@19.2.4/umd/react.production.min.js",
+        global: "React",
+        crossorigin: "anonymous"
+      },
+      unpkg: {
+        url: "https://unpkg.com/react@19.2.4/umd/react.production.min.js",
+        global: "React",
+        crossorigin: "anonymous"
+      },
+      "esm.sh": {
+        url: "https://esm.sh/react@19.2.4",
+        esm: true,
+        crossorigin: "anonymous"
       }
-      if (uiConfig.sandboxDomain) {
-        meta["ui/domain"] = uiConfig.sandboxDomain;
+    },
+    preferredProviders: ["esm.sh", "cloudflare", "jsdelivr", "unpkg"],
+    metadata: {
+      description: "A JavaScript library for building user interfaces",
+      homepage: "https://react.dev",
+      license: "MIT"
+    }
+  },
+  "react-dom": {
+    packageName: "react-dom",
+    defaultVersion: "19.2.4",
+    providers: {
+      cloudflare: {
+        url: "https://cdnjs.cloudflare.com/ajax/libs/react-dom/19.2.4/umd/react-dom.production.min.js",
+        global: "ReactDOM",
+        crossorigin: "anonymous",
+        peerDependencies: ["react"]
+      },
+      jsdelivr: {
+        url: "https://cdn.jsdelivr.net/npm/react-dom@19.2.4/umd/react-dom.production.min.js",
+        global: "ReactDOM",
+        crossorigin: "anonymous",
+        peerDependencies: ["react"]
+      },
+      unpkg: {
+        url: "https://unpkg.com/react-dom@19.2.4/umd/react-dom.production.min.js",
+        global: "ReactDOM",
+        crossorigin: "anonymous",
+        peerDependencies: ["react"]
+      },
+      "esm.sh": {
+        url: "https://esm.sh/react-dom@19.2.4",
+        esm: true,
+        crossorigin: "anonymous",
+        peerDependencies: ["react"]
       }
-      break;
-    case "claude":
-      meta["ui/resourceUri"] = staticWidgetUri;
-      meta["ui/mimeType"] = "text/html+mcp";
-      if (uiConfig.displayMode) {
-        const mappedMode = DISPLAY_MODE_MAP[uiConfig.displayMode];
-        if (mappedMode) {
-          meta["ui/displayMode"] = mappedMode;
-        }
+    },
+    preferredProviders: ["esm.sh", "cloudflare", "jsdelivr", "unpkg"],
+    metadata: {
+      description: "React package for working with the DOM",
+      homepage: "https://react.dev",
+      license: "MIT"
+    }
+  },
+  "chart.js": {
+    packageName: "chart.js",
+    defaultVersion: "4.5.1",
+    providers: {
+      cloudflare: {
+        url: "https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.5.1/chart.umd.min.js",
+        global: "Chart",
+        crossorigin: "anonymous"
+      },
+      jsdelivr: {
+        url: "https://cdn.jsdelivr.net/npm/chart.js@4.5.1/dist/chart.umd.min.js",
+        global: "Chart",
+        crossorigin: "anonymous"
+      },
+      unpkg: {
+        url: "https://unpkg.com/chart.js@4.5.1/dist/chart.umd.min.js",
+        global: "Chart",
+        crossorigin: "anonymous"
       }
-      if (uiConfig.prefersBorder !== void 0) {
-        meta["ui/prefersBorder"] = uiConfig.prefersBorder;
+    },
+    preferredProviders: ["esm.sh", "cloudflare", "jsdelivr", "unpkg"],
+    metadata: {
+      description: "Simple yet flexible JavaScript charting library",
+      homepage: "https://www.chartjs.org",
+      license: "MIT"
+    }
+  },
+  d3: {
+    packageName: "d3",
+    defaultVersion: "7.9.0",
+    providers: {
+      cloudflare: {
+        url: "https://cdnjs.cloudflare.com/ajax/libs/d3/7.9.0/d3.min.js",
+        integrity: "sha512-vc58qvvBdrDR4etbxMdlTt4GBQk1qjvyORR2nrsPsFPyrs+/u5c3+1Ct6upOgdZoIl7eq6k3a1UPDSNAQi/32A==",
+        global: "d3",
+        crossorigin: "anonymous"
+      },
+      jsdelivr: {
+        url: "https://cdn.jsdelivr.net/npm/d3@7.9.0/dist/d3.min.js",
+        global: "d3",
+        crossorigin: "anonymous"
+      },
+      unpkg: {
+        url: "https://unpkg.com/d3@7.9.0/dist/d3.min.js",
+        global: "d3",
+        crossorigin: "anonymous"
       }
-      if (uiConfig.csp) {
-        const csp = {};
-        if (uiConfig.csp.connectDomains?.length) {
-          csp.connectDomains = uiConfig.csp.connectDomains;
-        }
-        if (uiConfig.csp.resourceDomains?.length) {
-          csp.resourceDomains = uiConfig.csp.resourceDomains;
-        }
-        if (Object.keys(csp).length > 0) {
-          meta["ui/csp"] = csp;
-        }
+    },
+    preferredProviders: ["esm.sh", "cloudflare", "jsdelivr", "unpkg"],
+    metadata: {
+      description: "Data-Driven Documents",
+      homepage: "https://d3js.org",
+      license: "ISC"
+    }
+  },
+  lodash: {
+    packageName: "lodash",
+    defaultVersion: "4.17.21",
+    providers: {
+      cloudflare: {
+        url: "https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js",
+        integrity: "sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==",
+        global: "_",
+        crossorigin: "anonymous"
+      },
+      jsdelivr: {
+        url: "https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js",
+        global: "_",
+        crossorigin: "anonymous"
+      },
+      unpkg: {
+        url: "https://unpkg.com/lodash@4.17.21/lodash.min.js",
+        global: "_",
+        crossorigin: "anonymous"
       }
-      break;
-    // Gemini, IDEs don't need discovery metadata
-    // They use inline HTML at call time
-    default:
-      break;
+    },
+    preferredProviders: ["esm.sh", "cloudflare", "jsdelivr", "unpkg"],
+    metadata: {
+      description: "A modern JavaScript utility library",
+      homepage: "https://lodash.com",
+      license: "MIT"
+    }
   }
-  return meta;
+};
+function lookupPackage(packageName, registry = DEFAULT_CDN_REGISTRY) {
+  return registry[packageName];
 }
 
-// libs/uipack/src/adapters/serving-mode.ts
-var PLATFORM_CAPABILITIES = {
-  openai: {
-    supportsWidgets: true,
-    useStructuredContent: true,
-    supportedModes: ["inline", "static", "hybrid", "direct-url", "custom-url"],
-    defaultMode: "inline"
-  },
-  "ext-apps": {
-    supportsWidgets: true,
-    useStructuredContent: true,
-    supportedModes: ["inline", "static", "hybrid", "direct-url", "custom-url"],
-    defaultMode: "inline"
-  },
-  claude: {
-    supportsWidgets: true,
-    useStructuredContent: true,
-    // Claude supports inline only (no resource fetching for static)
-    supportedModes: ["inline"],
-    defaultMode: "inline"
-  },
-  cursor: {
-    // Cursor (IDE) - similar to OpenAI, supports widgets
-    supportsWidgets: true,
-    useStructuredContent: true,
-    supportedModes: ["inline", "static", "hybrid", "direct-url", "custom-url"],
-    defaultMode: "inline"
-  },
-  continue: {
-    // Continue (IDE extension) - basic widget support
-    supportsWidgets: true,
-    useStructuredContent: true,
-    supportedModes: ["inline"],
-    defaultMode: "inline"
-  },
-  cody: {
-    // Sourcegraph Cody - basic widget support
-    supportsWidgets: true,
-    useStructuredContent: true,
-    supportedModes: ["inline"],
-    defaultMode: "inline"
-  },
-  "generic-mcp": {
-    // Generic MCP clients - assume widget support
-    supportsWidgets: true,
-    useStructuredContent: true,
-    supportedModes: ["inline", "static"],
-    defaultMode: "inline"
-  },
-  gemini: {
-    supportsWidgets: false,
-    useStructuredContent: false,
-    supportedModes: [],
-    defaultMode: "inline"
-    // Not used since supportsWidgets is false
-  },
-  unknown: {
-    // Unknown clients: assume widget support, return ui/html + text/html+mcp
-    // This allows generic MCP clients to receive and render widget UI
-    supportsWidgets: true,
-    useStructuredContent: true,
-    supportedModes: ["inline"],
-    defaultMode: "inline"
+// libs/uipack/src/resolver/import-parser.ts
+var IMPORT_PATTERNS = {
+  named: /import\s*\{([^}]+)\}\s*from\s*['"]([^'"]+)['"]/g,
+  default: /import\s+(\w+)\s+from\s*['"]([^'"]+)['"]/g,
+  namespace: /import\s*\*\s*as\s+(\w+)\s+from\s*['"]([^'"]+)['"]/g,
+  sideEffect: /import\s*['"]([^'"]+)['"]/g,
+  dynamic: /(?:await\s+)?import\s*\(\s*['"]([^'"]+)['"]\s*\)/g,
+  defaultAndNamed: /import\s+(\w+)\s*,\s*\{([^}]+)\}\s*from\s*['"]([^'"]+)['"]/g,
+  defaultAndNamespace: /import\s+(\w+)\s*,\s*\*\s*as\s+(\w+)\s+from\s*['"]([^'"]+)['"]/g,
+  reExport: /export\s*\{[^}]+\}\s*from\s*['"]([^'"]+)['"]/g,
+  reExportAll: /export\s*\*\s*from\s*['"]([^'"]+)['"]/g
+};
+function parseNamedImports(namedString) {
+  return namedString.split(",").map((s) => s.trim()).filter((s) => s.length > 0).map((s) => {
+    const asMatch = s.match(/^(\w+)\s+as\s+\w+$/);
+    return asMatch ? asMatch[1] : s;
+  });
+}
+function isRelativeImport(specifier) {
+  return specifier.startsWith("./") || specifier.startsWith("../") || specifier.startsWith("/");
+}
+function isExternalImport(specifier) {
+  return !isRelativeImport(specifier) && !specifier.startsWith("#");
+}
+function getPackageName(specifier) {
+  if (specifier.startsWith("@")) {
+    const parts = specifier.split("/");
+    if (parts.length >= 2) {
+      return `${parts[0]}/${parts[1]}`;
+    }
+    return specifier;
+  }
+  const firstSlash = specifier.indexOf("/");
+  return firstSlash === -1 ? specifier : specifier.slice(0, firstSlash);
+}
+function getLineNumber(source, index) {
+  let line = 1;
+  for (let i = 0; i < index && i < source.length; i++) {
+    if (source[i] === "\n") {
+      line++;
+    }
+  }
+  return line;
+}
+function getColumnNumber(source, index) {
+  let column = 0;
+  for (let i = index - 1; i >= 0 && source[i] !== "\n"; i--) {
+    column++;
+  }
+  return column;
+}
+function parseImports(source) {
+  const imports = [];
+  const seenStatements = /* @__PURE__ */ new Set();
+  const addImport = (imp) => {
+    const key = `${imp.type}:${imp.specifier}:${imp.statement}`;
+    if (!seenStatements.has(key)) {
+      seenStatements.add(key);
+      imports.push(imp);
+    }
+  };
+  let match;
+  const defaultAndNamedRegex = new RegExp(IMPORT_PATTERNS.defaultAndNamed.source, "g");
+  while ((match = defaultAndNamedRegex.exec(source)) !== null) {
+    const [statement, defaultName, namedString, specifier] = match;
+    addImport({
+      statement,
+      specifier,
+      type: "default",
+      defaultImport: defaultName,
+      namedImports: parseNamedImports(namedString),
+      line: getLineNumber(source, match.index),
+      column: getColumnNumber(source, match.index)
+    });
+  }
+  const defaultAndNamespaceRegex = new RegExp(IMPORT_PATTERNS.defaultAndNamespace.source, "g");
+  while ((match = defaultAndNamespaceRegex.exec(source)) !== null) {
+    const [statement, defaultName, namespaceName, specifier] = match;
+    addImport({
+      statement,
+      specifier,
+      type: "default",
+      defaultImport: defaultName,
+      namespaceImport: namespaceName,
+      line: getLineNumber(source, match.index),
+      column: getColumnNumber(source, match.index)
+    });
+  }
+  const namedRegex = new RegExp(IMPORT_PATTERNS.named.source, "g");
+  while ((match = namedRegex.exec(source)) !== null) {
+    const [statement, namedString, specifier] = match;
+    addImport({
+      statement,
+      specifier,
+      type: "named",
+      namedImports: parseNamedImports(namedString),
+      line: getLineNumber(source, match.index),
+      column: getColumnNumber(source, match.index)
+    });
+  }
+  const defaultRegex = new RegExp(IMPORT_PATTERNS.default.source, "g");
+  while ((match = defaultRegex.exec(source)) !== null) {
+    const [statement, defaultName, specifier] = match;
+    const afterMatch = source.slice(match.index + match[0].length - specifier.length - 2);
+    if (afterMatch.startsWith(",")) continue;
+    addImport({
+      statement,
+      specifier,
+      type: "default",
+      defaultImport: defaultName,
+      line: getLineNumber(source, match.index),
+      column: getColumnNumber(source, match.index)
+    });
+  }
+  const namespaceRegex = new RegExp(IMPORT_PATTERNS.namespace.source, "g");
+  while ((match = namespaceRegex.exec(source)) !== null) {
+    const [statement, namespaceName, specifier] = match;
+    addImport({
+      statement,
+      specifier,
+      type: "namespace",
+      namespaceImport: namespaceName,
+      line: getLineNumber(source, match.index),
+      column: getColumnNumber(source, match.index)
+    });
+  }
+  const sideEffectRegex = new RegExp(IMPORT_PATTERNS.sideEffect.source, "g");
+  while ((match = sideEffectRegex.exec(source)) !== null) {
+    const [statement, specifier] = match;
+    const beforeMatch = source.slice(Math.max(0, match.index - 50), match.index);
+    if (beforeMatch.includes("from")) continue;
+    addImport({
+      statement,
+      specifier,
+      type: "side-effect",
+      line: getLineNumber(source, match.index),
+      column: getColumnNumber(source, match.index)
+    });
+  }
+  const dynamicRegex = new RegExp(IMPORT_PATTERNS.dynamic.source, "g");
+  while ((match = dynamicRegex.exec(source)) !== null) {
+    const [statement, specifier] = match;
+    addImport({
+      statement,
+      specifier,
+      type: "dynamic",
+      line: getLineNumber(source, match.index),
+      column: getColumnNumber(source, match.index)
+    });
+  }
+  const reExportRegex = new RegExp(IMPORT_PATTERNS.reExport.source, "g");
+  while ((match = reExportRegex.exec(source)) !== null) {
+    const [statement, specifier] = match;
+    addImport({
+      statement,
+      specifier,
+      type: "named",
+      line: getLineNumber(source, match.index),
+      column: getColumnNumber(source, match.index)
+    });
+  }
+  const reExportAllRegex = new RegExp(IMPORT_PATTERNS.reExportAll.source, "g");
+  while ((match = reExportAllRegex.exec(source)) !== null) {
+    const [statement, specifier] = match;
+    addImport({
+      statement,
+      specifier,
+      type: "namespace",
+      line: getLineNumber(source, match.index),
+      column: getColumnNumber(source, match.index)
+    });
+  }
+  const externalImports = imports.filter((imp) => isExternalImport(imp.specifier));
+  const relativeImports = imports.filter((imp) => isRelativeImport(imp.specifier));
+  const externalPackages = [...new Set(externalImports.map((imp) => getPackageName(imp.specifier)))];
+  return {
+    imports,
+    externalImports,
+    relativeImports,
+    externalPackages
+  };
+}
+
+// libs/uipack/src/resolver/esm-sh.resolver.ts
+var DEFAULT_FALLBACK_CDN = "https://esm.sh";
+function createEsmShResolver(options = {}) {
+  const {
+    fallbackCdnBase = DEFAULT_FALLBACK_CDN,
+    registry = DEFAULT_CDN_REGISTRY,
+    providerOrder = ["esm.sh", "cloudflare", "jsdelivr", "unpkg"]
+  } = options;
+  return {
+    resolve(specifier, _context) {
+      if (specifier.startsWith("./") || specifier.startsWith("../") || specifier.startsWith("/")) {
+        return null;
+      }
+      if (specifier.startsWith("node:") || specifier.startsWith("#")) {
+        return null;
+      }
+      const pkgName = getPackageName(specifier);
+      const entry = lookupPackage(pkgName, registry);
+      if (entry) {
+        for (const provider of providerOrder) {
+          const config = entry.providers[provider];
+          if (config?.url) {
+            const subpath = specifier.slice(pkgName.length);
+            if (subpath && config.url.includes("esm.sh/")) {
+              return {
+                value: config.url + subpath,
+                type: "url",
+                integrity: config.integrity
+              };
+            }
+            if (subpath) {
+              return {
+                value: `${fallbackCdnBase}/${specifier}`,
+                type: "url"
+              };
+            }
+            if (config.global && !config.esm) {
+              return {
+                value: config.url,
+                type: "url",
+                integrity: config.integrity
+              };
+            }
+            return {
+              value: config.url,
+              type: "url",
+              integrity: config.integrity
+            };
+          }
+        }
+      }
+      return {
+        value: `${fallbackCdnBase}/${specifier}`,
+        type: "url"
+      };
+    }
+  };
+}
+
+// libs/uipack/src/component/types.ts
+function isNpmSource(source) {
+  return typeof source === "object" && source !== null && "npm" in source;
+}
+function isFileSource(source) {
+  return typeof source === "object" && source !== null && "file" in source;
+}
+function isImportSource(source) {
+  return typeof source === "object" && source !== null && "import" in source;
+}
+function isFunctionSource(source) {
+  return typeof source === "function";
+}
+
+// libs/uipack/src/component/transpiler.ts
+function bundleFileSource(source, filename, resolveDir, componentName) {
+  const esbuild = __require("esbuild");
+  const mountCode = `
+// --- Auto-generated mount ---
+import { createRoot } from 'react-dom/client';
+import { McpBridgeProvider } from '@frontmcp/ui/react';
+import React from 'react';
+const __root = document.getElementById('root');
+if (__root) {
+  createRoot(__root).render(
+    React.createElement(McpBridgeProvider, null,
+      React.createElement(${componentName})
+    )
+  );
+}`;
+  const loader = {
+    ".tsx": "tsx",
+    ".jsx": "jsx"
+  };
+  const stdinLoader = filename.endsWith(".tsx") ? "tsx" : "jsx";
+  try {
+    const result = esbuild.buildSync({
+      stdin: {
+        contents: source + "\n" + mountCode,
+        loader: stdinLoader,
+        resolveDir,
+        sourcefile: filename
+      },
+      bundle: true,
+      write: false,
+      format: "esm",
+      target: "es2020",
+      jsx: "transform",
+      jsxFactory: "React.createElement",
+      jsxFragment: "React.Fragment",
+      external: ["react", "react-dom"],
+      define: { "process.env.NODE_ENV": '"production"' },
+      platform: "browser",
+      treeShaking: true,
+      logLevel: "warning",
+      loader
+    });
+    return { code: result.outputFiles[0].text };
+  } catch (err) {
+    const message = err instanceof Error ? err.message : String(err);
+    throw new Error(
+      `Failed to bundle FileSource "${filename}": ${message}. Ensure workspace packages are built (e.g. nx build ui).`
+    );
   }
+}
+function extractDefaultExportName(code) {
+  let match = code.match(/export\s+default\s+(?:function|class)\s+(\w+)/);
+  if (match) return match[1];
+  match = code.match(/export\s+default\s+(\w+)\s*;/);
+  if (match) return match[1];
+  return null;
+}
+
+// libs/uipack/src/component/loader.ts
+var DEFAULT_META = {
+  mcpAware: false,
+  renderer: "auto"
 };
-function resolveServingMode(options) {
-  const { configuredMode = "auto", platformType } = options;
-  const capabilities = PLATFORM_CAPABILITIES[platformType] || PLATFORM_CAPABILITIES.unknown;
-  if (!capabilities.supportsWidgets) {
-    return {
-      effectiveMode: null,
-      useStructuredContent: false,
-      supportsUI: false,
-      reason: `Platform '${platformType}' does not support widget UI`
-    };
+function resolveUISource(source, options) {
+  const resolver = options?.resolver ?? createEsmShResolver();
+  if (isNpmSource(source)) {
+    return resolveNpmSource(source, resolver);
+  }
+  if (isImportSource(source)) {
+    return resolveImportSource(source);
   }
-  if (configuredMode === "auto") {
+  if (isFileSource(source)) {
+    return resolveFileSource(source);
+  }
+  if (isFunctionSource(source)) {
+    return resolveFunctionSource(source, options?.input, options?.output);
+  }
+  throw new Error("Unknown UISource type");
+}
+function resolveNpmSource(source, resolver) {
+  const specifier = source.version ? `${source.npm}@${source.version}` : source.npm;
+  const pkgName = getPackageName(source.npm);
+  const resolved = resolver.resolve(specifier);
+  const url = resolved?.value ?? `https://esm.sh/${specifier}`;
+  const peerDeps = [];
+  if (pkgName !== "react" && pkgName !== "react-dom") {
+    peerDeps.push("react", "react-dom");
+  }
+  return {
+    mode: "module",
+    url,
+    exportName: source.exportName ?? "default",
+    meta: { ...DEFAULT_META, renderer: "react" },
+    peerDependencies: peerDeps
+  };
+}
+function resolveImportSource(source) {
+  return {
+    mode: "module",
+    url: source.import,
+    exportName: source.exportName ?? "default",
+    meta: { ...DEFAULT_META },
+    peerDependencies: []
+  };
+}
+function resolveFileSource(source) {
+  const path = __require("path");
+  const ext = path.extname(source.file).toLowerCase();
+  if (ext === ".tsx" || ext === ".jsx") {
+    const fs = __require("fs");
+    const filePath = path.isAbsolute(source.file) ? source.file : path.resolve(process.cwd(), source.file);
+    const rawSource = fs.readFileSync(filePath, "utf-8");
+    const componentName = source.exportName || extractDefaultExportName(rawSource) || "Component";
+    const bundled = bundleFileSource(rawSource, source.file, path.dirname(filePath), componentName);
+    const parsed = parseImports(bundled.code);
     return {
-      effectiveMode: capabilities.defaultMode,
-      useStructuredContent: capabilities.useStructuredContent,
-      supportsUI: true,
-      reason: `Auto-selected '${capabilities.defaultMode}' for platform '${platformType}'`
+      mode: "module",
+      code: bundled.code,
+      imports: [...new Set(parsed.externalImports.map((i) => i.specifier))],
+      exportName: componentName,
+      meta: { mcpAware: true, renderer: "react" },
+      peerDependencies: source.peerDependencies || ["react", "react-dom"],
+      bundled: true
     };
   }
-  if (capabilities.supportedModes.includes(configuredMode)) {
+  if (source.inline) {
     return {
-      effectiveMode: configuredMode,
-      useStructuredContent: capabilities.useStructuredContent,
-      supportsUI: true,
-      reason: `Using configured mode '${configuredMode}' (supported by '${platformType}')`
+      mode: "inline",
+      html: `<!-- File source: ${source.file} (inline mode - content to be resolved at build time) -->`,
+      exportName: "default",
+      meta: { ...DEFAULT_META, renderer: "html" },
+      peerDependencies: []
     };
   }
   return {
-    effectiveMode: null,
-    useStructuredContent: false,
-    supportsUI: false,
-    reason: `Mode '${configuredMode}' not supported by platform '${platformType}'. Supported: ${capabilities.supportedModes.join(", ") || "none"}`
+    mode: "module",
+    url: source.file,
+    exportName: "default",
+    meta: { ...DEFAULT_META },
+    peerDependencies: []
   };
 }
-function isPlatformModeSupported(platformType, mode) {
-  const capabilities = PLATFORM_CAPABILITIES[platformType] || PLATFORM_CAPABILITIES.unknown;
-  if (mode === "auto") {
-    return capabilities.supportsWidgets;
+function resolveFunctionSource(source, input, output) {
+  const html = source(input, output);
+  return {
+    mode: "inline",
+    html,
+    exportName: "default",
+    meta: { mcpAware: false, renderer: "html" },
+    peerDependencies: []
+  };
+}
+function generateMountScript(resolved, propsMapping) {
+  if (resolved.mode !== "module" || !resolved.url) {
+    return "";
+  }
+  const componentImport = resolved.exportName === "default" ? `import Component from '${resolved.url}';` : `import { ${resolved.exportName} as Component } from '${resolved.url}';`;
+  if (resolved.meta.mcpAware) {
+    return `${componentImport}
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+createRoot(document.getElementById('root'))
+  .render(React.createElement(Component));`;
   }
-  return capabilities.supportedModes.includes(mode);
+  const propsCode = propsMapping ? generateMappedPropsCode(propsMapping) : "window.__mcpToolOutput";
+  return `${componentImport}
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+const output = window.__mcpToolOutput;
+const props = ${propsCode};
+createRoot(document.getElementById('root'))
+  .render(React.createElement(Component, props));`;
 }
-function getDefaultServingMode(platformType) {
-  const capabilities = PLATFORM_CAPABILITIES[platformType] || PLATFORM_CAPABILITIES.unknown;
-  return capabilities.supportsWidgets ? capabilities.defaultMode : null;
+function generateMappedPropsCode(mapping) {
+  const entries = Object.entries(mapping).map(([prop, path]) => {
+    const accessPath = path.split(".").map((part) => `[${safeJsonForScript(part)}]`).join("");
+    return `${safeJsonForScript(prop)}: output${accessPath}`;
+  }).join(", ");
+  return `({ ${entries} })`;
 }
-function platformUsesStructuredContent(platformType) {
-  const capabilities = PLATFORM_CAPABILITIES[platformType] || PLATFORM_CAPABILITIES.unknown;
-  return capabilities.useStructuredContent;
+
+// libs/uipack/src/resolver/import-map.ts
+function createImportMapFromResolved(resolved) {
+  const imports = {};
+  const integrity = {};
+  for (const [specifier, res] of Object.entries(resolved)) {
+    if (res.type === "url") {
+      imports[specifier] = res.value;
+      if (res.integrity) {
+        integrity[res.value] = res.integrity;
+      }
+    }
+  }
+  return {
+    imports,
+    integrity: Object.keys(integrity).length > 0 ? integrity : void 0
+  };
 }
-function platformSupportsWidgets(platformType) {
-  const capabilities = PLATFORM_CAPABILITIES[platformType] || PLATFORM_CAPABILITIES.unknown;
-  return capabilities.supportsWidgets;
+function generateImportMapScriptTag(map) {
+  const json = JSON.stringify(map, null, 2).replace(/<\//g, "<\\/");
+  return `<script type="importmap">
+${json}
+</script>`;
 }
 
-// libs/uipack/src/utils/index.ts
-import {
-  safeStringify,
-  escapeHtml,
-  escapeHtmlAttr,
-  escapeJsString,
-  escapeScriptClose,
-  safeJsonForScript
-} from "@frontmcp/utils";
+// libs/uipack/src/component/renderer.ts
+function renderComponent(config, shellConfig) {
+  const resolver = shellConfig.resolver ?? createEsmShResolver();
+  const resolved = resolveUISource(config.source, {
+    resolver,
+    input: shellConfig.input,
+    output: shellConfig.output
+  });
+  const mergedShellConfig = {
+    ...shellConfig,
+    withShell: config.withShell ?? shellConfig.withShell,
+    includeBridge: config.includeBridge ?? shellConfig.includeBridge,
+    customShell: config.customShell ?? shellConfig.customShell
+  };
+  if (resolved.mode === "inline") {
+    return buildShell(resolved.html ?? "", mergedShellConfig);
+  }
+  const content = buildModuleContent(resolved, resolver, config.props);
+  return buildShell(content, mergedShellConfig);
+}
+function buildModuleContent(resolved, resolver, propsMapping) {
+  const parts = [];
+  if (resolved.code && resolved.bundled) {
+    const importEntries = {};
+    for (const spec of resolved.imports || []) {
+      const depResolved = resolver.resolve(spec);
+      if (depResolved) {
+        importEntries[spec] = depResolved;
+      }
+    }
+    if (Object.keys(importEntries).length > 0) {
+      const importMap = createImportMapFromResolved(importEntries);
+      parts.push(generateImportMapScriptTag(importMap));
+    }
+    parts.push('<div id="root"></div>');
+    parts.push(`<script type="module">
+${resolved.code}
+</script>`);
+  } else if (resolved.code) {
+    const importEntries = {};
+    const allSpecifiers = /* @__PURE__ */ new Set([
+      ...resolved.imports || [],
+      "react-dom/client",
+      // needed by mount script
+      "@frontmcp/ui/react",
+      // needed for McpBridgeProvider
+      // React subpath entries needed by esm.sh externalized modules:
+      "react/jsx-runtime",
+      "react/jsx-dev-runtime",
+      "react-dom/server",
+      "react-dom/static"
+    ]);
+    const coreDeps = /* @__PURE__ */ new Set([
+      "react",
+      "react-dom",
+      "react-dom/client",
+      "react/jsx-runtime",
+      "react/jsx-dev-runtime",
+      "react-dom/server",
+      "react-dom/static"
+    ]);
+    for (const spec of allSpecifiers) {
+      const depResolved = resolver.resolve(spec);
+      if (depResolved) {
+        if (!coreDeps.has(spec) && depResolved.value?.includes("esm.sh")) {
+          importEntries[spec] = {
+            ...depResolved,
+            value: addExternalParam(depResolved.value, ["react", "react-dom"])
+          };
+        } else {
+          importEntries[spec] = depResolved;
+        }
+      }
+    }
+    if (importEntries["react-dom"] && !importEntries["react-dom/client"]) {
+      const rdc = resolver.resolve("react-dom/client");
+      if (rdc) importEntries["react-dom/client"] = rdc;
+    }
+    if (Object.keys(importEntries).length > 0) {
+      const importMap = createImportMapFromResolved(importEntries);
+      parts.push(generateImportMapScriptTag(importMap));
+    }
+    parts.push('<div id="root"></div>');
+    const mountCode = generateInlineMountCode(resolved.exportName);
+    parts.push(`<script type="module">
+${resolved.code}
+${mountCode}
+</script>`);
+  } else {
+    const importEntries = {};
+    for (const dep of resolved.peerDependencies) {
+      const depResolved = resolver.resolve(dep);
+      if (depResolved) {
+        importEntries[dep] = depResolved;
+      }
+    }
+    if (importEntries["react-dom"]) {
+      const reactDomClient = resolver.resolve("react-dom/client");
+      if (reactDomClient) {
+        importEntries["react-dom/client"] = reactDomClient;
+      }
+    }
+    if (Object.keys(importEntries).length > 0) {
+      const importMap = createImportMapFromResolved(importEntries);
+      parts.push(generateImportMapScriptTag(importMap));
+    }
+    parts.push('<div id="root"></div>');
+    const mountScript = generateMountScript(resolved, propsMapping);
+    if (mountScript) {
+      parts.push(`<script type="module">
+${mountScript}
+</script>`);
+    }
+  }
+  return parts.join("\n");
+}
+function addExternalParam(url, externals) {
+  const sep = url.includes("?") ? "&" : "?";
+  return `${url}${sep}external=${externals.join(",")}`;
+}
+function generateInlineMountCode(componentName) {
+  return `
+// --- Mount ---
+import { createRoot as __createRoot } from 'react-dom/client';
+import { McpBridgeProvider as __McpBridgeProvider } from '@frontmcp/ui/react';
+const __root = document.getElementById('root');
+if (__root) {
+  __createRoot(__root).render(
+    React.createElement(__McpBridgeProvider, null,
+      React.createElement(${componentName})
+    )
+  );
+}`;
+}
 
-// libs/uipack/src/adapters/response-builder.ts
-function buildToolResponseContent(options) {
-  const { rawOutput, htmlContent, servingMode, useStructuredContent, platformType } = options;
-  if (servingMode === "static") {
-    return {
-      content: [{ type: "text", text: safeStringify(rawOutput) }],
-      structuredContent: useStructuredContent ? rawOutput : void 0,
-      contentCleared: false,
-      format: "json-only"
-    };
+// libs/uipack/src/adapters/type-detector.ts
+function detectUIType(template) {
+  if (template === null || template === void 0) {
+    return "auto";
   }
-  if (servingMode === "hybrid") {
-    return {
-      content: [{ type: "text", text: safeStringify(rawOutput) }],
-      structuredContent: useStructuredContent ? rawOutput : void 0,
-      contentCleared: false,
-      format: "json-only"
-    };
+  if (typeof template === "object" && template !== null && "file" in template) {
+    const file = template.file;
+    if (/\.(tsx|jsx)$/i.test(file)) return "react";
   }
-  if (useStructuredContent) {
-    if (htmlContent) {
-      const htmlInContent = platformType === "openai" || platformType === "ext-apps";
-      if (htmlInContent) {
-        return {
-          content: [{ type: "text", text: htmlContent }],
-          structuredContent: rawOutput,
-          contentCleared: false,
-          format: "structured-content"
-        };
-      } else {
-        return {
-          content: [{ type: "text", text: safeStringify(rawOutput) }],
-          structuredContent: rawOutput,
-          contentCleared: false,
-          format: "structured-content"
-        };
+  if (typeof template === "function") {
+    const proto = template.prototype;
+    if (proto && typeof proto.render === "function") {
+      return "react";
+    }
+    const asRecord = template;
+    if (asRecord["$$typeof"] !== void 0) {
+      return "react";
+    }
+    if (template.name && /^[A-Z]/.test(template.name)) {
+      return "react";
+    }
+    return "html";
+  }
+  if (typeof template === "string") {
+    if (template.includes("<") && template.includes(">")) {
+      return "html";
+    }
+    return "markdown";
+  }
+  return "auto";
+}
+
+// libs/uipack/src/adapters/content-detector.ts
+var CHART_TYPES = /* @__PURE__ */ new Set(["bar", "line", "pie", "area", "scatter", "doughnut", "radar", "polarArea", "bubble"]);
+var MERMAID_PREFIXES = [
+  "flowchart",
+  "graph",
+  "sequenceDiagram",
+  "classDiagram",
+  "stateDiagram",
+  "erDiagram",
+  "gantt",
+  "pie",
+  "gitGraph",
+  "journey",
+  "mindmap",
+  "timeline",
+  "quadrantChart",
+  "sankey",
+  "xychart"
+];
+var PDF_MAGIC = "JVBERi";
+function detectContentType(value) {
+  if (value === null || value === void 0) {
+    return "text";
+  }
+  if (typeof value === "object" && !Array.isArray(value)) {
+    const obj = value;
+    if (typeof obj["type"] === "string" && CHART_TYPES.has(obj["type"])) {
+      return "chart";
+    }
+    return "json";
+  }
+  if (typeof value === "string") {
+    const trimmed = value.trimStart();
+    if (trimmed.startsWith(PDF_MAGIC)) {
+      return "pdf";
+    }
+    for (const prefix of MERMAID_PREFIXES) {
+      if (trimmed.startsWith(prefix)) {
+        return "mermaid";
       }
     }
-    return {
-      content: [{ type: "text", text: safeStringify(rawOutput) }],
-      structuredContent: rawOutput,
-      contentCleared: false,
-      format: "json-only"
-    };
+    if (trimmed.includes("<") && trimmed.includes(">")) {
+      return "html";
+    }
+    return "text";
   }
-  const supportsWidgets = platformSupportsWidgets(platformType);
-  if (supportsWidgets) {
-    return {
-      content: [],
-      contentCleared: true,
-      format: "widget"
-    };
+  return "text";
+}
+
+// libs/uipack/src/adapters/content-renderers.ts
+var CHART_JS_CDN = "https://esm.sh/chart.js@4/auto";
+var MERMAID_CDN = "https://esm.sh/mermaid@11/dist/mermaid.esm.min.mjs";
+function buildChartHtml(chartJson) {
+  const chartData = safeJsonForScript(chartJson);
+  const content = `
+<canvas id="chart" style="max-width:100%;max-height:80vh;"></canvas>
+<script type="module">
+import Chart from '${CHART_JS_CDN}';
+const ctx = document.getElementById('chart').getContext('2d');
+new Chart(ctx, ${chartData});
+</script>`;
+  const result = buildShell(content, {
+    toolName: "chart",
+    csp: {
+      resourceDomains: ["https://esm.sh"],
+      connectDomains: ["https://esm.sh"]
+    },
+    includeBridge: false
+  });
+  return result.html;
+}
+function buildMermaidHtml(mermaidCode) {
+  const escaped = escapeHtml(mermaidCode);
+  const content = `
+<pre class="mermaid">${escaped}</pre>
+<script type="module">
+import mermaid from '${MERMAID_CDN}';
+mermaid.initialize({ startOnLoad: true, theme: 'default' });
+</script>`;
+  const result = buildShell(content, {
+    toolName: "mermaid",
+    csp: {
+      resourceDomains: ["https://esm.sh"],
+      connectDomains: ["https://esm.sh"]
+    },
+    includeBridge: false
+  });
+  return result.html;
+}
+function buildPdfHtml(base64) {
+  const content = `
+<div id="pdf-container" style="width:100%;overflow:auto;text-align:center;"></div>
+<script type="module">
+import * as pdfjsLib from 'https://esm.sh/pdfjs-dist@4/build/pdf.min.mjs';
+pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://esm.sh/pdfjs-dist@4/build/pdf.worker.min.mjs';
+
+const base64 = ${JSON.stringify(base64)};
+const binaryStr = atob(base64);
+const bytes = new Uint8Array(binaryStr.length);
+for (let i = 0; i < binaryStr.length; i++) bytes[i] = binaryStr.charCodeAt(i);
+
+const pdf = await pdfjsLib.getDocument({ data: bytes }).promise;
+const container = document.getElementById('pdf-container');
+for (let i = 1; i <= pdf.numPages; i++) {
+  const page = await pdf.getPage(i);
+  const viewport = page.getViewport({ scale: 1.5 });
+  const canvas = document.createElement('canvas');
+  canvas.width = viewport.width;
+  canvas.height = viewport.height;
+  canvas.style.marginBottom = '8px';
+  container.appendChild(canvas);
+  await page.render({ canvasContext: canvas.getContext('2d'), viewport }).promise;
+}
+</script>`;
+  const result = buildShell(content, {
+    toolName: "pdf",
+    csp: {
+      resourceDomains: ["https://esm.sh"],
+      connectDomains: ["https://esm.sh"]
+    },
+    includeBridge: false
+  });
+  return result.html;
+}
+function wrapDetectedContent(value) {
+  const contentType = detectContentType(value);
+  switch (contentType) {
+    case "chart":
+      return buildChartHtml(value);
+    case "mermaid":
+      return buildMermaidHtml(value);
+    case "pdf":
+      return buildPdfHtml(value);
+    case "html":
+      return void 0;
+    default:
+      return void 0;
   }
-  if (htmlContent) {
-    return {
-      content: [
-        {
-          type: "text",
-          text: `## Data
-\`\`\`json
-${safeStringify(
-            rawOutput,
-            2
-          )}
-\`\`\`
-
-## Visual Template (for artifact rendering)
-\`\`\`html
-${htmlContent}
-\`\`\``
+}
+
+// libs/uipack/src/adapters/template-renderer.ts
+function renderToolTemplate(options) {
+  const { toolName, input, output, template, platformType, resolver } = options;
+  const uiType = detectUIType(template);
+  const shellConfig = {
+    toolName,
+    input,
+    output,
+    includeBridge: true,
+    resolver
+  };
+  let html;
+  let hash = "";
+  let size = 0;
+  if (typeof template === "object" && template !== null && "file" in template) {
+    const cspResourceDomains = ["https://esm.sh"];
+    const cspConnectDomains = ["https://esm.sh"];
+    if (resolver && "overrides" in resolver) {
+      const overrides = resolver.overrides;
+      if (overrides) {
+        for (const url of Object.values(overrides)) {
+          try {
+            const origin = new URL(url).origin;
+            if (!cspResourceDomains.includes(origin)) cspResourceDomains.push(origin);
+            if (!cspConnectDomains.includes(origin)) cspConnectDomains.push(origin);
+          } catch {
+          }
         }
-      ],
-      contentCleared: false,
-      format: "markdown"
+      }
+    }
+    const cspConfig = {
+      resourceDomains: cspResourceDomains,
+      connectDomains: cspConnectDomains
     };
+    const result = renderComponent({ source: template }, { ...shellConfig, csp: cspConfig });
+    html = result.html;
+    hash = result.hash;
+    size = result.size;
+  } else if (typeof template === "function") {
+    if (uiType === "react") {
+      const shellResult = buildShell('<div id="root"></div>', shellConfig);
+      html = shellResult.html;
+      hash = shellResult.hash;
+      size = shellResult.size;
+    } else {
+      const helpers = createTemplateHelpers();
+      const ctx = { input, output, helpers };
+      const rawResult = template(ctx);
+      const wrapped = wrapDetectedContent(rawResult);
+      if (wrapped) {
+        html = wrapped;
+      } else {
+        const textContent = typeof rawResult === "string" ? rawResult : `<pre>${JSON.stringify(rawResult, null, 2)}</pre>`;
+        const shellResult = buildShell(textContent, shellConfig);
+        html = shellResult.html;
+        hash = shellResult.hash;
+        size = shellResult.size;
+      }
+    }
+  } else if (typeof template === "string") {
+    const shellResult = buildShell(template, shellConfig);
+    html = shellResult.html;
+    hash = shellResult.hash;
+    size = shellResult.size;
+  } else {
+    const shellResult = buildShell('<div id="root"></div>', shellConfig);
+    html = shellResult.html;
+    hash = shellResult.hash;
+    size = shellResult.size;
+  }
+  const htmlKey = "ui/html";
+  const meta = {
+    [htmlKey]: html,
+    "ui/type": uiType,
+    "ui/mimeType": MCP_APPS_MIME_TYPE
+  };
+  return {
+    html,
+    uiType,
+    hash,
+    size: size || Buffer.byteLength(html, "utf8"),
+    meta
+  };
+}
+
+// libs/uipack/src/adapters/base-template.ts
+function createDefaultBaseTemplate(options) {
+  const { toolName } = options;
+  const bridgeScript = `<script>${generateBridgeIIFE({ minify: true })}</script>`;
+  const content = `
+${bridgeScript}
+<div id="root">
+  <div style="font-family:system-ui,sans-serif;padding:1rem;color:#374151;">
+    <p style="color:#6b7280;font-size:0.875rem;">Waiting for tool output...</p>
+    <p style="color:#9ca3af;font-size:0.75rem;">Tool: <code>${toolName}</code></p>
+  </div>
+</div>
+<script>
+(function() {
+  var bridge = window.FrontMcpBridge;
+  if (bridge && typeof bridge.onToolResult === 'function') {
+    bridge.onToolResult(function(data) {
+      var root = document.getElementById('root');
+      if (root && data) {
+        root.innerHTML = '<pre style="font-family:monospace;white-space:pre-wrap;padding:1rem;">' +
+          JSON.stringify(data, null, 2).replace(/</g, '&lt;').replace(/>/g, '&gt;') +
+          '</pre>';
+      }
+    });
+  }
+})();
+</script>`;
+  const result = buildShell(content, {
+    toolName,
+    includeBridge: false,
+    // Bridge already included via inline script above
+    title: `Widget: ${toolName}`
+  });
+  return result.html;
+}
+
+// libs/uipack/src/adapters/cdn-info.ts
+var ESM_SH_BASE = "https://esm.sh";
+var REACT_DEPS = [
+  { name: "react", url: `${ESM_SH_BASE}/react@18` },
+  { name: "react-dom", url: `${ESM_SH_BASE}/react-dom@18` }
+];
+function buildCDNInfoForUIType(uiType) {
+  const deps = [];
+  switch (uiType) {
+    case "react":
+      deps.push(...REACT_DEPS);
+      break;
+    case "mdx":
+      deps.push(...REACT_DEPS);
+      deps.push({ name: "marked", url: `${ESM_SH_BASE}/marked@latest` });
+      break;
+    case "markdown":
+      deps.push({ name: "marked", url: `${ESM_SH_BASE}/marked@latest` });
+      break;
+    case "auto":
+      deps.push(...REACT_DEPS);
+      deps.push({ name: "marked", url: `${ESM_SH_BASE}/marked@latest` });
+      break;
+    case "html":
+    default:
+      break;
   }
   return {
-    content: [{ type: "text", text: safeStringify(rawOutput, 2) }],
-    contentCleared: false,
-    format: "json-only"
+    base: ESM_SH_BASE,
+    dependencies: deps
   };
 }
 export {
-  buildFrontMCPCSP,
-  buildOpenAICSP,
-  buildToolDiscoveryMeta,
+  MCP_APPS_EXTENSION_ID,
+  MCP_APPS_MIME_TYPE,
+  buildCDNInfoForUIType,
+  buildChartHtml,
+  buildMermaidHtml,
+  buildPdfHtml,
   buildToolResponseContent,
-  buildUIMeta,
-  getDefaultServingMode,
-  getExtAppsMimeType,
-  isExtAppsMimeType,
-  isPlatformModeSupported,
-  platformSupportsWidgets,
-  platformUsesStructuredContent,
-  resolveServingMode
+  createDefaultBaseTemplate,
+  detectContentType,
+  detectUIType,
+  isUIRenderFailure,
+  renderToolTemplate,
+  resolveServingMode,
+  wrapDetectedContent
 };