@frontmcp/ui 0.5.1 → 0.6.0

package/esm/react/types.d.ts

@@ -0,0 +1,106 @@
+/**
+ * @file types.ts
+ * @description TypeScript types for React wrapper components.
+ *
+ * Re-exports element types from web-components for use with React refs,
+ * and defines React-specific prop interfaces.
+ *
+ * @module @frontmcp/ui/react/types
+ */
+import type { ReactNode } from 'react';
+import type { CardOptions, CardVariant, CardSize, BadgeOptions, BadgeVariant, BadgeSize, ButtonOptions, AlertOptions } from '../components';
+export type { FmcpButton, FmcpCard, FmcpAlert, FmcpBadge, FmcpInput, FmcpSelect } from '../web-components';
+/**
+ * React props for Card component
+ */
+export interface CardProps {
+    /** Card title */
+    title?: string;
+    /** Card subtitle/description */
+    subtitle?: string;
+    /** Header actions content */
+    headerActions?: ReactNode;
+    /** Footer content */
+    footer?: ReactNode;
+    /** Card variant */
+    variant?: CardVariant;
+    /** Card size (padding) */
+    size?: CardSize;
+    /** Additional CSS classes */
+    className?: string;
+    /** Card ID */
+    id?: string;
+    /** Clickable card (adds hover effects) */
+    clickable?: boolean;
+    /** Click handler URL */
+    href?: string;
+    /** Card content */
+    children: ReactNode;
+}
+/**
+ * React props for Badge component
+ */
+export interface BadgeProps {
+    /** Badge variant */
+    variant?: BadgeVariant;
+    /** Badge size */
+    size?: BadgeSize;
+    /** Rounded pill style */
+    pill?: boolean;
+    /** Icon before text (ReactNode) */
+    icon?: ReactNode;
+    /** Dot indicator (no text) */
+    dot?: boolean;
+    /** Additional CSS classes */
+    className?: string;
+    /** Removable badge */
+    removable?: boolean;
+    /** Badge content */
+    children?: ReactNode;
+}
+/**
+ * React props for Button component
+ */
+export interface ButtonProps {
+    /** Button variant */
+    variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger' | 'success';
+    /** Button size */
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /** Disabled state */
+    disabled?: boolean;
+    /** Loading state */
+    loading?: boolean;
+    /** Full width */
+    fullWidth?: boolean;
+    /** Icon position */
+    iconPosition?: 'left' | 'right';
+    /** Icon content */
+    icon?: ReactNode;
+    /** Button type */
+    type?: 'button' | 'submit' | 'reset';
+    /** Additional CSS classes */
+    className?: string;
+    /** Click handler */
+    onClick?: () => void;
+    /** Button content */
+    children: ReactNode;
+}
+/**
+ * React props for Alert component
+ */
+export interface AlertProps {
+    /** Alert variant */
+    variant?: 'info' | 'success' | 'warning' | 'danger';
+    /** Alert title */
+    title?: string;
+    /** Icon content */
+    icon?: ReactNode;
+    /** Dismissible */
+    dismissible?: boolean;
+    /** Additional CSS classes */
+    className?: string;
+    /** Alert content */
+    children: ReactNode;
+}
+export type { CardOptions, CardVariant, CardSize, BadgeOptions, BadgeVariant, BadgeSize, ButtonOptions, AlertOptions };
+//# sourceMappingURL=types.d.ts.map

package/esm/react/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/react/types.ts"],"names":[],"mappings":"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"}

package/esm/react/utils.d.ts

