@tagit/ai-client-react 0.1.0-beta.1

package/dist/chat-widget.d.ts

@@ -0,0 +1,53 @@
+export type ChatWidgetMode = 'overlay' | 'inline';
+export type ChatWidgetSide = 'left' | 'right';
+export type ChatWidgetTheme = 'light' | 'dark' | 'system';
+export type ChatColorScheme = {
+    bg?: string;
+    surface?: string;
+    text?: string;
+    muted?: string;
+    border?: string;
+    primary?: string;
+    primaryContrast?: string;
+    tabBg?: string;
+    tabText?: string;
+    headerBg?: string;
+    bodyBg?: string;
+    footerBg?: string;
+    footerPromptBg?: string;
+    footerSendButtonBg?: string;
+    footerSendButtonText?: string;
+    userBubbleBg?: string;
+    assistantBubbleBg?: string;
+    scrim?: string;
+};
+export type ChatWidgetProps = {
+    mode?: ChatWidgetMode;
+    side?: ChatWidgetSide;
+    title?: string;
+    titleIconUrl?: string | null;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    theme?: ChatWidgetTheme;
+    colorScheme?: ChatColorScheme;
+    colorSchemes?: Partial<Record<'light' | 'dark', ChatColorScheme>>;
+    tabIcon?: React.ReactNode;
+    tabLabel?: string | null;
+    tabTooltipOpen?: string | null;
+    tabTooltipClose?: string | null;
+    tabIconUrl?: string | null;
+    tabHeightPercent?: number;
+    width?: number | string;
+    resizable?: boolean;
+    minWidthPx?: number;
+    maxWidthPx?: number;
+    onWidthChange?: (width: string) => void;
+    showBackdrop?: boolean;
+    closeOnOutsideClick?: boolean;
+    onNewChat?: () => void;
+    className?: string;
+    children: React.ReactNode;
+};
+export declare function ChatWidget({ mode, side, title, titleIconUrl, open, defaultOpen, onOpenChange, theme, colorScheme, colorSchemes, tabIcon, tabLabel, tabTooltipOpen, tabTooltipClose, tabIconUrl, tabHeightPercent, width, resizable, minWidthPx, maxWidthPx, onWidthChange, showBackdrop, closeOnOutsideClick, onNewChat, className, children, }: ChatWidgetProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=chat-widget.d.ts.map

package/dist/chat-widget.d.ts.map

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

package/dist/chat-widget.js

@@ -0,0 +1,134 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { SquareArrowOutUpRight, X } from 'lucide-react';
+function resolveTheme(theme) {
+    if (theme === 'light' || theme === 'dark') {
+        return theme;
+    }
+    if (typeof window !== 'undefined' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+        return 'dark';
+    }
+    return 'light';
+}
+export function ChatWidget({ mode = 'overlay', side = 'right', title = 'Ask TagIt', titleIconUrl, open, defaultOpen = false, onOpenChange, theme = 'system', colorScheme, colorSchemes, tabIcon, tabLabel = 'Chat', tabTooltipOpen, tabTooltipClose, tabIconUrl, tabHeightPercent = 40, width = 420, resizable = true, minWidthPx = 280, maxWidthPx, onWidthChange, showBackdrop = false, closeOnOutsideClick = false, onNewChat, className, children, }) {
+    const [internalOpen, setInternalOpen] = useState(defaultOpen);
+    const [internalWidth, setInternalWidth] = useState(typeof width === 'number' ? `${width}px` : String(width));
+    const [resolvedTheme, setResolvedTheme] = useState(() => resolveTheme(theme));
+    const panelRef = useRef(null);
+    const isControlled = typeof open === 'boolean';
+    const isOpen = isControlled ? Boolean(open) : internalOpen;
+    useEffect(() => {
+        setInternalWidth(typeof width === 'number' ? `${width}px` : String(width));
+    }, [width]);
+    useEffect(() => {
+        setResolvedTheme(resolveTheme(theme));
+        if (theme !== 'system' || typeof window === 'undefined') {
+            return;
+        }
+        const mql = window.matchMedia('(prefers-color-scheme: dark)');
+        const onChange = () => setResolvedTheme(mql.matches ? 'dark' : 'light');
+        mql.addEventListener('change', onChange);
+        return () => mql.removeEventListener('change', onChange);
+    }, [theme]);
+    useEffect(() => {
+        if (!isOpen || mode !== 'overlay') {
+            return;
+        }
+        const onKeyDown = (event) => {
+            if (event.key === 'Escape') {
+                setOpen(false);
+            }
+        };
+        window.addEventListener('keydown', onKeyDown);
+        return () => window.removeEventListener('keydown', onKeyDown);
+    }, [isOpen, mode]);
+    const setOpen = (nextOpen) => {
+        if (!isControlled) {
+            setInternalOpen(nextOpen);
+        }
+        onOpenChange?.(nextOpen);
+    };
+    const activeColorScheme = colorSchemes?.[resolvedTheme] ?? colorScheme;
+    const normalizedTabHeightPercent = Math.min(100, Math.max(0, tabHeightPercent));
+    const accessibleLabel = tabLabel?.trim() || title || 'Chat';
+    const collapseIcon = side === 'right' ? '>' : '<';
+    const hoverTitle = isOpen
+        ? tabTooltipClose?.trim() || `Close ${accessibleLabel}`
+        : tabTooltipOpen?.trim() || `Open ${accessibleLabel}`;
+    const setWidthFromResize = (widthPx, containerMaxPx) => {
+        const effectiveMax = Math.max(minWidthPx, Math.min(maxWidthPx ?? Number.MAX_SAFE_INTEGER, Math.max(minWidthPx, containerMaxPx)));
+        const clamped = Math.max(minWidthPx, Math.min(widthPx, effectiveMax));
+        const next = `${Math.round(clamped)}px`;
+        setInternalWidth(next);
+        onWidthChange?.(next);
+    };
+    const startResize = (event) => {
+        if (!resizable || !isOpen) {
+            return;
+        }
+        event.preventDefault();
+        const startX = event.clientX;
+        const startWidth = panelRef.current?.getBoundingClientRect().width ?? 0;
+        const onMove = (moveEvent) => {
+            const delta = side === 'right' ? startX - moveEvent.clientX : moveEvent.clientX - startX;
+            const root = panelRef.current?.closest('.tagIt-chat-widget');
+            const containerMaxPx = mode === 'inline'
+                ? (root?.parentElement?.getBoundingClientRect().width ?? window.innerWidth)
+                : window.innerWidth;
+            setWidthFromResize(startWidth + delta, containerMaxPx);
+        };
+        const onUp = () => {
+            window.removeEventListener('mousemove', onMove);
+            window.removeEventListener('mouseup', onUp);
+        };
+        window.addEventListener('mousemove', onMove);
+        window.addEventListener('mouseup', onUp);
+    };
+    const cssVars = useMemo(() => {
+        const vars = {
+            ['--tagIt-chat-bg']: activeColorScheme?.bg,
+            ['--tagIt-chat-surface']: activeColorScheme?.surface,
+            ['--tagIt-chat-text']: activeColorScheme?.text,
+            ['--tagIt-chat-muted']: activeColorScheme?.muted,
+            ['--tagIt-chat-border']: activeColorScheme?.border,
+            ['--tagIt-chat-primary']: activeColorScheme?.primary,
+            ['--tagIt-chat-primary-contrast']: activeColorScheme?.primaryContrast,
+            ['--tagIt-chat-tab-bg']: activeColorScheme?.tabBg,
+            ['--tagIt-chat-tab-text']: activeColorScheme?.tabText,
+            ['--tagIt-chat-panel-header-bg']: activeColorScheme?.headerBg,
+            ['--tagIt-chat-panel-body-bg']: activeColorScheme?.bodyBg,
+            ['--tagIt-chat-panel-footer-bg']: activeColorScheme?.footerBg,
+            ['--tagIt-chat-panel-footer-prompt-bg']: activeColorScheme?.footerPromptBg,
+            ['--tagIt-chat-panel-footer-send-bg']: activeColorScheme?.footerSendButtonBg,
+            ['--tagIt-chat-panel-footer-send-text']: activeColorScheme?.footerSendButtonText,
+            ['--tagIt-chat-user-bubble-bg']: activeColorScheme?.userBubbleBg,
+            ['--tagIt-chat-assistant-bubble-bg']: activeColorScheme?.assistantBubbleBg,
+            ['--tagIt-chat-scrim']: activeColorScheme?.scrim,
+            ['--tagIt-chat-panel-width']: internalWidth,
+            ['--tagIt-chat-tab-top']: `calc((100dvh - 48px) * ${(100 - normalizedTabHeightPercent) / 100})`,
+            ['--tagIt-chat-tab-top-inline']: `calc((100% - 48px) * ${(100 - normalizedTabHeightPercent) / 100})`,
+        };
+        return vars;
+    }, [activeColorScheme, internalWidth, normalizedTabHeightPercent]);
+    return (_jsxs("div", { className: [
+            'tagIt-chat-widget',
+            `tagIt-chat-widget-${mode}`,
+            `tagIt-chat-side-${side}`,
+            `tagIt-chat-theme-${resolvedTheme}`,
+            className || '',
+        ].join(' ').trim(), style: cssVars, children: [mode === 'overlay' && (showBackdrop || closeOnOutsideClick) && (_jsx("div", { className: [
+                    'tagIt-chat-scrim',
+                    isOpen ? 'tagIt-chat-scrim-open' : '',
+                    showBackdrop ? '' : 'tagIt-chat-scrim-transparent',
+                    closeOnOutsideClick ? '' : 'tagIt-chat-scrim-pass-through',
+                ].join(' ').trim(), onClick: () => {
+                    if (closeOnOutsideClick) {
+                        setOpen(false);
+                    }
+                }, "aria-hidden": true })), _jsxs("button", { type: "button", className: [
+                    'tagIt-chat-tab',
+                    tabLabel?.trim() ? '' : 'tagIt-chat-tab-icon-only',
+                    isOpen ? 'tagIt-chat-tab-open' : '',
+                ].join(' ').trim(), "aria-expanded": isOpen, "aria-label": isOpen ? `Close ${accessibleLabel}` : `Open ${accessibleLabel}`, title: hoverTitle, onClick: () => setOpen(!isOpen), children: [_jsx("span", { className: "tagIt-chat-tab-icon", "aria-hidden": true, children: isOpen ? collapseIcon : tabIconUrl ? _jsx("img", { src: tabIconUrl, alt: "" }) : tabIcon || 'AI' }), tabLabel?.trim() ? _jsx("span", { className: "tagIt-chat-tab-label", children: tabLabel }) : null] }), _jsxs("aside", { ref: panelRef, className: `tagIt-chat-panel ${isOpen ? 'tagIt-chat-panel-open' : ''}`, children: [resizable ? (_jsx("button", { type: "button", className: "tagIt-chat-resize-handle", "aria-label": "Resize chat panel", onMouseDown: startResize })) : null, _jsxs("header", { className: "tagIt-chat-panel-header", children: [_jsxs("div", { className: "tagIt-chat-panel-title-wrap", children: [titleIconUrl?.trim() ? (_jsx("img", { src: titleIconUrl, alt: "", "aria-hidden": true, className: "tagIt-chat-panel-title-icon" })) : null, _jsx("h2", { children: title })] }), _jsxs("div", { className: "tagIt-chat-panel-header-actions", children: [onNewChat && (_jsx("button", { type: "button", className: "tagIt-chat-header-btn", "aria-label": "New chat", title: "New chat", onClick: onNewChat, children: _jsx(SquareArrowOutUpRight, { size: 22 }) })), _jsx("button", { type: "button", className: "tagIt-chat-close", "aria-label": "Close chat", onClick: () => setOpen(false), children: _jsx(X, { size: 22 }) })] })] }), _jsx("div", { className: "tagIt-chat-panel-body", children: children })] })] }));
+}
+//# sourceMappingURL=chat-widget.js.map

package/dist/chat-widget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-widget.js","sourceRoot":"","sources":["../src/chat-widget.tsx"],"names":[],"mappings":"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"}

package/dist/hooks.d.ts

@@ -0,0 +1,6 @@
+/**
+ * React hooks for AI client
+ * Re-exports from provider for convenience
+ */
+export { useAIClient, useConversation, useClientEvents, } from './provider.js';
+//# sourceMappingURL=hooks.d.ts.map

package/dist/hooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../src/hooks.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACL,WAAW,EACX,eAAe,EACf,eAAe,GAChB,MAAM,eAAe,CAAC"}

package/dist/hooks.js

@@ -0,0 +1,6 @@
+/**
+ * React hooks for AI client
+ * Re-exports from provider for convenience
+ */
+export { useAIClient, useConversation, useClientEvents, } from './provider.js';
+//# sourceMappingURL=hooks.js.map

package/dist/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../src/hooks.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACL,WAAW,EACX,eAAe,EACf,eAAe,GAChB,MAAM,eAAe,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @tagit/ai-client-react
+ *
+ * React integration layer for tagit AI client core
+ * Provides context provider and hooks for consuming the AI client in React apps
+ *
+ * @example
+ * ```tsx
+ * import { AIClient, createDefaultConfig } from '@tagit/ai-client-core';
+ * import { AIClientProvider, useConversation } from '@tagit/ai-client-react';
+ *
+ * const config = createDefaultConfig('use-case-id', 'https://orchestrator.url');
+ * const client = new AIClient(config);
+ *
+ * function ChatApp() {
+ *   const { messages, sendMessage, isLoading } = useConversation();
+ *   return (
+ *     <div>
+ *       {messages.map(m => <div key={m.id}>{m.role}: {m.content}</div>)}
+ *       <button onClick={() => sendMessage('Hello')}>Send</button>
+ *     </div>
+ *   );
+ * }
+ *
+ * export default function App() {
+ *   return (
+ *     <AIClientProvider client={client}>
+ *       <ChatApp />
+ *     </AIClientProvider>
+ *   );
+ * }
+ * ```
+ */
+export { AIClientProvider, useAIClient, useConversation, useClientEvents, } from './provider.js';
+export { ChatWidget, type ChatWidgetProps, type ChatWidgetMode, type ChatWidgetSide, type ChatWidgetTheme, type ChatColorScheme, } from './chat-widget.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAEH,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,eAAe,EACf,eAAe,GAChB,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,UAAU,EACV,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,cAAc,EACnB,KAAK,eAAe,EACpB,KAAK,eAAe,GACrB,MAAM,kBAAkB,CAAC"}

package/dist/index.js

@@ -0,0 +1,36 @@
+/**
+ * @tagit/ai-client-react
+ *
+ * React integration layer for tagit AI client core
+ * Provides context provider and hooks for consuming the AI client in React apps
+ *
+ * @example
+ * ```tsx
+ * import { AIClient, createDefaultConfig } from '@tagit/ai-client-core';
+ * import { AIClientProvider, useConversation } from '@tagit/ai-client-react';
+ *
+ * const config = createDefaultConfig('use-case-id', 'https://orchestrator.url');
+ * const client = new AIClient(config);
+ *
+ * function ChatApp() {
+ *   const { messages, sendMessage, isLoading } = useConversation();
+ *   return (
+ *     <div>
+ *       {messages.map(m => <div key={m.id}>{m.role}: {m.content}</div>)}
+ *       <button onClick={() => sendMessage('Hello')}>Send</button>
+ *     </div>
+ *   );
+ * }
+ *
+ * export default function App() {
+ *   return (
+ *     <AIClientProvider client={client}>
+ *       <ChatApp />
+ *     </AIClientProvider>
+ *   );
+ * }
+ * ```
+ */
+export { AIClientProvider, useAIClient, useConversation, useClientEvents, } from './provider.js';
+export { ChatWidget, } from './chat-widget.js';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAEH,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,eAAe,EACf,eAAe,GAChB,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,UAAU,GAMX,MAAM,kBAAkB,CAAC"}

package/dist/provider.d.ts

@@ -0,0 +1,43 @@
+import { ReactNode } from 'react';
+import type { AIClient, ClientEvent } from '@tagit/ai-client-core';
+interface AIClientProviderProps {
+    client: AIClient;
+    children: ReactNode;
+}
+/**
+ * Provider that exposes the AI client to React components
+ */
+export declare function AIClientProvider({ client, children }: AIClientProviderProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Hook to access the AI client
+ */
+export declare function useAIClient(): AIClient;
+/**
+ * Hook to access and subscribe to conversation state
+ */
+export declare function useConversation(): {
+    sendMessage: (message: string, options?: {
+        tools?: "none" | "all" | string[];
+        useCaseMessage?: string;
+    }) => Promise<void>;
+    cancel: () => void;
+    retry: (options?: {
+        tools?: "none" | "all" | string[];
+        useCaseMessage?: string;
+    }) => Promise<void>;
+    clearHistory: () => void;
+    reEditMessage: (messageId: string) => string | null;
+    id: string;
+    messages: import("@tagit/ai-client-core").Message[];
+    isLoading: boolean;
+    isStreaming?: boolean;
+    error?: string;
+    lastError?: import("@tagit/ai-client-core").ClientErrorInfo;
+    useCaseId: string;
+};
+/**
+ * Hook to listen for specific client events
+ */
+export declare function useClientEvents(callback: (event: ClientEvent) => void): void;
+export {};
+//# sourceMappingURL=provider.d.ts.map

package/dist/provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAgD,MAAM,OAAO,CAAC;AACvF,OAAO,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAqB,MAAM,uBAAuB,CAAC;AAOtF,UAAU,qBAAqB;IAC7B,MAAM,EAAE,QAAQ,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,qBAAqB,2CAM3E;AAED;;GAEG;AACH,wBAAgB,WAAW,IAAI,QAAQ,CAMtC;AAED;;GAEG;AACH,wBAAgB,eAAe;2BAchB,MAAM,YACL;QAAE,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,MAAM,EAAE,CAAC;QAAC,cAAc,CAAC,EAAE,MAAM,CAAA;KAAE;;sBAa9D;QAAE,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,MAAM,EAAE,CAAC;QAAC,cAAc,CAAC,EAAE,MAAM,CAAA;KAAE;;+BAiB9B,MAAM,KAAG,MAAM,GAAG,IAAI;;;;;;;;EAcrE;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,QAMrE"}

package/dist/provider.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useCallback, useContext, useEffect, useState } from 'react';
+/**
+ * AI Client context
+ */
+const AIClientContext = React.createContext(null);
+/**
+ * Provider that exposes the AI client to React components
+ */
+export function AIClientProvider({ client, children }) {
+    return (_jsx(AIClientContext.Provider, { value: client, children: children }));
+}
+/**
+ * Hook to access the AI client
+ */
+export function useAIClient() {
+    const client = useContext(AIClientContext);
+    if (!client) {
+        throw new Error('useAIClient must be used within AIClientProvider');
+    }
+    return client;
+}
+/**
+ * Hook to access and subscribe to conversation state
+ */
+export function useConversation() {
+    const client = useAIClient();
+    const [state, setState] = useState(() => client.getState());
+    useEffect(() => {
+        const unsubscribe = client.on((event) => {
+            setState(client.getState());
+        });
+        return unsubscribe;
+    }, [client]);
+    const sendMessage = useCallback(async (message, options) => {
+        await client.sendMessage(message, options);
+    }, [client]);
+    const cancel = useCallback(() => {
+        client.cancel();
+    }, [client]);
+    const retry = useCallback(async (options) => {
+        const lastUserMessage = [...state.messages].reverse().find((message) => message.role === 'user');
+        if (!lastUserMessage) {
+            throw new Error('No user message available to retry');
+        }
+        await client.sendMessage(lastUserMessage.content, options);
+    }, [client, state.messages]);
+    const clearHistory = useCallback(() => {
+        client.clearHistory();
+        setState(client.getState());
+    }, [client]);
+    const reEditMessage = useCallback((messageId) => {
+        const content = client.trimHistoryBefore(messageId);
+        if (content !== null)
+            setState(client.getState());
+        return content;
+    }, [client]);
+    return {
+        ...state,
+        sendMessage,
+        cancel,
+        retry,
+        clearHistory,
+        reEditMessage,
+    };
+}
+/**
+ * Hook to listen for specific client events
+ */
+export function useClientEvents(callback) {
+    const client = useAIClient();
+    useEffect(() => {
+        return client.on(callback);
+    }, [client, callback]);
+}
+//# sourceMappingURL=provider.js.map

package/dist/provider.js.map

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

package/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "@tagit/ai-client-react",
+  "version": "0.1.0-beta.1",
+  "description": "React hooks and provider for TagIt AI client",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "src/chat-widget.css"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./chat-widget": {
+      "types": "./dist/chat-widget.d.ts",
+      "default": "./dist/chat-widget.js"
+    },
+    "./chat-widget.css": "./src/chat-widget.css",
+    "./hooks": {
+      "types": "./dist/hooks.d.ts",
+      "default": "./dist/hooks.js"
+    },
+    "./provider": {
+      "types": "./dist/provider.d.ts",
+      "default": "./dist/provider.js"
+    }
+  },
+  "dependencies": {
+    "lucide-react": "^1.7.0",
+    "@tagit/ai-client-core": "0.1.0-beta.1"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0"
+  },
+  "devDependencies": {
+    "@types/node": "^20.10.6",
+    "@types/react": "^18.2.37",
+    "react": "^18.2.0",
+    "typescript": "^6.0.2"
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "scripts": {
+    "build": "tsc",
+    "dev": "tsc --watch",
+    "test": "node ../../scripts/run-node-tests.mjs dist",
+    "typecheck": "tsc --noEmit"
+  }
+}

