@frontmcp/ui 0.5.0 → 0.6.0

package/src/runtime/wrapper.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"wrapper.js","sourceRoot":"","sources":["../../../src/runtime/wrapper.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Tool UI Wrapper\n *\n * Wraps tool UI templates with the MCP Bridge runtime and\n * integrates with the existing layout system for consistent styling.\n */\n\nimport type { WrapToolUIOptions, HostContext } from './types';\nimport { MCP_BRIDGE_RUNTIME } from './mcp-bridge';\nimport { buildCSPMetaTag, buildCSPDirectives } from './csp';\nimport {\n  type ThemeConfig,\n  type PlatformCapabilities,\n  DEFAULT_THEME,\n  OPENAI_PLATFORM,\n  buildFontPreconnect,\n  buildFontStylesheets,\n  buildCdnScripts,\n  buildThemeCss,\n  mergeThemes,\n  canUseCdn,\n  needsInlineScripts,\n  type DeepPartial,\n} from '../theme';\nimport { escapeHtml } from '../layouts/base';\nimport { sanitizeInput as sanitizeInputFn, type SanitizerFn } from './sanitizer';\nimport { BRIDGE_SCRIPT_TAGS } from '../bridge/runtime/iife-generator';\n\n// ============================================\n// Extended Options\n// ============================================\n\n/**\n * Extended options for wrapToolUI that include theme and platform\n */\nexport interface WrapToolUIFullOptions extends WrapToolUIOptions {\n  /** Theme configuration */\n  theme?: DeepPartial<ThemeConfig>;\n\n  /** Target platform capabilities */\n  platform?: PlatformCapabilities;\n\n  /** Initial host context */\n  hostContext?: Partial<HostContext>;\n\n  /**\n   * Sanitize input before exposing to widget.\n   * This protects sensitive data from being exposed in client-side widgets.\n   *\n   * - `true`: Auto-detect and redact PII patterns (email, phone, SSN, credit card)\n   * - `string[]`: Redact values in fields with these names\n   * - `SanitizerFn`: Custom sanitizer function\n   * - `false` or `undefined`: No sanitization (default)\n   *\n   * @example\n   * ```typescript\n   * // Auto-detect PII\n   * wrapToolUI({ sanitizeInput: true, ... });\n   *\n   * // Redact specific fields\n   * wrapToolUI({ sanitizeInput: ['password', 'token', 'api_key'], ... });\n   *\n   * // Custom sanitizer\n   * wrapToolUI({\n   *   sanitizeInput: (key, value) => key === 'secret' ? '[HIDDEN]' : value,\n   *   ...\n   * });\n   * ```\n   */\n  sanitizeInput?: boolean | string[] | SanitizerFn;\n\n  /**\n   * The type of renderer used (for framework runtime injection).\n   * Auto-detected by renderToolTemplateAsync.\n   */\n  rendererType?: string;\n\n  /**\n   * Enable client-side hydration for React/MDX components.\n   */\n  hydrate?: boolean;\n\n  /**\n   * Skip CSP meta tag generation.\n   *\n   * OpenAI handles CSP through `_meta['openai/widgetCSP']` in the MCP response,\n   * not through HTML meta tags. When true, the CSP meta tag is omitted from the\n   * HTML output to avoid browser warnings about CSP meta tags outside <head>.\n   *\n   * @default false\n   */\n  skipCspMeta?: boolean;\n}\n\n// ============================================\n// Template Helpers Implementation\n// ============================================\n\n/**\n * Create template helpers for use in template builder functions\n */\nexport function createTemplateHelpers() {\n  let idCounter = 0;\n\n  return {\n    /**\n     * Escape HTML special characters to prevent XSS\n     */\n    escapeHtml,\n\n    /**\n     * Format a date for display\n     */\n    formatDate: (date: Date | string, format?: string): string => {\n      const d = typeof date === 'string' ? new Date(date) : date;\n      if (isNaN(d.getTime())) return String(date);\n\n      if (format === 'iso') {\n        return d.toISOString();\n      }\n      if (format === 'time') {\n        return d.toLocaleTimeString();\n      }\n      if (format === 'datetime') {\n        return d.toLocaleString();\n      }\n      // Default: localized date\n      return d.toLocaleDateString();\n    },\n\n    /**\n     * Format a number as currency\n     */\n    formatCurrency: (amount: number, currency = 'USD'): string => {\n      return new Intl.NumberFormat('en-US', {\n        style: 'currency',\n        currency,\n      }).format(amount);\n    },\n\n    /**\n     * Generate a unique ID for DOM elements\n     */\n    uniqueId: (prefix = 'mcp'): string => {\n      return `${prefix}-${++idCounter}-${Date.now().toString(36)}`;\n    },\n\n    /**\n     * Safely embed JSON data in HTML\n     * Escapes characters that could break out of script tags or HTML\n     */\n    jsonEmbed: (data: unknown): string => {\n      // JSON.stringify returns undefined for undefined input, handle it\n      const json = JSON.stringify(data);\n      if (json === undefined) {\n        return 'undefined';\n      }\n      return json.replace(/</g, '\\\\u003c').replace(/>/g, '\\\\u003e').replace(/&/g, '\\\\u0026').replace(/'/g, '\\\\u0027');\n    },\n  };\n}\n\n// ============================================\n// Main Wrapper Function\n// ============================================\n\n/**\n * Wrap tool UI content in a complete HTML document with MCP Bridge runtime.\n *\n * This function creates a standalone HTML document that:\n * - Includes the MCP Bridge runtime for cross-platform compatibility\n * - Applies Content Security Policy meta tags\n * - Injects tool input/output data\n * - Uses the FrontMCP theme system for consistent styling\n *\n * @param options - Options for wrapping the template\n * @returns Complete HTML document string\n *\n * @example\n * ```typescript\n * const html = wrapToolUI({\n *   content: '<div class=\"p-4\">Weather: 72°F</div>',\n *   toolName: 'get_weather',\n *   input: { location: 'San Francisco' },\n *   output: { temperature: 72, conditions: 'sunny' },\n *   csp: { connectDomains: ['https://api.weather.com'] },\n * });\n * ```\n */\nexport function wrapToolUI(options: WrapToolUIFullOptions): string {\n  const {\n    content,\n    toolName,\n    input = {},\n    output,\n    structuredContent,\n    csp,\n    widgetAccessible = false,\n    title,\n    theme: themeOverrides,\n    platform = OPENAI_PLATFORM,\n    hostContext,\n    sanitizeInput: sanitizeOption,\n    rendererType,\n    hydrate = false, // Disabled by default to prevent React hydration Error #418 in MCP clients\n    skipCspMeta = false,\n  } = options;\n\n  // Apply input sanitization if enabled\n  let sanitizedInput = input;\n  if (sanitizeOption) {\n    const sanitizeMode = sanitizeOption === true ? true : sanitizeOption;\n    sanitizedInput = sanitizeInputFn(input, sanitizeMode);\n  }\n\n  // Merge theme\n  const theme: ThemeConfig = themeOverrides ? mergeThemes(DEFAULT_THEME, themeOverrides) : DEFAULT_THEME;\n\n  // Check CDN capabilities\n  const useCdn = canUseCdn(platform);\n  const useInline = needsInlineScripts(platform);\n\n  // Build font links (skip for blocked network)\n  const fontPreconnect = useCdn ? buildFontPreconnect() : '';\n  const fontStylesheets = useCdn ? buildFontStylesheets({ inter: true }) : '';\n\n  // Build scripts (Tailwind only - no HTMX needed for basic widgets)\n  const scripts = buildCdnScripts({\n    tailwind: platform.supportsTailwind,\n    htmx: false,\n    alpine: false,\n    icons: false,\n    inline: useInline,\n  });\n\n  // Build framework runtime scripts (React/MDX)\n  const frameworkScripts = buildFrameworkRuntimeScripts({\n    rendererType,\n    hydrate,\n    platform,\n  });\n\n  // Build theme CSS\n  const themeCss = buildThemeCss(theme);\n  const customCss = theme.customCss || '';\n\n  // Build Tailwind style block\n  const styleBlock = platform.supportsTailwind\n    ? `<style type=\"text/tailwindcss\">\n    @theme {\n      ${themeCss}\n    }\n    ${customCss}\n  </style>`\n    : '';\n\n  // Build CSP meta tag (skip for platforms like OpenAI that handle CSP via _meta)\n  const cspMetaTag = skipCspMeta ? '' : buildCSPMetaTag(csp);\n\n  // Build data injection script\n  const dataScript = buildDataInjectionScript({\n    toolName,\n    input: sanitizedInput,\n    output,\n    structuredContent,\n    widgetAccessible,\n    hostContext,\n  });\n\n  // Page title\n  const pageTitle = title || `${escapeHtml(toolName)} - Tool Result`;\n\n  return `<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  <title>${pageTitle}</title>\n  ${cspMetaTag}\n\n  <!-- Fonts -->\n  ${fontPreconnect}\n  ${fontStylesheets}\n\n  <!-- Tailwind CSS -->\n  ${scripts}\n  ${styleBlock}\n\n  <!-- Framework Runtime -->\n  ${frameworkScripts}\n\n  <!-- Tool Data -->\n  ${dataScript}\n\n  <!-- MCP Bridge Runtime -->\n  ${MCP_BRIDGE_RUNTIME}\n</head>\n<body class=\"bg-background text-text-primary font-sans antialiased\">\n  ${content}\n</body>\n</html>`;\n}\n\n/**\n * Build framework-specific runtime scripts (React, MDX).\n * Only included when using React/MDX renderers with hydration enabled.\n */\nfunction buildFrameworkRuntimeScripts(options: {\n  rendererType?: string;\n  hydrate?: boolean;\n  platform: PlatformCapabilities;\n}): string {\n  const { rendererType, hydrate, platform } = options;\n\n  // No framework scripts needed for HTML templates\n  if (!rendererType || rendererType === 'html' || rendererType === 'html-fallback') {\n    return '';\n  }\n\n  // Only include runtime if hydration is enabled\n  if (!hydrate) {\n    return '';\n  }\n\n  // React/MDX both need React runtime for hydration\n  if (rendererType === 'react' || rendererType === 'mdx') {\n    const useCdn = canUseCdn(platform);\n\n    if (useCdn) {\n      // Use CDN for platforms with network access\n      return `\n  <!-- React Runtime (for hydration) -->\n  <script crossorigin src=\"https://unpkg.com/react@18/umd/react.production.min.js\"></script>\n  <script crossorigin src=\"https://unpkg.com/react-dom@18/umd/react-dom.production.min.js\"></script>\n  <script>\n    // Hydration script for React/MDX components\n    (function() {\n      document.addEventListener('DOMContentLoaded', function() {\n        var hydratables = document.querySelectorAll('[data-hydrate], [data-mdx-hydrate]');\n        if (hydratables.length > 0 && window.__frontmcp_components) {\n          hydratables.forEach(function(el) {\n            var componentName = el.getAttribute('data-hydrate');\n            var propsJson = el.getAttribute('data-props');\n            var props = propsJson ? JSON.parse(propsJson) : {};\n\n            if (window.__frontmcp_components[componentName]) {\n              try {\n                ReactDOM.hydrateRoot(el, React.createElement(\n                  window.__frontmcp_components[componentName],\n                  props\n                ));\n              } catch (e) {\n                console.error('[FrontMCP] Hydration failed:', e);\n              }\n            }\n          });\n        }\n      });\n    })();\n  </script>`;\n    } else {\n      // For blocked-network platforms, SSR only (no hydration)\n      return `\n  <!-- React hydration not available on blocked-network platforms -->\n  <script>\n    console.warn('[FrontMCP] React hydration disabled - platform does not support external scripts');\n  </script>`;\n    }\n  }\n\n  return '';\n}\n\n/**\n * Build the data injection script that sets up globals before MCP Bridge runs\n */\nfunction buildDataInjectionScript(options: {\n  toolName: string;\n  input: Record<string, unknown>;\n  output: unknown;\n  structuredContent?: unknown;\n  widgetAccessible: boolean;\n  hostContext?: Partial<HostContext>;\n}): string {\n  const { toolName, input, output, structuredContent, widgetAccessible, hostContext } = options;\n\n  const helpers = createTemplateHelpers();\n\n  // Build the context object\n  const contextData = {\n    theme: hostContext?.theme || 'light',\n    displayMode: hostContext?.displayMode || 'inline',\n    ...hostContext,\n  };\n\n  return `<script>\n  // Tool metadata\n  window.__mcpToolName = ${helpers.jsonEmbed(toolName)};\n  window.__mcpToolInput = ${helpers.jsonEmbed(input)};\n  window.__mcpToolOutput = ${helpers.jsonEmbed(output)};\n  window.__mcpStructuredContent = ${helpers.jsonEmbed(structuredContent)};\n  window.__mcpWidgetAccessible = ${helpers.jsonEmbed(widgetAccessible)};\n  window.__mcpHostContext = ${helpers.jsonEmbed(contextData)};\n</script>`;\n}\n\n// ============================================\n// Universal Wrapper (Works on All Platforms)\n// ============================================\n\n/**\n * Resource loading mode for widget scripts.\n * - 'cdn': Load React/MDX from CDN URLs (lightweight HTML, requires network)\n * - 'inline': Embed all scripts in HTML (larger, works offline)\n */\nexport type ResourceMode = 'cdn' | 'inline';\n\n/**\n * Options for the universal wrapper.\n */\nexport interface WrapToolUIUniversalOptions {\n  /** Rendered template content (HTML) */\n  content: string;\n  /** Tool name */\n  toolName: string;\n  /** Tool input arguments */\n  input?: Record<string, unknown>;\n  /** Tool output/result */\n  output?: unknown;\n  /** Structured content */\n  structuredContent?: unknown;\n  /** CSP configuration */\n  csp?: WrapToolUIOptions['csp'];\n  /** Widget accessibility flag */\n  widgetAccessible?: boolean;\n  /** Page title */\n  title?: string;\n  /** Theme configuration */\n  theme?: DeepPartial<ThemeConfig>;\n  /** Whether to include the FrontMCP Bridge */\n  includeBridge?: boolean;\n  /** Whether to inline all scripts (for blocked-network environments) */\n  inlineScripts?: boolean;\n  /** Renderer type used */\n  rendererType?: string;\n  /** Enable hydration */\n  hydrate?: boolean;\n  /**\n   * Skip CSP meta tag generation.\n   *\n   * OpenAI handles CSP through `_meta['openai/widgetCSP']` in the MCP response,\n   * not through HTML meta tags. When true, the CSP meta tag is omitted from the\n   * HTML output to avoid browser warnings about CSP meta tags outside <head>.\n   *\n   * @default false\n   */\n  skipCspMeta?: boolean;\n  /**\n   * Resource loading mode for widget scripts.\n   *\n   * - 'cdn': Load React, MDX, Handlebars from CDN URLs (smaller HTML, requires network)\n   * - 'inline': Embed all scripts directly in HTML (larger, works in blocked-network environments)\n   *\n   * When `inlineScripts` is true, this is automatically set to 'inline'.\n   *\n   * @default 'cdn'\n   */\n  resourceMode?: ResourceMode;\n}\n\n/**\n * Wrap tool UI content in a universal HTML document.\n *\n * This wrapper produces HTML that works on ALL platforms:\n * - OpenAI ChatGPT (Apps SDK)\n * - Anthropic Claude\n * - MCP Apps (ext-apps / SEP-1865)\n * - Google Gemini\n * - Any MCP-compatible host\n *\n * The FrontMCP Bridge auto-detects the host at runtime and adapts\n * its communication protocol accordingly.\n *\n * @param options - Universal wrapper options\n * @returns Complete HTML document string\n *\n * @example\n * ```typescript\n * const html = wrapToolUIUniversal({\n *   content: '<div class=\"p-4\">Weather: 72°F</div>',\n *   toolName: 'get_weather',\n *   output: { temperature: 72 },\n * });\n * ```\n */\nexport function wrapToolUIUniversal(options: WrapToolUIUniversalOptions): string {\n  const {\n    content,\n    toolName,\n    input = {},\n    output,\n    structuredContent,\n    csp,\n    widgetAccessible = false,\n    title,\n    theme: themeOverrides,\n    includeBridge = true,\n    inlineScripts = false,\n    rendererType,\n    hydrate = false, // Disabled by default to prevent React hydration Error #418 in MCP clients\n    skipCspMeta = false,\n    resourceMode = inlineScripts ? 'inline' : 'cdn',\n  } = options;\n\n  // Determine if we should use inline scripts based on resourceMode\n  const useInlineScripts = resourceMode === 'inline' || inlineScripts;\n\n  // Merge theme\n  const theme: ThemeConfig = themeOverrides ? mergeThemes(DEFAULT_THEME, themeOverrides) : DEFAULT_THEME;\n\n  // Build font links (skip for inline mode / blocked network)\n  const fontPreconnect = useInlineScripts ? '' : buildFontPreconnect();\n  const fontStylesheets = useInlineScripts ? '' : buildFontStylesheets({ inter: true });\n\n  // Build CDN scripts\n  const scripts = buildCdnScripts({\n    tailwind: true,\n    htmx: false,\n    alpine: false,\n    icons: false,\n    inline: useInlineScripts,\n  });\n\n  // Build theme CSS\n  const themeCss = buildThemeCss(theme);\n  const customCss = theme.customCss || '';\n\n  // Build Tailwind style block\n  const styleBlock = `<style type=\"text/tailwindcss\">\n    @theme {\n      ${themeCss}\n    }\n    ${customCss}\n  </style>`;\n\n  // Build CSP meta tag (skip for platforms like OpenAI that handle CSP via _meta)\n  const cspMetaTag = skipCspMeta ? '' : buildCSPMetaTag(csp);\n\n  // Build data injection script\n  const dataScript = buildDataInjectionScript({\n    toolName,\n    input,\n    output,\n    structuredContent,\n    widgetAccessible,\n  });\n\n  // Build framework runtime (for React/MDX hydration)\n  // When resourceMode is 'cdn', we use CDN URLs for React/ReactDOM\n  const frameworkScripts = buildFrameworkRuntimeScriptsUniversal({\n    rendererType,\n    hydrate,\n    inlineScripts: useInlineScripts,\n    resourceMode,\n  });\n\n  // Universal bridge script (works on all platforms)\n  const bridgeScript = includeBridge ? BRIDGE_SCRIPT_TAGS.universal : '';\n\n  // Page title\n  const pageTitle = title || `${escapeHtml(toolName)} - Tool Result`;\n\n  return `<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  <title>${pageTitle}</title>\n  ${cspMetaTag}\n\n  <!-- Fonts -->\n  ${fontPreconnect}\n  ${fontStylesheets}\n\n  <!-- Tailwind CSS -->\n  ${scripts}\n  ${styleBlock}\n\n  <!-- Framework Runtime -->\n  ${frameworkScripts}\n\n  <!-- Tool Data -->\n  ${dataScript}\n\n  <!-- FrontMCP Bridge (Universal - Auto-detects host platform) -->\n  ${bridgeScript}\n</head>\n<body class=\"bg-background text-text-primary font-sans antialiased\">\n  ${content}\n</body>\n</html>`;\n}\n\n/**\n * Build framework runtime scripts for universal wrapper.\n * Supports both CDN mode (lightweight URLs) and inline mode (embedded scripts).\n */\nfunction buildFrameworkRuntimeScriptsUniversal(options: {\n  rendererType?: string;\n  hydrate?: boolean;\n  inlineScripts?: boolean;\n  resourceMode?: ResourceMode;\n}): string {\n  const { rendererType, hydrate, inlineScripts, resourceMode = 'cdn' } = options;\n\n  // No framework scripts needed for HTML templates\n  if (!rendererType || rendererType === 'html' || rendererType === 'html-fallback') {\n    return '';\n  }\n\n  // Determine if we're using inline scripts\n  const useInline = resourceMode === 'inline' || inlineScripts;\n\n  // React/MDX both need React runtime\n  // Include scripts when:\n  // 1. Using CDN mode (resourceMode === 'cdn') - scripts are lightweight\n  // 2. Hydration is enabled (for client-side interaction)\n  if (rendererType === 'react' || rendererType === 'mdx') {\n    if (!useInline) {\n      // CDN mode: Use ES modules from esm.sh for React 19\n      const reactScripts = `\n  <!-- React 19 Runtime (ES modules from esm.sh) -->\n  <script type=\"module\">\n    import React from 'https://esm.sh/react@19';\n    import { createRoot } from 'https://esm.sh/react-dom@19/client';\n    window.React = React;\n    window.ReactDOM = { createRoot };\n  </script>`;\n\n      // Add MDX runtime if needed\n      const mdxScripts =\n        rendererType === 'mdx'\n          ? `\n  <!-- MDX Runtime (CDN mode) -->\n  <script type=\"module\">\n    import * as runtime from 'https://esm.sh/@mdx-js/react@3?bundle';\n    window.MDXRuntime = runtime;\n  </script>`\n          : '';\n\n      // Add hydration script if hydration is enabled\n      const hydrationScript = hydrate\n        ? `\n  <script>\n    // Hydration script for React/MDX components\n    (function() {\n      document.addEventListener('DOMContentLoaded', function() {\n        var hydratables = document.querySelectorAll('[data-hydrate], [data-mdx-hydrate]');\n        if (hydratables.length > 0 && window.__frontmcp_components) {\n          hydratables.forEach(function(el) {\n            var componentName = el.getAttribute('data-hydrate');\n            var propsJson = el.getAttribute('data-props');\n            var props = propsJson ? JSON.parse(propsJson) : {};\n\n            if (window.__frontmcp_components[componentName]) {\n              try {\n                ReactDOM.hydrateRoot(el, React.createElement(\n                  window.__frontmcp_components[componentName],\n                  props\n                ));\n              } catch (e) {\n                console.error('[FrontMCP] Hydration failed:', e);\n              }\n            }\n          });\n        }\n      });\n    })();\n  </script>`\n        : '';\n\n      return reactScripts + mdxScripts + hydrationScript;\n    } else {\n      // Inline mode: Scripts must be embedded in HTML (for blocked-network environments)\n      // Currently not implemented - would require fetching and caching React at build time\n      return `\n  <!-- React/MDX runtime disabled (inline/blocked-network mode) -->\n  <script>\n    console.warn('[FrontMCP] React/MDX runtime disabled - inline scripts mode (network blocked). SSR content is static.');\n  </script>`;\n    }\n  }\n\n  return '';\n}\n\n// ============================================\n// Minimal Wrapper (No Theme)\n// ============================================\n\n/**\n * Wrap tool UI content with minimal boilerplate.\n * Use this when you need to control all styling yourself.\n *\n * @param options - Minimal wrapper options\n * @returns HTML document string\n */\nexport function wrapToolUIMinimal(\n  options: Pick<\n    WrapToolUIOptions,\n    'content' | 'toolName' | 'input' | 'output' | 'structuredContent' | 'csp' | 'widgetAccessible' | 'title'\n  > & { skipCspMeta?: boolean },\n): string {\n  const {\n    content,\n    toolName,\n    input = {},\n    output,\n    structuredContent,\n    csp,\n    widgetAccessible = false,\n    title,\n    skipCspMeta = false,\n  } = options;\n\n  const helpers = createTemplateHelpers();\n\n  // Build CSP meta tag (skip for platforms like OpenAI that handle CSP via _meta)\n  const cspMetaTag = skipCspMeta ? '' : buildCSPMetaTag(csp);\n\n  // Build data injection\n  const contextData = { theme: 'light', displayMode: 'inline' };\n\n  const dataScript = `<script>\n  window.__mcpToolName = ${helpers.jsonEmbed(toolName)};\n  window.__mcpToolInput = ${helpers.jsonEmbed(input)};\n  window.__mcpToolOutput = ${helpers.jsonEmbed(output)};\n  window.__mcpStructuredContent = ${helpers.jsonEmbed(structuredContent)};\n  window.__mcpWidgetAccessible = ${helpers.jsonEmbed(widgetAccessible)};\n  window.__mcpHostContext = ${helpers.jsonEmbed(contextData)};\n</script>`;\n\n  const pageTitle = title || `${escapeHtml(toolName)} - Tool Result`;\n\n  return `<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  <title>${pageTitle}</title>\n  ${cspMetaTag}\n  ${dataScript}\n  ${MCP_BRIDGE_RUNTIME}\n</head>\n<body>\n  ${content}\n</body>\n</html>`;\n}\n\n// ============================================\n// Static Widget Wrapper (For MCP Resource Mode)\n// ============================================\n\n/**\n * Options for wrapping a static widget.\n */\nexport interface WrapStaticWidgetOptions {\n  /** Tool name */\n  toolName: string;\n  /** SSR'd template content (rendered WITHOUT data) */\n  ssrContent: string;\n  /** Tool UI configuration */\n  uiConfig: {\n    csp?: WrapToolUIOptions['csp'];\n    widgetAccessible?: boolean;\n  };\n  /** Page title */\n  title?: string;\n  /** Theme configuration */\n  theme?: DeepPartial<ThemeConfig>;\n  /**\n   * Renderer type (react, mdx, html, etc).\n   * When 'react' or 'mdx', includes React runtime for client-side rendering.\n   */\n  rendererType?: string;\n  /**\n   * Transpiled component code to include for client-side rendering.\n   * Required for React components to re-render with actual data.\n   */\n  componentCode?: string;\n  /**\n   * Embedded data for inline mode (servingMode: 'inline').\n   * When provided, the data is embedded in the HTML and the component renders immediately\n   * instead of waiting for window.openai.toolOutput.\n   *\n   * This enables inline mode to use the same React renderer as static mode,\n   * but with data embedded in each response.\n   */\n  embeddedData?: {\n    input?: Record<string, unknown>;\n    output?: unknown;\n    structuredContent?: unknown;\n  };\n  /**\n   * Self-contained mode for inline serving.\n   * When true:\n   * - Skips the FrontMCP Bridge entirely (no wrapper interference)\n   * - Renders React immediately with embedded data\n   * - React component manages its own state via hooks\n   * - No global state updates that could trigger platform wrappers\n   *\n   * This is used for `servingMode: 'inline'` to prevent OpenAI's wrapper\n   * from overwriting the React component on data changes.\n   */\n  selfContained?: boolean;\n}\n\n/**\n * Options for lean widget shell (inline mode resourceTemplate).\n */\nexport interface WrapLeanWidgetShellOptions {\n  /** Tool name */\n  toolName: string;\n  /** UI configuration */\n  uiConfig: { widgetAccessible?: boolean };\n  /** Optional page title */\n  title?: string;\n  /** Optional theme overrides */\n  theme?: Partial<ThemeConfig>;\n}\n\n/**\n * Create a lean widget shell for inline mode resourceTemplate.\n *\n * This is a minimal HTML document with:\n * - HTML structure with theme CSS and fonts\n * - A placeholder/loading message while waiting for tool response\n * - FrontMCP Bridge for platform-agnostic communication\n * - Injector script that detects ui/html in tool response and replaces the document\n *\n * NO React runtime, NO component code - the actual React widget comes\n * in each tool response via _meta['ui/html'] and is injected by this shell.\n *\n * OpenAI caches this at discovery time. When a tool executes:\n * 1. Tool returns full widget HTML in _meta['ui/html']\n * 2. OpenAI injects this into window.openai.toolResponseMetadata['ui/html']\n * 3. The bridge detects this and calls the injector callback\n * 4. Injector replaces the entire document with the full React widget\n *\n * @param options - Lean widget options\n * @returns Minimal HTML document string with bridge and injector\n */\nexport function wrapLeanWidgetShell(options: WrapLeanWidgetShellOptions): string {\n  const { toolName, uiConfig, title, theme: themeOverrides } = options;\n\n  // Merge theme\n  const theme: ThemeConfig = themeOverrides ? mergeThemes(DEFAULT_THEME, themeOverrides) : DEFAULT_THEME;\n\n  // Build font links\n  const fontPreconnect = buildFontPreconnect();\n  const fontStylesheets = buildFontStylesheets({ inter: true });\n\n  // Build CDN scripts (only Tailwind for styling)\n  const tailwindScript = buildCdnScripts({\n    tailwind: true,\n    htmx: false,\n    alpine: false,\n    icons: false,\n    inline: false,\n  });\n\n  // Build theme CSS\n  const themeCss = buildThemeCss(theme);\n  const customCss = theme.customCss || '';\n\n  // Build Tailwind style block\n  const styleBlock = `<style type=\"text/tailwindcss\">\n    @theme {\n      ${themeCss}\n    }\n    ${customCss}\n  </style>`;\n\n  // Placeholder content with loading indicator\n  const placeholderContent = `\n    <div id=\"frontmcp-widget-root\" class=\"flex items-center justify-center min-h-[200px] p-4\">\n      <div class=\"text-center text-gray-500\">\n        <svg class=\"animate-spin mx-auto mb-2\" style=\"width: 1.5rem; height: 1.5rem; color: #9ca3af;\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\">\n          <circle style=\"opacity: 0.25;\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n          <path style=\"opacity: 0.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>\n        </svg>\n        <p class=\"text-sm\">Loading widget...</p>\n      </div>\n    </div>\n  `;\n\n  // Tool metadata script\n  const toolMetaScript = `<script>\n  // Lean widget shell for inline mode\n  // Actual widget content comes in tool response via ui/html\n  window.__mcpToolName = ${JSON.stringify(toolName)};\n  window.__mcpWidgetAccessible = ${JSON.stringify(uiConfig.widgetAccessible ?? false)};\n  window.__mcpLeanShell = true;\n</script>`;\n\n  // FrontMCP Bridge script (platform-agnostic)\n  const bridgeScript = BRIDGE_SCRIPT_TAGS.universal;\n\n  // Injector script that uses the bridge to detect and inject ui/html\n  const injectorScript = `<script>\n  // Lean shell injector for inline mode\n  // Uses FrontMCP Bridge (platform-agnostic) to detect tool response HTML\n  (function() {\n    var injected = false;\n\n    function injectWidget(metadata) {\n      if (injected) return;\n\n      // Check for ui/html in metadata\n      var html = null;\n\n      if (metadata) {\n        // Try different possible locations for the HTML\n        html = metadata['ui/html'] || metadata['openai/html'] || metadata.html;\n      }\n\n      if (html && typeof html === 'string') {\n        injected = true;\n        console.log('[FrontMCP] Lean shell: Injecting inline widget HTML (' + html.length + ' chars)');\n\n        // Replace entire document with the full React widget HTML\n        document.open();\n        document.write(html);\n        document.close();\n        return true;\n      }\n      return false;\n    }\n\n    // Wait for bridge to be ready, then subscribe\n    function subscribeAndInject() {\n      var bridge = window.FrontMcpBridge;\n      if (!bridge) {\n        console.warn('[FrontMCP] Lean shell: Bridge not found');\n        return;\n      }\n\n      // Check if data already available (via getToolResponseMetadata)\n      if (typeof bridge.getToolResponseMetadata === 'function') {\n        var existing = bridge.getToolResponseMetadata();\n        if (existing && injectWidget(existing)) {\n          return; // Already injected\n        }\n      }\n\n      // Subscribe to metadata changes (via onToolResponseMetadata)\n      if (typeof bridge.onToolResponseMetadata === 'function') {\n        console.log('[FrontMCP] Lean shell: Subscribing to tool response metadata');\n        bridge.onToolResponseMetadata(function(metadata) {\n          console.log('[FrontMCP] Lean shell: Received tool response metadata');\n          injectWidget(metadata);\n        });\n      } else {\n        console.warn('[FrontMCP] Lean shell: onToolResponseMetadata not available on bridge');\n      }\n    }\n\n    // Wait for bridge:ready event\n    window.addEventListener('bridge:ready', function() {\n      console.log('[FrontMCP] Lean shell: Bridge ready, setting up injector');\n      subscribeAndInject();\n    });\n\n    // Also try immediately in case bridge is already ready\n    if (window.FrontMcpBridge && window.FrontMcpBridge.initialized) {\n      subscribeAndInject();\n    }\n\n    // Fallback: poll for bridge if event doesn't fire\n    var bridgeCheckAttempts = 0;\n    var bridgeCheckInterval = setInterval(function() {\n      bridgeCheckAttempts++;\n      if (window.FrontMcpBridge) {\n        clearInterval(bridgeCheckInterval);\n        if (!injected) {\n          subscribeAndInject();\n        }\n      } else if (bridgeCheckAttempts >= 100) {\n        // 10 second timeout\n        clearInterval(bridgeCheckInterval);\n        console.warn('[FrontMCP] Lean shell: Timeout waiting for bridge');\n      }\n    }, 100);\n  })();\n</script>`;\n\n  // Spinner animation CSS\n  const spinnerCss = `<style>\n    @keyframes spin { to { transform: rotate(360deg); } }\n    .animate-spin { animation: spin 1s linear infinite; }\n  </style>`;\n\n  return `<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  <title>${escapeHtml(title || toolName)}</title>\n  ${fontPreconnect}\n  ${fontStylesheets}\n  ${tailwindScript}\n  ${styleBlock}\n  ${spinnerCss}\n  ${toolMetaScript}\n  ${bridgeScript}\n</head>\n<body class=\"bg-white font-sans antialiased\">\n  ${placeholderContent}\n  ${injectorScript}\n</body>\n</html>`;\n}\n\n// ============================================\n// Hybrid Widget Shell (For Hybrid Serving Mode)\n// ============================================\n\n/**\n * Options for hybrid widget shell (hybrid mode resourceTemplate).\n */\nexport interface WrapHybridWidgetShellOptions {\n  /** Tool name */\n  toolName: string;\n  /** UI configuration */\n  uiConfig: { widgetAccessible?: boolean; csp?: WrapToolUIOptions['csp'] };\n  /** Optional page title */\n  title?: string;\n  /** Optional theme overrides */\n  theme?: Partial<ThemeConfig>;\n}\n\n/**\n * Create a hybrid widget shell for hybrid serving mode.\n *\n * This shell contains:\n * - React 19 runtime from esm.sh CDN\n * - FrontMCP Bridge for platform-agnostic communication\n * - All FrontMCP hooks (useMcpBridgeContext, useToolOutput, useCallTool, etc.)\n * - All FrontMCP UI components (Card, Badge, Button)\n * - Dynamic renderer that imports and renders component code at runtime\n *\n * NO component code is included - it comes in the tool response via `_meta['ui/component']`.\n *\n * Flow:\n * 1. Shell is cached at tools/list (OpenAI caches outputTemplate)\n * 2. Tool response contains component code + structured data\n * 3. Shell imports component via blob URL and renders with data\n * 4. Re-renders on data updates via bridge notifications\n *\n * @param options - Hybrid widget shell options\n * @returns Complete HTML document string with dynamic renderer\n */\nexport function wrapHybridWidgetShell(options: WrapHybridWidgetShellOptions): string {\n  const { toolName, uiConfig, title, theme: themeOverrides } = options;\n\n  // Merge theme\n  const theme: ThemeConfig = themeOverrides ? mergeThemes(DEFAULT_THEME, themeOverrides) : DEFAULT_THEME;\n\n  // Build font links\n  const fontPreconnect = buildFontPreconnect();\n  const fontStylesheets = buildFontStylesheets({ inter: true });\n\n  // Build CDN scripts (Tailwind for styling)\n  const tailwindScript = buildCdnScripts({\n    tailwind: true,\n    htmx: false,\n    alpine: false,\n    icons: false,\n    inline: false,\n  });\n\n  // Build theme CSS\n  const themeCss = buildThemeCss(theme);\n  const customCss = theme.customCss || '';\n\n  // Build Tailwind style block\n  const styleBlock = `<style type=\"text/tailwindcss\">\n    @theme {\n      ${themeCss}\n    }\n    ${customCss}\n  </style>`;\n\n  // Loading placeholder content\n  const placeholderContent = `\n    <div id=\"frontmcp-widget-root\" class=\"flex items-center justify-center min-h-[200px] p-4\">\n      <div class=\"text-center text-gray-500\">\n        <svg class=\"animate-spin mx-auto mb-2\" style=\"width: 1.5rem; height: 1.5rem; color: #9ca3af;\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\">\n          <circle style=\"opacity: 0.25;\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n          <path style=\"opacity: 0.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>\n        </svg>\n        <p class=\"text-sm\">Loading widget...</p>\n      </div>\n    </div>\n    <div id=\"frontmcp-error\" style=\"display: none; padding: 1rem; margin: 1rem; background: #fef2f2; border: 1px solid #fecaca; border-radius: 0.5rem; color: #dc2626; font-size: 0.875rem;\"></div>\n  `;\n\n  // Tool metadata script\n  const toolMetaScript = `<script>\n  // Hybrid widget shell - component comes at tool call time\n  window.__mcpToolName = ${JSON.stringify(toolName)};\n  window.__mcpWidgetAccessible = ${JSON.stringify(uiConfig.widgetAccessible ?? false)};\n  window.__mcpHybridShell = true;\n</script>`;\n\n  // FrontMCP Bridge script (platform-agnostic)\n  const bridgeScript = BRIDGE_SCRIPT_TAGS.universal;\n\n  // Spinner animation CSS\n  const spinnerCss = `<style>\n    @keyframes spin { to { transform: rotate(360deg); } }\n    .animate-spin { animation: spin 1s linear infinite; }\n  </style>`;\n\n  // React 19 runtime + FrontMCP hooks + UI components + dynamic renderer\n  // This is the key script that makes hybrid mode work\n  const hybridRuntimeScript = `\n  <!-- FrontMCP Hybrid Widget Runtime -->\n  <script type=\"module\">\n  // ============================================\n  // 1. Import React 19 from esm.sh\n  // ============================================\n  import React from 'https://esm.sh/react@19';\n  import ReactDOM from 'https://esm.sh/react-dom@19/client';\n\n  // Make React available globally\n  window.React = React;\n  window.ReactDOM = ReactDOM;\n\n  // ============================================\n  // 2. Provide webpack namespace objects for transpiled components\n  // ============================================\n  window.external_react_namespaceObject = React;\n  window.jsx_runtime_namespaceObject = {\n    jsx: (type, props, key) => {\n      if (key !== undefined) props = { ...props, key };\n      return React.createElement(type, props);\n    },\n    jsxs: (type, props, key) => {\n      if (key !== undefined) props = { ...props, key };\n      return React.createElement(type, props);\n    },\n    Fragment: React.Fragment,\n  };\n  window.process = window.process || { env: { NODE_ENV: 'production' } };\n\n  // ============================================\n  // 3. FrontMCP Hooks (platform-agnostic via bridge)\n  // ============================================\n  function useMcpBridgeContext() {\n    return {\n      bridge: window.FrontMcpBridge || null,\n      loading: false,\n      error: null,\n      ready: window.FrontMcpBridge?.initialized ?? false,\n      adapterId: window.FrontMcpBridge?.adapterId ?? 'unknown',\n      capabilities: window.FrontMcpBridge?.capabilities ?? {},\n    };\n  }\n\n  function useToolOutput() {\n    const [output, setOutput] = React.useState(null);\n    React.useEffect(() => {\n      const bridge = window.FrontMcpBridge;\n      if (!bridge) return;\n\n      // Get initial output\n      const initial = bridge.getToolOutput();\n      if (initial) setOutput(initial);\n\n      // Subscribe to updates\n      const unsubscribe = bridge.onToolResult((result) => {\n        setOutput(result);\n      });\n      return unsubscribe;\n    }, []);\n    return output;\n  }\n\n  function useToolInput() {\n    const bridge = window.FrontMcpBridge;\n    return bridge?.getToolInput() || window.__mcpToolInput || {};\n  }\n\n  function useTheme() {\n    const [theme, setTheme] = React.useState('light');\n    React.useEffect(() => {\n      const bridge = window.FrontMcpBridge;\n      if (bridge?.getTheme) setTheme(bridge.getTheme());\n    }, []);\n    return theme;\n  }\n\n  function useCallTool(toolName, options = {}) {\n    const [loading, setLoading] = React.useState(false);\n    const [error, setError] = React.useState(null);\n\n    const isAvailable = !!(\n      (window.openai && typeof window.openai.callTool === 'function') ||\n      (window.FrontMcpBridge && window.FrontMcpBridge.hasCapability('canCallTools'))\n    );\n\n    const callTool = React.useCallback(async (args) => {\n      setLoading(true);\n      setError(null);\n      try {\n        let result;\n        if (window.openai && typeof window.openai.callTool === 'function') {\n          result = await window.openai.callTool(toolName, args || {});\n        } else if (window.FrontMcpBridge) {\n          result = await window.FrontMcpBridge.callTool(toolName, args || {});\n        } else {\n          throw new Error('Tool calling not available');\n        }\n        options.onSuccess?.(result);\n        return result;\n      } catch (err) {\n        setError(err);\n        options.onError?.(err);\n        throw err;\n      } finally {\n        setLoading(false);\n      }\n    }, [toolName]);\n\n    return [callTool, { loading, error, available: isAvailable }];\n  }\n\n  // ============================================\n  // 4. FrontMCP UI Components\n  // ============================================\n  function Card({ title, subtitle, variant, size, className, children, footer }) {\n    const baseClasses = 'rounded-lg border bg-bg-surface';\n    const variantClasses = variant === 'elevated' ? 'shadow-md' : 'border-divider';\n    const sizeClasses = { sm: 'p-3', md: 'p-4', lg: 'p-6' }[size || 'md'];\n    return React.createElement('div', { className: [baseClasses, variantClasses, sizeClasses, className].filter(Boolean).join(' ') },\n      (title || subtitle) && React.createElement('div', { className: 'mb-4' },\n        title && React.createElement('h3', { className: 'text-lg font-semibold text-text-primary' }, title),\n        subtitle && React.createElement('p', { className: 'text-sm text-text-secondary mt-1' }, subtitle)\n      ),\n      children,\n      footer && React.createElement('div', { className: 'mt-4 pt-4 border-t border-divider' }, footer)\n    );\n  }\n\n  function Badge({ children, variant, size, pill }) {\n    const baseClasses = 'inline-flex items-center font-medium';\n    const variantClasses = {\n      default: 'bg-bg-secondary text-text-primary',\n      success: 'bg-green-100 text-green-800',\n      warning: 'bg-yellow-100 text-yellow-800',\n      info: 'bg-blue-100 text-blue-800',\n      danger: 'bg-red-100 text-red-800',\n    }[variant || 'default'];\n    const sizeClasses = { sm: 'px-2 py-0.5 text-xs', md: 'px-2.5 py-1 text-sm', lg: 'px-3 py-1.5 text-base' }[size || 'md'];\n    const pillClasses = pill ? 'rounded-full' : 'rounded-md';\n    return React.createElement('span', {\n      className: [baseClasses, variantClasses, sizeClasses, pillClasses].filter(Boolean).join(' ')\n    }, children);\n  }\n\n  function Button({ children, variant, size, disabled, onClick, className }) {\n    const baseClasses = 'inline-flex items-center justify-center rounded-md font-medium transition-colors';\n    const variantClasses = {\n      primary: 'bg-primary text-white hover:bg-primary/90',\n      secondary: 'bg-bg-secondary text-text-primary hover:bg-bg-secondary/80',\n      outline: 'border border-divider bg-transparent hover:bg-bg-secondary',\n      ghost: 'bg-transparent hover:bg-bg-secondary',\n    }[variant || 'primary'];\n    const sizeClasses = { sm: 'px-3 py-1.5 text-sm', md: 'px-4 py-2 text-base', lg: 'px-6 py-3 text-lg' }[size || 'md'];\n    const disabledClasses = disabled ? 'opacity-50 cursor-not-allowed' : '';\n    return React.createElement('button', {\n      type: 'button',\n      className: [baseClasses, variantClasses, sizeClasses, disabledClasses, className].filter(Boolean).join(' '),\n      disabled,\n      onClick,\n    }, children);\n  }\n\n  // Expose via react_namespaceObject for transpiled components\n  window.react_namespaceObject = {\n    ...React,\n    useMcpBridgeContext,\n    useToolOutput,\n    useToolInput,\n    useTheme,\n    useCallTool,\n    Card,\n    Badge,\n    Button,\n    McpBridgeProvider: ({ children }) => children,\n  };\n  window.react_dom_namespaceObject = ReactDOM;\n\n  // Template helpers\n  window.__frontmcp_helpers = {\n    escapeHtml: (str) => String(str).replace(/[&<>\"']/g, c => ({'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#39;'})[c] || c),\n    formatDate: (d) => new Date(d).toLocaleDateString(),\n    formatCurrency: (a, c) => new Intl.NumberFormat('en-US', {style:'currency',currency:c||'USD'}).format(a),\n  };\n\n  // Component-specific helpers (for weather demo, etc.)\n  window.iconMap = {\n    sunny: '\\\\u2600\\\\uFE0F', cloudy: '\\\\u2601\\\\uFE0F', rainy: '\\\\uD83C\\\\uDF27\\\\uFE0F',\n    snowy: '\\\\u2744\\\\uFE0F', stormy: '\\\\u26C8\\\\uFE0F', windy: '\\\\uD83D\\\\uDCA8', foggy: '\\\\uD83C\\\\uDF2B\\\\uFE0F',\n  };\n  window.getConditionBadgeVariant = function(c) {\n    switch(c) { case 'sunny': return 'success'; case 'rainy': case 'snowy': return 'info'; case 'stormy': return 'warning'; default: return 'default'; }\n  };\n\n  console.log('[FrontMCP Hybrid] React 19 runtime loaded with hooks and components');\n\n  // ============================================\n  // 5. Dynamic Renderer\n  // ============================================\n  let currentComponent = null;\n  let reactRoot = null;\n\n  function hideLoader() {\n    const loader = document.querySelector('#frontmcp-widget-root > div');\n    if (loader) loader.style.display = 'none';\n  }\n\n  function showError(message) {\n    const errorEl = document.getElementById('frontmcp-error');\n    if (errorEl) {\n      errorEl.textContent = message;\n      errorEl.style.display = 'block';\n    }\n    hideLoader();\n  }\n\n  function render() {\n    const bridge = window.FrontMcpBridge;\n    const output = bridge?.getToolOutput();\n\n    if (!currentComponent) {\n      console.log('[FrontMCP Hybrid] No component loaded yet');\n      return false;\n    }\n\n    if (!output) {\n      console.log('[FrontMCP Hybrid] No data available yet');\n      return false;\n    }\n\n    const root = document.getElementById('frontmcp-widget-root');\n    if (!root) return false;\n\n    const props = {\n      input: bridge.getToolInput() || {},\n      output: output,\n      structuredContent: bridge.getStructuredContent(),\n      helpers: window.__frontmcp_helpers,\n    };\n\n    try {\n      hideLoader();\n      const element = React.createElement(currentComponent, props);\n      if (!reactRoot) {\n        reactRoot = ReactDOM.createRoot(root);\n      }\n      reactRoot.render(element);\n      console.log('[FrontMCP Hybrid] Component rendered with data');\n      return true;\n    } catch (err) {\n      console.error('[FrontMCP Hybrid] Render failed:', err);\n      showError('Rendering failed: ' + err.message);\n      return false;\n    }\n  }\n\n  async function loadComponent(payload) {\n    if (!payload?.code) {\n      console.warn('[FrontMCP Hybrid] No component code in payload');\n      return;\n    }\n\n    console.log('[FrontMCP Hybrid] Loading component, type:', payload.type);\n\n    try {\n      // Import component via blob URL\n      const blob = new Blob([payload.code], { type: 'application/javascript' });\n      const url = URL.createObjectURL(blob);\n\n      const module = await import(/* webpackIgnore: true */ url);\n      currentComponent = module.default || window.__frontmcp_component;\n      URL.revokeObjectURL(url);\n\n      if (!currentComponent) {\n        throw new Error('Component not found in module');\n      }\n\n      console.log('[FrontMCP Hybrid] Component loaded successfully');\n      render();\n    } catch (err) {\n      console.error('[FrontMCP Hybrid] Failed to load component:', err);\n      showError('Failed to load component: ' + err.message);\n    }\n  }\n\n  // ============================================\n  // 6. Bridge Integration\n  // ============================================\n  async function initializeBridge() {\n    // Wait for bridge to be ready\n    if (!window.FrontMcpBridge?.initialized) {\n      await new Promise(resolve => {\n        window.addEventListener('bridge:ready', resolve, { once: true });\n        // Fallback timeout\n        setTimeout(resolve, 5000);\n      });\n    }\n\n    const bridge = window.FrontMcpBridge;\n    if (!bridge) {\n      console.error('[FrontMCP Hybrid] Bridge not available');\n      showError('Bridge initialization failed');\n      return;\n    }\n\n    console.log('[FrontMCP Hybrid] Bridge ready, adapter:', bridge.adapterId);\n\n    // Listen for component code in tool response metadata\n    if (typeof bridge.onToolResponseMetadata === 'function') {\n      bridge.onToolResponseMetadata(function(metadata) {\n        console.log('[FrontMCP Hybrid] Received tool response metadata');\n\n        // Check for component payload\n        const componentPayload = metadata['ui/component'];\n        if (componentPayload) {\n          loadComponent(componentPayload);\n        }\n      });\n    }\n\n    // Listen for data updates (for re-renders)\n    if (typeof bridge.onToolResult === 'function') {\n      bridge.onToolResult(function(result) {\n        console.log('[FrontMCP Hybrid] Received tool result update');\n        render();\n      });\n    }\n\n    // Check if data already available (e.g., page refresh)\n    const existingMetadata = bridge.getToolResponseMetadata?.();\n    if (existingMetadata?.['ui/component']) {\n      loadComponent(existingMetadata['ui/component']);\n    }\n  }\n\n  // Start initialization\n  initializeBridge();\n  </script>`;\n\n  return `<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  <title>${escapeHtml(title || toolName)}</title>\n  ${fontPreconnect}\n  ${fontStylesheets}\n  ${tailwindScript}\n  ${styleBlock}\n  ${spinnerCss}\n  ${toolMetaScript}\n  ${bridgeScript}\n</head>\n<body class=\"bg-white font-sans antialiased\">\n  ${placeholderContent}\n  ${hybridRuntimeScript}\n</body>\n</html>`;\n}\n\n/**\n * Wrap a static widget template for MCP resource mode.\n *\n * Unlike `wrapToolUIUniversal`, this function creates a widget that:\n * - Does NOT embed data (input/output/structuredContent)\n * - Reads data at runtime from the FrontMCP Bridge (window.openai.toolOutput)\n * - Is cached at server startup and returned for all requests\n *\n * This is used for `servingMode: 'static'` where OpenAI caches the\n * outputTemplate HTML and injects data via window.openai.toolOutput.\n *\n * @param options - Static widget options\n * @returns Complete HTML document string\n *\n * @example\n * ```typescript\n * const html = wrapStaticWidgetUniversal({\n *   toolName: 'get_weather',\n *   ssrContent: '<div class=\"weather-card\"><!-- Template without data --></div>',\n *   uiConfig: { widgetAccessible: true },\n * });\n * ```\n */\nexport function wrapStaticWidgetUniversal(options: WrapStaticWidgetOptions): string {\n  const {\n    toolName,\n    ssrContent,\n    uiConfig,\n    title,\n    theme: themeOverrides,\n    rendererType,\n    componentCode,\n    embeddedData,\n    selfContained = false,\n  } = options;\n\n  // Merge theme\n  const theme: ThemeConfig = themeOverrides ? mergeThemes(DEFAULT_THEME, themeOverrides) : DEFAULT_THEME;\n\n  // Build font links\n  const fontPreconnect = buildFontPreconnect();\n  const fontStylesheets = buildFontStylesheets({ inter: true });\n\n  // Build CDN scripts\n  const scripts = buildCdnScripts({\n    tailwind: true,\n    htmx: false,\n    alpine: false,\n    icons: false,\n    inline: false,\n  });\n\n  // Build theme CSS\n  const themeCss = buildThemeCss(theme);\n  const customCss = theme.customCss || '';\n\n  // Build Tailwind style block\n  const styleBlock = `<style type=\"text/tailwindcss\">\n    @theme {\n      ${themeCss}\n    }\n    ${customCss}\n  </style>`;\n\n  // Build CSP meta tag (skip for OpenAI - they handle CSP via _meta)\n  // For static widgets, we skip CSP meta tag since OpenAI handles it\n  const cspMetaTag = '';\n\n  const isReactBased = rendererType === 'react' || rendererType === 'mdx';\n\n  // For inline mode with embeddedData: embed the data directly in the HTML\n  // For static mode (no embeddedData): data comes from window.openai.toolOutput at runtime\n  const hasEmbeddedData = embeddedData && (embeddedData.output !== undefined || embeddedData.input !== undefined);\n\n  // Universal bridge script (works on all platforms)\n  // Skip for self-contained/inline mode - data is embedded, no runtime communication needed\n  // Including the bridge triggers OpenAI's wrapper script which destroys our React content\n  // selfContained mode: explicitly skip bridge (inline mode with full React)\n  // hasEmbeddedData: backward compatibility for inline mode detection\n  const includeBridge = !selfContained && !hasEmbeddedData;\n  const bridgeScript = includeBridge ? BRIDGE_SCRIPT_TAGS.universal : '';\n\n  // Tool name injection (for Bridge to know which tool this is)\n  const helpers = createTemplateHelpers();\n\n  // Build the tool metadata script based on mode\n  // selfContained: inline mode with no bridge - React manages its own state\n  // hasEmbeddedData: backward compat - inline mode with embedded data\n  // neither: static mode - polls for data from host platform\n  const toolNameScript =\n    selfContained && hasEmbeddedData\n      ? `<script>\n  // Tool metadata (self-contained inline mode - no bridge, no wrapper interference)\n  window.__mcpToolName = ${helpers.jsonEmbed(toolName)};\n  window.__mcpWidgetAccessible = ${helpers.jsonEmbed(uiConfig.widgetAccessible ?? false)};\n  // Embedded data for immediate rendering\n  window.__mcpToolInput = ${helpers.jsonEmbed(embeddedData.input ?? {})};\n  window.__mcpToolOutput = ${helpers.jsonEmbed(embeddedData.output)};\n  window.__mcpStructuredContent = ${helpers.jsonEmbed(embeddedData.structuredContent)};\n  // Flags for self-contained mode\n  window.__mcpDataEmbedded = true;\n  window.__mcpSelfContained = true;\n  // No bridge included - React component handles state internally via hooks\n</script>`\n      : hasEmbeddedData\n      ? `<script>\n  // Tool metadata (inline mode - data embedded, backward compat)\n  window.__mcpToolName = ${helpers.jsonEmbed(toolName)};\n  window.__mcpWidgetAccessible = ${helpers.jsonEmbed(uiConfig.widgetAccessible ?? false)};\n  window.__mcpToolInput = ${helpers.jsonEmbed(embeddedData.input ?? {})};\n  window.__mcpToolOutput = ${helpers.jsonEmbed(embeddedData.output)};\n  window.__mcpStructuredContent = ${helpers.jsonEmbed(embeddedData.structuredContent)};\n  window.__mcpDataEmbedded = true;\n</script>`\n      : `<script>\n  // Tool metadata (static mode - data injected by host at runtime)\n  window.__mcpToolName = ${helpers.jsonEmbed(toolName)};\n  window.__mcpWidgetAccessible = ${helpers.jsonEmbed(uiConfig.widgetAccessible ?? false)};\n  // Data will be provided by host platform:\n  // - OpenAI: window.openai.toolOutput\n  // - FrontMCP Bridge: window.__mcpToolOutput, window.__mcpStructuredContent\n</script>`;\n\n  // Build the consolidated React module script\n  // Everything runs inside a single ES module for better async/import handling\n  const reactModuleScript =\n    isReactBased && componentCode\n      ? `\n  <!-- FrontMCP React Widget Runtime (Single ES Module) -->\n  <script type=\"module\">\n  // ============================================\n  // 1. Import React 19 from esm.sh\n  // ============================================\n  import React from 'https://esm.sh/react@19';\n  import ReactDOM from 'https://esm.sh/react-dom@19/client';\n\n  // Make React available globally for the component code\n  window.React = React;\n  window.ReactDOM = ReactDOM;\n\n  // ============================================\n  // 1b. Provide ALL webpack namespace objects\n  // ============================================\n  // Webpack generates different namespace variable names when bundling:\n  // - external_react_namespaceObject: React marked as external\n  // - jsx_runtime_namespaceObject: react/jsx-runtime\n  // We must provide ALL of these for transpiled components to work.\n\n  // external_react_namespaceObject - for React imports (useState, useEffect, etc.)\n  window.external_react_namespaceObject = React;\n\n  // jsx_runtime_namespaceObject - for JSX transformation (jsx, jsxs functions)\n  window.jsx_runtime_namespaceObject = {\n    jsx: (type, props, key) => {\n      if (key !== undefined) props = { ...props, key };\n      return React.createElement(type, props);\n    },\n    jsxs: (type, props, key) => {\n      if (key !== undefined) props = { ...props, key };\n      return React.createElement(type, props);\n    },\n    Fragment: React.Fragment,\n  };\n\n  // process.env - for development mode checks\n  window.process = window.process || { env: { NODE_ENV: 'production' } };\n\n  // ============================================\n  // 1c. Component-specific helpers\n  // ============================================\n  // These are module-level variables that get lost when calling .toString() on the component.\n  // For the weather component, we need iconMap and getConditionBadgeVariant.\n\n  window.iconMap = {\n    sunny: '\\u2600\\uFE0F',\n    cloudy: '\\u2601\\uFE0F',\n    rainy: '\\uD83C\\uDF27\\uFE0F',\n    snowy: '\\u2744\\uFE0F',\n    stormy: '\\u26C8\\uFE0F',\n    windy: '\\uD83D\\uDCA8',\n    foggy: '\\uD83C\\uDF2B\\uFE0F',\n  };\n\n  window.getConditionBadgeVariant = function(conditions) {\n    switch (conditions) {\n      case 'sunny': return 'success';\n      case 'rainy':\n      case 'snowy': return 'info';\n      case 'stormy': return 'warning';\n      default: return 'default';\n    }\n  };\n\n  // ============================================\n  // 2. Provide FrontMCP hooks on the react namespace\n  // ============================================\n  // Transpiled components may call react_namespaceObject.useMcpBridgeContext, etc.\n  // These are FrontMCP hooks that get bundled with React imports.\n  // We provide stub implementations that work with the client-side data.\n\n  // State storage for hooks\n  const hookState = {\n    toolOutput: null,\n    toolInput: null,\n    theme: 'light',\n    ready: false,\n  };\n\n  // useMcpBridgeContext - returns context about the bridge\n  function useMcpBridgeContext() {\n    return {\n      bridge: window.__frontmcp?.bridge || null,\n      loading: false,\n      error: null,\n      ready: hookState.ready,\n      adapterId: 'openai',\n      capabilities: { canCallTools: true, canSendMessages: false },\n    };\n  }\n\n  // useToolOutput - returns the tool output\n  function useToolOutput() {\n    const [output, setOutput] = React.useState(hookState.toolOutput);\n    React.useEffect(() => {\n      // Update when toolOutput changes\n      const checkOutput = () => {\n        const newOutput = getToolOutput();\n        if (newOutput && newOutput !== output) {\n          setOutput(newOutput);\n          hookState.toolOutput = newOutput;\n        }\n      };\n      const interval = setInterval(checkOutput, 100);\n      checkOutput();\n      return () => clearInterval(interval);\n    }, []);\n    return output;\n  }\n\n  // useToolInput - returns the tool input\n  function useToolInput() {\n    return hookState.toolInput || window.__mcpToolInput || {};\n  }\n\n  // useTheme - returns current theme\n  function useTheme() {\n    const [theme, setTheme] = React.useState(hookState.theme);\n    React.useEffect(() => {\n      // Try to detect theme from host\n      if (window.openai?.theme) {\n        setTheme(window.openai.theme);\n      }\n    }, []);\n    return theme;\n  }\n\n  // useCallTool - returns a function to call tools from within widgets\n  // Supports multiple environments:\n  // - OpenAI: Uses window.openai.callTool directly\n  // - FrontMCP Bridge: Uses window.__frontmcp.callTool\n  // - Other: Falls back gracefully\n  function useCallTool(toolName, options = {}) {\n    const [loading, setLoading] = React.useState(false);\n    const [error, setError] = React.useState(null);\n\n    // Check availability once\n    const isAvailable = !!(\n      (window.openai && typeof window.openai.callTool === 'function') ||\n      (window.__frontmcp && typeof window.__frontmcp.callTool === 'function')\n    );\n\n    const callTool = React.useCallback(async (args) => {\n      setLoading(true);\n      setError(null);\n      try {\n        let result;\n\n        // Priority 1: OpenAI SDK (most reliable in OpenAI iframe)\n        if (window.openai && typeof window.openai.callTool === 'function') {\n          console.log('[FrontMCP] useCallTool: Using OpenAI SDK for', toolName);\n          result = await window.openai.callTool(toolName, args || {});\n        } else if (window.__frontmcp && typeof window.__frontmcp.callTool === 'function') {\n          // Priority 2: FrontMCP bridge\n          console.log('[FrontMCP] useCallTool: Using FrontMCP bridge for', toolName);\n          result = await window.__frontmcp.callTool(toolName, args || {});\n        } else {\n          // Not available - log warning and return null\n          console.warn(\n            '[FrontMCP] useCallTool: No tool calling mechanism available. ' +\n            'Tool: \"' + toolName + '\". Widget is display-only.'\n          );\n          const notAvailableError = new Error('Tool calling not available in this environment');\n          setError(notAvailableError);\n          options.onError?.(notAvailableError);\n          return null;\n        }\n\n        // Normalize result: ensure structuredContent is available for component callbacks\n        // OpenAI returns raw tool output directly, but components may expect { structuredContent: ... }\n        // This ensures both direct access (result.temperature) and wrapped access (result.structuredContent.temperature) work\n        const normalizedResult = {\n          ...result,\n          structuredContent: result.structuredContent ?? result,\n        };\n\n        // For static mode: Update global state so hooks (useToolOutput) pick up the change\n        // For self-contained/inline mode: Skip this - React component handles state internally via setOutput\n        // Updating global state in inline mode could trigger OpenAI's wrapper to overwrite our React component\n        if (!window.__mcpSelfContained && !window.__mcpDataEmbedded) {\n          window.__mcpToolOutput = normalizedResult.structuredContent;\n          window.__mcpStructuredContent = normalizedResult.structuredContent;\n        }\n\n        console.log('[FrontMCP] useCallTool: Tool returned, normalized result:', normalizedResult);\n        options.onSuccess?.(normalizedResult);\n        return normalizedResult;\n      } catch (err) {\n        console.error('[FrontMCP] useCallTool error:', err);\n        setError(err);\n        options.onError?.(err);\n        throw err;\n      } finally {\n        setLoading(false);\n      }\n    }, [toolName]);\n\n    return [callTool, { loading, error, available: isAvailable }];\n  }\n\n  // ============================================\n  // 2b. UI Components (Card, Badge, etc.)\n  // ============================================\n  // These may be bundled from @frontmcp/ui/react and referenced via namespace.\n  // We provide simple stub implementations.\n\n  function Card({ title, subtitle, variant, size, className, children, footer }) {\n    const baseClasses = 'rounded-lg border bg-bg-surface';\n    const variantClasses = variant === 'elevated' ? 'shadow-md' : 'border-divider';\n    const sizeClasses = { sm: 'p-3', md: 'p-4', lg: 'p-6' }[size || 'md'];\n\n    return React.createElement('div', { className: [baseClasses, variantClasses, sizeClasses, className].filter(Boolean).join(' ') },\n      (title || subtitle) && React.createElement('div', { className: 'mb-4' },\n        title && React.createElement('h3', { className: 'text-lg font-semibold text-text-primary' }, title),\n        subtitle && React.createElement('p', { className: 'text-sm text-text-secondary mt-1' }, subtitle)\n      ),\n      children,\n      footer && React.createElement('div', { className: 'mt-4 pt-4 border-t border-divider' }, footer)\n    );\n  }\n\n  function Badge({ children, variant, size, pill }) {\n    const baseClasses = 'inline-flex items-center font-medium';\n    const variantClasses = {\n      default: 'bg-bg-secondary text-text-primary',\n      success: 'bg-green-100 text-green-800',\n      warning: 'bg-yellow-100 text-yellow-800',\n      info: 'bg-blue-100 text-blue-800',\n      danger: 'bg-red-100 text-red-800',\n    }[variant || 'default'];\n    const sizeClasses = { sm: 'px-2 py-0.5 text-xs', md: 'px-2.5 py-1 text-sm', lg: 'px-3 py-1.5 text-base' }[size || 'md'];\n    const pillClasses = pill ? 'rounded-full' : 'rounded-md';\n\n    return React.createElement('span', {\n      className: [baseClasses, variantClasses, sizeClasses, pillClasses].filter(Boolean).join(' ')\n    }, children);\n  }\n\n  function Button({ children, variant, size, disabled, onClick, className }) {\n    const baseClasses = 'inline-flex items-center justify-center rounded-md font-medium transition-colors';\n    const variantClasses = {\n      primary: 'bg-primary text-white hover:bg-primary/90',\n      secondary: 'bg-bg-secondary text-text-primary hover:bg-bg-secondary/80',\n      outline: 'border border-divider bg-transparent hover:bg-bg-secondary',\n      ghost: 'bg-transparent hover:bg-bg-secondary',\n    }[variant || 'primary'];\n    const sizeClasses = { sm: 'px-3 py-1.5 text-sm', md: 'px-4 py-2 text-base', lg: 'px-6 py-3 text-lg' }[size || 'md'];\n    const disabledClasses = disabled ? 'opacity-50 cursor-not-allowed' : '';\n\n    return React.createElement('button', {\n      type: 'button',\n      className: [baseClasses, variantClasses, sizeClasses, disabledClasses, className].filter(Boolean).join(' '),\n      disabled,\n      onClick,\n    }, children);\n  }\n\n  // Provide webpack-style namespace objects that transpiled components may reference\n  // This fixes \"react_namespaceObject is not defined\" errors\n  // Include both React exports AND FrontMCP hooks/components\n  window.react_namespaceObject = {\n    ...React,\n    // FrontMCP hooks\n    useMcpBridgeContext,\n    useToolOutput,\n    useToolInput,\n    useTheme,\n    useCallTool,\n    // FrontMCP UI components\n    Card,\n    Badge,\n    Button,\n    // Also provide as 'McpBridgeProvider' stub (no-op for client)\n    McpBridgeProvider: ({ children }) => children,\n  };\n  window.react_dom_namespaceObject = ReactDOM;\n\n  console.log('[FrontMCP] React 19 loaded from esm.sh with FrontMCP hooks');\n\n  // ============================================\n  // 2. Define the Component\n  // ============================================\n  // Note: The component may reference react_namespaceObject which is now available\n  ${componentCode}\n\n  // ============================================\n  // 3. Helper Functions\n  // ============================================\n  function getComponent() {\n    return window.__frontmcp_component;\n  }\n\n  function getToolOutput() {\n    // Try OpenAI's toolOutput first\n    if (window.openai && window.openai.toolOutput) {\n      return window.openai.toolOutput;\n    }\n    // Try FrontMCP bridge\n    if (window.__mcpToolOutput) {\n      return window.__mcpToolOutput;\n    }\n    // Try __frontmcp namespace\n    if (window.__frontmcp && window.__frontmcp.toolOutput) {\n      return window.__frontmcp.toolOutput;\n    }\n    return null;\n  }\n\n  function showLoader() {\n    const loader = document.getElementById('frontmcp-loader');\n    if (loader) loader.style.display = 'flex';\n  }\n\n  function hideLoader() {\n    const loader = document.getElementById('frontmcp-loader');\n    if (loader) loader.style.display = 'none';\n  }\n\n  function showError(message) {\n    const errorEl = document.getElementById('frontmcp-error');\n    if (errorEl) {\n      errorEl.textContent = message;\n      errorEl.style.display = 'block';\n    }\n    hideLoader();\n  }\n\n  // ============================================\n  // 4. Render Function\n  // ============================================\n  function renderComponent() {\n    const Component = getComponent();\n    if (!Component) {\n      console.warn('[FrontMCP] No component registered for client-side rendering');\n      showError('Component not found');\n      return false;\n    }\n\n    const output = getToolOutput();\n    if (!output) {\n      return false; // Not ready yet, keep polling\n    }\n\n    // Find or create widget root\n    // OpenAI may have removed our original root element during iframe setup\n    // when their wrapper script overwrites #widget-root with a loading spinner\n    let root = document.getElementById('frontmcp-widget-root');\n    if (!root) {\n      console.log('[FrontMCP] Widget root not found, creating new element');\n\n      // Look for OpenAI's container first - we should render inside it\n      const openaiRoot = document.getElementById('widget-root');\n\n      if (openaiRoot) {\n        // Clear OpenAI's wrapper content and create our root inside\n        console.log('[FrontMCP] Found OpenAI widget-root, creating frontmcp-widget-root inside it');\n        openaiRoot.innerHTML = '';\n        root = document.createElement('div');\n        root.id = 'frontmcp-widget-root';\n        openaiRoot.appendChild(root);\n      } else {\n        // Fallback: create in body (for MCP Inspector, etc.)\n        console.log('[FrontMCP] No OpenAI widget-root, creating in body');\n        root = document.createElement('div');\n        root.id = 'frontmcp-widget-root';\n        document.body.innerHTML = '';\n        document.body.appendChild(root);\n      }\n    }\n\n    // Ensure it's visible\n    root.style.display = 'block';\n\n    try {\n      // Build props\n      const props = {\n        input: window.__mcpToolInput || {},\n        output: output,\n        structuredContent: window.__mcpStructuredContent,\n        helpers: {\n          escapeHtml: (str) => String(str).replace(/[&<>\"']/g, c => ({'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#39;'})[c] || c),\n          formatDate: (d) => new Date(d).toLocaleDateString(),\n          formatCurrency: (a, c) => new Intl.NumberFormat('en-US', {style:'currency',currency:c||'USD'}).format(a),\n        }\n      };\n\n      // Hide loader and show widget root before rendering\n      hideLoader();\n      root.style.display = 'block';\n\n      // Render with React 19\n      const element = React.createElement(Component, props);\n      const reactRoot = ReactDOM.createRoot(root);\n      reactRoot.render(element);\n      console.log('[FrontMCP] Component rendered successfully with data:', output);\n\n      // Mark React as mounted to prevent OpenAI wrapper from overwriting\n      // This works with the renderContent override in the Tool Metadata script\n      window.__frontmcp = window.__frontmcp || {};\n      window.__frontmcp._reactMounted = true;\n\n      // For inline mode: prevent OpenAI's wrapper from re-rendering over us\n      // The wrapper subscribes to bridge state changes and will overwrite our content\n      // when bridge.setData is called. We disable this after initial render.\n      if (window.__mcpDataEmbedded && window.__frontmcp && window.__frontmcp.bridge) {\n        window.__frontmcp._inlineRendered = true;\n\n        // Override setData to no-op after inline render\n        const originalSetData = window.__frontmcp.bridge.setData;\n        if (originalSetData && !window.__frontmcp._setDataOverridden) {\n          window.__frontmcp._setDataOverridden = true;\n          window.__frontmcp.bridge.setData = function(data) {\n            if (window.__frontmcp._inlineRendered) {\n              console.log('[FrontMCP] Skipping bridge setData - inline mode already rendered');\n              return;\n            }\n            return originalSetData.call(this, data);\n          };\n        }\n      }\n\n      return true;\n    } catch (e) {\n      console.error('[FrontMCP] React rendering failed:', e);\n      showError('Rendering failed: ' + e.message);\n      return false;\n    }\n  }\n\n  // ============================================\n  // 5. Main: Render immediately or poll for toolOutput\n  // ============================================\n  // For inline mode (embeddedData): data is already embedded, render immediately\n  // For static mode: poll for window.openai.toolOutput\n\n  if (window.__mcpDataEmbedded) {\n    // Inline mode: Data is embedded in HTML, render immediately\n    console.log('[FrontMCP] Inline mode: data embedded, rendering immediately');\n    if (!renderComponent()) {\n      showError('Failed to render component');\n    }\n  } else {\n    // MCP-resource mode: Poll for toolOutput from host platform\n    showLoader();\n\n    let attempts = 0;\n    const maxAttempts = 100; // 10 seconds max\n    const pollInterval = setInterval(() => {\n      attempts++;\n      if (renderComponent()) {\n        clearInterval(pollInterval);\n      } else if (attempts >= maxAttempts) {\n        clearInterval(pollInterval);\n        if (!getToolOutput()) {\n          console.warn('[FrontMCP] Timeout waiting for toolOutput');\n          showError('Timeout waiting for data');\n        }\n      }\n    }, 100);\n  }\n  </script>`\n      : '';\n\n  // Page title\n  const pageTitle = title || `${escapeHtml(toolName)} - Tool Widget`;\n\n  // Build loading indicator and error display\n  // Skip loader for inline mode - data is already embedded, SSR content is visible immediately\n  const loaderHtml =\n    isReactBased && componentCode && !hasEmbeddedData\n      ? `\n  <!-- Loading State -->\n  <div id=\"frontmcp-loader\" style=\"display: flex; align-items: center; justify-content: center; padding: 2rem; gap: 0.5rem;\">\n    <svg class=\"animate-spin\" style=\"width: 1.25rem; height: 1.25rem; color: #6b7280;\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\">\n      <circle style=\"opacity: 0.25;\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n      <path style=\"opacity: 0.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>\n    </svg>\n    <span style=\"color: #6b7280; font-size: 0.875rem;\">Loading widget...</span>\n  </div>\n  <div id=\"frontmcp-error\" style=\"display: none; padding: 1rem; margin: 1rem; background: #fef2f2; border: 1px solid #fecaca; border-radius: 0.5rem; color: #dc2626; font-size: 0.875rem;\"></div>\n  `\n      : '';\n\n  // Wrap SSR content in a root element for React to render into\n  // For static mode: widget root is hidden until data arrives (loader shows first)\n  // For inline mode: widget root is VISIBLE immediately (data is embedded, SSR is rendered)\n  const widgetRootStyle = hasEmbeddedData ? '' : 'display: none;';\n\n  const wrappedContent =\n    isReactBased && componentCode\n      ? `${loaderHtml}<div id=\"frontmcp-widget-root\" style=\"${widgetRootStyle}\">${ssrContent}</div>`\n      : ssrContent;\n\n  return `<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  <title>${pageTitle}</title>\n  ${cspMetaTag}\n\n  <!-- Fonts -->\n  ${fontPreconnect}\n  ${fontStylesheets}\n\n  <!-- Tailwind CSS -->\n  ${scripts}\n  ${styleBlock}\n\n  <!-- Spinner Animation -->\n  <style>\n    @keyframes spin { to { transform: rotate(360deg); } }\n    .animate-spin { animation: spin 1s linear infinite; }\n  </style>\n\n  <!-- Tool Metadata -->\n  ${toolNameScript}\n\n  <!-- FrontMCP Bridge (Universal - Reads data from host at runtime) -->\n  ${bridgeScript}\n</head>\n<body class=\"bg-background text-text-primary font-sans antialiased\">\n  ${wrappedContent}\n  ${reactModuleScript}\n</body>\n</html>`;\n}\n\n// ============================================\n// OpenAI-Specific Functions\n// ============================================\n\n/**\n * Build OpenAI Apps SDK specific meta annotations.\n * These are placed in _meta field of the tool response.\n */\nexport function buildOpenAIMeta(options: {\n  csp?: WrapToolUIOptions['csp'];\n  widgetAccessible?: boolean;\n  widgetDescription?: string;\n  displayMode?: 'inline' | 'fullscreen' | 'pip';\n}): Record<string, unknown> {\n  const meta: Record<string, unknown> = {};\n\n  // Widget accessibility\n  if (options.widgetAccessible) {\n    meta['openai/widgetAccessible'] = true;\n  }\n\n  // Widget description\n  if (options.widgetDescription) {\n    meta['openai/widgetDescription'] = options.widgetDescription;\n  }\n\n  // CSP configuration\n  if (options.csp) {\n    const cspConfig: Record<string, string[]> = {};\n    if (options.csp.connectDomains?.length) {\n      cspConfig['connect_domains'] = options.csp.connectDomains;\n    }\n    if (options.csp.resourceDomains?.length) {\n      cspConfig['resource_domains'] = options.csp.resourceDomains;\n    }\n    if (Object.keys(cspConfig).length > 0) {\n      meta['openai/widgetCSP'] = cspConfig;\n    }\n  }\n\n  // Display mode hint\n  if (options.displayMode && options.displayMode !== 'inline') {\n    meta['openai/displayMode'] = options.displayMode;\n  }\n\n  return meta;\n}\n\n/**\n * Get the MIME type for tool UI responses based on target platform\n */\nexport function getToolUIMimeType(platform: 'openai' | 'ext-apps' | 'generic' = 'generic'): string {\n  switch (platform) {\n    case 'openai':\n      return 'text/html+skybridge';\n    case 'ext-apps':\n      return 'text/html+mcp';\n    default:\n      return 'text/html';\n  }\n}\n"]}

