@ateam-ai-mobile/ui 0.1.0

package/dist/index.d.mts

@@ -0,0 +1,166 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Message, JobProgress, UIAction } from '@ateam-ai-mobile/core';
+import * as React$1 from 'react';
+import React__default from 'react';
+import { PluginSurfaceMeta, PlatformPluginManifest } from '@ateam-ai-mobile/plugin-runtime';
+import * as zustand from 'zustand';
+
+interface AdasChatScreenProps {
+    /** Called when the user taps the call button; omit to hide it. */
+    onCallStart?: () => void;
+    /** Composer placeholder. */
+    placeholder?: string;
+    /** Extra element rendered above the composer (e.g. suggestion chips). */
+    footerAccessory?: React.ReactNode;
+    /** Mount the fullscreen image viewer here. Default true — set false if
+     *  the host already mounts <Lightbox /> at its root. */
+    withLightbox?: boolean;
+}
+declare function AdasChatScreen({ onCallStart, placeholder, footerAccessory, withLightbox, }: AdasChatScreenProps): react_jsx_runtime.JSX.Element;
+
+interface Props$7 {
+    message: Message;
+}
+declare function DaySeparator({ date }: {
+    date: Date;
+}): react_jsx_runtime.JSX.Element;
+declare function MessageBubble({ message }: Props$7): react_jsx_runtime.JSX.Element;
+
+interface Props$6 {
+    onSend: (text: string) => void;
+    onCallStart?: () => void;
+    loading: boolean;
+    /** Pre-fill the composer (e.g. from bridge.prepareMessage). The text is
+     *  placed in the input and focused — not sent. */
+    prefill?: string;
+    placeholder?: string;
+}
+declare function ChatInput({ onSend, onCallStart, loading, prefill, placeholder }: Props$6): react_jsx_runtime.JSX.Element;
+
+declare function TypingIndicator(): react_jsx_runtime.JSX.Element;
+
+interface Props$5 {
+    progress: JobProgress;
+}
+declare function JobProgressBar({ progress }: Props$5): react_jsx_runtime.JSX.Element;
+
+interface Props$4 {
+    columns: string[];
+    rows: any[][];
+}
+/**
+ * Renders tabular data as a vertical stack of cards — one card per row.
+ * The first column becomes the card title; remaining columns become
+ * key:value rows inside the card. Built specifically for narrow phone
+ * screens where horizontal markdown tables become unreadable.
+ */
+declare function TableCardBlock({ columns, rows }: Props$4): react_jsx_runtime.JSX.Element | null;
+
+interface Props$3 {
+    actions: UIAction[];
+}
+declare function UIActionsRow({ actions }: Props$3): react_jsx_runtime.JSX.Element | null;
+
+interface PluginRendererProps {
+    /** Full plugin ID, e.g. "mcp:connector-id:plugin-name" */
+    id: string;
+    /** Plugin manifest (from API) */
+    manifest: any;
+    /** Shared command buffer from parent — captures commands before plugin mounts */
+    commandBufferRef?: React__default.MutableRefObject<any[]>;
+    /** Engine-supplied props from sys.focusUiPlugin(id, props) — forwarded to
+     *  the plugin Component as `PluginProps.props`. */
+    props?: any;
+}
+declare function Plugin({ id, manifest, commandBufferRef, props: engineProps }: PluginRendererProps): react_jsx_runtime.JSX.Element;
+
+interface Props$2 {
+    pluginId: string;
+    surface: PluginSurfaceMeta;
+    dismiss: () => void;
+    /** Engine-supplied props forwarded from sys.focusUiPlugin(id, props). */
+    props?: any;
+}
+declare function PluginSurface({ pluginId, surface, dismiss, props }: Props$2): react_jsx_runtime.JSX.Element;
+
+interface Props$1 {
+    pluginId: string;
+    manifest: PlatformPluginManifest;
+    commandBufferRef?: React.MutableRefObject<any[]>;
+}
+/**
+ * WebView renderer for iframe-mode plugins. The injected bridge JS makes
+ * existing web plugins work unmodified; the origin guards below make sure
+ * the JWT seeded into localStorage can never leave the trusted hosts.
+ */
+declare function EmbeddedPluginWebView({ pluginId, manifest, commandBufferRef }: Props$1): react_jsx_runtime.JSX.Element;
+
+/**
+ * PostMessage bridge between the React Native host and a plugin WebView.
+ * Implements the same protocol as PluginHost.jsx in the web frontend.
+ *
+ * Handles THREE communication paths:
+ *   1. fetch("/mcp") — intercepted in bridge JS, proxied through postMessage
+ *   2. postMessage mcp-call — direct postMessage from plugin SDK
+ *   3. plugin commands — routed from the job stream to the WebView
+ */
+declare function usePluginBridge(pluginId: string, connectorId?: string, commandBufferRef?: React.MutableRefObject<any[]>, wsRef?: {
+    current: WebSocket | null;
+}): {
+    webViewRef: React$1.RefObject<any>;
+    sendInit: () => void;
+    handleMessage: (event: {
+        nativeEvent: {
+            data: string;
+        };
+    }) => Promise<void>;
+};
+/**
+ * Build injected JavaScript that:
+ * 1. Seeds localStorage with JWT + tenant (plugins read from localStorage)
+ * 2. Intercepts fetch("/mcp") and proxies through the postMessage bridge
+ * 3. Bridges iframe postMessage API to React Native WebView
+ *
+ * This makes existing web plugins work on mobile WITHOUT modification.
+ */
+declare function buildPluginBridgeJS(jwt: string, tenant: string): string;
+
+interface Props {
+    visible: boolean;
+    /** Display title shown in the top bar. */
+    title?: string;
+    /** Signed bundle URL from a /surface item. Relative or absolute. */
+    bundleUrl?: string;
+    onClose: () => void;
+}
+declare function WidgetWebView({ visible, title, bundleUrl, onClose }: Props): react_jsx_runtime.JSX.Element;
+
+declare function Lightbox(): react_jsx_runtime.JSX.Element | null;
+
+interface LightboxState {
+    uri: string | null;
+    show: (uri: string) => void;
+    hide: () => void;
+}
+declare const useLightboxStore: zustand.UseBoundStore<zustand.StoreApi<LightboxState>>;
+
+/**
+ * Host integration points for @ateam-ai-mobile/ui — same DI pattern as
+ * @ateam-ai-mobile/plugin-runtime's host.ts. Everything has a safe default; the host
+ * (or @ateam-ai-mobile/expo) wires real implementations at startup.
+ */
+interface ClipboardProvider {
+    setString(text: string): Promise<void>;
+}
+/** Register a clipboard implementation (e.g. expo-clipboard via @ateam-ai-mobile/expo). */
+declare function setClipboardProvider(clipboard: ClipboardProvider | null): void;
+interface UIActionRoute {
+    /** Full plugin id, e.g. "mcp:connector:plugin" or "platform:<name>". */
+    pluginId: string;
+    /** Query params the plugin reads on load (focus, tool, args, verb). */
+    params: Record<string, string>;
+}
+type UIActionNavigator = (route: UIActionRoute) => void;
+declare function setUIActionNavigator(navigate: UIActionNavigator | null): void;
+
+export { AdasChatScreen, type AdasChatScreenProps, ChatInput, type ClipboardProvider, DaySeparator, EmbeddedPluginWebView, JobProgressBar, Lightbox, MessageBubble, Plugin, PluginSurface, TableCardBlock, TypingIndicator, type UIActionRoute, UIActionsRow, WidgetWebView, buildPluginBridgeJS, setClipboardProvider, setUIActionNavigator, useLightboxStore, usePluginBridge };

