@frontmcp/ui 0.12.1 → 1.0.0-beta.1

package/README.md

@@ -1,95 +1,302 @@
 # @frontmcp/ui
 
-Platform-aware UI toolkit for building HTML widgets, React components, and web components inside MCP transports.
+MUI-based React components, content renderers, and MCP bridge for building interactive MCP widgets.
 
 [![NPM](https://img.shields.io/npm/v/@frontmcp/ui.svg)](https://www.npmjs.com/package/@frontmcp/ui)
-
-## Package Split
-
-| Package            | Purpose                                                         | React Required |
-| ------------------ | --------------------------------------------------------------- | -------------- |
-| `@frontmcp/ui`     | HTML components, React components/hooks, SSR renderers          | Yes (peer dep) |
-| `@frontmcp/uipack` | Themes, build/render pipelines, runtime helpers, template types | No             |
+[![License](https://img.shields.io/npm/l/@frontmcp/ui.svg)](../../LICENSE)
 
 ## Install
 
 ```bash
-npm install @frontmcp/ui @frontmcp/uipack react react-dom
+npm install @frontmcp/ui react react-dom @mui/material @emotion/react @emotion/styled
 ```
 
-## Features
+> **Note:** Renderer libraries (recharts, react-pdf, mermaid, katex, etc.) are **not** installed locally. They are automatically lazy-loaded from [esm.sh](https://esm.sh) in the browser at runtime.
+
+## Quick Start
+
+### Theme + Components
+
+```tsx
+import { FrontMcpThemeProvider } from '@frontmcp/ui/theme';
+import { Card, Button, Badge } from '@frontmcp/ui/components';
+
+function App() {
+  return (
+    <FrontMcpThemeProvider>
+      <Card title="Weather" elevation={2}>
+        <Badge label="Live" variant="success" />
+        <p>Temperature: 18C</p>
+        <Button variant="primary" onClick={() => {}}>
+          Refresh
+        </Button>
+      </Card>
+    </FrontMcpThemeProvider>
+  );
+}
+```
 
-- **HTML-first components** — buttons, cards, badges, alerts, forms, tables, layouts that return ready-to-stream HTML ([docs][docs-components])
-- **React components** — `Button`, `Card`, `Alert`, `Badge` with TypeScript props ([docs][docs-react])
-- **MCP Bridge hooks** — `useMcpBridge`, `useCallTool`, `useToolInput`, `useToolOutput` ([docs][docs-hooks])
-- **SSR + hydration** — `ReactRenderer` for server-side rendering, `ReactRendererAdapter` for client hydration ([docs][docs-ssr])
-- **MDX rendering** — server-side MDX-to-HTML with component resolution ([docs][docs-mdx])
-- **Web components** — `<fmcp-button>`, `<fmcp-card>`, and friends as custom elements ([docs][docs-web-components])
-- **Universal app shell** — `FrontMCPProvider` + `UniversalApp` for platform-agnostic React apps ([docs][docs-universal])
-- **SSR bundling** — `InMemoryBundler` for component compilation ([docs][docs-bundling])
-
-## Quick Example
-
-```ts
-import { card, button } from '@frontmcp/ui/components';
-import { baseLayout } from '@frontmcp/ui/layouts';
-import { DEFAULT_THEME } from '@frontmcp/uipack/theme';
-
-const html = baseLayout(card(`<h2>Hello</h2>${button('Submit', { variant: 'primary' })}`, { variant: 'elevated' }), {
-  title: 'My Widget',
-  theme: DEFAULT_THEME,
-});
+### MCP Bridge Hooks
+
+```tsx
+import { McpBridgeProvider, useCallTool, useToolOutput } from '@frontmcp/ui/react';
+
+function WeatherWidget() {
+  const output = useToolOutput<{ temp: number }>();
+  const { call, loading } = useCallTool('get_weather');
+
+  return (
+    <div>
+      <p>{output?.temp}C</p>
+      <button onClick={() => call({ city: 'London' })} disabled={loading}>
+        Refresh
+      </button>
+    </div>
+  );
+}
+
+// Wrap with provider
+<McpBridgeProvider>
+  <WeatherWidget />
+</McpBridgeProvider>;
 ```
 
-> Full guide: [UI Overview][docs-overview]
+### Content Rendering
+
+```tsx
+import { renderContent, detectContentType } from '@frontmcp/ui/renderer';
+
+// Auto-detects content type and renders with the appropriate renderer
+const type = detectContentType(data); // 'chart' | 'csv' | 'pdf' | 'mermaid' | ...
+const element = renderContent(data, { type });
+```
+
+## Features
+
+- **11 MUI components** — Button, Card, Alert, Badge, Avatar, Modal, Table, TextField, Select, List, Loader
+- **13 content renderers** — Charts, CSV, Flow, HTML, Image, Maps, Math, MDX, Media (video + audio), Mermaid, PDF, React JSX
+- **MCP bridge hooks** — `useCallTool`, `useToolInput`, `useToolOutput`, `useSendMessage`, `useOpenLink`, and more
+- **5 platform adapters** — OpenAI, ExtApps, Claude, Gemini, Generic (auto-detected)
+- **MUI theme system** — `FrontMcpThemeProvider` with light/dark presets and custom theme support
+- **Runtime utilities** — Content type auto-detection, Babel JSX transpilation
+- **Tree-shakeable** — Import individual components and renderers to minimize bundle size
 
 ## Entry Points
 
-| Path                          | Exports                               |
-| ----------------------------- | ------------------------------------- |
-| `@frontmcp/ui/components`     | HTML components, helpers, error boxes |
-| `@frontmcp/ui/layouts`        | Base layouts, consent/error templates |
-| `@frontmcp/ui/pages`          | High-level page templates             |
-| `@frontmcp/ui/widgets`        | OpenAI App SDK-style widgets          |
-| `@frontmcp/ui/react`          | React components + hooks              |
-| `@frontmcp/ui/renderers`      | ReactRenderer, MdxRenderer, adapters  |
-| `@frontmcp/ui/render`         | React 19 static rendering utilities   |
-| `@frontmcp/ui/web-components` | `<fmcp-*>` custom elements            |
-| `@frontmcp/ui/bridge`         | Bridge registry + adapters            |
-| `@frontmcp/ui/bundler`        | SSR/component bundler                 |
-
-## Docs
-
-| Topic            | Link                                  |
-| ---------------- | ------------------------------------- |
-| Overview         | [UI Overview][docs-overview]          |
-| HTML components  | [Components][docs-components]         |
-| React components | [React][docs-react]                   |
-| MCP Bridge hooks | [Hooks][docs-hooks]                   |
-| SSR rendering    | [SSR][docs-ssr]                       |
-| MDX rendering    | [MDX][docs-mdx]                       |
-| Web components   | [Web Components][docs-web-components] |
-| Universal app    | [Universal App][docs-universal]       |
-| Bundling         | [Bundling][docs-bundling]             |
+| Path                           | Exports                                                                     |
+| ------------------------------ | --------------------------------------------------------------------------- |
+| `@frontmcp/ui`                 | Bridge core, hooks (main barrel)                                            |
+| `@frontmcp/ui/theme`           | `FrontMcpThemeProvider`, `createFrontMcpTheme`, `defaultTheme`, `darkTheme` |
+| `@frontmcp/ui/components`      | All 11 React components                                                     |
+| `@frontmcp/ui/components/*`    | Individual components (`/Button`, `/Card`, `/Alert`, etc.)                  |
+| `@frontmcp/ui/renderer`        | `renderContent`, `detectContentType`, `registerAllRenderers`                |
+| `@frontmcp/ui/renderer/*`      | Individual renderers (`/charts`, `/csv`, `/pdf`, `/mdx`, etc.)              |
+| `@frontmcp/ui/renderer/common` | Shared renderer utilities (`useLazyModule`, `useRendererTheme`)             |
+| `@frontmcp/ui/react`           | `McpBridgeProvider`, all hooks                                              |
+| `@frontmcp/ui/bridge`          | `FrontMcpBridge`, `createBridge`, `AdapterRegistry`, adapters               |
+| `@frontmcp/ui/runtime`         | `detectContentType`, `transpileJsx`, Babel loader                           |
+
+## Components
+
+| Component   | Key Props                           | Description                             |
+| ----------- | ----------------------------------- | --------------------------------------- |
+| `Button`    | `variant`, `onClick`, `disabled`    | MUI button with FrontMCP variants       |
+| `Card`      | `title`, `elevation`, `slots`       | Content card with customizable slots    |
+| `Alert`     | `severity`, `title`, `onClose`      | Status alert banner                     |
+| `Badge`     | `label`, `variant`                  | Status/label badge                      |
+| `Avatar`    | `src`, `alt`, `size`                | User avatar                             |
+| `Modal`     | `open`, `onClose`, `title`, `slots` | Dialog modal                            |
+| `Table`     | `columns`, `rows`, `sortable`       | Data table                              |
+| `TextField` | `label`, `value`, `onChange`        | Text input field                        |
+| `Select`    | `options`, `value`, `onChange`      | Dropdown select                         |
+| `List`      | `items`, `onItemClick`              | List with item definitions              |
+| `Loader`    | `variant`, context provider         | Loading indicator with `LoaderProvider` |
+
+## Renderers
+
+| Renderer  | Type              | Priority |
+| --------- | ----------------- | -------- |
+| PDF       | `pdf`             | 90       |
+| Charts    | `chart`           | 80       |
+| Flow      | `flow`            | 70       |
+| Maps      | `map`             | 60       |
+| Mermaid   | `mermaid`         | 50       |
+| Math      | `math`            | 40       |
+| Image     | `image`           | 30       |
+| Media     | `video` / `audio` | 20       |
+| CSV       | `csv`             | 10       |
+| React JSX | `jsx`             | 10       |
+| MDX       | `mdx`             | 5        |
+| HTML      | `html`            | 0        |
+
+All renderer libraries are lazy-loaded from [esm.sh](https://esm.sh) in the browser at runtime — no local installation is needed. Priority determines which renderer wins when multiple match.
+
+## Bridge Adapters
+
+| Adapter | Detects Via                           | Priority | Key Capabilities                                |
+| ------- | ------------------------------------- | -------- | ----------------------------------------------- |
+| OpenAI  | `window.openai.callTool`              | 100      | `callTool`, `sendMessage`, `requestDisplayMode` |
+| ExtApps | `window.__mcpPlatform === 'ext-apps'` | 80       | Negotiated via `postMessage` handshake          |
+| Claude  | `window.claude`, hostname `claude.ai` | 60       | `openLink`                                      |
+| Gemini  | `window.__mcpPlatform === 'gemini'`   | 40       | `openLink`, `networkAccess`                     |
+| Generic | Always matches (fallback)             | 0        | `openLink`, `networkAccess`                     |
+
+## Contributing
+
+### Architecture
+
+```mermaid
+graph TD
+    subgraph "@frontmcp/ui"
+        IDX["index.ts<br/><i>Main barrel exports</i>"]
+
+        subgraph bridge["bridge/"]
+            B_CORE["core/<br/>AdapterRegistry, bridge factory"]
+            B_ADAPT["adapters/<br/>OpenAI, ExtApps, Claude,<br/>Gemini, Generic + base"]
+            B_RT["runtime/<br/>Script generation<br/><i>re-exports from uipack</i>"]
+            B_TYPES["types/<br/>TypeScript interfaces"]
+        end
+
+        subgraph theme["theme/"]
+            TH_CREATE["create-theme.ts"]
+            TH_PROV["FrontMcpThemeProvider.tsx"]
+            TH_HOOK["use-theme.ts"]
+        end
+
+        subgraph components["components/ (11)"]
+            C_BTN["Button"] --- C_CARD["Card"] --- C_ALERT["Alert"]
+            C_BADGE["Badge"] --- C_AVATAR["Avatar"] --- C_MODAL["Modal"]
+            C_TABLE["Table"] --- C_TF["TextField"] --- C_SEL["Select"]
+            C_LIST["List"] --- C_LOADER["Loader<br/><i>+ LoaderProvider</i>"]
+        end
+
+        subgraph renderer["renderer/ (13)"]
+            R_CHARTS["charts<br/><i>recharts</i>"]
+            R_CSV["csv"]
+            R_FLOW["flow<br/><i>@xyflow/react</i>"]
+            R_HTML["html<br/><i>dompurify</i>"]
+            R_IMG["image"]
+            R_MAPS["maps<br/><i>leaflet</i>"]
+            R_MATH["math<br/><i>katex</i>"]
+            R_MDX["mdx<br/><i>react-markdown</i>"]
+            R_MEDIA["media<br/><i>react-player</i>"]
+            R_MERM["mermaid"]
+            R_PDF["pdf<br/><i>react-pdf</i>"]
+            R_REACT["react/jsx"]
+            R_COMMON["common/<br/>useLazyModule,<br/>useRendererTheme"]
+        end
+
+        subgraph react["react/hooks/"]
+            H_CTX["context.ts<br/>McpBridgeProvider,<br/>useMcpBridge, useTheme"]
+            H_TOOLS["tools.ts<br/>useCallTool, useToolInput,<br/>useToolOutput"]
+        end
+
+        subgraph runtime["runtime/"]
+            RT_DETECT["content-detector.ts<br/>detectContentType()"]
+            RT_BABEL["babel-runtime.ts<br/>transpileJsx(), loadBabel()"]
+        end
+    end
+
+    IDX --> bridge
+    IDX --> react
+    bridge --> B_CORE
+    bridge --> B_ADAPT
+    bridge --> B_RT
+    react --> H_CTX
+    react --> H_TOOLS
+    H_CTX --> bridge
+```
+
+### How @frontmcp/ui works with @frontmcp/uipack
+
+These two packages split concerns between server-side (uipack) and browser-side (ui):
+
+| Concern           | @frontmcp/ui (browser)      | @frontmcp/uipack (server)       |
+| ----------------- | --------------------------- | ------------------------------- |
+| React dependency  | Yes (peer dep)              | No                              |
+| Bridge            | Runtime class + React hooks | IIFE generator (vanilla JS)     |
+| Components        | MUI React components        | --                              |
+| Shell building    | --                          | HTML shell, CSP, data injection |
+| Rendering         | 13 content renderers        | --                              |
+| Import resolution | --                          | esm.sh resolver, import maps    |
+| Theme             | MUI ThemeProvider           | --                              |
+
+**End-to-end data flow:**
+
+```mermaid
+sequenceDiagram
+    participant Dev as Developer
+    participant SDK as @frontmcp/sdk
+    participant UP as @frontmcp/uipack
+    participant Browser
+    participant UI as @frontmcp/ui
+
+    Dev->>SDK: @Tool({ ui: { npm: '...' } })
+    SDK->>UP: renderComponent(config, shellConfig)
+    UP->>UP: resolve deps (esm.sh)
+    UP->>UP: build shell (CSP + data injection)
+    UP->>UP: inject bridge IIFE
+    UP-->>SDK: ShellResult { html, hash, size }
+
+    Browser->>SDK: readResource("ui://widget/tool.html")
+    SDK-->>Browser: cached HTML
+
+    Browser->>Browser: Load @frontmcp/ui via esm.sh
+    Browser->>UI: Mount React components
+    UI->>UI: Bridge hooks read window.__mcp* globals
+    UI->>Browser: Interactive widget rendered
+```
+
+1. **Server-side** (`@frontmcp/uipack`): Resolves component dependencies, builds HTML shell with CSP and bridge IIFE, injects tool data as `window.__mcp*` globals
+2. **Browser-side** (`@frontmcp/ui`): Loaded via esm.sh in the browser, provides React components, hooks to read injected data, and the bridge runtime for host communication
+
+### Renderer System
+
+Each renderer implements the `ContentRenderer` interface:
+
+```typescript
+interface ContentRenderer {
+  type: string; // e.g. 'chart', 'csv', 'pdf'
+  priority: number; // Higher wins when multiple match
+  canHandle(content: string): boolean;
+  render(content: string, options?: RenderOptions): ReactElement;
+}
+```
+
+Renderers are registered via `registerAllRenderers()` and auto-detected at runtime. Each renderer lazy-loads its peer dependencies using `useLazyModule()` — if a peer dep is missing, the renderer gracefully skips.
+
+### Development
+
+```bash
+# Build
+nx build ui
+
+# Test
+nx test ui
+
+# Lint
+nx lint ui
+```
+
+### Testing
+
+- 95%+ coverage required across statements, branches, functions, lines
+- Test all component variants and edge cases
+- Test renderer content detection logic
+- Test bridge adapter detection and capability checks
+
+## Requirements
+
+- Node.js >= 22.0.0
+- React ^18.0.0 || ^19.0.0
+- MUI >= 7.0.0
 
 ## Related Packages
 
-- [`@frontmcp/uipack`](../uipack) — React-free themes, runtime helpers, build tooling
-- [`@frontmcp/sdk`](../sdk) — core framework
-- [`@frontmcp/testing`](../testing) — UI assertions (`toHaveRenderedHtml`, `toBeXssSafe`)
+- [`@frontmcp/uipack`](../uipack) — React-free server-side shell builder, import resolver, component loader
+- [`@frontmcp/sdk`](../sdk) — Core FrontMCP SDK
+- [`@frontmcp/testing`](../testing) — UI test assertions
 
 ## License
 
 Apache-2.0 — see [LICENSE](../../LICENSE).
-
-<!-- links -->
-
-[docs-overview]: https://docs.agentfront.dev/frontmcp/ui/overview
-[docs-components]: https://docs.agentfront.dev/frontmcp/ui/components
-[docs-react]: https://docs.agentfront.dev/frontmcp/ui/react
-[docs-hooks]: https://docs.agentfront.dev/frontmcp/ui/hooks
-[docs-ssr]: https://docs.agentfront.dev/frontmcp/ui/ssr
-[docs-mdx]: https://docs.agentfront.dev/frontmcp/ui/mdx
-[docs-web-components]: https://docs.agentfront.dev/frontmcp/ui/web-components
-[docs-universal]: https://docs.agentfront.dev/frontmcp/ui/universal
-[docs-bundling]: https://docs.agentfront.dev/frontmcp/ui/bundling

package/bridge/adapters/claude.adapter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"claude.adapter.d.ts","sourceRoot":"","sources":["../../../src/bridge/adapters/claude.adapter.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAwB,MAAM,gBAAgB,CAAC;AAkBnE;;;;;;;;;;;;;;;;;;;GAmBG;AACH,qBAAa,aAAc,SAAQ,WAAW;IAC5C,QAAQ,CAAC,EAAE,YAAY;IACvB,QAAQ,CAAC,IAAI,wBAAwB;IACrC,QAAQ,CAAC,QAAQ,MAAM;;IAgBvB;;;;;OAKG;IACH,SAAS,IAAI,OAAO;IAgCpB;;OAEG;IACY,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;IAU1C;;;OAGG;IACY,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAMnD;;OAEG;IACY,kBAAkB,CAAC,KAAK,EAAE,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;IAKpE;;OAEG;IACY,YAAY,IAAI,OAAO,CAAC,IAAI,CAAC;IAS5C;;OAEG;IACH,OAAO,CAAC,mBAAmB;CAoB5B;AAED;;GAEG;AACH,wBAAgB,mBAAmB,IAAI,aAAa,CAEnD"}
+{"version":3,"file":"claude.adapter.d.ts","sourceRoot":"","sources":["../../../src/bridge/adapters/claude.adapter.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAwB,MAAM,gBAAgB,CAAC;AAgBnE;;;;;;;;;;;;;;;;;;;GAmBG;AACH,qBAAa,aAAc,SAAQ,WAAW;IAC5C,QAAQ,CAAC,EAAE,YAAY;IACvB,QAAQ,CAAC,IAAI,wBAAwB;IACrC,QAAQ,CAAC,QAAQ,MAAM;;IAgBvB;;;;;OAKG;IACH,SAAS,IAAI,OAAO;IAgCpB;;OAEG;IACY,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;IAU1C;;;OAGG;IACY,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAMnD;;OAEG;IACY,kBAAkB,CAAC,KAAK,EAAE,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;IAKpE;;OAEG;IACY,YAAY,IAAI,OAAO,CAAC,IAAI,CAAC;IAS5C;;OAEG;IACH,OAAO,CAAC,mBAAmB;CAoB5B;AAED;;GAEG;AACH,wBAAgB,mBAAmB,IAAI,aAAa,CAEnD"}

package/bridge/adapters/gemini.adapter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gemini.adapter.d.ts","sourceRoot":"","sources":["../../../src/bridge/adapters/gemini.adapter.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,WAAW,EAAwB,MAAM,gBAAgB,CAAC;AA6BnE;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAAa,aAAc,SAAQ,WAAW;IAC5C,QAAQ,CAAC,EAAE,YAAY;IACvB,QAAQ,CAAC,IAAI,mBAAmB;IAChC,QAAQ,CAAC,QAAQ,MAAM;IAEvB,OAAO,CAAC,OAAO,CAAwB;;IAgBvC;;OAEG;IACH,SAAS,IAAI,OAAO;IAuBpB;;OAEG;IACY,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;IAsB1C;;OAEG;IACM,QAAQ,IAAI,OAAO,GAAG,MAAM;IAQrC;;OAEG;IACY,WAAW,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAQ1D;;OAEG;IACY,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAanD;;OAEG;IACH,OAAO,CAAC,mBAAmB;CAqB5B;AAED;;GAEG;AACH,wBAAgB,mBAAmB,IAAI,aAAa,CAEnD"}
+{"version":3,"file":"gemini.adapter.d.ts","sourceRoot":"","sources":["../../../src/bridge/adapters/gemini.adapter.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,WAAW,EAAwB,MAAM,gBAAgB,CAAC;AA2BnE;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAAa,aAAc,SAAQ,WAAW;IAC5C,QAAQ,CAAC,EAAE,YAAY;IACvB,QAAQ,CAAC,IAAI,mBAAmB;IAChC,QAAQ,CAAC,QAAQ,MAAM;IAEvB,OAAO,CAAC,OAAO,CAAwB;;IAgBvC;;OAEG;IACH,SAAS,IAAI,OAAO;IAuBpB;;OAEG;IACY,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;IAsB1C;;OAEG;IACM,QAAQ,IAAI,OAAO,GAAG,MAAM;IAQrC;;OAEG;IACY,WAAW,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAQ1D;;OAEG;IACY,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAanD;;OAEG;IACH,OAAO,CAAC,mBAAmB;CAqB5B;AAED;;GAEG;AACH,wBAAgB,mBAAmB,IAAI,aAAa,CAEnD"}

package/bridge/index.js

@@ -1510,9 +1510,7 @@ var ExtAppsNotSupportedError = class extends Error {
 var CLAUDE_DOMAINS = ["claude.ai", "anthropic.com"];
 function isValidClaudeDomain(hostname) {
   const lowerHost = hostname.toLowerCase();
-  return CLAUDE_DOMAINS.some(
-    (domain) => lowerHost === domain || lowerHost.endsWith("." + domain)
-  );
+  return CLAUDE_DOMAINS.some((domain) => lowerHost === domain || lowerHost.endsWith("." + domain));
 }
 var ClaudeAdapter = class extends BaseAdapter {
   id = "claude";
@@ -1617,9 +1615,7 @@ function createClaudeAdapter() {
 var GEMINI_DOMAINS = ["gemini.google.com", "bard.google.com"];
 function isValidGeminiDomain(hostname) {
   const lowerHost = hostname.toLowerCase();
-  return GEMINI_DOMAINS.some(
-    (domain) => lowerHost === domain || lowerHost.endsWith("." + domain)
-  );
+  return GEMINI_DOMAINS.some((domain) => lowerHost === domain || lowerHost.endsWith("." + domain));
 }
 var GeminiAdapter = class extends BaseAdapter {
   id = "gemini";
@@ -1813,33 +1809,3 @@ registerBuiltInAdapters();
 
 // libs/ui/src/bridge/runtime/index.ts
 var import_uipack = require("@frontmcp/uipack");
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  AdapterRegistry,
-  BRIDGE_SCRIPT_TAGS,
-  BaseAdapter,
-  ClaudeAdapter,
-  DEFAULT_CAPABILITIES,
-  DEFAULT_SAFE_AREA,
-  ExtAppsAdapter,
-  FrontMcpBridge,
-  GeminiAdapter,
-  GenericAdapter,
-  OpenAIAdapter,
-  UNIVERSAL_BRIDGE_SCRIPT,
-  createBridge,
-  createClaudeAdapter,
-  createExtAppsAdapter,
-  createGeminiAdapter,
-  createGenericAdapter,
-  createOpenAIAdapter,
-  defaultRegistry,
-  detectAdapter,
-  generateBridgeIIFE,
-  generatePlatformBundle,
-  getAdapter,
-  getGlobalBridge,
-  registerAdapter,
-  registerBuiltInAdapters,
-  resetGlobalBridge
-});

package/components/Alert/Alert.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export interface AlertProps {
+    severity?: 'success' | 'info' | 'warning' | 'error';
+    title?: string;
+    dismissible?: boolean;
+    onDismiss?: () => void;
+    icon?: React.ReactNode;
+    children: React.ReactNode;
+}
+export declare function Alert({ severity, title, dismissible, onDismiss, icon, children, }: AlertProps): React.ReactElement | null;
+//# sourceMappingURL=Alert.d.ts.map

package/components/Alert/Alert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAIxC,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,KAAK,CAAC,EACpB,QAAiB,EACjB,KAAK,EACL,WAAmB,EACnB,SAAS,EACT,IAAI,EACJ,QAAQ,GACT,EAAE,UAAU,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CAkBxC"}

package/components/Alert/index.d.ts

@@ -0,0 +1,4 @@
+export { Alert } from './Alert';
+export { Alert as default } from './Alert';
+export type { AlertProps } from './Alert';
+//# sourceMappingURL=index.d.ts.map

package/components/Alert/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,KAAK,IAAI,OAAO,EAAE,MAAM,SAAS,CAAC;AAC3C,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC"}

package/components/Alert/index.js

@@ -0,0 +1,61 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// libs/ui/src/components/Alert/index.ts
+var Alert_exports = {};
+__export(Alert_exports, {
+  Alert: () => Alert,
+  default: () => Alert
+});
+module.exports = __toCommonJS(Alert_exports);
+
+// libs/ui/src/components/Alert/Alert.tsx
+var import_react = require("react");
+var import_Alert = __toESM(require("@mui/material/Alert"));
+var import_AlertTitle = __toESM(require("@mui/material/AlertTitle"));
+var import_jsx_runtime = require("react/jsx-runtime");
+function Alert({
+  severity = "info",
+  title,
+  dismissible = false,
+  onDismiss,
+  icon,
+  children
+}) {
+  const [dismissed, setDismissed] = (0, import_react.useState)(false);
+  if (dismissed) return null;
+  const handleClose = dismissible ? () => {
+    setDismissed(true);
+    onDismiss?.();
+  } : void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Alert.default, { severity, onClose: handleClose, icon, children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_AlertTitle.default, { children: title }),
+    children
+  ] });
+}

package/components/Avatar/Avatar.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface AvatarProps {
+    src?: string;
+    alt?: string;
+    children?: React.ReactNode;
+    size?: number;
+    variant?: 'circular' | 'rounded' | 'square';
+}
+export declare function Avatar({ src, alt, children, size, variant }: AvatarProps): React.ReactElement;
+//# sourceMappingURL=Avatar.d.ts.map

package/components/Avatar/Avatar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,WAAW;IAC1B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,UAAU,GAAG,SAAS,GAAG,QAAQ,CAAC;CAC7C;AAED,wBAAgB,MAAM,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAS,EAAE,OAAoB,EAAE,EAAE,WAAW,GAAG,KAAK,CAAC,YAAY,CAM/G"}

package/components/Avatar/index.d.ts

@@ -0,0 +1,4 @@
+export { Avatar } from './Avatar';
+export { Avatar as default } from './Avatar';
+export type { AvatarProps } from './Avatar';
+//# sourceMappingURL=index.d.ts.map

package/components/Avatar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,UAAU,CAAC;AAC7C,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}

package/components/Avatar/index.js

@@ -0,0 +1,43 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// libs/ui/src/components/Avatar/index.ts
+var Avatar_exports = {};
+__export(Avatar_exports, {
+  Avatar: () => Avatar,
+  default: () => Avatar
+});
+module.exports = __toCommonJS(Avatar_exports);
+
+// libs/ui/src/components/Avatar/Avatar.tsx
+var import_Avatar = __toESM(require("@mui/material/Avatar"));
+var import_jsx_runtime = require("react/jsx-runtime");
+function Avatar({ src, alt, children, size = 40, variant = "circular" }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Avatar.default, { src, alt, variant, sx: { width: size, height: size }, children });
+}

package/components/Badge/Badge.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export type BadgeVariant = 'default' | 'primary' | 'success' | 'warning' | 'error' | 'info';
+export interface BadgeProps {
+    variant?: BadgeVariant;
+    label: string;
+    dot?: boolean;
+    removable?: boolean;
+    onRemove?: () => void;
+    size?: 'small' | 'medium';
+    icon?: React.ReactElement;
+}
+export declare function Badge({ variant, label, dot, removable, onRemove, size, icon, }: BadgeProps): React.ReactElement;
+//# sourceMappingURL=Badge.d.ts.map

package/components/Badge/Badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AAE5F,MAAM,WAAW,UAAU;IACzB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC1B,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;CAC3B;AA6BD,wBAAgB,KAAK,CAAC,EACpB,OAAmB,EACnB,KAAK,EACL,GAAW,EACX,SAAiB,EACjB,QAAQ,EACR,IAAc,EACd,IAAI,GACL,EAAE,UAAU,GAAG,KAAK,CAAC,YAAY,CAajC"}

package/components/Badge/index.d.ts

@@ -0,0 +1,4 @@
+export { Badge } from './Badge';
+export { Badge as default } from './Badge';
+export type { BadgeProps, BadgeVariant } from './Badge';
+//# sourceMappingURL=index.d.ts.map

package/components/Badge/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,KAAK,IAAI,OAAO,EAAE,MAAM,SAAS,CAAC;AAC3C,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC"}