@frontmcp/sdk 0.6.0 → 0.6.2

package/mcp-apps/index.js

@@ -0,0 +1,799 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// libs/sdk/src/mcp-apps/index.ts
+var mcp_apps_exports = {};
+__export(mcp_apps_exports, {
+  DEFAULT_CSP_DIRECTIVES: () => DEFAULT_CSP_DIRECTIVES,
+  DEFAULT_PROTOCOL_VERSION: () => DEFAULT_PROTOCOL_VERSION,
+  DeviceCapabilitiesSchema: () => DeviceCapabilitiesSchema,
+  EXTENDED_SANDBOX_PERMISSIONS: () => EXTENDED_SANDBOX_PERMISSIONS,
+  JsonRpcErrorSchema: () => JsonRpcErrorSchema,
+  JsonRpcNotificationSchema: () => JsonRpcNotificationSchema,
+  JsonRpcRequestSchema: () => JsonRpcRequestSchema,
+  JsonRpcResponseSchema: () => JsonRpcResponseSchema,
+  MCP_APPS_METHODS: () => MCP_APPS_METHODS,
+  MCP_APPS_MIME_TYPE: () => MCP_APPS_MIME_TYPE,
+  MCP_APPS_PROTOCOL_VERSION: () => MCP_APPS_PROTOCOL_VERSION,
+  McpAppsCSPSchema: () => McpAppsCSPSchema,
+  McpAppsDisplayModeSchema: () => McpAppsDisplayModeSchema,
+  McpAppsExtensionCapabilitySchema: () => McpAppsExtensionCapabilitySchema,
+  McpAppsHostContextSchema: () => McpAppsHostContextSchema,
+  McpAppsMimeTypeSchema: () => McpAppsMimeTypeSchema,
+  McpAppsPlatformSchema: () => McpAppsPlatformSchema,
+  McpUiHostContextChangeParamsSchema: () => McpUiHostContextChangeParamsSchema,
+  McpUiInitializeParamsSchema: () => McpUiInitializeParamsSchema,
+  McpUiInitializeResultSchema: () => McpUiInitializeResultSchema,
+  McpUiMessageParamsSchema: () => McpUiMessageParamsSchema,
+  McpUiOpenLinkParamsSchema: () => McpUiOpenLinkParamsSchema,
+  McpUiSizeChangeParamsSchema: () => McpUiSizeChangeParamsSchema,
+  McpUiToolCancelledParamsSchema: () => McpUiToolCancelledParamsSchema,
+  McpUiToolInputParamsSchema: () => McpUiToolInputParamsSchema,
+  McpUiToolInputPartialParamsSchema: () => McpUiToolInputPartialParamsSchema,
+  McpUiToolResultParamsSchema: () => McpUiToolResultParamsSchema,
+  SANDBOX_PERMISSIONS: () => SANDBOX_PERMISSIONS,
+  SafeAreaInsetsSchema: () => SafeAreaInsetsSchema,
+  ThemeSchema: () => ThemeSchema,
+  ToolInfoSchema: () => ToolInfoSchema,
+  ToolUIMetaSchema: () => ToolUIMetaSchema,
+  UIResourceMetaSchema: () => UIResourceMetaSchema,
+  UIResourceSchema: () => UIResourceSchema,
+  ViewportInfoSchema: () => ViewportInfoSchema,
+  buildCSPDirectives: () => buildCSPDirectives,
+  buildCSPHeader: () => buildCSPHeader,
+  buildCSPMetaTag: () => buildCSPMetaTag,
+  buildSandboxAttribute: () => buildSandboxAttribute,
+  createSimpleMcpAppsTemplate: () => createSimpleMcpAppsTemplate,
+  extractBodyContent: () => extractBodyContent,
+  generateMcpAppsTemplate: () => generateMcpAppsTemplate,
+  isDomainAllowed: () => isDomainAllowed,
+  isValidProtocolVersion: () => isValidProtocolVersion,
+  isValidUIResourceUri: () => isValidUIResourceUri,
+  mergeCSP: () => mergeCSP,
+  parseCSPHeader: () => parseCSPHeader,
+  parseHostContext: () => parseHostContext,
+  parseUIResource: () => parseUIResource,
+  wrapInMcpAppsTemplate: () => wrapInMcpAppsTemplate
+});
+module.exports = __toCommonJS(mcp_apps_exports);
+
+// libs/sdk/src/mcp-apps/types.ts
+var MCP_APPS_MIME_TYPE = "text/html+mcp";
+var MCP_APPS_METHODS = {
+  // Lifecycle
+  INITIALIZE: "ui/initialize",
+  INITIALIZED: "ui/notifications/initialized",
+  // Tool lifecycle notifications (Host → UI)
+  TOOL_INPUT: "ui/notifications/tool-input",
+  TOOL_INPUT_PARTIAL: "ui/notifications/tool-input-partial",
+  TOOL_RESULT: "ui/notifications/tool-result",
+  TOOL_CANCELLED: "ui/notifications/tool-cancelled",
+  // Context notifications (Host → UI)
+  SIZE_CHANGE: "ui/notifications/size-change",
+  HOST_CONTEXT_CHANGE: "ui/host-context-change",
+  RESOURCE_TEARDOWN: "ui/resource-teardown",
+  // UI Requests (UI → Host)
+  OPEN_LINK: "ui/open-link",
+  MESSAGE: "ui/message",
+  // Standard MCP methods that UI can use
+  TOOLS_CALL: "tools/call",
+  RESOURCES_READ: "resources/read",
+  NOTIFICATIONS_MESSAGE: "notifications/message",
+  PING: "ping",
+  // Sandbox proxy (web hosts only)
+  SANDBOX_READY: "ui/notifications/sandbox-ready",
+  SANDBOX_RESOURCE_READY: "ui/notifications/sandbox-resource-ready"
+};
+var MCP_APPS_PROTOCOL_VERSION = "2025-01-01";
+
+// libs/sdk/src/mcp-apps/schemas.ts
+var import_zod = require("zod");
+var McpAppsMimeTypeSchema = import_zod.z.literal(MCP_APPS_MIME_TYPE);
+var McpAppsDisplayModeSchema = import_zod.z.enum(["inline", "fullscreen", "pip"]);
+var McpAppsPlatformSchema = import_zod.z.enum(["web", "desktop", "mobile"]);
+var ThemeSchema = import_zod.z.enum(["light", "dark"]);
+var McpAppsCSPSchema = import_zod.z.object({
+  connectDomains: import_zod.z.array(import_zod.z.string().url()).optional(),
+  resourceDomains: import_zod.z.array(import_zod.z.string().url()).optional()
+}).strict();
+var UIResourceMetaSchema = import_zod.z.object({
+  csp: McpAppsCSPSchema.optional(),
+  domain: import_zod.z.string().optional(),
+  prefersBorder: import_zod.z.boolean().optional()
+}).strict();
+var UIResourceSchema = import_zod.z.object({
+  uri: import_zod.z.string().startsWith("ui://"),
+  name: import_zod.z.string().min(1),
+  description: import_zod.z.string().optional(),
+  mimeType: McpAppsMimeTypeSchema,
+  _meta: import_zod.z.object({
+    ui: UIResourceMetaSchema.optional()
+  }).optional()
+}).strict();
+var DeviceCapabilitiesSchema = import_zod.z.object({
+  touch: import_zod.z.boolean().optional(),
+  hover: import_zod.z.boolean().optional()
+}).strict();
+var SafeAreaInsetsSchema = import_zod.z.object({
+  top: import_zod.z.number(),
+  right: import_zod.z.number(),
+  bottom: import_zod.z.number(),
+  left: import_zod.z.number()
+}).strict();
+var ViewportInfoSchema = import_zod.z.object({
+  width: import_zod.z.number().positive(),
+  height: import_zod.z.number().positive(),
+  maxHeight: import_zod.z.number().positive().optional(),
+  maxWidth: import_zod.z.number().positive().optional()
+}).strict();
+var ToolInfoSchema = import_zod.z.object({
+  id: import_zod.z.union([import_zod.z.string(), import_zod.z.number()]).optional(),
+  tool: import_zod.z.object({
+    name: import_zod.z.string().min(1),
+    description: import_zod.z.string().optional(),
+    inputSchema: import_zod.z.record(import_zod.z.string(), import_zod.z.unknown()).optional()
+  })
+}).strict();
+var McpAppsHostContextSchema = import_zod.z.object({
+  toolInfo: ToolInfoSchema.optional(),
+  theme: ThemeSchema.optional(),
+  displayMode: McpAppsDisplayModeSchema.optional(),
+  viewport: ViewportInfoSchema.optional(),
+  locale: import_zod.z.string().optional(),
+  timeZone: import_zod.z.string().optional(),
+  platform: McpAppsPlatformSchema.optional(),
+  deviceCapabilities: DeviceCapabilitiesSchema.optional(),
+  safeAreaInsets: SafeAreaInsetsSchema.optional()
+}).strict();
+var JsonRpcErrorSchema = import_zod.z.object({
+  code: import_zod.z.number().int(),
+  message: import_zod.z.string(),
+  data: import_zod.z.unknown().optional()
+}).strict();
+var JsonRpcRequestSchema = import_zod.z.object({
+  jsonrpc: import_zod.z.literal("2.0"),
+  id: import_zod.z.union([import_zod.z.string(), import_zod.z.number()]),
+  method: import_zod.z.string().min(1),
+  params: import_zod.z.unknown().optional()
+}).strict();
+var JsonRpcResponseSchema = import_zod.z.object({
+  jsonrpc: import_zod.z.literal("2.0"),
+  id: import_zod.z.union([import_zod.z.string(), import_zod.z.number()]),
+  result: import_zod.z.unknown().optional(),
+  error: JsonRpcErrorSchema.optional()
+}).strict();
+var JsonRpcNotificationSchema = import_zod.z.object({
+  jsonrpc: import_zod.z.literal("2.0"),
+  method: import_zod.z.string().min(1),
+  params: import_zod.z.unknown().optional()
+}).strict();
+var McpUiInitializeParamsSchema = import_zod.z.object({
+  protocolVersion: import_zod.z.string(),
+  capabilities: import_zod.z.object({
+    messages: import_zod.z.array(import_zod.z.string()).optional()
+  }).optional()
+}).strict();
+var McpUiInitializeResultSchema = import_zod.z.object({
+  protocolVersion: import_zod.z.string(),
+  capabilities: import_zod.z.object({
+    extensions: import_zod.z.record(import_zod.z.string(), import_zod.z.unknown()).optional()
+  }),
+  hostContext: McpAppsHostContextSchema
+}).strict();
+var McpUiToolInputParamsSchema = import_zod.z.object({
+  arguments: import_zod.z.record(import_zod.z.string(), import_zod.z.unknown())
+}).strict();
+var McpUiToolInputPartialParamsSchema = import_zod.z.object({
+  argumentsDelta: import_zod.z.string()
+}).strict();
+var ToolResultContentItemSchema = import_zod.z.object({
+  type: import_zod.z.enum(["text", "image", "resource"]),
+  text: import_zod.z.string().optional(),
+  data: import_zod.z.string().optional(),
+  mimeType: import_zod.z.string().optional(),
+  uri: import_zod.z.string().optional()
+});
+var McpUiToolResultParamsSchema = import_zod.z.object({
+  content: import_zod.z.array(ToolResultContentItemSchema),
+  structuredContent: import_zod.z.record(import_zod.z.string(), import_zod.z.unknown()).optional(),
+  _meta: import_zod.z.record(import_zod.z.string(), import_zod.z.unknown()).optional()
+}).strict();
+var McpUiToolCancelledParamsSchema = import_zod.z.object({
+  reason: import_zod.z.string().optional()
+}).strict();
+var McpUiSizeChangeParamsSchema = import_zod.z.object({
+  viewport: ViewportInfoSchema
+}).strict();
+var McpUiHostContextChangeParamsSchema = import_zod.z.object({
+  changes: McpAppsHostContextSchema.partial()
+}).strict();
+var McpUiOpenLinkParamsSchema = import_zod.z.object({
+  url: import_zod.z.string().url()
+}).strict();
+var McpUiMessageParamsSchema = import_zod.z.object({
+  content: import_zod.z.string().min(1)
+}).strict();
+var McpAppsExtensionCapabilitySchema = import_zod.z.object({
+  mimeTypes: import_zod.z.array(McpAppsMimeTypeSchema)
+}).strict();
+var ToolUIMetaSchema = import_zod.z.object({
+  "ui/resourceUri": import_zod.z.string().startsWith("ui://").optional(),
+  "ui/mimeType": McpAppsMimeTypeSchema.optional()
+}).passthrough();
+function isValidUIResourceUri(uri) {
+  return uri.startsWith("ui://") && uri.length > 5;
+}
+function isValidProtocolVersion(version) {
+  return /^\d{4}-\d{2}-\d{2}$/.test(version);
+}
+function parseUIResource(data) {
+  const result = UIResourceSchema.safeParse(data);
+  return result.success ? result.data : null;
+}
+function parseHostContext(data) {
+  const result = McpAppsHostContextSchema.safeParse(data);
+  return result.success ? result.data : null;
+}
+var DEFAULT_PROTOCOL_VERSION = MCP_APPS_PROTOCOL_VERSION;
+
+// libs/sdk/src/mcp-apps/csp.ts
+var DEFAULT_CSP_DIRECTIVES = [
+  { name: "default-src", values: ["'none'"] },
+  { name: "script-src", values: ["'self'", "'unsafe-inline'"] },
+  { name: "style-src", values: ["'self'", "'unsafe-inline'"] },
+  { name: "img-src", values: ["'self'", "data:"] },
+  { name: "font-src", values: ["'self'"] },
+  { name: "connect-src", values: ["'none'"] },
+  { name: "frame-src", values: ["'none'"] },
+  { name: "object-src", values: ["'none'"] },
+  { name: "base-uri", values: ["'self'"] },
+  { name: "form-action", values: ["'self'"] }
+];
+var SANDBOX_PERMISSIONS = ["allow-scripts", "allow-same-origin"];
+var EXTENDED_SANDBOX_PERMISSIONS = [
+  ...SANDBOX_PERMISSIONS,
+  "allow-forms",
+  "allow-popups",
+  "allow-popups-to-escape-sandbox"
+];
+function buildCSPHeader(csp) {
+  const directives = buildCSPDirectives(csp);
+  return directives.map((d) => `${d.name} ${d.values.join(" ")}`).join("; ");
+}
+function buildCSPDirectives(csp) {
+  const directives = /* @__PURE__ */ new Map();
+  for (const directive of DEFAULT_CSP_DIRECTIVES) {
+    directives.set(directive.name, [...directive.values]);
+  }
+  if (csp) {
+    if (csp.connectDomains && csp.connectDomains.length > 0) {
+      const connectSrc = directives.get("connect-src") || [];
+      const filteredConnect = connectSrc.filter((v) => v !== "'none'");
+      directives.set("connect-src", [...filteredConnect, "'self'", ...csp.connectDomains]);
+    }
+    if (csp.resourceDomains && csp.resourceDomains.length > 0) {
+      const resourceDomains = csp.resourceDomains;
+      const scriptSrc = directives.get("script-src") || [];
+      directives.set("script-src", [...scriptSrc, ...resourceDomains]);
+      const styleSrc = directives.get("style-src") || [];
+      directives.set("style-src", [...styleSrc, ...resourceDomains]);
+      const imgSrc = directives.get("img-src") || [];
+      directives.set("img-src", [...imgSrc, ...resourceDomains]);
+      const fontSrc = directives.get("font-src") || [];
+      directives.set("font-src", [...fontSrc, ...resourceDomains]);
+    }
+  }
+  return Array.from(directives.entries()).map(([name, values]) => ({
+    name,
+    values: [...new Set(values)]
+    // Deduplicate
+  }));
+}
+function buildSandboxAttribute(options) {
+  const permissions = [...SANDBOX_PERMISSIONS];
+  if (options?.allowForms) {
+    permissions.push("allow-forms");
+  }
+  if (options?.allowPopups) {
+    permissions.push("allow-popups");
+  }
+  if (options?.allowPopupsToEscapeSandbox) {
+    permissions.push("allow-popups-to-escape-sandbox");
+  }
+  return permissions.join(" ");
+}
+function buildCSPMetaTag(csp) {
+  const header = buildCSPHeader(csp);
+  return `<meta http-equiv="Content-Security-Policy" content="${escapeHtmlAttribute(header)}">`;
+}
+function isDomainAllowed(domain, csp, type) {
+  if (!csp) return false;
+  const domains = type === "connect" ? csp.connectDomains : csp.resourceDomains;
+  if (!domains || domains.length === 0) return false;
+  return domains.some((allowed) => {
+    try {
+      const allowedUrl = new URL(allowed);
+      const testUrl = new URL(domain);
+      return allowedUrl.protocol === testUrl.protocol && allowedUrl.hostname === testUrl.hostname;
+    } catch {
+      return allowed === domain;
+    }
+  });
+}
+function mergeCSP(base, override) {
+  const merged = {};
+  const connectDomains = /* @__PURE__ */ new Set();
+  if (base?.connectDomains) {
+    base.connectDomains.forEach((d) => connectDomains.add(d));
+  }
+  if (override?.connectDomains) {
+    override.connectDomains.forEach((d) => connectDomains.add(d));
+  }
+  if (connectDomains.size > 0) {
+    merged.connectDomains = Array.from(connectDomains);
+  }
+  const resourceDomains = /* @__PURE__ */ new Set();
+  if (base?.resourceDomains) {
+    base.resourceDomains.forEach((d) => resourceDomains.add(d));
+  }
+  if (override?.resourceDomains) {
+    override.resourceDomains.forEach((d) => resourceDomains.add(d));
+  }
+  if (resourceDomains.size > 0) {
+    merged.resourceDomains = Array.from(resourceDomains);
+  }
+  return merged;
+}
+function escapeHtmlAttribute(str) {
+  return str.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/'/g, "&#39;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+function parseCSPHeader(header) {
+  const csp = {};
+  const connectDomains = [];
+  const resourceDomains = [];
+  const directives = header.split(";").map((d) => d.trim());
+  for (const directive of directives) {
+    const [name, ...values] = directive.split(/\s+/);
+    if (name === "connect-src") {
+      for (const value of values) {
+        if (value.startsWith("https://") || value.startsWith("http://")) {
+          connectDomains.push(value);
+        }
+      }
+    }
+    if (["script-src", "style-src", "img-src", "font-src"].includes(name)) {
+      for (const value of values) {
+        if (value.startsWith("https://") || value.startsWith("http://")) {
+          resourceDomains.push(value);
+        }
+      }
+    }
+  }
+  if (connectDomains.length > 0) {
+    csp.connectDomains = [...new Set(connectDomains)];
+  }
+  if (resourceDomains.length > 0) {
+    csp.resourceDomains = [...new Set(resourceDomains)];
+  }
+  return csp;
+}
+
+// libs/sdk/src/mcp-apps/template.ts
+function generateMcpAppsTemplate(options) {
+  const {
+    toolInfo,
+    input,
+    output,
+    structuredContent,
+    csp,
+    title = "MCP App",
+    headContent = "",
+    bodyContent,
+    scripts = [],
+    includeBridge = true,
+    bridgeConfig,
+    theme = "light",
+    debug = false
+  } = options;
+  const cspMeta = buildCSPMetaTag(csp);
+  const dataAttrs = buildDataAttributes({ toolInfo, input, output, structuredContent });
+  const bridgeScript = includeBridge ? generateBridgeScript({ ...bridgeConfig, debug }) : "";
+  const additionalScripts = scripts.map((s) => `<script>${s}</script>`).join("\n");
+  return `<!DOCTYPE html>
+<html lang="en" data-theme="${escapeAttr(theme)}">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  ${cspMeta}
+  <meta name="mcp-apps-version" content="${MCP_APPS_PROTOCOL_VERSION}">
+  <meta name="mcp-apps-mime-type" content="${MCP_APPS_MIME_TYPE}">
+  <title>${escapeHtml(title)}</title>
+  <style>
+    :root {
+      --mcp-bg: #ffffff;
+      --mcp-text: #1a1a1a;
+      --mcp-border: #e5e5e5;
+      --mcp-primary: #0969da;
+      --mcp-error: #cf222e;
+      --mcp-success: #1a7f37;
+    }
+    [data-theme="dark"] {
+      --mcp-bg: #0d1117;
+      --mcp-text: #c9d1d9;
+      --mcp-border: #30363d;
+      --mcp-primary: #58a6ff;
+      --mcp-error: #f85149;
+      --mcp-success: #3fb950;
+    }
+    * { box-sizing: border-box; }
+    body {
+      margin: 0;
+      padding: 16px;
+      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+      background: var(--mcp-bg);
+      color: var(--mcp-text);
+      line-height: 1.5;
+    }
+  </style>
+  ${headContent}
+</head>
+<body ${dataAttrs}>
+  ${bodyContent}
+  ${bridgeScript}
+  ${additionalScripts}
+</body>
+</html>`;
+}
+function generateBridgeScript(config) {
+  const {
+    protocolVersion = MCP_APPS_PROTOCOL_VERSION,
+    trustedOrigin = "*",
+    requestTimeout = 3e4,
+    debug = false
+  } = config || {};
+  return `<script>
+(function() {
+  'use strict';
+
+  // MCP Apps Bridge Runtime
+  const MCP_PROTOCOL_VERSION = '${protocolVersion}';
+  const REQUEST_TIMEOUT = ${requestTimeout};
+  const DEBUG = ${debug};
+
+  // State
+  let initialized = false;
+  let hostContext = {};
+  let pendingRequests = new Map();
+  let messageId = 0;
+  let trustedOrigin = '${trustedOrigin}';
+
+  // Logging
+  function log(...args) {
+    if (DEBUG) console.log('[MCP Bridge]', ...args);
+  }
+
+  // Generate unique message ID
+  function nextId() {
+    return ++messageId;
+  }
+
+  // Send JSON-RPC message to host
+  function sendMessage(message) {
+    log('Sending:', message);
+    parent.postMessage(message, trustedOrigin);
+  }
+
+  // Send JSON-RPC request and wait for response
+  function sendRequest(method, params) {
+    return new Promise((resolve, reject) => {
+      const id = nextId();
+      const request = {
+        jsonrpc: '2.0',
+        id: id,
+        method: method,
+        params: params
+      };
+
+      const timeout = setTimeout(() => {
+        pendingRequests.delete(id);
+        reject(new Error('Request timeout: ' + method));
+      }, REQUEST_TIMEOUT);
+
+      pendingRequests.set(id, { resolve, reject, timeout });
+      sendMessage(request);
+    });
+  }
+
+  // Send JSON-RPC notification (no response expected)
+  function sendNotification(method, params) {
+    sendMessage({
+      jsonrpc: '2.0',
+      method: method,
+      params: params
+    });
+  }
+
+  // Handle incoming messages from host
+  function handleMessage(event) {
+    // Validate origin on first message (trust-on-first-use)
+    if (trustedOrigin === '*' && event.origin) {
+      trustedOrigin = event.origin;
+      log('Trusted origin set to:', trustedOrigin);
+    }
+
+    const data = event.data;
+    if (!data || data.jsonrpc !== '2.0') return;
+
+    log('Received:', data);
+
+    // Handle response to our request
+    if (data.id !== undefined && pendingRequests.has(data.id)) {
+      const { resolve, reject, timeout } = pendingRequests.get(data.id);
+      clearTimeout(timeout);
+      pendingRequests.delete(data.id);
+
+      if (data.error) {
+        reject(new Error(data.error.message || 'Unknown error'));
+      } else {
+        resolve(data.result);
+      }
+      return;
+    }
+
+    // Handle notifications from host
+    if (data.method) {
+      handleNotification(data.method, data.params);
+    }
+  }
+
+  // Handle notifications from host
+  function handleNotification(method, params) {
+    switch (method) {
+      case '${MCP_APPS_METHODS.TOOL_INPUT}':
+        window.dispatchEvent(new CustomEvent('mcp:tool-input', { detail: params }));
+        break;
+      case '${MCP_APPS_METHODS.TOOL_INPUT_PARTIAL}':
+        window.dispatchEvent(new CustomEvent('mcp:tool-input-partial', { detail: params }));
+        break;
+      case '${MCP_APPS_METHODS.TOOL_RESULT}':
+        window.dispatchEvent(new CustomEvent('mcp:tool-result', { detail: params }));
+        break;
+      case '${MCP_APPS_METHODS.TOOL_CANCELLED}':
+        window.dispatchEvent(new CustomEvent('mcp:tool-cancelled', { detail: params }));
+        break;
+      case '${MCP_APPS_METHODS.SIZE_CHANGE}':
+        window.dispatchEvent(new CustomEvent('mcp:size-change', { detail: params }));
+        break;
+      case '${MCP_APPS_METHODS.HOST_CONTEXT_CHANGE}':
+        Object.assign(hostContext, params.changes);
+        window.dispatchEvent(new CustomEvent('mcp:context-change', { detail: params.changes }));
+        // Update theme if changed
+        if (params.changes.theme) {
+          document.documentElement.setAttribute('data-theme', params.changes.theme);
+        }
+        break;
+      case '${MCP_APPS_METHODS.RESOURCE_TEARDOWN}':
+        window.dispatchEvent(new CustomEvent('mcp:teardown', { detail: params }));
+        break;
+    }
+  }
+
+  // Initialize connection with host
+  async function initialize() {
+    if (initialized) return hostContext;
+
+    try {
+      const result = await sendRequest('${MCP_APPS_METHODS.INITIALIZE}', {
+        protocolVersion: MCP_PROTOCOL_VERSION,
+        capabilities: {
+          messages: ['${MCP_APPS_METHODS.TOOL_INPUT}', '${MCP_APPS_METHODS.TOOL_RESULT}']
+        }
+      });
+
+      hostContext = result.hostContext || {};
+      initialized = true;
+
+      // Apply initial theme
+      if (hostContext.theme) {
+        document.documentElement.setAttribute('data-theme', hostContext.theme);
+      }
+
+      // Send initialized notification
+      sendNotification('${MCP_APPS_METHODS.INITIALIZED}', {});
+
+      log('Initialized with context:', hostContext);
+      window.dispatchEvent(new CustomEvent('mcp:initialized', { detail: hostContext }));
+
+      return hostContext;
+    } catch (error) {
+      console.error('[MCP Bridge] Initialization failed:', error);
+      throw error;
+    }
+  }
+
+  // Public API
+  window.mcpBridge = {
+    // Initialize connection
+    initialize: initialize,
+
+    // Get current host context
+    getHostContext: function() {
+      return { ...hostContext };
+    },
+
+    // Get tool info
+    getToolInfo: function() {
+      return hostContext.toolInfo;
+    },
+
+    // Call a tool on the MCP server
+    callTool: function(name, args) {
+      return sendRequest('${MCP_APPS_METHODS.TOOLS_CALL}', { name, arguments: args });
+    },
+
+    // Read a resource
+    readResource: function(uri) {
+      return sendRequest('${MCP_APPS_METHODS.RESOURCES_READ}', { uri });
+    },
+
+    // Request host to open a link
+    openLink: function(url) {
+      return sendRequest('${MCP_APPS_METHODS.OPEN_LINK}', { url });
+    },
+
+    // Send message to host's chat
+    sendMessage: function(content) {
+      return sendRequest('${MCP_APPS_METHODS.MESSAGE}', { content });
+    },
+
+    // Log message to host
+    log: function(level, message, data) {
+      sendNotification('${MCP_APPS_METHODS.NOTIFICATIONS_MESSAGE}', {
+        level: level,
+        logger: 'mcp-app',
+        data: { message, ...data }
+      });
+    },
+
+    // Ping host
+    ping: function() {
+      return sendRequest('${MCP_APPS_METHODS.PING}', {});
+    },
+
+    // Check if initialized
+    isInitialized: function() {
+      return initialized;
+    },
+
+    // Protocol version
+    protocolVersion: MCP_PROTOCOL_VERSION
+  };
+
+  // Listen for messages
+  window.addEventListener('message', handleMessage);
+
+  // Auto-initialize when DOM is ready
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', function() {
+      initialize().catch(function(err) {
+        log('Auto-init failed:', err);
+      });
+    });
+  } else {
+    initialize().catch(function(err) {
+      log('Auto-init failed:', err);
+    });
+  }
+
+  log('Bridge loaded');
+})();
+</script>`;
+}
+function buildDataAttributes(options) {
+  const attrs = [];
+  if (options.toolInfo) {
+    attrs.push(`data-mcp-tool="${escapeAttr(JSON.stringify(options.toolInfo))}"`);
+  }
+  if (options.input) {
+    attrs.push(`data-mcp-input="${escapeAttr(JSON.stringify(options.input))}"`);
+  }
+  if (options.output !== void 0) {
+    attrs.push(`data-mcp-output="${escapeAttr(JSON.stringify(options.output))}"`);
+  }
+  if (options.structuredContent !== void 0) {
+    attrs.push(`data-mcp-structured="${escapeAttr(JSON.stringify(options.structuredContent))}"`);
+  }
+  return attrs.join(" ");
+}
+function escapeHtml(str) {
+  return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+function escapeAttr(str) {
+  return str.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/'/g, "&#39;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+function wrapInMcpAppsTemplate(html, options) {
+  return generateMcpAppsTemplate({
+    ...options,
+    bodyContent: html
+  });
+}
+function createSimpleMcpAppsTemplate(content, title) {
+  return generateMcpAppsTemplate({
+    title: title || "MCP App",
+    bodyContent: `<div class="mcp-content">${content}</div>`,
+    includeBridge: true
+  });
+}
+function extractBodyContent(html) {
+  const match = html.match(/<body[^>]*>([\s\S]*?)<script/);
+  return match ? match[1].trim() : null;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DEFAULT_CSP_DIRECTIVES,
+  DEFAULT_PROTOCOL_VERSION,
+  DeviceCapabilitiesSchema,
+  EXTENDED_SANDBOX_PERMISSIONS,
+  JsonRpcErrorSchema,
+  JsonRpcNotificationSchema,
+  JsonRpcRequestSchema,
+  JsonRpcResponseSchema,
+  MCP_APPS_METHODS,
+  MCP_APPS_MIME_TYPE,
+  MCP_APPS_PROTOCOL_VERSION,
+  McpAppsCSPSchema,
+  McpAppsDisplayModeSchema,
+  McpAppsExtensionCapabilitySchema,
+  McpAppsHostContextSchema,
+  McpAppsMimeTypeSchema,
+  McpAppsPlatformSchema,
+  McpUiHostContextChangeParamsSchema,
+  McpUiInitializeParamsSchema,
+  McpUiInitializeResultSchema,
+  McpUiMessageParamsSchema,
+  McpUiOpenLinkParamsSchema,
+  McpUiSizeChangeParamsSchema,
+  McpUiToolCancelledParamsSchema,
+  McpUiToolInputParamsSchema,
+  McpUiToolInputPartialParamsSchema,
+  McpUiToolResultParamsSchema,
+  SANDBOX_PERMISSIONS,
+  SafeAreaInsetsSchema,
+  ThemeSchema,
+  ToolInfoSchema,
+  ToolUIMetaSchema,
+  UIResourceMetaSchema,
+  UIResourceSchema,
+  ViewportInfoSchema,
+  buildCSPDirectives,
+  buildCSPHeader,
+  buildCSPMetaTag,
+  buildSandboxAttribute,
+  createSimpleMcpAppsTemplate,
+  extractBodyContent,
+  generateMcpAppsTemplate,
+  isDomainAllowed,
+  isValidProtocolVersion,
+  isValidUIResourceUri,
+  mergeCSP,
+  parseCSPHeader,
+  parseHostContext,
+  parseUIResource,
+  wrapInMcpAppsTemplate
+});