package/dist/index.d.ts

@@ -0,0 +1,166 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Message, JobProgress, UIAction } from '@ateam-ai-mobile/core';
+import * as React$1 from 'react';
+import React__default from 'react';
+import { PluginSurfaceMeta, PlatformPluginManifest } from '@ateam-ai-mobile/plugin-runtime';
+import * as zustand from 'zustand';
+
+interface AdasChatScreenProps {
+    /** Called when the user taps the call button; omit to hide it. */
+    onCallStart?: () => void;
+    /** Composer placeholder. */
+    placeholder?: string;
+    /** Extra element rendered above the composer (e.g. suggestion chips). */
+    footerAccessory?: React.ReactNode;
+    /** Mount the fullscreen image viewer here. Default true — set false if
+     *  the host already mounts <Lightbox /> at its root. */
+    withLightbox?: boolean;
+}
+declare function AdasChatScreen({ onCallStart, placeholder, footerAccessory, withLightbox, }: AdasChatScreenProps): react_jsx_runtime.JSX.Element;
+
+interface Props$7 {
+    message: Message;
+}
+declare function DaySeparator({ date }: {
+    date: Date;
+}): react_jsx_runtime.JSX.Element;
+declare function MessageBubble({ message }: Props$7): react_jsx_runtime.JSX.Element;
+
+interface Props$6 {
+    onSend: (text: string) => void;
+    onCallStart?: () => void;
+    loading: boolean;
+    /** Pre-fill the composer (e.g. from bridge.prepareMessage). The text is
+     *  placed in the input and focused — not sent. */
+    prefill?: string;
+    placeholder?: string;
+}
+declare function ChatInput({ onSend, onCallStart, loading, prefill, placeholder }: Props$6): react_jsx_runtime.JSX.Element;
+
+declare function TypingIndicator(): react_jsx_runtime.JSX.Element;
+
+interface Props$5 {
+    progress: JobProgress;
+}
+declare function JobProgressBar({ progress }: Props$5): react_jsx_runtime.JSX.Element;
+
+interface Props$4 {
+    columns: string[];
+    rows: any[][];
+}
+/**
+ * Renders tabular data as a vertical stack of cards — one card per row.
+ * The first column becomes the card title; remaining columns become
+ * key:value rows inside the card. Built specifically for narrow phone
+ * screens where horizontal markdown tables become unreadable.
+ */
+declare function TableCardBlock({ columns, rows }: Props$4): react_jsx_runtime.JSX.Element | null;
+
+interface Props$3 {
+    actions: UIAction[];
+}
+declare function UIActionsRow({ actions }: Props$3): react_jsx_runtime.JSX.Element | null;
+
+interface PluginRendererProps {
+    /** Full plugin ID, e.g. "mcp:connector-id:plugin-name" */
+    id: string;
+    /** Plugin manifest (from API) */
+    manifest: any;
+    /** Shared command buffer from parent — captures commands before plugin mounts */
+    commandBufferRef?: React__default.MutableRefObject<any[]>;
+    /** Engine-supplied props from sys.focusUiPlugin(id, props) — forwarded to
+     *  the plugin Component as `PluginProps.props`. */
+    props?: any;
+}
+declare function Plugin({ id, manifest, commandBufferRef, props: engineProps }: PluginRendererProps): react_jsx_runtime.JSX.Element;
+
+interface Props$2 {
+    pluginId: string;
+    surface: PluginSurfaceMeta;
+    dismiss: () => void;
+    /** Engine-supplied props forwarded from sys.focusUiPlugin(id, props). */
+    props?: any;
+}
+declare function PluginSurface({ pluginId, surface, dismiss, props }: Props$2): react_jsx_runtime.JSX.Element;
+
+interface Props$1 {
+    pluginId: string;
+    manifest: PlatformPluginManifest;
+    commandBufferRef?: React.MutableRefObject<any[]>;
+}
+/**
+ * WebView renderer for iframe-mode plugins. The injected bridge JS makes
+ * existing web plugins work unmodified; the origin guards below make sure
+ * the JWT seeded into localStorage can never leave the trusted hosts.
+ */
+declare function EmbeddedPluginWebView({ pluginId, manifest, commandBufferRef }: Props$1): react_jsx_runtime.JSX.Element;
+
+/**
+ * PostMessage bridge between the React Native host and a plugin WebView.
+ * Implements the same protocol as PluginHost.jsx in the web frontend.
+ *
+ * Handles THREE communication paths:
+ *   1. fetch("/mcp") — intercepted in bridge JS, proxied through postMessage
+ *   2. postMessage mcp-call — direct postMessage from plugin SDK
+ *   3. plugin commands — routed from the job stream to the WebView
+ */
+declare function usePluginBridge(pluginId: string, connectorId?: string, commandBufferRef?: React.MutableRefObject<any[]>, wsRef?: {
+    current: WebSocket | null;
+}): {
+    webViewRef: React$1.RefObject<any>;
+    sendInit: () => void;
+    handleMessage: (event: {
+        nativeEvent: {
+            data: string;
+        };
+    }) => Promise<void>;
+};
+/**
+ * Build injected JavaScript that:
+ * 1. Seeds localStorage with JWT + tenant (plugins read from localStorage)
+ * 2. Intercepts fetch("/mcp") and proxies through the postMessage bridge
+ * 3. Bridges iframe postMessage API to React Native WebView
+ *
+ * This makes existing web plugins work on mobile WITHOUT modification.
+ */
+declare function buildPluginBridgeJS(jwt: string, tenant: string): string;
+
+interface Props {
+    visible: boolean;
+    /** Display title shown in the top bar. */
+    title?: string;
+    /** Signed bundle URL from a /surface item. Relative or absolute. */
+    bundleUrl?: string;
+    onClose: () => void;
+}
+declare function WidgetWebView({ visible, title, bundleUrl, onClose }: Props): react_jsx_runtime.JSX.Element;
+
+declare function Lightbox(): react_jsx_runtime.JSX.Element | null;
+
+interface LightboxState {
+    uri: string | null;
+    show: (uri: string) => void;
+    hide: () => void;
+}
+declare const useLightboxStore: zustand.UseBoundStore<zustand.StoreApi<LightboxState>>;
+
+/**
+ * Host integration points for @ateam-ai-mobile/ui — same DI pattern as
+ * @ateam-ai-mobile/plugin-runtime's host.ts. Everything has a safe default; the host
+ * (or @ateam-ai-mobile/expo) wires real implementations at startup.
+ */
+interface ClipboardProvider {
+    setString(text: string): Promise<void>;
+}
+/** Register a clipboard implementation (e.g. expo-clipboard via @ateam-ai-mobile/expo). */
+declare function setClipboardProvider(clipboard: ClipboardProvider | null): void;
+interface UIActionRoute {
+    /** Full plugin id, e.g. "mcp:connector:plugin" or "platform:<name>". */
+    pluginId: string;
+    /** Query params the plugin reads on load (focus, tool, args, verb). */
+    params: Record<string, string>;
+}
+type UIActionNavigator = (route: UIActionRoute) => void;
+declare function setUIActionNavigator(navigate: UIActionNavigator | null): void;
+
+export { AdasChatScreen, type AdasChatScreenProps, ChatInput, type ClipboardProvider, DaySeparator, EmbeddedPluginWebView, JobProgressBar, Lightbox, MessageBubble, Plugin, PluginSurface, TableCardBlock, TypingIndicator, type UIActionRoute, UIActionsRow, WidgetWebView, buildPluginBridgeJS, setClipboardProvider, setUIActionNavigator, useLightboxStore, usePluginBridge };