@headwai/chat-bubble 4.0.0 → 6.1.0-rc.publish-npm-package.df2535f

package/README.dev.md

@@ -15,7 +15,6 @@ The chat bubble is based on a Svelte integration for the [deep-chat](https://www
 
 ```bash
 git clone <your-repo-url>
-cd chat-bubble
 ```
 
 2. Install dependencies:
@@ -61,9 +60,8 @@ Create a `.env` by copying `.env.example` file in your project root with the fol
 <script>
   // Runtime configuration override
   window.HEADWAI_CHAT_BUBBLE_CONFIG = {
-    apiUrl: 'https://customer-api.com/chat',
-    apiKey: 'customer-api-key',
-    modelId: 'gpt-4',
+    apiUrl: 'https://company.localchat.at',
+    assistantId: 'customer-support-assistant-id',
   };
 </script>
 ```
@@ -73,8 +71,7 @@ Create a `.env` by copying `.env.example` file in your project root with the fol
 ```html
 <div
   data-chat-bubble
-  data-chat-bubble-api-url="https://api1.com/chat"
-  data-chat-bubble-api-key="key1"
+  data-chat-bubble-api-url="https://company.localchat.at"
   data-chat-bubble-user-message-background-color="#ff9500"
   data-chat-bubble-ai-message-background-color="#00c851"
   data-chat-bubble-user-message-text-color="#ffffff"
@@ -104,9 +101,8 @@ This project builds a standalone widget that can be integrated into any website.
 
 ```bash
 # Production .env file
-VITE_CHAT_BUBBLE_API_URL=https://api.customer-domain.com/chat
-VITE_CHAT_BUBBLE_API_KEY=prod-api-key
-VITE_CHAT_BUBBLE_MODEL_ID=gpt-4
+VITE_CHAT_BUBBLE_API_URL=https://company.localchat.at
+VITE_CHAT_BUBBLE_ASSISTANT_ID=customer-support-assistant-id
 ```
 
 2. **Bump package version**
@@ -164,7 +160,7 @@ The chat bubble makes requests to the following API endpoints:
 
 #### 1. Chat Completions API
 
-- **Endpoint**: `{apiUrl}/api/chat-bubble/chat/completions`
+- **Endpoint**: `{apiUrl}/api/chat/completions`
 - **Method**: WebSocket (streaming)
 - **Purpose**: Main chat conversation endpoint for sending messages and receiving AI responses
 - **Authentication**: Bearer token via `Authorization` header
@@ -173,7 +169,7 @@ The chat bubble makes requests to the following API endpoints:
 
 #### 2. Chat Creation API
 
-- **Endpoint**: `{apiUrl}/api/chat-bubble/v1/chats/new`
+- **Endpoint**: `{apiUrl}/api/v1/chats/new`
 - **Method**: POST
 - **Purpose**: Create a new chat session when starting a conversation
 - **Authentication**: Bearer token via `Authorization` header
@@ -181,7 +177,7 @@ The chat bubble makes requests to the following API endpoints:
 
 #### 3. Chat Storage API
 
-- **Endpoint**: `{apiUrl}/api/chat-bubble/v1/chats/{chatId}`
+- **Endpoint**: `{apiUrl}/api/v1/chats/{chatId}`
 - **Method**: POST
 - **Purpose**: Store/update chat history and conversation state
 - **Authentication**: Bearer token via `Authorization` header
@@ -189,7 +185,7 @@ The chat bubble makes requests to the following API endpoints:
 
 #### 4. Feedback API
 
-- **Endpoint**: `{apiUrl}/api/chat-bubble/v1/evaluations/feedback`
+- **Endpoint**: `{apiUrl}/api/v1/evaluations/feedback`
 - **Method**: POST
 - **Purpose**: Submit user feedback (thumbs up/down) for AI responses
 - **Authentication**: Bearer token via `Authorization` header
@@ -201,11 +197,10 @@ The chat bubble can be configured using environment variables, data attributes,
 
 #### Core API Configuration
 
-| Attribute | Environment Variable        | Data Attribute              | Purpose                                  | Default             |
-| --------- | --------------------------- | --------------------------- | ---------------------------------------- | ------------------- |
-| `apiUrl`  | `VITE_CHAT_BUBBLE_API_URL`  | `data-chat-bubble-api-url`  | Base URL for API endpoints               | `https://localhost` |
-| `apiKey`  | `VITE_CHAT_BUBBLE_API_KEY`  | `data-chat-bubble-api-key`  | Authentication token for API requests    | `''`                |
-| `modelId` | `VITE_CHAT_BUBBLE_MODEL_ID` | `data-chat-bubble-model-id` | AI model identifier to use for responses | `test-model`        |
+| Attribute     | Environment Variable            | Data Attribute                  | Purpose                                   | Default             |
+| ------------- | ------------------------------- | ------------------------------- | ----------------------------------------- | ------------------- |
+| `apiUrl`      | `VITE_CHAT_BUBBLE_API_URL`      | `data-chat-bubble-api-url`      | Base URL for API endpoints                | `https://localhost` |
+| `assistantId` | `VITE_CHAT_BUBBLE_ASSISTANT_ID` | `data-chat-bubble-assistant-id` | Assistant identifier to use for responses | `test-model`        |
 
 #### Message Configuration
 
@@ -248,7 +243,7 @@ The chat bubble can be configured using environment variables, data attributes,
       "content": "message text"
     }
   ],
