@blumessage/react-chat 1.0.2 → 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -16,25 +16,21 @@ A React TypeScript chat widget component with floating button, theming, and Blum
16
16
  ## Installation
17
17
 
18
18
  ```bash
19
- npm install blumessage-react-chat-component
19
+ npm i @blumessage/react-chat
20
20
  ```
21
21
 
22
- **Requirements**: This component uses Tailwind CSS classes and Lucide React icons. Ensure Tailwind CSS is configured in your project.
23
-
24
22
  ## Quick Start
25
23
 
26
24
  ### Floating Chat Widget (Default)
27
25
 
28
26
  ```tsx
29
27
  import React from 'react';
30
- import { BlumessageChat } from 'blumessage-react-chat-component';
28
+ import { BlumessageChat } from '@blumessage/react-chat';
31
29
 
32
30
  function App() {
33
31
  return (
34
32
  <BlumessageChat
35
33
  apiKey="your-blumessage-api-key"
36
- buttonText="Chat with us"
37
- buttonPosition="bottom-right"
38
34
  />
39
35
  );
40
36
  }
@@ -44,7 +40,7 @@ function App() {
44
40
 
45
41
  ```tsx
46
42
  import React from 'react';
47
- import { BlumessageChat } from 'blumessage-react-chat-component';
43
+ import { BlumessageChat } from '@blumessage/react-chat';
48
44
 
49
45
  function App() {
50
46
  return (
@@ -161,28 +157,42 @@ const initialMessages = [
161
157
 
162
158
  ## Icon Options
163
159
 
164
- The `icon` prop accepts flexible naming patterns:
160
+ The `icon` prop accepts **any lucide-react icon name** with flexible naming patterns. The component intelligently matches your input to the appropriate lucide-react icon:
165
161
 
166
162
  ```tsx
167
- // All of these work for message icons:
168
- icon="message"
169
- icon="chat"
170
- icon="message-circle"
171
- icon="messaging"
172
-
173
- // Other supported patterns:
174
- icon="bot" // or "robot"
175
- icon="phone" // or "call"
176
- icon="mail" // or "email"
177
- icon="headphones" // or "support"
178
- icon="users" // or "user"
179
- icon="heart" // or "love"
180
- icon="star" // or "favorite"
181
- icon="zap" // or "lightning"
182
-
183
- // Default fallback: MessageCircle
163
+ // Any lucide-react icon works:
164
+ icon="message-circle" // MessageCircle
165
+ icon="phone" // Phone
166
+ icon="mail" // Mail
167
+ icon="headphones" // Headphones
168
+ icon="bot" // Bot
169
+ icon="users" // Users
170
+ icon="heart" // Heart
171
+ icon="star" // Star
172
+ icon="zap" // Zap
173
+ icon="settings" // Settings
174
+ icon="help-circle" // HelpCircle
175
+ icon="info" // Info
176
+ icon="alert-triangle" // AlertTriangle
177
+
178
+ // ✅ Flexible naming patterns (case-insensitive, ignores hyphens/underscores):
179
+ icon="MessageCircle" // MessageCircle
180
+ icon="message_circle" // → MessageCircle
181
+ icon="message circle" // → MessageCircle
182
+ icon="chat" // → MessageCircle (smart matching)
183
+ icon="messaging" // → MessageCircle (smart matching)
184
+ icon="support" // → Headphones (smart matching)
185
+ icon="email" // → Mail (smart matching)
186
+ icon="call" // → Phone (smart matching)
187
+
188
+ // ✅ Default fallback: MessageCircle (if no match found)
189
+ icon="unknown-icon" // → MessageCircle
184
190
  ```
185
191
 
192
+ **Browse all available icons at:** [lucide.dev/icons](https://lucide.dev/icons)
193
+
194
+ Simply use the icon name from lucide-react, and the component will handle the rest!
195
+
186
196
  ## Error Handling
187
197
 
188
198
  The `onError` callback provides detailed error context:
@@ -217,7 +227,7 @@ The `onError` callback provides detailed error context:
217
227
  Full TypeScript definitions included:
218
228
 
219
229
  ```typescript
220
- import { BlumessageChat, Message, BlumessageChatProps } from 'blumessage-react-chat-component';
230
+ import { BlumessageChat, Message, BlumessageChatProps } from '@blumessage/react-chat';
221
231
 
222
232
  interface Message {
223
233
  id: string;
@@ -276,4 +286,4 @@ ISC
276
286
 
277
287
  ## Support
278
288
 
279
- For issues and feature requests, please visit the [GitHub repository](https://github.com/yourusername/blumessage-react-chat-component).
289
+ For issues and feature requests, please visit the [GitHub repository](https://github.com/Blumessage/react-chat).
@@ -215,7 +215,7 @@ export var BlumessageChat = function (_a) {
215
215
  })];
216
216
  case 1:
217
217
  response = _a.sent();
218
- if (!(response.status === 201)) return [3 /*break*/, 7];
218
+ if (!response.ok) return [3 /*break*/, 7];
219
219
  console.log("Blumessage chat initialized successfully");
220
220
  setIsInitialized(true);
221
221
  setError(null);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blumessage/react-chat",
3
- "version": "1.0.2",
3
+ "version": "1.0.4",
4
4
  "description": "A React TypeScript chat widget component with floating button, theming, and Blumessage API integration",
5
5
  "license": "MIT",
6
6
  "author": "Blumessage <contact@blumessage.com>",