@frontmcp/ui 0.5.0 → 0.6.0

package/src/base-template/polyfills.js

@@ -1,190 +0,0 @@
-"use strict";
-/**
- * Platform Polyfills for Base Template
- *
- * Provides additional polyfills for MCP session detection and
- * direct HTTP fallback when not in an OpenAI or ext-apps environment.
- *
- * These polyfills complement the existing MCP_BRIDGE_RUNTIME.
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.renderMcpSessionPolyfill = renderMcpSessionPolyfill;
-/**
- * Render the MCP session detection polyfill script.
- *
- * This provides auto-detection of MCP session info from:
- * 1. Explicit window.__frontmcp.mcpSession
- * 2. Meta tags (mcp-url, mcp-session-id)
- * 3. URL query parameters (mcpUrl, sessionId)
- * 4. Fallback values provided at render time
- *
- * @param mcpSession - Optional explicit session to bake into the template
- * @returns Script tag with polyfill code
- */
-function renderMcpSessionPolyfill(mcpSession) {
-    const fallbackCode = mcpSession
-        ? `
-      return {
-        mcpUrl: '${escapeJs(mcpSession.mcpUrl)}',
-        sessionId: '${escapeJs(mcpSession.sessionId)}'
-      };`
-        : `
-      return null;`;
-    return `<script>
-(function() {
-  'use strict';
-
-  window.__frontmcp = window.__frontmcp || {};
-
-  /**
-   * Auto-detect MCP session from page context.
-   * Tries multiple sources in order of priority.
-   */
-  window.__frontmcp.detectMcpSession = function() {
-    // 1. Check if explicitly set by developer
-    if (window.__frontmcp.mcpSession) {
-      return window.__frontmcp.mcpSession;
-    }
-
-    // 2. Check meta tags
-    var mcpUrlMeta = document.querySelector('meta[name="mcp-url"]');
-    var sessionIdMeta = document.querySelector('meta[name="mcp-session-id"]');
-    if (mcpUrlMeta && sessionIdMeta) {
-      return {
-        mcpUrl: mcpUrlMeta.getAttribute('content'),
-        sessionId: sessionIdMeta.getAttribute('content')
-      };
-    }
-
-    // 3. Check URL query parameters (for ngrok/iframe scenarios)
-    try {
-      var params = new URLSearchParams(window.location.search);
-      var mcpUrl = params.get('mcpUrl');
-      var sessionId = params.get('sessionId');
-      if (mcpUrl && sessionId) {
-        return { mcpUrl: mcpUrl, sessionId: sessionId };
-      }
-    } catch (e) {
-      // URLSearchParams may not be available in all environments
-    }
-
-    // 4. Use explicit fallback if provided at render time
-    ${fallbackCode}
-  };
-
-  /**
-   * Enhanced callTool that uses HTTP fallback when MCP bridge is unavailable.
-   * This wraps window.mcpBridge.callTool with HTTP fallback support.
-   */
-  window.__frontmcp.callTool = async function(toolName, args) {
-    // Priority 1: Direct OpenAI SDK call (most reliable in OpenAI iframe)
-    if (typeof window !== 'undefined' && window.openai && typeof window.openai.callTool === 'function') {
-      return window.openai.callTool(toolName, args);
-    }
-
-    // Priority 2: If MCP bridge has callTool, use it
-    if (window.mcpBridge && typeof window.mcpBridge.callTool === 'function') {
-      try {
-        return await window.mcpBridge.callTool(toolName, args);
-      } catch (e) {
-        // If MCP bridge fails, fall through to HTTP fallback
-        console.warn('MCP bridge callTool failed, trying HTTP fallback:', e.message);
-      }
-    }
-
-    // Priority 3: HTTP fallback using detected session
-    var session = window.__frontmcp.detectMcpSession();
-    if (!session) {
-      throw new Error(
-        'MCP session not available. Set window.__frontmcp.mcpSession, ' +
-        'add meta tags, or provide URL parameters.'
-      );
-    }
-
-    var response = await fetch(session.mcpUrl, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        'X-Session-Id': session.sessionId
-      },
-      body: JSON.stringify({
-        jsonrpc: '2.0',
-        method: 'tools/call',
-        params: { name: toolName, arguments: args || {} },
-        id: Date.now()
-      })
-    });
-
-    if (!response.ok) {
-      throw new Error('HTTP ' + response.status + ': ' + response.statusText);
-    }
-
-    var result = await response.json();
-    if (result.error) {
-      throw new Error(result.error.message || 'Tool call failed');
-    }
-    return result.result;
-  };
-
-  /**
-   * Get tool output from all possible sources.
-   * Priority: pre-rendered HTML from metadata > structured data > raw output
-   *
-   * Note: Returns undefined for null values from OpenAI (which is its initial state)
-   * to allow proper loading state handling in the bridge.
-   */
-  window.__frontmcp.getToolOutput = function() {
-    // 1. Check for pre-rendered HTML in OpenAI toolResponseMetadata (highest priority)
-    // This is set when the tool has a UI template (React, HTML, etc.)
-    if (window.openai && window.openai.toolResponseMetadata) {
-      var html = window.openai.toolResponseMetadata['ui/html'];
-      if (html && typeof html === 'string') {
-        return html;  // Return HTML string directly
-      }
-    }
-
-    // 2. Check for pre-rendered HTML in MCP response metadata (for MCP Inspector, etc.)
-    if (window.__mcpResponseMeta) {
-      var mcpHtml = window.__mcpResponseMeta['ui/html'];
-      if (mcpHtml && typeof mcpHtml === 'string') {
-        return mcpHtml;  // Return HTML string directly
-      }
-    }
-
-    // 3. OpenAI injects structured data into window.openai.toolOutput
-    // Skip null - that's OpenAI's initial state before real data is injected
-    if (window.openai && window.openai.toolOutput !== undefined && window.openai.toolOutput !== null) {
-      return window.openai.toolOutput;
-    }
-
-    // 4. MCP Bridge stores in window.__mcpToolOutput (skip null)
-    if (window.__mcpToolOutput !== undefined && window.__mcpToolOutput !== null) {
-      return window.__mcpToolOutput;
-    }
-
-    // 5. Explicit injection
-    if (window.__frontmcp.toolOutput !== undefined) {
-      return window.__frontmcp.toolOutput;
-    }
-
-    return undefined;
-  };
-})();
-</script>`;
-}
-/**
- * Escape string for use in JavaScript string literal
- */
-function escapeJs(str) {
-    return str
-        .replace(/\\/g, '\\\\')
-        .replace(/'/g, "\\'")
-        .replace(/"/g, '\\"')
-        .replace(/`/g, '\\`')
-        .replace(/\n/g, '\\n')
-        .replace(/\r/g, '\\r')
-        .replace(/<\/script/gi, '<\\/script')
-        .replace(/\u2028/g, '\\u2028')
-        .replace(/\u2029/g, '\\u2029');
-}
-//# sourceMappingURL=polyfills.js.map

package/src/base-template/polyfills.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"polyfills.js","sourceRoot":"","sources":["../../../src/base-template/polyfills.ts"],"names":[],"mappings":";AAAA;;;;;;;GAOG;;AAwBH,4DAuJC;AAnKD;;;;;;;;;;;GAWG;AACH,SAAgB,wBAAwB,CAAC,UAAuB;IAC9D,MAAM,YAAY,GAAG,UAAU;QAC7B,CAAC,CAAC;;mBAEa,QAAQ,CAAC,UAAU,CAAC,MAAM,CAAC;sBACxB,QAAQ,CAAC,UAAU,CAAC,SAAS,CAAC;SAC3C;QACL,CAAC,CAAC;mBACa,CAAC;IAElB,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAuCH,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAqGR,CAAC;AACX,CAAC;AAED;;GAEG;AACH,SAAS,QAAQ,CAAC,GAAW;IAC3B,OAAO,GAAG;SACP,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC;SACtB,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC;SACpB,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC;SACpB,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC;SACpB,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC;SACrB,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC;SACrB,OAAO,CAAC,aAAa,EAAE,YAAY,CAAC;SACpC,OAAO,CAAC,SAAS,EAAE,SAAS,CAAC;SAC7B,OAAO,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;AACnC,CAAC","sourcesContent":["/**\n * Platform Polyfills for Base Template\n *\n * Provides additional polyfills for MCP session detection and\n * direct HTTP fallback when not in an OpenAI or ext-apps environment.\n *\n * These polyfills complement the existing MCP_BRIDGE_RUNTIME.\n */\n\n/**\n * MCP Session information for HTTP fallback\n */\nexport interface McpSession {\n  /** MCP server URL */\n  mcpUrl: string;\n  /** Session ID for authentication */\n  sessionId: string;\n}\n\n/**\n * Render the MCP session detection polyfill script.\n *\n * This provides auto-detection of MCP session info from:\n * 1. Explicit window.__frontmcp.mcpSession\n * 2. Meta tags (mcp-url, mcp-session-id)\n * 3. URL query parameters (mcpUrl, sessionId)\n * 4. Fallback values provided at render time\n *\n * @param mcpSession - Optional explicit session to bake into the template\n * @returns Script tag with polyfill code\n */\nexport function renderMcpSessionPolyfill(mcpSession?: McpSession): string {\n  const fallbackCode = mcpSession\n    ? `\n      return {\n        mcpUrl: '${escapeJs(mcpSession.mcpUrl)}',\n        sessionId: '${escapeJs(mcpSession.sessionId)}'\n      };`\n    : `\n      return null;`;\n\n  return `<script>\n(function() {\n  'use strict';\n\n  window.__frontmcp = window.__frontmcp || {};\n\n  /**\n   * Auto-detect MCP session from page context.\n   * Tries multiple sources in order of priority.\n   */\n  window.__frontmcp.detectMcpSession = function() {\n    // 1. Check if explicitly set by developer\n    if (window.__frontmcp.mcpSession) {\n      return window.__frontmcp.mcpSession;\n    }\n\n    // 2. Check meta tags\n    var mcpUrlMeta = document.querySelector('meta[name=\"mcp-url\"]');\n    var sessionIdMeta = document.querySelector('meta[name=\"mcp-session-id\"]');\n    if (mcpUrlMeta && sessionIdMeta) {\n      return {\n        mcpUrl: mcpUrlMeta.getAttribute('content'),\n        sessionId: sessionIdMeta.getAttribute('content')\n      };\n    }\n\n    // 3. Check URL query parameters (for ngrok/iframe scenarios)\n    try {\n      var params = new URLSearchParams(window.location.search);\n      var mcpUrl = params.get('mcpUrl');\n      var sessionId = params.get('sessionId');\n      if (mcpUrl && sessionId) {\n        return { mcpUrl: mcpUrl, sessionId: sessionId };\n      }\n    } catch (e) {\n      // URLSearchParams may not be available in all environments\n    }\n\n    // 4. Use explicit fallback if provided at render time\n    ${fallbackCode}\n  };\n\n  /**\n   * Enhanced callTool that uses HTTP fallback when MCP bridge is unavailable.\n   * This wraps window.mcpBridge.callTool with HTTP fallback support.\n   */\n  window.__frontmcp.callTool = async function(toolName, args) {\n    // Priority 1: Direct OpenAI SDK call (most reliable in OpenAI iframe)\n    if (typeof window !== 'undefined' && window.openai && typeof window.openai.callTool === 'function') {\n      return window.openai.callTool(toolName, args);\n    }\n\n    // Priority 2: If MCP bridge has callTool, use it\n    if (window.mcpBridge && typeof window.mcpBridge.callTool === 'function') {\n      try {\n        return await window.mcpBridge.callTool(toolName, args);\n      } catch (e) {\n        // If MCP bridge fails, fall through to HTTP fallback\n        console.warn('MCP bridge callTool failed, trying HTTP fallback:', e.message);\n      }\n    }\n\n    // Priority 3: HTTP fallback using detected session\n    var session = window.__frontmcp.detectMcpSession();\n    if (!session) {\n      throw new Error(\n        'MCP session not available. Set window.__frontmcp.mcpSession, ' +\n        'add meta tags, or provide URL parameters.'\n      );\n    }\n\n    var response = await fetch(session.mcpUrl, {\n      method: 'POST',\n      headers: {\n        'Content-Type': 'application/json',\n        'X-Session-Id': session.sessionId\n      },\n      body: JSON.stringify({\n        jsonrpc: '2.0',\n        method: 'tools/call',\n        params: { name: toolName, arguments: args || {} },\n        id: Date.now()\n      })\n    });\n\n    if (!response.ok) {\n      throw new Error('HTTP ' + response.status + ': ' + response.statusText);\n    }\n\n    var result = await response.json();\n    if (result.error) {\n      throw new Error(result.error.message || 'Tool call failed');\n    }\n    return result.result;\n  };\n\n  /**\n   * Get tool output from all possible sources.\n   * Priority: pre-rendered HTML from metadata > structured data > raw output\n   *\n   * Note: Returns undefined for null values from OpenAI (which is its initial state)\n   * to allow proper loading state handling in the bridge.\n   */\n  window.__frontmcp.getToolOutput = function() {\n    // 1. Check for pre-rendered HTML in OpenAI toolResponseMetadata (highest priority)\n    // This is set when the tool has a UI template (React, HTML, etc.)\n    if (window.openai && window.openai.toolResponseMetadata) {\n      var html = window.openai.toolResponseMetadata['ui/html'];\n      if (html && typeof html === 'string') {\n        return html;  // Return HTML string directly\n      }\n    }\n\n    // 2. Check for pre-rendered HTML in MCP response metadata (for MCP Inspector, etc.)\n    if (window.__mcpResponseMeta) {\n      var mcpHtml = window.__mcpResponseMeta['ui/html'];\n      if (mcpHtml && typeof mcpHtml === 'string') {\n        return mcpHtml;  // Return HTML string directly\n      }\n    }\n\n    // 3. OpenAI injects structured data into window.openai.toolOutput\n    // Skip null - that's OpenAI's initial state before real data is injected\n    if (window.openai && window.openai.toolOutput !== undefined && window.openai.toolOutput !== null) {\n      return window.openai.toolOutput;\n    }\n\n    // 4. MCP Bridge stores in window.__mcpToolOutput (skip null)\n    if (window.__mcpToolOutput !== undefined && window.__mcpToolOutput !== null) {\n      return window.__mcpToolOutput;\n    }\n\n    // 5. Explicit injection\n    if (window.__frontmcp.toolOutput !== undefined) {\n      return window.__frontmcp.toolOutput;\n    }\n\n    return undefined;\n  };\n})();\n</script>`;\n}\n\n/**\n * Escape string for use in JavaScript string literal\n */\nfunction escapeJs(str: string): string {\n  return str\n    .replace(/\\\\/g, '\\\\\\\\')\n    .replace(/'/g, \"\\\\'\")\n    .replace(/\"/g, '\\\\\"')\n    .replace(/`/g, '\\\\`')\n    .replace(/\\n/g, '\\\\n')\n    .replace(/\\r/g, '\\\\r')\n    .replace(/<\\/script/gi, '<\\\\/script')\n    .replace(/\\u2028/g, '\\\\u2028')\n    .replace(/\\u2029/g, '\\\\u2029');\n}\n"]}

package/src/base-template/theme-styles.d.ts

@@ -1,73 +0,0 @@
-/**
- * Theme Styles for Base Template
- *
- * Composes theme configuration into complete HTML head content
- * including fonts, scripts, and CSS custom properties.
- *
- * Uses existing theme utilities from @frontmcp/ui/theme module.
- */
-import { type ThemeConfig } from '../theme';
-/**
- * Options for rendering theme styles.
- */
-export interface ThemeStylesOptions {
-    /** Theme configuration (default: DEFAULT_THEME) */
-    theme?: ThemeConfig;
-    /** Include Tailwind CSS (default: true) */
-    tailwind?: boolean;
-    /** Include HTMX (default: false) */
-    htmx?: boolean;
-    /** Include Alpine.js (default: false) */
-    alpine?: boolean;
-    /** Include fonts (default: true) */
-    fonts?: boolean;
-    /** Use inline scripts from cache (for blocked network platforms) */
-    inline?: boolean;
-}
-/**
- * Render complete theme styles for HTML head section.
- *
- * This function composes all theme-related HTML including:
- * 1. Font preconnect links (optional)
- * 2. Font stylesheets (optional)
- * 3. Tailwind CSS script (with @theme variables)
- * 4. Additional framework scripts (HTMX, Alpine.js)
- *
- * @param options - Theme styles configuration
- * @returns HTML string with all style/script tags
- *
- * @example
- * ```typescript
- * // Default theme with Tailwind only
- * const styles = renderThemeStyles();
- *
- * // Custom theme with HTMX
- * const styles = renderThemeStyles({
- *   theme: customTheme,
- *   htmx: true,
- * });
- *
- * // For blocked-network platforms (Claude Artifacts)
- * await fetchAndCacheScriptsFromTheme(theme);
- * const styles = renderThemeStyles({ inline: true });
- * ```
- */
-export declare function renderThemeStyles(options?: ThemeStylesOptions): string;
-/**
- * Render minimal theme styles (Tailwind + @theme only).
- *
- * Use this for lightweight widgets that don't need fonts or additional scripts.
- *
- * @param theme - Theme configuration (default: DEFAULT_THEME)
- * @returns HTML string with Tailwind script and @theme style block
- */
-export declare function renderMinimalThemeStyles(theme?: ThemeConfig): string;
-/**
- * Render theme CSS variables only (no scripts).
- *
- * Use this when Tailwind is already loaded elsewhere.
- *
- * @param theme - Theme configuration (default: DEFAULT_THEME)
- * @returns HTML style block with @theme CSS
- */
-export declare function renderThemeCssOnly(theme?: ThemeConfig): string;

package/src/base-template/theme-styles.js

@@ -1,95 +0,0 @@
-"use strict";
-/**
- * Theme Styles for Base Template
- *
- * Composes theme configuration into complete HTML head content
- * including fonts, scripts, and CSS custom properties.
- *
- * Uses existing theme utilities from @frontmcp/ui/theme module.
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.renderThemeStyles = renderThemeStyles;
-exports.renderMinimalThemeStyles = renderMinimalThemeStyles;
-exports.renderThemeCssOnly = renderThemeCssOnly;
-const theme_1 = require("../theme");
-/**
- * Render complete theme styles for HTML head section.
- *
- * This function composes all theme-related HTML including:
- * 1. Font preconnect links (optional)
- * 2. Font stylesheets (optional)
- * 3. Tailwind CSS script (with @theme variables)
- * 4. Additional framework scripts (HTMX, Alpine.js)
- *
- * @param options - Theme styles configuration
- * @returns HTML string with all style/script tags
- *
- * @example
- * ```typescript
- * // Default theme with Tailwind only
- * const styles = renderThemeStyles();
- *
- * // Custom theme with HTMX
- * const styles = renderThemeStyles({
- *   theme: customTheme,
- *   htmx: true,
- * });
- *
- * // For blocked-network platforms (Claude Artifacts)
- * await fetchAndCacheScriptsFromTheme(theme);
- * const styles = renderThemeStyles({ inline: true });
- * ```
- */
-function renderThemeStyles(options = {}) {
-    const { theme = theme_1.DEFAULT_THEME, tailwind = true, htmx = false, alpine = false, fonts = true, inline = false, } = options;
-    const parts = [];
-    // 1. Font preconnect links (if not inline mode)
-    if (fonts && !inline) {
-        parts.push((0, theme_1.buildFontPreconnectFromTheme)(theme));
-    }
-    // 2. Font stylesheets (if not inline mode)
-    if (fonts && !inline) {
-        parts.push((0, theme_1.buildFontStylesheetsFromTheme)(theme));
-    }
-    // 3. Tailwind CSS script (required for @theme to work)
-    const scriptOptions = {
-        tailwind,
-        htmx,
-        alpine,
-        inline,
-    };
-    parts.push((0, theme_1.buildCdnScriptsFromTheme)(theme, scriptOptions));
-    // 4. @theme style block with CSS custom properties
-    parts.push((0, theme_1.buildStyleBlock)(theme));
-    return parts.filter(Boolean).join('\n  ');
-}
-/**
- * Render minimal theme styles (Tailwind + @theme only).
- *
- * Use this for lightweight widgets that don't need fonts or additional scripts.
- *
- * @param theme - Theme configuration (default: DEFAULT_THEME)
- * @returns HTML string with Tailwind script and @theme style block
- */
-function renderMinimalThemeStyles(theme = theme_1.DEFAULT_THEME) {
-    return renderThemeStyles({
-        theme,
-        tailwind: true,
-        htmx: false,
-        alpine: false,
-        fonts: false,
-        inline: false,
-    });
-}
-/**
- * Render theme CSS variables only (no scripts).
- *
- * Use this when Tailwind is already loaded elsewhere.
- *
- * @param theme - Theme configuration (default: DEFAULT_THEME)
- * @returns HTML style block with @theme CSS
- */
-function renderThemeCssOnly(theme = theme_1.DEFAULT_THEME) {
-    return (0, theme_1.buildStyleBlock)(theme);
-}
-//# sourceMappingURL=theme-styles.js.map

package/src/base-template/theme-styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"theme-styles.js","sourceRoot":"","sources":["../../../src/base-template/theme-styles.ts"],"names":[],"mappings":";AAAA;;;;;;;GAOG;;AA0DH,8CAmCC;AAUD,4DASC;AAUD,gDAEC;AA1HD,oCAQkB;AAoBlB;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,SAAgB,iBAAiB,CAAC,UAA8B,EAAE;IAChE,MAAM,EACJ,KAAK,GAAG,qBAAa,EACrB,QAAQ,GAAG,IAAI,EACf,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,KAAK,EACd,KAAK,GAAG,IAAI,EACZ,MAAM,GAAG,KAAK,GACf,GAAG,OAAO,CAAC;IAEZ,MAAM,KAAK,GAAa,EAAE,CAAC;IAE3B,gDAAgD;IAChD,IAAI,KAAK,IAAI,CAAC,MAAM,EAAE,CAAC;QACrB,KAAK,CAAC,IAAI,CAAC,IAAA,oCAA4B,EAAC,KAAK,CAAC,CAAC,CAAC;IAClD,CAAC;IAED,2CAA2C;IAC3C,IAAI,KAAK,IAAI,CAAC,MAAM,EAAE,CAAC;QACrB,KAAK,CAAC,IAAI,CAAC,IAAA,qCAA6B,EAAC,KAAK,CAAC,CAAC,CAAC;IACnD,CAAC;IAED,uDAAuD;IACvD,MAAM,aAAa,GAA0B;QAC3C,QAAQ;QACR,IAAI;QACJ,MAAM;QACN,MAAM;KACP,CAAC;IACF,KAAK,CAAC,IAAI,CAAC,IAAA,gCAAwB,EAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC;IAE3D,mDAAmD;IACnD,KAAK,CAAC,IAAI,CAAC,IAAA,uBAAe,EAAC,KAAK,CAAC,CAAC,CAAC;IAEnC,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;AAC5C,CAAC;AAED;;;;;;;GAOG;AACH,SAAgB,wBAAwB,CAAC,QAAqB,qBAAa;IACzE,OAAO,iBAAiB,CAAC;QACvB,KAAK;QACL,QAAQ,EAAE,IAAI;QACd,IAAI,EAAE,KAAK;QACX,MAAM,EAAE,KAAK;QACb,KAAK,EAAE,KAAK;QACZ,MAAM,EAAE,KAAK;KACd,CAAC,CAAC;AACL,CAAC;AAED;;;;;;;GAOG;AACH,SAAgB,kBAAkB,CAAC,QAAqB,qBAAa;IACnE,OAAO,IAAA,uBAAe,EAAC,KAAK,CAAC,CAAC;AAChC,CAAC","sourcesContent":["/**\n * Theme Styles for Base Template\n *\n * Composes theme configuration into complete HTML head content\n * including fonts, scripts, and CSS custom properties.\n *\n * Uses existing theme utilities from @frontmcp/ui/theme module.\n */\n\nimport {\n  DEFAULT_THEME,\n  buildStyleBlock,\n  buildCdnScriptsFromTheme,\n  buildFontPreconnectFromTheme,\n  buildFontStylesheetsFromTheme,\n  type ThemeConfig,\n  type ThemeCdnScriptOptions,\n} from '../theme';\n\n/**\n * Options for rendering theme styles.\n */\nexport interface ThemeStylesOptions {\n  /** Theme configuration (default: DEFAULT_THEME) */\n  theme?: ThemeConfig;\n  /** Include Tailwind CSS (default: true) */\n  tailwind?: boolean;\n  /** Include HTMX (default: false) */\n  htmx?: boolean;\n  /** Include Alpine.js (default: false) */\n  alpine?: boolean;\n  /** Include fonts (default: true) */\n  fonts?: boolean;\n  /** Use inline scripts from cache (for blocked network platforms) */\n  inline?: boolean;\n}\n\n/**\n * Render complete theme styles for HTML head section.\n *\n * This function composes all theme-related HTML including:\n * 1. Font preconnect links (optional)\n * 2. Font stylesheets (optional)\n * 3. Tailwind CSS script (with @theme variables)\n * 4. Additional framework scripts (HTMX, Alpine.js)\n *\n * @param options - Theme styles configuration\n * @returns HTML string with all style/script tags\n *\n * @example\n * ```typescript\n * // Default theme with Tailwind only\n * const styles = renderThemeStyles();\n *\n * // Custom theme with HTMX\n * const styles = renderThemeStyles({\n *   theme: customTheme,\n *   htmx: true,\n * });\n *\n * // For blocked-network platforms (Claude Artifacts)\n * await fetchAndCacheScriptsFromTheme(theme);\n * const styles = renderThemeStyles({ inline: true });\n * ```\n */\nexport function renderThemeStyles(options: ThemeStylesOptions = {}): string {\n  const {\n    theme = DEFAULT_THEME,\n    tailwind = true,\n    htmx = false,\n    alpine = false,\n    fonts = true,\n    inline = false,\n  } = options;\n\n  const parts: string[] = [];\n\n  // 1. Font preconnect links (if not inline mode)\n  if (fonts && !inline) {\n    parts.push(buildFontPreconnectFromTheme(theme));\n  }\n\n  // 2. Font stylesheets (if not inline mode)\n  if (fonts && !inline) {\n    parts.push(buildFontStylesheetsFromTheme(theme));\n  }\n\n  // 3. Tailwind CSS script (required for @theme to work)\n  const scriptOptions: ThemeCdnScriptOptions = {\n    tailwind,\n    htmx,\n    alpine,\n    inline,\n  };\n  parts.push(buildCdnScriptsFromTheme(theme, scriptOptions));\n\n  // 4. @theme style block with CSS custom properties\n  parts.push(buildStyleBlock(theme));\n\n  return parts.filter(Boolean).join('\\n  ');\n}\n\n/**\n * Render minimal theme styles (Tailwind + @theme only).\n *\n * Use this for lightweight widgets that don't need fonts or additional scripts.\n *\n * @param theme - Theme configuration (default: DEFAULT_THEME)\n * @returns HTML string with Tailwind script and @theme style block\n */\nexport function renderMinimalThemeStyles(theme: ThemeConfig = DEFAULT_THEME): string {\n  return renderThemeStyles({\n    theme,\n    tailwind: true,\n    htmx: false,\n    alpine: false,\n    fonts: false,\n    inline: false,\n  });\n}\n\n/**\n * Render theme CSS variables only (no scripts).\n *\n * Use this when Tailwind is already loaded elsewhere.\n *\n * @param theme - Theme configuration (default: DEFAULT_THEME)\n * @returns HTML style block with @theme CSS\n */\nexport function renderThemeCssOnly(theme: ThemeConfig = DEFAULT_THEME): string {\n  return buildStyleBlock(theme);\n}\n"]}

package/src/bridge/adapters/base-adapter.d.ts

@@ -1,103 +0,0 @@
-/**
- * Base Platform Adapter
- *
- * Abstract base class for platform adapters with default implementations.
- * Extend this class to create custom adapters for new platforms.
- *
- * @packageDocumentation
- */
-import type { PlatformAdapter, AdapterCapabilities, DisplayMode, UserAgentInfo, SafeAreaInsets, ViewportInfo, HostContext } from '../types';
-/**
- * Default adapter capabilities (most features disabled).
- */
-export declare const DEFAULT_CAPABILITIES: AdapterCapabilities;
-/**
- * Default safe area insets (no insets).
- */
-export declare const DEFAULT_SAFE_AREA: SafeAreaInsets;
-/**
- * Abstract base class for platform adapters.
- * Provides default implementations that can be overridden.
- */
-export declare abstract class BaseAdapter implements PlatformAdapter {
-    abstract readonly id: string;
-    abstract readonly name: string;
-    abstract readonly priority: number;
-    protected _capabilities: AdapterCapabilities;
-    protected _hostContext: HostContext;
-    protected _widgetState: Record<string, unknown>;
-    protected _toolInput: Record<string, unknown>;
-    protected _toolOutput: unknown;
-    protected _structuredContent: unknown;
-    protected _initialized: boolean;
-    protected _contextListeners: Set<(changes: Partial<HostContext>) => void>;
-    protected _toolResultListeners: Set<(result: unknown) => void>;
-    constructor();
-    get capabilities(): AdapterCapabilities;
-    abstract canHandle(): boolean;
-    initialize(): Promise<void>;
-    dispose(): void;
-    getTheme(): 'light' | 'dark';
-    getDisplayMode(): DisplayMode;
-    getUserAgent(): UserAgentInfo;
-    getLocale(): string;
-    getToolInput(): Record<string, unknown>;
-    getToolOutput(): unknown;
-    getStructuredContent(): unknown;
-    getWidgetState(): Record<string, unknown>;
-    getSafeArea(): SafeAreaInsets;
-    getViewport(): ViewportInfo | undefined;
-    getHostContext(): HostContext;
-    callTool(_name: string, _args: Record<string, unknown>): Promise<unknown>;
-    sendMessage(_content: string): Promise<void>;
-    openLink(url: string): Promise<void>;
-    requestDisplayMode(_mode: DisplayMode): Promise<void>;
-    requestClose(): Promise<void>;
-    setWidgetState(state: Record<string, unknown>): void;
-    onContextChange(callback: (changes: Partial<HostContext>) => void): () => void;
-    onToolResult(callback: (result: unknown) => void): () => void;
-    /**
-     * Create default host context from environment detection.
-     */
-    protected _createDefaultHostContext(): HostContext;
-    /**
-     * Detect theme from CSS media query.
-     */
-    protected _detectTheme(): 'light' | 'dark';
-    /**
-     * Detect locale from navigator.
-     */
-    protected _detectLocale(): string;
-    /**
-     * Detect user agent capabilities.
-     */
-    protected _detectUserAgent(): UserAgentInfo;
-    /**
-     * Detect viewport dimensions.
-     */
-    protected _detectViewport(): ViewportInfo | undefined;
-    /**
-     * Read injected tool data from window globals.
-     */
-    protected _readInjectedData(): void;
-    /**
-     * Load widget state from localStorage.
-     */
-    protected _loadWidgetState(): void;
-    /**
-     * Persist widget state to localStorage.
-     */
-    protected _persistWidgetState(): void;
-    /**
-     * Get localStorage key for widget state.
-     */
-    protected _getStateKey(): string;
-    /**
-     * Notify context change listeners.
-     */
-    protected _notifyContextChange(changes: Partial<HostContext>): void;
-    /**
-     * Notify tool result listeners.
-     */
-    protected _notifyToolResult(result: unknown): void;
-}