@bmx-labs/chat-widget 0.0.1 → 0.0.3

package/README.md

@@ -1,6 +1,6 @@
 # @bmx-labs/chat-widget
 
-A reusable chat AI widget for React/Next.js apps. Fixed bottom-right with highest stacking order, pluggable backend adapter.
+A reusable chat AI widget for React/Next.js apps. Fixed bottom-right with highest stacking order, designed for server-side RAG integration.
 
 ## Install
 
@@ -8,52 +8,57 @@ A reusable chat AI widget for React/Next.js apps. Fixed bottom-right with highes
 npm i @bmx-labs/chat-widget react react-dom
 ```
 
+```bash
+yarn add @bmx-labs/chat-widget react react-dom
+```
+
+```bash
+pnpm add @bmx-labs/chat-widget react react-dom
+```
+
 ## Usage
 
 ```tsx
 import React from "react";
-import { BmxChatBot } from "@bmx-labs/chat-widget";
-import { PineconeRAGAdapter } from "@bmx-labs/chat-widget/adapters/context";
+import { BmxChatBot, RestAdapters } from "@bmx-labs/chat-widget";
 
 export default function App() {
-  // Frontend-only RAG adapter: embeds query with OpenAI, retrieves topK from Pinecone,
-  // builds a system prompt, then calls OpenAI chat to generate the answer.
-  const api = new PineconeRAGAdapter({
-    openAIApiKey: process.env.NEXT_PUBLIC_OPENAI_API_KEY!,
-    pineconeApiKey: process.env.NEXT_PUBLIC_PINECONE_API_KEY!,
-    pineconeIndexUrl: process.env.NEXT_PUBLIC_PINECONE_HOST!,
-    chatModel: "gpt-4o-mini",
-  });
-
-  return <BmxChatBot api={api} projectId="<your_project_id>" />;
+  // Server-side RAG adapter: calls your backend API endpoint
+  const api = RestAdapters.production(); // or RestAdapters.development()
+
+  return <BmxChatBot api={api} projectId="bmx" />;
 }
 ```
 
 - The widget is rendered via a portal to `document.body` with a very high `z-index`.
-- Provide your own API route at `/api/ai` that proxies to your LLM provider. Do not expose secrets in the browser.
+- **Server-side RAG**: All AI processing happens on your server to keep API keys secure.
 
 ### Adapters
 
-- `PineconeRAGAdapter` – Frontend RAG: OpenAI embeddings → Pinecone vector search → OpenAI chat.
-- `createMockAdapter(delayMs?)` – Echo responses for local dev.
+- `RestAdapters.production()` – Calls your server endpoint (same domain)
+- `RestAdapters.development()` – Calls localhost:8080 for development
+- `createRestAdapter(config)` – Custom server configuration
+- `createMockAdapter(delayMs?)` – Echo responses for local dev
 
-### PineconeRAGAdapter Config
+### Server Integration
+
+Create a POST endpoint on your server (e.g., `/common/ai/chat`) that handles RAG:
 
 ```ts
-type PineconeRAGAdapterConfig = {
-  openAIApiKey: string;
-  pineconeApiKey: string;
-  pineconeIndexUrl: string; // e.g. https://bmx-xxxx.svc.region.pinecone.io
-  namespace?: string; // default: 'bmx-docs'
-  topK?: number; // default: 4
-  chatModel?: string; // default: gpt-4o-mini
-  embeddingModel?: string; // default: text-embedding-3-large
-  openAIBaseURL?: string; // default: https://api.openai.com/v1
-  enableStreaming?: boolean; // not yet used
-  maxContextTokens?: number; // default: 2000
-  minScoreThreshold?: number; // default: 0.3
-  debug?: boolean; // default: false
-};
+// Your server endpoint
+POST /common/ai/chat
+{
+  "input": "user question",
+  "history": [{"role": "user", "content": "previous message"}]
+}
+
+// Response
+{
+  "id": "msg-123",
+  "role": "assistant", 
+  "content": "AI response with sources",
+  "createdAt": 1234567890
+}
 ```
 
 ### BmxChatBot Props
@@ -68,23 +73,10 @@ type PineconeRAGAdapterConfig = {
 ## Development
 
 ```bash
