@leanmcp/ui 0.3.3 → 0.3.5

package/README.md

@@ -1,285 +1,285 @@
-<p align="center">
-  <img
-    src="https://raw.githubusercontent.com/LeanMCP/leanmcp-sdk/refs/heads/main/assets/logo.png"
-    alt="LeanMCP Logo"
-    width="400"
-  />
-</p>
-
-<p align="center">
-  <strong>@leanmcp/ui</strong><br/>
-  MCP-Native UI SDK for React — Build rich, interactive MCP Apps with first-class tool integration.
-</p>
-
-<p align="center">
-  <a href="https://www.npmjs.com/package/@leanmcp/ui">
-    <img src="https://img.shields.io/npm/v/@leanmcp/ui" alt="npm version" />
-  </a>
-  <a href="https://www.npmjs.com/package/@leanmcp/ui">
-    <img src="https://img.shields.io/npm/dm/@leanmcp/ui" alt="npm downloads" />
-  </a>
-  <a href="https://docs.leanmcp.com/sdk/ui">
-    <img src="https://img.shields.io/badge/Docs-leanmcp-0A66C2?" />
-  </a>
-  <a href="https://discord.com/invite/DsRcA3GwPy">
-    <img src="https://img.shields.io/badge/Discord-Join-5865F2?logo=discord&logoColor=white" />
-  </a>
-  <a href="https://x.com/LeanMcp">
-    <img src="https://img.shields.io/badge/@LeanMCP-f5f5f5?logo=x&logoColor=000000" />
-  </a>
-</p>
-
-## Features
-
-- **MCP-Native Components** — ToolButton, ToolSelect, ToolForm, ToolDataGrid, and more
-- **First-Class Tool Integration** — Components that natively call MCP tools
-- **ChatGPT Apps Support** — Build apps that work inside ChatGPT with `@GPTApp`
-- **Streaming Support** — Handle partial/streaming tool responses
-- **Theming** — Automatic host theme adaptation (light/dark)
-- **Testing Utilities** — `MockAppProvider` for unit testing
-
-## Installation
-
-```bash
-npm install @leanmcp/ui
-```
-
-## Quick Start
-
-```tsx
-import { AppProvider, ToolButton } from '@leanmcp/ui';
-import '@leanmcp/ui/styles.css';
-
-function MyApp() {
-  return (
-    <AppProvider appInfo={{ name: 'MyApp', version: '1.0.0' }}>
-      <ToolButton tool="refresh-data" resultDisplay="toast">
-        Refresh
-      </ToolButton>
-    </AppProvider>
-  );
-}
-```
-
-## Components
-
-### MCP-Native Components
-
-| Component | Description |
-|-----------|-------------|
-| `ToolButton` | Button with tool execution, confirmation, result display |
-| `ToolSelect` | Select with tool-based options and selection callbacks |
-| `ToolInput` | Input with debounced search and autocomplete |
-| `ToolForm` | Form with multiple field types (text, select, checkbox, slider) |
-| `ToolDataGrid` | Table with server-side pagination, sorting, row actions |
-| `ResourceView` | Display MCP server resources with auto-refresh |
-| `StreamingContent` | Render streaming/partial tool data |
-
-### Utility Components
-
-| Component | Description |
-|-----------|-------------|
-| `RequireConnection` | Guard wrapper for MCP connection state |
-| `ToolErrorBoundary` | Error boundary with retry for tool errors |
-| `ToolProvider` | Scoped configuration context |
-
-## Hooks
-
-| Hook | Description |
-|------|-------------|
-| `useTool` | Call tools with retry, abort, transformation |
-| `useToolStream` | Handle streaming tool input |
-| `useResource` | Read MCP resources with auto-refresh |
-| `useMessage` | Send messages to host chat |
-| `useHostContext` | Access host theme and viewport |
-
-### GPT Apps SDK Hooks
-
-These hooks provide access to the ChatGPT Apps SDK globals (compatible with OpenAI's `window.openai` API):
-
-| Hook | Description |
-|------|-------------|
-| `useToolOutput` | Access `structuredContent` from the tool response |
-| `useToolInput` | Access input arguments passed to the tool |
-| `useWidgetState` | Read/write persistent widget state across sessions |
-| `useToolResponseMetadata` | Access `_meta` from the tool response |
-| `useOpenAiGlobal` | Low-level hook to subscribe to any `window.openai` property |
-
-## Examples
-
-### ToolButton with Confirmation
-
-```tsx
-<ToolButton 
-  tool="delete-item" 
-  args={{ id: item.id }}
-  confirm={{ 
-    title: 'Delete Item?',
-    description: 'This cannot be undone.' 
-  }}
-  variant="destructive"
->
-  Delete
-</ToolButton>
-```
-
-### ToolSelect with Dynamic Options
-
-```tsx
-<ToolSelect
-  optionsTool="list-categories"
-  transformOptions={(r) => r.categories.map(c => ({
-    value: c.id,
-    label: c.name
-  }))}
-  onSelectTool="set-category"
-  argName="categoryId"
-/>
-```
-
-### ToolDataGrid
-
-```tsx
-<ToolDataGrid
-  dataTool="list-users"
-  columns={[
-    { key: 'name', header: 'Name', sortable: true },
-    { key: 'email', header: 'Email' },
-    { key: 'status', header: 'Status' }
-  ]}
-  transformData={(r) => ({ rows: r.users, total: r.total })}
-  rowActions={[
-    { label: 'Edit', tool: 'edit-user' }
-  ]}
-  pagination
-/>
-```
-
-### ToolForm
-
-```tsx
-<ToolForm
-  toolName="create-item"
-  fields={[
-    { name: 'title', label: 'Title', required: true },
-    { name: 'priority', label: 'Priority', type: 'select', 
-      options: [
-        { value: 'low', label: 'Low' },
-        { value: 'high', label: 'High' }
-      ] 
-    },
-    { name: 'notify', label: 'Send notifications', type: 'switch' }
-  ]}
-  showSuccessToast
-/>
-```
-
-## Server-Side Integration
-
-Use `@UIApp` decorator to register your React component as an MCP resource.
-
-> **Note:** Use a relative path string for the `component` property, not an imported component. This avoids importing React components on the server side.
-
-```typescript
-// mcp/dashboard/index.ts
-import { UIApp } from '@leanmcp/core';
-
-export class DashboardService {
-  @UIApp({
-    component: './Dashboard',  // Path relative to this file
-    name: 'dashboard',
-    title: 'Analytics Dashboard'
-  })
-  dashboard() {}
-}
-```
-
-## ChatGPT Integration
-
-Use `@GPTApp` for ChatGPT-specific apps:
-
-```typescript
-import { GPTApp } from '@leanmcp/ui';
-
-export class SlackService {
-  @GPTApp({
-    component: './SlackApp',  // Path relative to this file
-    name: 'slack-composer'
-  })
-  slackComposer() {}
-}
-```
-
-### GPT Apps SDK Hooks Usage
-
-Access tool output (structuredContent) without making additional API calls:
-
-```tsx
-import { useToolOutput, useWidgetState } from '@leanmcp/ui';
-
-function ChannelsView() {
-  // Access the structured data from the tool response
-  const toolOutput = useToolOutput<{ channels: Channel[] }>();
-  
-  // Persist state across the session
-  const [state, setState] = useWidgetState({ selectedChannel: null });
-  
-  if (!toolOutput?.channels) return <div>Loading...</div>;
-  
-  return (
-    <ul>
-      {toolOutput.channels.map(ch => (
-        <li key={ch.id} onClick={() => setState({ selectedChannel: ch.id })}>
-          {ch.name}
-        </li>
-      ))}
-    </ul>
-  );
-}
-```
-
-## Theming
-
-The SDK uses CSS variables compatible with MCP host theming. Import the styles:
-
-```tsx
-import '@leanmcp/ui/styles.css';
-```
-
-The styles automatically adapt to the host's theme (light/dark).
-
-## Testing
-
-Use `MockAppProvider` for unit testing:
-
-```tsx
-import { MockAppProvider } from '@leanmcp/ui/testing';
-
-test('renders tool result', () => {
-  render(
-    <MockAppProvider 
-      toolResult={{ data: 'test' }}
-      callTool={async () => ({ content: [{ type: 'text', text: '{}' }] })}
-    >
-      <MyComponent />
-    </MockAppProvider>
-  );
-});
-```
-
-## Documentation
-
-- [Full Documentation](https://docs.leanmcp.com/sdk/ui)
-- [Component Reference](https://docs.leanmcp.com/sdk/ui-components)
-- [Hooks Reference](https://docs.leanmcp.com/sdk/ui-hooks)
-- [ChatGPT Apps Guide](https://docs.leanmcp.com/sdk/ui-gpt-apps)
-
-## Related Packages
-
-- [@leanmcp/core](https://www.npmjs.com/package/@leanmcp/core) — Core MCP server functionality
-- [@leanmcp/cli](https://www.npmjs.com/package/@leanmcp/cli) — CLI for project scaffolding
-- [@leanmcp/auth](https://www.npmjs.com/package/@leanmcp/auth) — Authentication decorators
-
-## License
-
-MIT
+<p align="center">
+  <img
+    src="https://raw.githubusercontent.com/LeanMCP/leanmcp-sdk/refs/heads/main/assets/logo.png"
+    alt="LeanMCP Logo"
+    width="400"
+  />
+</p>
+
+<p align="center">
+  <strong>@leanmcp/ui</strong><br/>
+  MCP-Native UI SDK for React — Build rich, interactive MCP Apps with first-class tool integration.
+</p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/@leanmcp/ui">
+    <img src="https://img.shields.io/npm/v/@leanmcp/ui" alt="npm version" />
+  </a>
+  <a href="https://www.npmjs.com/package/@leanmcp/ui">
+    <img src="https://img.shields.io/npm/dm/@leanmcp/ui" alt="npm downloads" />
+  </a>
+  <a href="https://docs.leanmcp.com/sdk/ui">
+    <img src="https://img.shields.io/badge/Docs-leanmcp-0A66C2?" />
+  </a>
+  <a href="https://discord.com/invite/DsRcA3GwPy">
+    <img src="https://img.shields.io/badge/Discord-Join-5865F2?logo=discord&logoColor=white" />
+  </a>
+  <a href="https://x.com/LeanMcp">
+    <img src="https://img.shields.io/badge/@LeanMCP-f5f5f5?logo=x&logoColor=000000" />
+  </a>
+</p>
+
+## Features
+
+- **MCP-Native Components** — ToolButton, ToolSelect, ToolForm, ToolDataGrid, and more
+- **First-Class Tool Integration** — Components that natively call MCP tools
+- **ChatGPT Apps Support** — Build apps that work inside ChatGPT with `@GPTApp`
+- **Streaming Support** — Handle partial/streaming tool responses
+- **Theming** — Automatic host theme adaptation (light/dark)
+- **Testing Utilities** — `MockAppProvider` for unit testing
+
+## Installation
+
+```bash
+npm install @leanmcp/ui
+```
+
+## Quick Start
+
+```tsx
+import { AppProvider, ToolButton } from '@leanmcp/ui';
+import '@leanmcp/ui/styles.css';
+
+function MyApp() {
+  return (
+    <AppProvider appInfo={{ name: 'MyApp', version: '1.0.0' }}>
+      <ToolButton tool="refresh-data" resultDisplay="toast">
+        Refresh
+      </ToolButton>
+    </AppProvider>
+  );
+}
+```
+
+## Components
+
+### MCP-Native Components
+
+| Component | Description |
+|-----------|-------------|
+| `ToolButton` | Button with tool execution, confirmation, result display |
+| `ToolSelect` | Select with tool-based options and selection callbacks |
+| `ToolInput` | Input with debounced search and autocomplete |
+| `ToolForm` | Form with multiple field types (text, select, checkbox, slider) |
+| `ToolDataGrid` | Table with server-side pagination, sorting, row actions |
+| `ResourceView` | Display MCP server resources with auto-refresh |
+| `StreamingContent` | Render streaming/partial tool data |
+
+### Utility Components
+
+| Component | Description |
+|-----------|-------------|
+| `RequireConnection` | Guard wrapper for MCP connection state |
+| `ToolErrorBoundary` | Error boundary with retry for tool errors |
+| `ToolProvider` | Scoped configuration context |
+
+## Hooks
+
+| Hook | Description |
+|------|-------------|
+| `useTool` | Call tools with retry, abort, transformation |
+| `useToolStream` | Handle streaming tool input |
+| `useResource` | Read MCP resources with auto-refresh |
+| `useMessage` | Send messages to host chat |
+| `useHostContext` | Access host theme and viewport |
+
+### GPT Apps SDK Hooks
+
+These hooks provide access to the ChatGPT Apps SDK globals (compatible with OpenAI's `window.openai` API):
+
+| Hook | Description |
+|------|-------------|
+| `useToolOutput` | Access `structuredContent` from the tool response |
+| `useToolInput` | Access input arguments passed to the tool |
+| `useWidgetState` | Read/write persistent widget state across sessions |
+| `useToolResponseMetadata` | Access `_meta` from the tool response |
+| `useOpenAiGlobal` | Low-level hook to subscribe to any `window.openai` property |
+
+## Examples
+
+### ToolButton with Confirmation
+
+```tsx
+<ToolButton 
+  tool="delete-item" 
+  args={{ id: item.id }}
+  confirm={{ 
+    title: 'Delete Item?',
+    description: 'This cannot be undone.' 
+  }}
+  variant="destructive"
+>
+  Delete
+</ToolButton>
+```
+
+### ToolSelect with Dynamic Options
+
+```tsx
+<ToolSelect
+  optionsTool="list-categories"
+  transformOptions={(r) => r.categories.map(c => ({
+    value: c.id,
+    label: c.name
+  }))}
+  onSelectTool="set-category"
+  argName="categoryId"
+/>
+```
+
+### ToolDataGrid
+
+```tsx
+<ToolDataGrid
+  dataTool="list-users"
+  columns={[
+    { key: 'name', header: 'Name', sortable: true },
+    { key: 'email', header: 'Email' },
+    { key: 'status', header: 'Status' }
+  ]}
+  transformData={(r) => ({ rows: r.users, total: r.total })}
+  rowActions={[
+    { label: 'Edit', tool: 'edit-user' }
+  ]}
+  pagination
+/>
+```
+
+### ToolForm
+
+```tsx
+<ToolForm
+  toolName="create-item"
+  fields={[
+    { name: 'title', label: 'Title', required: true },
+    { name: 'priority', label: 'Priority', type: 'select', 
+      options: [
+        { value: 'low', label: 'Low' },
+        { value: 'high', label: 'High' }
+      ] 
+    },
+    { name: 'notify', label: 'Send notifications', type: 'switch' }
+  ]}
+  showSuccessToast
+/>
+```
+
+## Server-Side Integration
+
+Use `@UIApp` decorator to register your React component as an MCP resource.
+
+> **Note:** Use a relative path string for the `component` property, not an imported component. This avoids importing React components on the server side.
+
+```typescript
+// mcp/dashboard/index.ts
+import { UIApp } from '@leanmcp/core';
+
+export class DashboardService {
+  @UIApp({
+    component: './Dashboard',  // Path relative to this file
+    name: 'dashboard',
+    title: 'Analytics Dashboard'
+  })
+  dashboard() {}
+}
+```
+
+## ChatGPT Integration
+
+Use `@GPTApp` for ChatGPT-specific apps:
+
+```typescript
+import { GPTApp } from '@leanmcp/ui';
+
+export class SlackService {
+  @GPTApp({
+    component: './SlackApp',  // Path relative to this file
+    name: 'slack-composer'
+  })
+  slackComposer() {}
+}
+```
+
+### GPT Apps SDK Hooks Usage
+
+Access tool output (structuredContent) without making additional API calls:
+
+```tsx
+import { useToolOutput, useWidgetState } from '@leanmcp/ui';
+
+function ChannelsView() {
+  // Access the structured data from the tool response
+  const toolOutput = useToolOutput<{ channels: Channel[] }>();
+  
+  // Persist state across the session
+  const [state, setState] = useWidgetState({ selectedChannel: null });
+  
+  if (!toolOutput?.channels) return <div>Loading...</div>;
+  
+  return (
+    <ul>
+      {toolOutput.channels.map(ch => (
+        <li key={ch.id} onClick={() => setState({ selectedChannel: ch.id })}>
+          {ch.name}
+        </li>
+      ))}
+    </ul>
+  );
+}
+```
+
+## Theming
+
+The SDK uses CSS variables compatible with MCP host theming. Import the styles:
+
+```tsx
+import '@leanmcp/ui/styles.css';
+```
+
+The styles automatically adapt to the host's theme (light/dark).
+
+## Testing
+
+Use `MockAppProvider` for unit testing:
+
+```tsx
+import { MockAppProvider } from '@leanmcp/ui/testing';
+
+test('renders tool result', () => {
+  render(
+    <MockAppProvider 
+      toolResult={{ data: 'test' }}
+      callTool={async () => ({ content: [{ type: 'text', text: '{}' }] })}
+    >
+      <MyComponent />
+    </MockAppProvider>
+  );
+});
+```
+
+## Documentation
+
+- [Full Documentation](https://docs.leanmcp.com/sdk/ui)
+- [Component Reference](https://docs.leanmcp.com/sdk/ui-components)
+- [Hooks Reference](https://docs.leanmcp.com/sdk/ui-hooks)
+- [ChatGPT Apps Guide](https://docs.leanmcp.com/sdk/ui-gpt-apps)
+
+## Related Packages
+
+- [@leanmcp/core](https://www.npmjs.com/package/@leanmcp/core) — Core MCP server functionality
+- [@leanmcp/cli](https://www.npmjs.com/package/@leanmcp/cli) — CLI for project scaffolding
+- [@leanmcp/auth](https://www.npmjs.com/package/@leanmcp/auth) — Authentication decorators
+
+## License
+
+MIT

package/dist/{chunk-2HRO6CFU.js → chunk-57VDL5UC.js}

@@ -134,5 +134,5 @@ exports.getGPTAppMetadata = getGPTAppMetadata;
 exports.getGPTAppUri = getGPTAppUri;
 exports.getUIAppMetadata = getUIAppMetadata;
 exports.getUIAppUri = getUIAppUri;
-//# sourceMappingURL=chunk-2HRO6CFU.js.map
-//# sourceMappingURL=chunk-2HRO6CFU.js.map
+//# sourceMappingURL=chunk-57VDL5UC.js.map
+//# sourceMappingURL=chunk-57VDL5UC.js.map

package/dist/chunk-57VDL5UC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/decorator/UIApp.ts","../src/decorator/GPTApp.ts"],"names":["UI_APP_COMPONENT_KEY","UI_APP_URI_KEY","UI_APP_OPTIONS_KEY","UIApp","options","target","propertyKey","descriptor","methodName","String","className","name","toLowerCase","replace","uri","Reflect","defineMetadata","component","value","existingMeta","getMetadata","ui","resourceUri","getUIAppMetadata","undefined","getUIAppUri","GPT_APP_COMPONENT_KEY","GPT_APP_URI_KEY","GPT_APP_OPTIONS_KEY","GPTApp","uiMeta","visibility","openAiMeta","widgetAccessible","prefersBorder","widgetDomain","widgetDescription","csp","fileParams","invocation","invoking","invoked","getGPTAppMetadata","getGPTAppUri"],"mappings":"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","file":"chunk-57VDL5UC.js","sourcesContent":["/**\n * @UIApp Decorator\n * \n * Links an MCP tool to a React UI component.\n * When applied to a tool method, it:\n * 1. Adds _meta.ui/resourceUri to the tool definition\n * 2. Auto-registers a resource that renders the component to HTML\n * \n * This decorator is designed to work with @leanmcp/core decorators.\n */\nimport 'reflect-metadata';\nimport type React from 'react';\n\n// Metadata keys\nexport const UI_APP_COMPONENT_KEY = 'ui:app:component';\nexport const UI_APP_URI_KEY = 'ui:app:uri';\nexport const UI_APP_OPTIONS_KEY = 'ui:app:options';\n\n/**\n * Options for @UIApp decorator\n */\nexport interface UIAppOptions {\n    /** \n     * React component or path to component file (relative to service file).\n     * - Use path string (e.g., './WeatherCard') for CLI build - avoids importing browser code in server\n     * - Use component reference for direct SSR rendering\n     */\n    component: React.ComponentType<any> | string;\n    /** Custom resource URI (auto-generated if not provided) */\n    uri?: string;\n    /** HTML document title */\n    title?: string;\n    /** Additional CSS styles */\n    styles?: string;\n}\n\n\n/**\n * Decorator that links a tool to a UI component.\n * \n * When the tool is called, the host will fetch the UI resource\n * which returns the component rendered as HTML.\n * \n * @example\n * ```typescript\n * import { Tool } from '@leanmcp/core';\n * import { UIApp } from '@leanmcp/ui';\n * import { WeatherCard } from './WeatherCard';\n * \n * class WeatherService {\n *   @Tool({ description: 'Get weather for a city' })\n *   @UIApp({ component: WeatherCard })\n *   async getWeather(args: { city: string }) {\n *     return { city: args.city, temp: 22 };\n *   }\n * }\n * ```\n */\nexport function UIApp(options: UIAppOptions): MethodDecorator {\n    return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n        const methodName = String(propertyKey);\n        // Use same pattern as @Resource in @leanmcp/core: className without 'service' suffix\n        const className = target.constructor.name.toLowerCase().replace('service', '');\n\n        // Generate URI using ui:// scheme (required by ext-apps hosts)\n        const uri = options.uri ?? `ui://${className}/${methodName}`;\n\n        // Store metadata on the method\n        Reflect.defineMetadata(UI_APP_COMPONENT_KEY, options.component, descriptor.value!);\n        Reflect.defineMetadata(UI_APP_URI_KEY, uri, descriptor.value!);\n        Reflect.defineMetadata(UI_APP_OPTIONS_KEY, options, descriptor.value!);\n\n        // Also store the resource URI for the @Tool decorator to pick up\n        // The @Tool decorator in @leanmcp/core should check for this\n        const existingMeta = Reflect.getMetadata('tool:meta', descriptor.value) || {};\n        Reflect.defineMetadata('tool:meta', {\n            ...existingMeta,\n            // New nested format (preferred by ext-apps 0.2.2)\n            ui: {\n                resourceUri: uri,\n            },\n            // Legacy flat format (for backwards compatibility)\n            'ui/resourceUri': uri,\n        }, descriptor.value!);\n\n        return descriptor;\n    };\n}\n\n/**\n * Helper to get UIApp metadata from a method\n */\nexport function getUIAppMetadata(target: Function): UIAppOptions | undefined {\n    const component = Reflect.getMetadata(UI_APP_COMPONENT_KEY, target);\n    if (!component) return undefined;\n\n    return {\n        component,\n        uri: Reflect.getMetadata(UI_APP_URI_KEY, target),\n        ...Reflect.getMetadata(UI_APP_OPTIONS_KEY, target),\n    };\n}\n\n/**\n * Helper to get the resource URI from a method\n */\nexport function getUIAppUri(target: Function): string | undefined {\n    return Reflect.getMetadata(UI_APP_URI_KEY, target);\n}\n","/**\n * @GPTApp Decorator\n * \n * Links an MCP tool to a React UI component compliant with ChatGPT Apps SDK.\n * \n * When applied to a tool method, it:\n * 1. Adds _meta.ui/resourceUri to the tool definition\n * 2. Adds OpenAI-specific metadata (widgetAccessible, outputTemplate, etc.)\n * 3. Auto-registers a resource that renders the component to HTML with 'text/html+skybridge' mimeType\n */\nimport 'reflect-metadata';\nimport type React from 'react';\n\n// Metadata keys\nexport const GPT_APP_COMPONENT_KEY = 'gptapp:component';\nexport const GPT_APP_URI_KEY = 'gptapp:uri';\nexport const GPT_APP_OPTIONS_KEY = 'gptapp:options';\n\n/**\n * Options for @GPTApp decorator\n */\nexport interface GPTAppOptions {\n    /** \n     * React component or path to component file (relative to service file).\n     * - Use path string (e.g., './WeatherCard') for CLI build - avoids importing browser code in server\n     * - Use component reference for direct SSR rendering\n     */\n    component: React.ComponentType<any> | string;\n\n    /** Custom resource URI (auto-generated ui://... if not provided) */\n    uri?: string;\n\n    /** HTML document title */\n    title?: string;\n\n    /** Additional CSS styles */\n    styles?: string;\n\n    // ========== GPT-specific options ==========\n\n    /** \n     * Allow widget to call tools via window.openai.callTool.\n     * Maps to _meta[\"openai/widgetAccessible\"]\n     */\n    widgetAccessible?: boolean;\n\n    /** \n     * Tool visibility: 'public' (default) or 'private'.\n     * 'private' hides the tool from the model but keeps it callable by the widget.\n     * Maps to _meta[\"openai/visibility\"]\n     */\n    visibility?: 'public' | 'private';\n\n    /** \n     * Widget prefers border around iframe.\n     * Maps to _meta[\"openai/widgetPrefersBorder\"]\n     */\n    prefersBorder?: boolean;\n\n    /** \n     * Widget domain for API allowlists.\n     * Maps to _meta[\"openai/widgetDomain\"]\n     */\n    widgetDomain?: string;\n\n    /** \n     * Widget description for the model.\n     * Maps to _meta[\"openai/widgetDescription\"]\n     */\n    widgetDescription?: string;\n\n    /** \n     * Content Security Policy configuration.\n     * Maps to _meta[\"openai/widgetCSP\"]\n     */\n    csp?: {\n        connect_domains?: string[];\n        resource_domains?: string[];\n        redirect_domains?: string[];\n        frame_domains?: string[];\n    };\n\n    /** \n     * File parameters (fields treated as file uploads).\n     * Maps to _meta[\"openai/fileParams\"]\n     */\n    fileParams?: string[];\n\n    /** \n     * Invocation messages shown during tool call.\n     * Maps to _meta[\"openai/toolInvocation\"]\n     */\n    invocation?: {\n        invoking?: string;  // e.g., \"Preparing the board…\"\n        invoked?: string;   // e.g., \"Board ready.\"\n    };\n}\n\n\n/**\n * Decorator that links a tool to a UI component for ChatGPT Apps.\n * \n * When the tool is called, the host will fetch the UI resource\n * which returns the component rendered as HTML with 'text/html+skybridge'.\n * \n * @example\n * ```typescript\n * import { Tool } from '@leanmcp/core';\n * import { GPTApp } from '@leanmcp/ui';\n * import { KanbanBoard } from './KanbanBoard';\n * \n * class KanbanService {\n *   @Tool({ description: 'Show Kanban Board' })\n *   @GPTApp({ \n *     component: KanbanBoard,\n *     widgetAccessible: true,\n *     invocation: { invoking: 'Loading board...' }\n *   })\n *   async showBoard() { ... }\n * }\n * ```\n */\nexport function GPTApp(options: GPTAppOptions): MethodDecorator {\n    return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n        const methodName = String(propertyKey);\n        // Use same pattern as @Resource in @leanmcp/core: className without 'service' suffix\n        const className = target.constructor.name.toLowerCase().replace('service', '');\n\n        // Generate URI using ui:// scheme (required by ext-apps hosts)\n        const uri = options.uri ?? `ui://${className}/${methodName}`;\n\n        // Store metadata on the method\n        Reflect.defineMetadata(GPT_APP_COMPONENT_KEY, options.component, descriptor.value!);\n        Reflect.defineMetadata(GPT_APP_URI_KEY, uri, descriptor.value!);\n        Reflect.defineMetadata(GPT_APP_OPTIONS_KEY, options, descriptor.value!);\n\n        // Also store the resource URI and OpenAI-specific metadata for the @Tool decorator to pick up\n        const existingMeta = Reflect.getMetadata('tool:meta', descriptor.value) || {};\n\n        // Build nested ui metadata (preferred by ext-apps 0.2.2)\n        const uiMeta: Record<string, any> = {\n            resourceUri: uri,\n        };\n\n        // Map visibility to ext-apps format\n        if (options.visibility) {\n            uiMeta.visibility = options.visibility === 'private' ? ['app'] : ['model', 'app'];\n        }\n\n        const openAiMeta: Record<string, any> = {\n            // New nested format (preferred by ext-apps 0.2.2)\n            ui: uiMeta,\n            // Legacy flat format (for backwards compatibility)\n            'ui/resourceUri': uri,\n            'openai/outputTemplate': uri,\n        };\n\n        if (options.widgetAccessible !== undefined) {\n            openAiMeta['openai/widgetAccessible'] = options.widgetAccessible;\n        }\n\n        if (options.visibility) {\n            openAiMeta['openai/visibility'] = options.visibility;\n        }\n\n        if (options.prefersBorder !== undefined) {\n            openAiMeta['openai/widgetPrefersBorder'] = options.prefersBorder;\n        }\n\n        if (options.widgetDomain) {\n            openAiMeta['openai/widgetDomain'] = options.widgetDomain;\n        }\n\n        if (options.widgetDescription) {\n            openAiMeta['openai/widgetDescription'] = options.widgetDescription;\n        }\n\n        if (options.csp) {\n            openAiMeta['openai/widgetCSP'] = options.csp;\n        }\n\n        if (options.fileParams) {\n            openAiMeta['openai/fileParams'] = options.fileParams;\n        }\n\n        if (options.invocation) {\n            if (options.invocation.invoking) openAiMeta['openai/toolInvocation/invoking'] = options.invocation.invoking;\n            if (options.invocation.invoked) openAiMeta['openai/toolInvocation/invoked'] = options.invocation.invoked;\n        }\n\n        Reflect.defineMetadata('tool:meta', {\n            ...existingMeta,\n            ...openAiMeta,\n        }, descriptor.value!);\n\n        return descriptor;\n    };\n}\n\n/**\n * Helper to get GPTApp metadata from a method\n */\nexport function getGPTAppMetadata(target: Function): GPTAppOptions | undefined {\n    const component = Reflect.getMetadata(GPT_APP_COMPONENT_KEY, target);\n    if (!component) return undefined;\n\n    return {\n        component,\n        uri: Reflect.getMetadata(GPT_APP_URI_KEY, target),\n        ...Reflect.getMetadata(GPT_APP_OPTIONS_KEY, target),\n    };\n}\n\n/**\n * Helper to get the resource URI from a method\n */\nexport function getGPTAppUri(target: Function): string | undefined {\n    return Reflect.getMetadata(GPT_APP_URI_KEY, target);\n}\n"]}

package/dist/{chunk-KX75VCMM.mjs → chunk-5RGEQPF3.mjs}

@@ -120,5 +120,5 @@ function getGPTAppUri(target) {
 __name(getGPTAppUri, "getGPTAppUri");
 
 export { GPTApp, GPT_APP_COMPONENT_KEY, GPT_APP_OPTIONS_KEY, GPT_APP_URI_KEY, UIApp, UI_APP_COMPONENT_KEY, UI_APP_OPTIONS_KEY, UI_APP_URI_KEY, __name, getGPTAppMetadata, getGPTAppUri, getUIAppMetadata, getUIAppUri };
-//# sourceMappingURL=chunk-KX75VCMM.mjs.map
-//# sourceMappingURL=chunk-KX75VCMM.mjs.map
+//# sourceMappingURL=chunk-5RGEQPF3.mjs.map
+//# sourceMappingURL=chunk-5RGEQPF3.mjs.map