package/src/styles/index.d.ts

@@ -1,7 +0,0 @@
-/**
- * @file styles/index.ts
- * @description Centralized CSS class definitions for UI components.
- *
- * @module @frontmcp/ui/styles
- */
-export * from './variants';

package/src/styles/index.js

@@ -1,11 +0,0 @@
-"use strict";
-/**
- * @file styles/index.ts
- * @description Centralized CSS class definitions for UI components.
- *
- * @module @frontmcp/ui/styles
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./variants"), exports);
-//# sourceMappingURL=index.js.map

package/src/styles/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/styles/index.ts"],"names":[],"mappings":";AAAA;;;;;GAKG;;;AAEH,qDAA2B","sourcesContent":["/**\n * @file styles/index.ts\n * @description Centralized CSS class definitions for UI components.\n *\n * @module @frontmcp/ui/styles\n */\n\nexport * from './variants';\n"]}

package/src/styles/variants.d.ts

@@ -1,50 +0,0 @@
-/**
- * @file variants.ts
- * @description Centralized CSS class definitions for all UI components.
- *
- * This is the single source of truth for Tailwind CSS classes used across
- * all components (Card, Badge, Button, Alert, etc.).
- *
- * @module @frontmcp/ui/styles
- */
-export type CardVariant = 'default' | 'outlined' | 'elevated' | 'filled' | 'ghost';
-export type CardSize = 'sm' | 'md' | 'lg';
-export declare const CARD_VARIANTS: Record<CardVariant, string>;
-export declare const CARD_SIZES: Record<CardSize, string>;
-export declare function getCardVariantClasses(variant: CardVariant): string;
-export declare function getCardSizeClasses(size: CardSize): string;
-export type BadgeVariant = 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' | 'outline';
-export type BadgeSize = 'sm' | 'md' | 'lg';
-export declare const BADGE_VARIANTS: Record<BadgeVariant, string>;
-export declare const BADGE_SIZES: Record<BadgeSize, string>;
-export declare const BADGE_DOT_SIZES: Record<BadgeSize, string>;
-export declare const BADGE_DOT_VARIANTS: Record<BadgeVariant, string>;
-export declare function getBadgeVariantClasses(variant: BadgeVariant): string;
-export declare function getBadgeSizeClasses(size: BadgeSize): string;
-export declare function getBadgeDotSizeClasses(size: BadgeSize): string;
-export declare function getBadgeDotVariantClasses(variant: BadgeVariant): string;
-export type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger' | 'success' | 'link';
-export type ButtonSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-export declare const BUTTON_VARIANTS: Record<ButtonVariant, string>;
-export declare const BUTTON_SIZES: Record<ButtonSize, string>;
-export declare const BUTTON_ICON_SIZES: Record<ButtonSize, string>;
-export declare const BUTTON_BASE_CLASSES = "inline-flex items-center justify-center font-medium rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-primary/50 focus:ring-offset-2";
-export declare function getButtonVariantClasses(variant: ButtonVariant): string;
-export declare function getButtonSizeClasses(size: ButtonSize, iconOnly: boolean): string;
-export type AlertVariant = 'info' | 'success' | 'warning' | 'danger' | 'neutral';
-export declare const ALERT_VARIANTS: Record<AlertVariant, {
-    container: string;
-    icon: string;
-}>;
-export declare const ALERT_BASE_CLASSES = "rounded-lg border p-4";
-export declare function getAlertVariantClasses(variant: AlertVariant): {
-    container: string;
-    icon: string;
-};
-export declare const ALERT_ICONS: Record<AlertVariant, string>;
-export declare const CLOSE_ICON = "<svg class=\"w-3 h-3\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n  <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"/>\n</svg>";
-export declare const LOADING_SPINNER = "<svg class=\"animate-spin -ml-1 mr-2 h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\">\n  <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n  <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>\n</svg>";
-/**
- * Join CSS classes, filtering out falsy values
- */
-export declare function cn(...classes: (string | undefined | null | false)[]): string;