@@ -0,0 +1,43 @@
+/**
+ * @file utils.ts
+ * @description Utility functions for React wrapper components.
+ *
+ * Provides helpers for converting React children to HTML strings
+ * for SSR compatibility with FrontMCP web components.
+ *
+ * @module @frontmcp/ui/react/utils
+ */
+import type { ReactNode } from 'react';
+/**
+ * Convert React children to an HTML string for SSR.
+ *
+ * - Strings are escaped via escapeHtml()
+ * - Numbers are converted to strings
+ * - ReactNode is rendered via ReactDOMServer.renderToStaticMarkup()
+ * - null/undefined return empty string
+ *
+ * @param children - React children to convert
+ * @returns HTML string representation
+ *
+ * @example
+ * ```tsx
+ * // String children
+ * renderChildrenToString('Hello') // 'Hello' (escaped)
+ *
+ * // React element children
+ * renderChildrenToString(<div>Test</div>) // '<div>Test</div>'
+ *
+ * // Mixed children
+ * renderChildrenToString(['Hello', <span>World</span>])
+ * ```
+ */
+export declare function renderChildrenToString(children: ReactNode): string;
+/**
+ * Check if we're running in a browser environment
+ */
+export declare function isBrowser(): boolean;
+/**
+ * Check if we're running in a Node.js environment
+ */
+export declare function isServer(): boolean;
+//# sourceMappingURL=utils.d.ts.map

package/esm/react/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/react/utils.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAoBvC;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,SAAS,GAAG,MAAM,CAiClE;AAED;;GAEG;AACH,wBAAgB,SAAS,IAAI,OAAO,CAEnC;AAED;;GAEG;AACH,wBAAgB,QAAQ,IAAI,OAAO,CAElC"}

package/esm/registry/index.d.ts

@@ -0,0 +1,46 @@
+/**
+ * @frontmcp/ui Registry Module
+ *
+ * Standalone widget building without @frontmcp/sdk.
+ *
+ * This module enables external platforms (like AgentLink) to use FrontMCP's
+ * widget compilation and rendering system without requiring the full SDK.
+ *
+ * @example
+ * ```typescript
+ * import {
+ *   ToolUIRegistry,
+ *   renderToolTemplateAsync,
+ *   buildStaticWidgetUri,
+ * } from '@frontmcp/ui/registry';
+ *
+ * // Create a registry for widget management
+ * const registry = new ToolUIRegistry();
+ *
+ * // Compile static widgets at startup
+ * await registry.compileStaticWidgetAsync({
+ *   toolName: 'get_weather',
+ *   template: WeatherWidget,
+ *   uiConfig: { template: WeatherWidget, ... },
+ * });
+ *
+ * // Render inline widgets at tool call time
+ * const result = await registry.renderAndRegisterAsync({
+ *   toolName: 'get_weather',
+ *   requestId: 'abc123',
+ *   input: { location: 'London' },
+ *   output: { temp: 72 },
+ *   uiConfig,
+ *   platformType: 'openai',
+ * });
+ * ```
+ *
+ * @packageDocumentation
+ */
+export { ToolUIRegistry, isUIRenderFailure } from './tool-ui.registry';
+export type { RenderOptions, UIRenderResult, UIRenderFailure, CompileStaticWidgetOptions, HybridComponentPayload, BuildHybridComponentPayloadOptions, } from './tool-ui.registry';
+export { renderToolTemplate, renderToolTemplateAsync, isReactComponent, hasUIConfig, containsMdxSyntax, } from './render-template';
+export type { RenderTemplateOptions } from './render-template';
+export { UI_RESOURCE_SCHEME, isUIResourceUri, isStaticWidgetUri, parseWidgetUri, buildStaticWidgetUri, getUIResourceMimeType, } from './uri-utils';
+export type { ParsedWidgetUri } from './uri-utils';
+//# sourceMappingURL=index.d.ts.map

package/esm/registry/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/registry/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AAMH,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACvE,YAAY,EACV,aAAa,EACb,cAAc,EACd,eAAe,EACf,0BAA0B,EAC1B,sBAAsB,EACtB,kCAAkC,GACnC,MAAM,oBAAoB,CAAC;AAM5B,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,gBAAgB,EAChB,WAAW,EACX,iBAAiB,GAClB,MAAM,mBAAmB,CAAC;AAC3B,YAAY,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAM/D,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,iBAAiB,EACjB,cAAc,EACd,oBAAoB,EACpB,qBAAqB,GACtB,MAAM,aAAa,CAAC;AACrB,YAAY,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC"}