-  "model": "model-id",
+  "model": "customer-support-assistant-id",
   "stream": true,
   "chat_id": "uuid-if-existing",
   "params": {},
@@ -277,10 +272,11 @@ The chat bubble can be configured using environment variables, data attributes,
 
 ```javascript
 {
+  "assistantId": "customer-support-assistant-id",
   "chat": {
     "id": "",
     "title": "New Chatbubble Chat",
-    "models": ["model-id"],
+    "models": ["customer-support-assistant-id"],
     "params": {},
     "history": {
       "messages": {"message-id": {...}},
@@ -293,7 +289,7 @@ The chat bubble can be configured using environment variables, data attributes,
       "role": "assistant|user",
       "content": "message content",
       "timestamp": 1704636645,
-      "models": ["model-id"]
+      "models": ["customer-support-assistant-id"]
     }],
     "tags": [],
     "timestamp": 1704636645000
@@ -302,21 +298,83 @@ The chat bubble can be configured using environment variables, data attributes,
 }
 ```
 
+#### Chat Storage Request
+
+```javascript
+{
+  "assistantId": "customer-support-assistant-id",
+  "chat": {
+    "models": ["customer-support-assistant-id"],
+    "history": {
+      "messages": {
+        "message-uuid-1": {
+          "id": "message-uuid-1",
+          "parentId": null,
+          "childrenIds": ["message-uuid-2"],
+          "role": "user",
+          "content": "user message content",
+          "timestamp": 1704636645,
+          "models": ["customer-support-assistant-id"]
+        },
+        "message-uuid-2": {
+          "id": "message-uuid-2",
+          "parentId": "message-uuid-1",
+          "childrenIds": [],
+          "role": "assistant",
+          "content": "assistant response content",
+          "model": "customer-support-assistant-id",
+          "modelId": "customer-support-assistant-id",
+          "modelIdx": 0,
+          "timestamp": 1704636645,
+          "sources": []
+        }
+      },
+      "currentId": "message-uuid-2"
+    },
+    "messages": [
+      {
+        "id": "message-uuid-1",
+        "parentId": null,
+        "childrenIds": ["message-uuid-2"],
+        "role": "user",
+        "content": "user message content",
+        "timestamp": 1704636645,
+        "models": ["customer-support-assistant-id"]
+      },
+      {
+        "id": "message-uuid-2",
+        "parentId": "message-uuid-1",
+        "childrenIds": [],
+        "role": "assistant",
+        "content": "assistant response content",
+        "model": "customer-support-assistant-id",
+        "modelId": "customer-support-assistant-id",
+        "modelIdx": 0,
+        "timestamp": 1704636645,
+        "sources": []
+      }
+    ],
+    "params": {}
+  }
+}
+```
+
 #### Feedback Request
 
 ```javascript
 {
+  "assistantId": "customer-support-assistant-id",
   "type": "rating",
   "data": {
     "rating": 1, // 1 for positive, -1 for negative
-    "model_id": "model-id"
+    "model_id": "customer-support-assistant-id"
   },
   "meta": {
-    "model_id": "model-id",
+    "model_id": "customer-support-assistant-id",
     "message_id": "message-uuid",
     "message_index": 2,
     "chat_id": "chat-uuid",
-    "base_models": {"model-id": "model-id"}
+    "base_models": {"customer-support-assistant-id": "customer-support-assistant-id"}
   },
   "snapshot": {
     "chat": {
@@ -352,7 +410,6 @@ This component is designed to work with OpenAI-compatible APIs. The request and
 ### Common Issues
 
 **CORS Errors**: Ensure your API endpoint allows requests from your domain
-**Authentication Failures**: Verify your API key is correct and has proper permissions
 **Environment Variables Not Loading**: Ensure variables are prefixed with `VITE_CHAT_BUBBLE_`
 **CDN Version Delays**: Sometimes the `@latest` tag on jsDelivr CDN takes time to propagate to all edge servers and may not deliver the newest version immediately. If you need the latest features or fixes, specify the exact version number instead of using `@latest`:
 

package/README.md

@@ -3,7 +3,7 @@
 ## Features
 
 - 🚀 Easy integration
-- 💬 Connect to any LocalChat Model
+- 💬 Connect to any LocalChat Assistant
 - 📋 Review conversations in LocalChat
 - 📱 Responsive design
 - 🎨 Customizable UI components
@@ -23,8 +23,7 @@ Add the Headwai Chat Bubble to the respective .html file.
       // Runtime configuration override
       window.HEADWAI_CHAT_BUBBLE_CONFIG = {
         apiUrl: 'https://company.localchat.at', // required
-        apiKey: 'chat-bubble-proxy-api-key', // required
-        modelId: 'customer-support-model-id', // required
+        assistantId: 'customer-support-assistant-id', // required
         maxMessages: 0, // optional - 0 means unlimited
         placeholderText: 'Ask your question here!', // optional - default: 'Enter your questions here'
         faviconPath: 'https://cdn.company.at/icons/favicon.svg', // optional - default: '/icons/favicon.svg'
@@ -86,8 +85,7 @@ For multiple instances use data attributes of the `<div>` tag for configuration
 <div
   data-chat-bubble
   data-chat-bubble-api-url="https://company.localchat.at"
-  data-chat-bubble-api-key="chat-bubble-proxy-api-key"
-  data-chat-bubble-model-id="customer-support-model-id"
+  data-chat-bubble-assistant-id="customer-support-assistant-id"
   data-chat-bubble-max-messages="0"
   data-chat-bubble-placeholder-text="Ask your question here!"
   data-chat-bubble-favicon-path="https://cdn.company.at/icons/favicon.svg"
@@ -106,8 +104,7 @@ For multiple instances use data attributes of the `<div>` tag for configuration
 <div
   data-chat-bubble
   data-chat-bubble-api-url="https://company.localchat.at"
-  data-chat-bubble-api-key="chat-bubble-proxy-api-key"
-  data-chat-bubble-model-id="FAQ-model-id"
+  data-chat-bubble-assistant-id="faq-assistant-id"
   data-chat-bubble-max-messages="10"
   data-chat-bubble-placeholder-text="Ask about our FAQ..."
   data-chat-bubble-favicon-path="https://cdn.company.at/icons/faq-icon.svg"
@@ -144,45 +141,20 @@ The base URL of your LocalChat API endpoint where the chat bubble will send mess
 apiUrl: 'https://company.localchat.at';
 ```
 