package/src/styles/variants.js

@@ -1,175 +0,0 @@
-"use strict";
-/**
- * @file variants.ts
- * @description Centralized CSS class definitions for all UI components.
- *
- * This is the single source of truth for Tailwind CSS classes used across
- * all components (Card, Badge, Button, Alert, etc.).
- *
- * @module @frontmcp/ui/styles
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LOADING_SPINNER = exports.CLOSE_ICON = exports.ALERT_ICONS = exports.ALERT_BASE_CLASSES = exports.ALERT_VARIANTS = exports.BUTTON_BASE_CLASSES = exports.BUTTON_ICON_SIZES = exports.BUTTON_SIZES = exports.BUTTON_VARIANTS = exports.BADGE_DOT_VARIANTS = exports.BADGE_DOT_SIZES = exports.BADGE_SIZES = exports.BADGE_VARIANTS = exports.CARD_SIZES = exports.CARD_VARIANTS = void 0;
-exports.getCardVariantClasses = getCardVariantClasses;
-exports.getCardSizeClasses = getCardSizeClasses;
-exports.getBadgeVariantClasses = getBadgeVariantClasses;
-exports.getBadgeSizeClasses = getBadgeSizeClasses;
-exports.getBadgeDotSizeClasses = getBadgeDotSizeClasses;
-exports.getBadgeDotVariantClasses = getBadgeDotVariantClasses;
-exports.getButtonVariantClasses = getButtonVariantClasses;
-exports.getButtonSizeClasses = getButtonSizeClasses;
-exports.getAlertVariantClasses = getAlertVariantClasses;
-exports.cn = cn;
-exports.CARD_VARIANTS = {
-    default: 'bg-white border border-border rounded-xl shadow-sm',
-    outlined: 'bg-transparent border-2 border-border rounded-xl',
-    elevated: 'bg-white rounded-xl shadow-lg',
-    filled: 'bg-gray-50 rounded-xl',
-    ghost: 'bg-transparent',
-};
-exports.CARD_SIZES = {
-    sm: 'p-4',
-    md: 'p-6',
-    lg: 'p-8',
-};
-function getCardVariantClasses(variant) {
-    return exports.CARD_VARIANTS[variant];
-}
-function getCardSizeClasses(size) {
-    return exports.CARD_SIZES[size];
-}
-exports.BADGE_VARIANTS = {
-    default: 'bg-gray-100 text-gray-800',
-    primary: 'bg-primary/10 text-primary',
-    secondary: 'bg-secondary/10 text-secondary',
-    success: 'bg-success/10 text-success',
-    warning: 'bg-warning/10 text-warning',
-    danger: 'bg-danger/10 text-danger',
-    info: 'bg-blue-100 text-blue-800',
-    outline: 'border border-border text-text-primary bg-transparent',
-};
-exports.BADGE_SIZES = {
-    sm: 'px-2 py-0.5 text-xs',
-    md: 'px-2.5 py-1 text-xs',
-    lg: 'px-3 py-1.5 text-sm',
-};
-exports.BADGE_DOT_SIZES = {
-    sm: 'w-2 h-2',
-    md: 'w-2.5 h-2.5',
-    lg: 'w-3 h-3',
-};
-exports.BADGE_DOT_VARIANTS = {
-    default: 'bg-gray-400',
-    primary: 'bg-primary',
-    secondary: 'bg-secondary',
-    success: 'bg-success',
-    warning: 'bg-warning',
-    danger: 'bg-danger',
-    info: 'bg-blue-500',
-    outline: 'border border-current',
-};
-function getBadgeVariantClasses(variant) {
-    return exports.BADGE_VARIANTS[variant];
-}
-function getBadgeSizeClasses(size) {
-    return exports.BADGE_SIZES[size];
-}
-function getBadgeDotSizeClasses(size) {
-    return exports.BADGE_DOT_SIZES[size];
-}
-function getBadgeDotVariantClasses(variant) {
-    return exports.BADGE_DOT_VARIANTS[variant];
-}
-exports.BUTTON_VARIANTS = {
-    primary: 'bg-primary hover:bg-primary/90 text-white shadow-sm',
-    secondary: 'bg-secondary hover:bg-secondary/90 text-white shadow-sm',
-    outline: 'border-2 border-primary text-primary hover:bg-primary/10',
-    ghost: 'text-text-primary hover:bg-gray-100',
-    danger: 'bg-danger hover:bg-danger/90 text-white shadow-sm',
-    success: 'bg-success hover:bg-success/90 text-white shadow-sm',
-    link: 'text-primary hover:text-primary/80 hover:underline',
-};
-exports.BUTTON_SIZES = {
-    xs: 'px-2.5 py-1.5 text-xs',
-    sm: 'px-3 py-2 text-sm',
-    md: 'px-4 py-2.5 text-sm',
-    lg: 'px-5 py-3 text-base',
-    xl: 'px-6 py-3.5 text-lg',
-};
-exports.BUTTON_ICON_SIZES = {
-    xs: 'p-1.5',
-    sm: 'p-2',
-    md: 'p-2.5',
-    lg: 'p-3',
-    xl: 'p-4',
-};
-exports.BUTTON_BASE_CLASSES = 'inline-flex items-center justify-center font-medium rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-primary/50 focus:ring-offset-2';
-function getButtonVariantClasses(variant) {
-    return exports.BUTTON_VARIANTS[variant];
-}
-function getButtonSizeClasses(size, iconOnly) {
-    return iconOnly ? exports.BUTTON_ICON_SIZES[size] : exports.BUTTON_SIZES[size];
-}
-exports.ALERT_VARIANTS = {
-    info: {
-        container: 'bg-blue-50 border-blue-200 text-blue-800',
-        icon: 'text-blue-500',
-    },
-    success: {
-        container: 'bg-success/10 border-success/30 text-success',
-        icon: 'text-success',
-    },
-    warning: {
-        container: 'bg-warning/10 border-warning/30 text-warning',
-        icon: 'text-warning',
-    },
-    danger: {
-        container: 'bg-danger/10 border-danger/30 text-danger',
-        icon: 'text-danger',
-    },
-    neutral: {
-        container: 'bg-gray-50 border-gray-200 text-gray-800',
-        icon: 'text-gray-500',
-    },
-};
-exports.ALERT_BASE_CLASSES = 'rounded-lg border p-4';
-function getAlertVariantClasses(variant) {
-    return exports.ALERT_VARIANTS[variant];
-}
-// ============================================
-// Common Icons (SVG strings)
-// ============================================
-exports.ALERT_ICONS = {
-    info: `<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
-  </svg>`,
-    success: `<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
-  </svg>`,
-    warning: `<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>
-  </svg>`,
-    danger: `<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"/>
-  </svg>`,
-    neutral: `<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
-  </svg>`,
-};
-exports.CLOSE_ICON = `<svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
-</svg>`;
-exports.LOADING_SPINNER = `<svg class="animate-spin -ml-1 mr-2 h-4 w-4" 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>`;
-// ============================================
-// Utility Functions
-// ============================================
-/**
- * Join CSS classes, filtering out falsy values
- */
-function cn(...classes) {
-    return classes.filter(Boolean).join(' ');
-}
-//# sourceMappingURL=variants.js.map