-npm install
-npm run build
-npm run dev
-```
-
-### GitHub Actions (Publish on tag)
-
-1. Create an npm token and add it as `NPM_TOKEN` in GitHub repository secrets.
-2. Push a tag to trigger publish:
-
-```bash
-git tag v0.1.1
-git push --tags
+pnpm i
+pnpm dev
 ```
 
-The workflow at `.github/workflows/publish.yml` will build and publish to npm.
-
 ## License
 
 This project is licensed as **GNU AGPLv3**.

package/dist/adapters/index.d.ts

@@ -1,2 +1,2 @@
 export { createMockAdapter } from "./mock";
-export { MorphexAdapter, PineconeRAGAdapter } from "./context";
+export { createRestAdapter, RestAdapters } from "./rest-adapter";

package/dist/adapters/rest-adapter.d.ts

@@ -0,0 +1,25 @@
+import type { BmxChatApiAdapter, RestAdapterConfig } from "../types";
+/**
+ * Creates a REST adapter that calls your server endpoint.
+ *
+ * @param {RestAdapterConfig} config - Configuration for the REST adapter.
+ * @returns {BmxChatApiAdapter} BmxChatApiAdapter implementation.
+ */
+export declare function createRestAdapter(config: RestAdapterConfig): BmxChatApiAdapter;
+/**
+ * Convenience factory for development and production.
+ */
+export declare const RestAdapters: {
+    /**
+     * For development (localhost:8080)
+     */
+    development: () => BmxChatApiAdapter;
+    /**
+     * For production (same domain)
+     */
+    production: (baseUrl?: string) => BmxChatApiAdapter;
+    /**
+     * Custom configuration
+     */
+    custom: (config: RestAdapterConfig) => BmxChatApiAdapter;
+};

package/dist/components/chat/ChatPanel.d.ts

@@ -19,6 +19,7 @@ interface ChatPanelProps {
     onHoverIntensityChange: (intensity: number) => void;
     rotateOnHover: boolean;
     onRotateOnHoverChange: (rotate: boolean) => void;
+    onSuggestionClick?: (suggestion: string) => void;
 }
-export declare function ChatPanel({ title, messages, input, setInput, onKeyDown, onSend, onClose, placeholder, sending, showSettings, onToggleSettings, onClearHistory, hue, onHueChange, hoverIntensity, onHoverIntensityChange, rotateOnHover, onRotateOnHoverChange, }: ChatPanelProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatPanel({ title, messages, input, setInput, onKeyDown, onSend, onClose, placeholder, sending, showSettings, onToggleSettings, onClearHistory, hue, onHueChange, hoverIntensity, onHoverIntensityChange, rotateOnHover, onRotateOnHoverChange, onSuggestionClick, }: ChatPanelProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/chat/SettingsPanel.d.ts

@@ -1,6 +1,8 @@
+import { ChatMessage } from "../../types";
 interface SettingsPanelProps {
     onClose: () => void;
     onClearHistory: () => void;
+    history: ChatMessage[];
     hue: number;
     onHueChange: (hue: number) => void;
     hoverIntensity: number;
@@ -8,5 +10,5 @@ interface SettingsPanelProps {
     rotateOnHover: boolean;
     onRotateOnHoverChange: (rotate: boolean) => void;
 }
-export declare function SettingsPanel({ onClose, onClearHistory, hue, onHueChange, hoverIntensity, onHoverIntensityChange, rotateOnHover, onRotateOnHoverChange, }: SettingsPanelProps): import("react/jsx-runtime").JSX.Element;
+export declare function SettingsPanel({ onClose, onClearHistory, history, hue, onHueChange, hoverIntensity, onHoverIntensityChange, rotateOnHover, onRotateOnHoverChange, }: SettingsPanelProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/message/EmptyMessages.d.ts

@@ -0,0 +1,4 @@
+export declare const EmptyMessages: ({ onSuggestionClick, }: {
+    onSuggestionClick?: (suggestion: string) => void;
+}) => import("react/jsx-runtime").JSX.Element;
+export default EmptyMessages;

package/dist/components/message/MessageList.d.ts

@@ -2,6 +2,7 @@ import type { ChatMessage } from "../../types";
 interface MessageListProps {
     messages: ChatMessage[];
     sending?: boolean;
+    onSuggestionClick?: (suggestion: string) => void;
 }
-export declare function MessageList({ messages, sending }: MessageListProps): import("react/jsx-runtime").JSX.Element;
+export declare function MessageList({ messages, sending, onSuggestionClick, }: MessageListProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/index.d.ts

@@ -1,3 +1,3 @@
+export { createMockAdapter, createRestAdapter, RestAdapters } from "./adapters";
 export { BmxChatBot } from "./components/BmxChatBot";
 export type { BmxChatApiAdapter, ChatMessage, ChatRole } from "./types";
-export { createMockAdapter, MorphexAdapter, PineconeRAGAdapter, } from "./adapters";