-#### `apiKey`
+#### `assistantId`
 
 **Type:** `string` | **Required:** ✅  
-The API Key of the dedicated Headwai Chat Bubble Proxy for LocalChat.
+The identifier of the AI assistant to use for generating responses. This should match an assistant configured in your LocalChat instance.
 
 ```javascript
-apiKey: 'chat-bubble-proxy-api-key';
+assistantId: 'customer-support-assistant-id';
 ```
 
-**How to get your API Key:**
-
-1. **Access Settings**: Login to LocalChat with the dedicated Headwai Chat Bubble user (All conversations will be stored at this user's chats list) and click on the user menu, then select `Settings`.
-
-   <img src="docs/images/settings.png" alt="LocalChat User Menu" width="50%" />
-
-2. **Navigate to Account**: In the Settings sidebar, click on `Account` to access your account settings.
-
-   <img src="docs/images/api-keys.png" alt="LocalChat Settings Account" width="50%" />
-
-3. **Get your API credentials**: In the API keys section, you have two options:
-   - **JWT Token**: Copy the existing JWT Token (expires after 7 days)
-   - **API Key**: Generate an API Key via `Generate API Key` button. Click the copy button next to the API Key field, or click the refresh button to generate a new permanent API Key
-
-**⚠️ Security Note:** When using permanent API Keys, ensure they are stored securely (e.g., environment variables, secure configuration) and never expose them directly in client-side code. If using JWT Tokens, implement an automatic refresh mechanism since they expire after 7 days - consider using a server-side proxy to handle token renewal and keep tokens secure.
-
-#### `modelId`
-
-**Type:** `string` | **Required:** ✅  
-The identifier of the AI model to use for generating responses. This should match a model configured in your LocalChat instance.
-
-```javascript
-modelId: 'customer-support-model-id';
-```
-
-1. **Navigate to Model**: Login to LocalChat with the dedicated Headwai Chat Bubble user (Or any other user that is allowed to see the desired model) and click on the `Workspace` menu, then select `Models`. Search for the name of the desired model (Or create one). Click onto the edit-`Pen`.
+1. **Navigate to Assistant**: Login to LocalChat with the dedicated Headwai Chat Bubble user (Or any other user that is allowed to see the desired assistant) and click on the `Workspace` menu, then select `Assistants`. Search for the name of the desired assistant (Or create one). Click onto the edit-`Pen`.
 
   <img src="docs/images/model-edit.png" alt="LocalChat User Menu" width="50%" />
 
-1. **Copy Model Id**: Now the model is displayed with its `name` and right underneath the `model-id`. Copy the `model-id`.
+1. **Copy Assistant Id**: Now the assistant is displayed with its `name` and right underneath the `assistant-id`. Copy the `assistant-id`.
 
   <img src="docs/images/model-id.png" alt="LocalChat User Menu" width="50%" />
 
@@ -338,7 +310,6 @@ When using data attributes for multiple chat bubbles, convert camelCase property
 ### Common Issues
 
 **CORS Errors**: Ensure your API endpoint allows requests from your domain
-**Authentication Failures**: Verify your API key is correct and has proper permissions
 **CDN Version Delays**: Sometimes the `@latest` tag on jsDelivr CDN takes time to propagate to all edge servers and may not deliver the newest version immediately. If you need the latest features or fixes, specify the exact version number instead of using `@latest`:
 
 ```html