package/src/styles/variants.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"variants.js","sourceRoot":"","sources":["../../../src/styles/variants.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @file variants.ts\n * @description Centralized CSS class definitions for all UI components.\n *\n * This is the single source of truth for Tailwind CSS classes used across\n * all components (Card, Badge, Button, Alert, etc.).\n *\n * @module @frontmcp/ui/styles\n */\n\n// ============================================\n// Card Styles\n// ============================================\n\nexport type CardVariant = 'default' | 'outlined' | 'elevated' | 'filled' | 'ghost';\nexport type CardSize = 'sm' | 'md' | 'lg';\n\nexport const CARD_VARIANTS: Record<CardVariant, string> = {\n  default: 'bg-white border border-border rounded-xl shadow-sm',\n  outlined: 'bg-transparent border-2 border-border rounded-xl',\n  elevated: 'bg-white rounded-xl shadow-lg',\n  filled: 'bg-gray-50 rounded-xl',\n  ghost: 'bg-transparent',\n};\n\nexport const CARD_SIZES: Record<CardSize, string> = {\n  sm: 'p-4',\n  md: 'p-6',\n  lg: 'p-8',\n};\n\nexport function getCardVariantClasses(variant: CardVariant): string {\n  return CARD_VARIANTS[variant];\n}\n\nexport function getCardSizeClasses(size: CardSize): string {\n  return CARD_SIZES[size];\n}\n\n// ============================================\n// Badge Styles\n// ============================================\n\nexport type BadgeVariant = 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' | 'outline';\nexport type BadgeSize = 'sm' | 'md' | 'lg';\n\nexport const BADGE_VARIANTS: Record<BadgeVariant, string> = {\n  default: 'bg-gray-100 text-gray-800',\n  primary: 'bg-primary/10 text-primary',\n  secondary: 'bg-secondary/10 text-secondary',\n  success: 'bg-success/10 text-success',\n  warning: 'bg-warning/10 text-warning',\n  danger: 'bg-danger/10 text-danger',\n  info: 'bg-blue-100 text-blue-800',\n  outline: 'border border-border text-text-primary bg-transparent',\n};\n\nexport const BADGE_SIZES: Record<BadgeSize, string> = {\n  sm: 'px-2 py-0.5 text-xs',\n  md: 'px-2.5 py-1 text-xs',\n  lg: 'px-3 py-1.5 text-sm',\n};\n\nexport const BADGE_DOT_SIZES: Record<BadgeSize, string> = {\n  sm: 'w-2 h-2',\n  md: 'w-2.5 h-2.5',\n  lg: 'w-3 h-3',\n};\n\nexport const BADGE_DOT_VARIANTS: Record<BadgeVariant, string> = {\n  default: 'bg-gray-400',\n  primary: 'bg-primary',\n  secondary: 'bg-secondary',\n  success: 'bg-success',\n  warning: 'bg-warning',\n  danger: 'bg-danger',\n  info: 'bg-blue-500',\n  outline: 'border border-current',\n};\n\nexport function getBadgeVariantClasses(variant: BadgeVariant): string {\n  return BADGE_VARIANTS[variant];\n}\n\nexport function getBadgeSizeClasses(size: BadgeSize): string {\n  return BADGE_SIZES[size];\n}\n\nexport function getBadgeDotSizeClasses(size: BadgeSize): string {\n  return BADGE_DOT_SIZES[size];\n}\n\nexport function getBadgeDotVariantClasses(variant: BadgeVariant): string {\n  return BADGE_DOT_VARIANTS[variant];\n}\n\n// ============================================\n// Button Styles\n// ============================================\n\nexport type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger' | 'success' | 'link';\nexport type ButtonSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport const BUTTON_VARIANTS: Record<ButtonVariant, string> = {\n  primary: 'bg-primary hover:bg-primary/90 text-white shadow-sm',\n  secondary: 'bg-secondary hover:bg-secondary/90 text-white shadow-sm',\n  outline: 'border-2 border-primary text-primary hover:bg-primary/10',\n  ghost: 'text-text-primary hover:bg-gray-100',\n  danger: 'bg-danger hover:bg-danger/90 text-white shadow-sm',\n  success: 'bg-success hover:bg-success/90 text-white shadow-sm',\n  link: 'text-primary hover:text-primary/80 hover:underline',\n};\n\nexport const BUTTON_SIZES: Record<ButtonSize, string> = {\n  xs: 'px-2.5 py-1.5 text-xs',\n  sm: 'px-3 py-2 text-sm',\n  md: 'px-4 py-2.5 text-sm',\n  lg: 'px-5 py-3 text-base',\n  xl: 'px-6 py-3.5 text-lg',\n};\n\nexport const BUTTON_ICON_SIZES: Record<ButtonSize, string> = {\n  xs: 'p-1.5',\n  sm: 'p-2',\n  md: 'p-2.5',\n  lg: 'p-3',\n  xl: 'p-4',\n};\n\nexport const BUTTON_BASE_CLASSES =\n  'inline-flex items-center justify-center font-medium rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-primary/50 focus:ring-offset-2';\n\nexport function getButtonVariantClasses(variant: ButtonVariant): string {\n  return BUTTON_VARIANTS[variant];\n}\n\nexport function getButtonSizeClasses(size: ButtonSize, iconOnly: boolean): string {\n  return iconOnly ? BUTTON_ICON_SIZES[size] : BUTTON_SIZES[size];\n}\n\n// ============================================\n// Alert Styles\n// ============================================\n\nexport type AlertVariant = 'info' | 'success' | 'warning' | 'danger' | 'neutral';\n\nexport const ALERT_VARIANTS: Record<AlertVariant, { container: string; icon: string }> = {\n  info: {\n    container: 'bg-blue-50 border-blue-200 text-blue-800',\n    icon: 'text-blue-500',\n  },\n  success: {\n    container: 'bg-success/10 border-success/30 text-success',\n    icon: 'text-success',\n  },\n  warning: {\n    container: 'bg-warning/10 border-warning/30 text-warning',\n    icon: 'text-warning',\n  },\n  danger: {\n    container: 'bg-danger/10 border-danger/30 text-danger',\n    icon: 'text-danger',\n  },\n  neutral: {\n    container: 'bg-gray-50 border-gray-200 text-gray-800',\n    icon: 'text-gray-500',\n  },\n};\n\nexport const ALERT_BASE_CLASSES = 'rounded-lg border p-4';\n\nexport function getAlertVariantClasses(variant: AlertVariant): { container: string; icon: string } {\n  return ALERT_VARIANTS[variant];\n}\n\n// ============================================\n// Common Icons (SVG strings)\n// ============================================\n\nexport const ALERT_ICONS: Record<AlertVariant, string> = {\n  info: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"/>\n  </svg>`,\n  success: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\"/>\n  </svg>`,\n  warning: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"/>\n  </svg>`,\n  danger: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z\"/>\n  </svg>`,\n  neutral: `<svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"/>\n  </svg>`,\n};\n\nexport const CLOSE_ICON = `<svg class=\"w-3 h-3\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n  <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"/>\n</svg>`;\n\nexport const LOADING_SPINNER = `<svg class=\"animate-spin -ml-1 mr-2 h-4 w-4\" fill=\"none\" viewBox=\"0 0 24 24\">\n  <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n  <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>\n</svg>`;\n\n// ============================================\n// Utility Functions\n// ============================================\n\n/**\n * Join CSS classes, filtering out falsy values\n */\nexport function cn(...classes: (string | undefined | null | false)[]): string {\n  return classes.filter(Boolean).join(' ');\n}\n"]}