package/src/chat-widget.css

@@ -0,0 +1,392 @@
+.tagIt-chat-widget {
+  --tagIt-chat-bg: #f3f6fb;
+  --tagIt-chat-surface: #ffffff;
+  --tagIt-chat-text: #0f172a;
+  --tagIt-chat-muted: #64748b;
+  --tagIt-chat-border: #dbe4f0;
+  --tagIt-chat-primary: #1d4ed8;
+  --tagIt-chat-primary-contrast: #ffffff;
+  --tagIt-chat-tab-bg: #1d4ed8;
+  --tagIt-chat-tab-text: #ffffff;
+  --tagIt-chat-panel-header-bg: #ffffff;
+  --tagIt-chat-panel-body-bg: #f3f6fb;
+  --tagIt-chat-panel-footer-bg: #f8fbff;
+  --tagIt-chat-panel-footer-prompt-bg: #ffffff;
+  --tagIt-chat-panel-footer-send-bg: #1d4ed8;
+  --tagIt-chat-panel-footer-send-text: #ffffff;
+  --tagIt-chat-user-bubble-bg: #667eea;
+  --tagIt-chat-assistant-bubble-bg: #f0f0f0;
+  --tagIt-chat-scrim: rgba(15, 23, 42, 0.34);
+  --tagIt-chat-panel-width: 420px;
+  --tagIt-chat-tab-top: calc((100dvh - 48px) * 0.4);
+}
+
+.tagIt-chat-widget * {
+  box-sizing: border-box;
+}
+
+.tagIt-chat-widget-overlay .tagIt-chat-scrim {
+  position: fixed;
+  inset: 0;
+  background: var(--tagIt-chat-scrim);
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 200ms ease;
+  z-index: 70;
+}
+
+.tagIt-chat-widget-overlay .tagIt-chat-scrim-open {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.tagIt-chat-widget-overlay .tagIt-chat-scrim-transparent {
+  background: transparent;
+}
+
+.tagIt-chat-widget-overlay .tagIt-chat-scrim-pass-through {
+  pointer-events: none !important;
+}
+
+.tagIt-chat-widget .tagIt-chat-tab {
+  position: fixed;
+  top: var(--tagIt-chat-tab-top);
+  z-index: 90;
+  border: 0;
+  padding: 10px 12px;
+  color: var(--tagIt-chat-tab-text);
+  background: var(--tagIt-chat-tab-bg);
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  cursor: pointer;
+  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.24);
+}
+
+.tagIt-chat-side-right .tagIt-chat-tab {
+  right: 0;
+  border-radius: 10px 0 0 10px;
+}
+
+.tagIt-chat-side-left .tagIt-chat-tab {
+  left: 0;
+  border-radius: 0 10px 10px 0;
+}
+
+.tagIt-chat-side-right .tagIt-chat-tab-open {
+  right: min(100vw, var(--tagIt-chat-panel-width));
+}
+
+.tagIt-chat-side-left .tagIt-chat-tab-open {
+  left: min(100vw, var(--tagIt-chat-panel-width));
+}
+
+.tagIt-chat-tab-icon {
+  width: 22px;
+  height: 22px;
+  border-radius: 999px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(255, 255, 255, 0.22);
+  font-size: 13px;
+  font-weight: 700;
+  overflow: hidden;
+}
+
+.tagIt-chat-tab-open .tagIt-chat-tab-icon {
+  font-size: 16px;
+  font-weight: 800;
+}
+
+.tagIt-chat-tab-icon img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.tagIt-chat-tab-label {
+  font-size: 13px;
+  font-weight: 700;
+}
+
+.tagIt-chat-tab-icon-only {
+  padding-inline: 10px;
+}
+
+.tagIt-chat-panel {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  width: min(100vw, var(--tagIt-chat-panel-width));
+  background: var(--tagIt-chat-bg);
+  border: 1px solid var(--tagIt-chat-border);
+  z-index: 95;
+  display: flex;
+  flex-direction: column;
+  transition: transform 220ms ease;
+}
+
+.tagIt-chat-resize-handle {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  width: 12px;
+  border: 0;
+  padding: 0;
+  margin: 0;
+  background: transparent;
+  cursor: ew-resize;
+  z-index: 12;
+}
+
+.tagIt-chat-resize-handle::before {
+  content: '';
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 2px;
+  height: 44px;
+  border-radius: 999px;
+  transform: translate(-50%, -50%);
+  background: color-mix(in srgb, var(--tagIt-chat-border) 82%, var(--tagIt-chat-text));
+  opacity: 0.55;
+}
+
+.tagIt-chat-side-right .tagIt-chat-resize-handle {
+  left: -6px;
+}
+
+.tagIt-chat-side-left .tagIt-chat-resize-handle {
+  right: -6px;
+}
+
+.tagIt-chat-side-right .tagIt-chat-panel {
+  right: 0;
+  border-left: 1px solid var(--tagIt-chat-border);
+  transform: translateX(102%);
+}
+
+.tagIt-chat-side-left .tagIt-chat-panel {
+  left: 0;
+  border-right: 1px solid var(--tagIt-chat-border);
+  transform: translateX(-102%);
+}
+
+.tagIt-chat-panel-open {
+  transform: translateX(0) !important;
+}
+
+.tagIt-chat-panel-header {
+  height: 56px;
+  padding: 0 14px;
+  border-bottom: 1px solid var(--tagIt-chat-border);
+  background: var(--tagIt-chat-panel-header-bg);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.tagIt-chat-panel-header h2 {
+  margin: 0;
+  font-size: 15px;
+  color: var(--tagIt-chat-text);
+}
+
+.tagIt-chat-panel-title-wrap {
+  min-width: 0;
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.tagIt-chat-panel-title-icon {
+  width: 22px;
+  height: 22px;
+  border-radius: 6px;
+  object-fit: cover;
+  flex-shrink: 0;
+}
+
+.tagIt-chat-close {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+  border: 1px solid var(--tagIt-chat-border);
+  background: transparent;
+  color: var(--tagIt-chat-muted);
+  border-radius: 8px;
+  width: 32px;
+  height: 32px;
+  flex-shrink: 0;
+  cursor: pointer;
+}
+
+.tagIt-chat-panel-header-actions {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  flex-shrink: 0;
+}
+
+.tagIt-chat-header-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+  width: 32px;
+  height: 32px;
+  flex-shrink: 0;
+  border: 1px solid var(--tagIt-chat-border);
+  background: transparent;
+  color: var(--tagIt-chat-muted);
+  border-radius: 8px;
+  cursor: pointer;
+  transition: background 0.12s, color 0.12s;
+}
+
+.tagIt-chat-header-btn:hover {
+  background: color-mix(in srgb, var(--tagIt-chat-border) 50%, transparent);
+  color: var(--tagIt-chat-text);
+}
+
+.tagIt-chat-header-btn svg,
+.tagIt-chat-close svg {
+  width: 22px;
+  height: 22px;
+  flex: none;
+  display: block;
+}
+
+.tagIt-chat-panel-body {
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--tagIt-chat-panel-body-bg);
+}
+
+.tagIt-chat-theme-dark {
+  --tagIt-chat-bg: #0b1220;
+  --tagIt-chat-surface: #111b30;
+  --tagIt-chat-text: #e2e8f0;
+  --tagIt-chat-muted: #9aa8c0;
+  --tagIt-chat-border: #22324f;
+  --tagIt-chat-primary: #60a5fa;
+  --tagIt-chat-primary-contrast: #081225;
+  --tagIt-chat-tab-bg: #1d4ed8;
+  --tagIt-chat-tab-text: #eaf2ff;
+  --tagIt-chat-panel-header-bg: #111b30;
+  --tagIt-chat-panel-body-bg: #0b1220;
+  --tagIt-chat-panel-footer-bg: #111b30;
+  --tagIt-chat-panel-footer-prompt-bg: #0f172a;
+  --tagIt-chat-panel-footer-send-bg: #60a5fa;
+  --tagIt-chat-panel-footer-send-text: #081225;
+  --tagIt-chat-user-bubble-bg: #1d4ed8;
+  --tagIt-chat-assistant-bubble-bg: #1e293b;
+  --tagIt-chat-scrim: rgba(3, 8, 18, 0.62);
+}
+
+.tagIt-chat-widget-inline .tagIt-chat-scrim {
+  display: none;
+}
+
+.tagIt-chat-widget-inline {
+  position: relative;
+  width: min(100%, var(--tagIt-chat-panel-width));
+  max-width: 100%;
+  height: 100%;
+  border: 0;
+  border-radius: 0;
+  background: var(--tagIt-chat-bg);
+  overflow: visible;
+}
+
+.tagIt-chat-widget-inline.tagIt-chat-side-right {
+  border-radius: 0;
+  border-left: 1px solid var(--tagIt-chat-border);
+}
+
+.tagIt-chat-widget-inline.tagIt-chat-side-left {
+  border-radius: 0;
+  border-right: 1px solid var(--tagIt-chat-border);
+}
+
+.tagIt-chat-widget-inline .tagIt-chat-panel {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  border: 0;
+  overflow: hidden;
+  z-index: 5;
+}
+
+.tagIt-chat-widget-inline .tagIt-chat-tab {
+  position: absolute;
+  top: var(--tagIt-chat-tab-top-inline, 10px);
+  z-index: 10;
+}
+
+.tagIt-chat-widget-inline.tagIt-chat-side-right .tagIt-chat-tab {
+  left: 0;
+  right: auto;
+  transform: translateX(-100%);
+  border-radius: 10px 0 0 10px;
+}
+
+.tagIt-chat-widget-inline.tagIt-chat-side-left .tagIt-chat-tab {
+  right: 0;
+  left: auto;
+  transform: translateX(100%);
+  border-radius: 0 10px 10px 0;
+}
+
+.tagIt-chat-widget-inline.tagIt-chat-side-right .tagIt-chat-tab-open {
+  left: 0;
+  right: auto;
+}
+
+.tagIt-chat-widget-inline.tagIt-chat-side-left .tagIt-chat-tab-open {
+  right: 0;
+  left: auto;
+}
+
+@media (max-width: 720px) {
+  .tagIt-chat-panel {
+    width: 100vw;
+    border-left: 0;
+    border-right: 0;
+  }
+
+  .tagIt-chat-side-right .tagIt-chat-panel,
+  .tagIt-chat-side-left .tagIt-chat-panel {
+    right: 0;
+    left: 0;
+    transform: translateY(102%);
+  }
+
+  .tagIt-chat-panel-open {
+    transform: translateY(0) !important;
+  }
+
+  .tagIt-chat-side-right .tagIt-chat-tab,
+  .tagIt-chat-side-left .tagIt-chat-tab {
+    right: 12px;
+    left: auto;
+    border-radius: 999px;
+    top: auto;
+    bottom: 18px;
+  }
+
+  .tagIt-chat-side-right .tagIt-chat-tab-open,
+  .tagIt-chat-side-left .tagIt-chat-tab-open {
+    right: 12px;
+    left: auto;
+  }
+
+  .tagIt-chat-resize-handle {
+    display: none;
+  }
+}