@diffsome/react 1.2.16 → 1.2.18

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/dist/chat.css CHANGED
@@ -230,6 +230,22 @@
230
230
  border-bottom-left-radius: 4px;
231
231
  }
232
232
 
233
+ /* Bot Message */
234
+ .diffsome-chat-message-bot {
235
+ align-self: flex-start;
236
+ align-items: flex-start;
237
+ }
238
+
239
+ .diffsome-chat-message-bot .diffsome-chat-message-bubble {
240
+ background: linear-gradient(135deg, #dbeafe 0%, #e0e7ff 100%);
241
+ color: #1e40af;
242
+ border-bottom-left-radius: 4px;
243
+ }
244
+
245
+ .diffsome-chat-bot-icon {
246
+ font-size: 11px;
247
+ }
248
+
233
249
  .diffsome-chat-message-content {
234
250
  font-size: 14px;
235
251
  line-height: 1.4;
package/dist/index.d.mts CHANGED
@@ -884,7 +884,7 @@ declare const ChatBubble: React__default.FC<ChatBubbleProps>;
884
884
  interface Message {
885
885
  id: number;
886
886
  content: string;
887
- sender_type: 'visitor' | 'agent' | 'system';
887
+ sender_type: 'visitor' | 'agent' | 'bot' | 'system';
888
888
  sender_name?: string;
889
889
  created_at?: string;
890
890
  is_read?: boolean;
@@ -918,7 +918,7 @@ declare const ChatWidget: React__default.FC<ChatWidgetProps>;
918
918
 
919
919
  interface ChatMessageProps {
920
920
  content: string;
921
- senderType: 'visitor' | 'agent' | 'system';
921
+ senderType: 'visitor' | 'agent' | 'bot' | 'system';
922
922
  senderName?: string;
923
923
  timestamp?: string;
924
924
  isRead?: boolean;
package/dist/index.d.ts CHANGED
@@ -884,7 +884,7 @@ declare const ChatBubble: React__default.FC<ChatBubbleProps>;
884
884
  interface Message {
885
885
  id: number;
886
886
  content: string;
887
- sender_type: 'visitor' | 'agent' | 'system';
887
+ sender_type: 'visitor' | 'agent' | 'bot' | 'system';
888
888
  sender_name?: string;
889
889
  created_at?: string;
890
890
  is_read?: boolean;
@@ -918,7 +918,7 @@ declare const ChatWidget: React__default.FC<ChatWidgetProps>;
918
918
 
919
919
  interface ChatMessageProps {
920
920
  content: string;
921
- senderType: 'visitor' | 'agent' | 'system';
921
+ senderType: 'visitor' | 'agent' | 'bot' | 'system';
922
922
  senderName?: string;
923
923
  timestamp?: string;
924
924
  isRead?: boolean;
package/dist/index.js CHANGED
@@ -2612,25 +2612,24 @@ var ChatMessage = ({
2612
2612
  }) => {
2613
2613
  const isVisitor = senderType === "visitor";
2614
2614
  const isSystem = senderType === "system";
2615
+ const isBot = senderType === "bot";
2615
2616
  if (isSystem) {
2616
2617
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: `diffsome-chat-message-system ${className}`, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: content }) });
2617
2618
  }
2618
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
2619
- "div",
2620
- {
2621
- className: `diffsome-chat-message ${isVisitor ? "diffsome-chat-message-visitor" : "diffsome-chat-message-agent"} ${className}`,
2622
- children: [
2623
- !isVisitor && senderName && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "diffsome-chat-message-sender", children: senderName }),
2624
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: `diffsome-chat-message-bubble ${isPending ? "diffsome-chat-message-pending" : ""} ${isFailed ? "diffsome-chat-message-failed" : ""}`, children: [
2625
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "diffsome-chat-message-content", children: content }),
2626
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "diffsome-chat-message-time", children: isPending ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "diffsome-chat-message-status", children: "Sending..." }) : isFailed ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "diffsome-chat-message-status diffsome-chat-message-error", children: "Failed" }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
2627
- timestamp,
2628
- isVisitor && isRead && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "diffsome-chat-message-read", children: " \u2713" })
2629
- ] }) })
2630
- ] })
2631
- ]
2632
- }
2633
- );
2619
+ const messageClass = isVisitor ? "diffsome-chat-message-visitor" : isBot ? "diffsome-chat-message-bot" : "diffsome-chat-message-agent";
2620
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: `diffsome-chat-message ${messageClass} ${className}`, children: [
2621
+ !isVisitor && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "diffsome-chat-message-sender", children: [
2622
+ isBot && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "diffsome-chat-bot-icon", children: "\u{1F916} " }),
2623
+ senderName || (isBot ? "AI Assistant" : "Agent")
2624
+ ] }),
2625
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: `diffsome-chat-message-bubble ${isPending ? "diffsome-chat-message-pending" : ""} ${isFailed ? "diffsome-chat-message-failed" : ""}`, children: [
2626
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "diffsome-chat-message-content", children: content }),
2627
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "diffsome-chat-message-time", children: isPending ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "diffsome-chat-message-status", children: "Sending..." }) : isFailed ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "diffsome-chat-message-status diffsome-chat-message-error", children: "Failed" }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
2628
+ timestamp,
2629
+ isVisitor && isRead && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "diffsome-chat-message-read", children: " \u2713" })
2630
+ ] }) })
2631
+ ] })
2632
+ ] });
2634
2633
  };
2635
2634
 
2636
2635
  // src/components/chat/ChatInput.tsx
@@ -2998,12 +2997,16 @@ var ChatBubble = ({
2998
2997
  };
2999
2998
  setMessages((prev) => [...prev, pendingMessage]);
3000
2999
  try {
3001
- const sentMessage = await conn.send(content);
3002
- if (sentMessage) {
3003
- seenMessageIds.current.add(sentMessage.id);
3000
+ const response = await conn.send(content);
3001
+ if (response) {
3002
+ seenMessageIds.current.add(response.id);
3004
3003
  setMessages(
3005
- (prev) => prev.map((m) => m.id === tempId ? { ...sentMessage, is_pending: false } : m)
3004
+ (prev) => prev.map((m) => m.id === tempId ? { ...response, is_pending: false } : m)
3006
3005
  );
3006
+ if (response.bot_response) {
3007
+ seenMessageIds.current.add(response.bot_response.id);
3008
+ setMessages((prev) => [...prev, response.bot_response]);
3009
+ }
3007
3010
  }
3008
3011
  } catch (error) {
3009
3012
  console.error("Failed to send message:", error);
package/dist/index.mjs CHANGED
@@ -2520,25 +2520,24 @@ var ChatMessage = ({
2520
2520
  }) => {
2521
2521
  const isVisitor = senderType === "visitor";
2522
2522
  const isSystem = senderType === "system";
2523
+ const isBot = senderType === "bot";
2523
2524
  if (isSystem) {
2524
2525
  return /* @__PURE__ */ jsx3("div", { className: `diffsome-chat-message-system ${className}`, children: /* @__PURE__ */ jsx3("span", { children: content }) });
2525
2526
  }
2526
- return /* @__PURE__ */ jsxs2(
2527
- "div",
2528
- {
2529
- className: `diffsome-chat-message ${isVisitor ? "diffsome-chat-message-visitor" : "diffsome-chat-message-agent"} ${className}`,
2530
- children: [
2531
- !isVisitor && senderName && /* @__PURE__ */ jsx3("div", { className: "diffsome-chat-message-sender", children: senderName }),
2532
- /* @__PURE__ */ jsxs2("div", { className: `diffsome-chat-message-bubble ${isPending ? "diffsome-chat-message-pending" : ""} ${isFailed ? "diffsome-chat-message-failed" : ""}`, children: [
2533
- /* @__PURE__ */ jsx3("div", { className: "diffsome-chat-message-content", children: content }),
2534
- /* @__PURE__ */ jsx3("div", { className: "diffsome-chat-message-time", children: isPending ? /* @__PURE__ */ jsx3("span", { className: "diffsome-chat-message-status", children: "Sending..." }) : isFailed ? /* @__PURE__ */ jsx3("span", { className: "diffsome-chat-message-status diffsome-chat-message-error", children: "Failed" }) : /* @__PURE__ */ jsxs2(Fragment2, { children: [
2535
- timestamp,
2536
- isVisitor && isRead && /* @__PURE__ */ jsx3("span", { className: "diffsome-chat-message-read", children: " \u2713" })
2537
- ] }) })
2538
- ] })
2539
- ]
2540
- }
2541
- );
2527
+ const messageClass = isVisitor ? "diffsome-chat-message-visitor" : isBot ? "diffsome-chat-message-bot" : "diffsome-chat-message-agent";
2528
+ return /* @__PURE__ */ jsxs2("div", { className: `diffsome-chat-message ${messageClass} ${className}`, children: [
2529
+ !isVisitor && /* @__PURE__ */ jsxs2("div", { className: "diffsome-chat-message-sender", children: [
2530
+ isBot && /* @__PURE__ */ jsx3("span", { className: "diffsome-chat-bot-icon", children: "\u{1F916} " }),
2531
+ senderName || (isBot ? "AI Assistant" : "Agent")
2532
+ ] }),
2533
+ /* @__PURE__ */ jsxs2("div", { className: `diffsome-chat-message-bubble ${isPending ? "diffsome-chat-message-pending" : ""} ${isFailed ? "diffsome-chat-message-failed" : ""}`, children: [
2534
+ /* @__PURE__ */ jsx3("div", { className: "diffsome-chat-message-content", children: content }),
2535
+ /* @__PURE__ */ jsx3("div", { className: "diffsome-chat-message-time", children: isPending ? /* @__PURE__ */ jsx3("span", { className: "diffsome-chat-message-status", children: "Sending..." }) : isFailed ? /* @__PURE__ */ jsx3("span", { className: "diffsome-chat-message-status diffsome-chat-message-error", children: "Failed" }) : /* @__PURE__ */ jsxs2(Fragment2, { children: [
2536
+ timestamp,
2537
+ isVisitor && isRead && /* @__PURE__ */ jsx3("span", { className: "diffsome-chat-message-read", children: " \u2713" })
2538
+ ] }) })
2539
+ ] })
2540
+ ] });
2542
2541
  };
2543
2542
 
2544
2543
  // src/components/chat/ChatInput.tsx
@@ -2906,12 +2905,16 @@ var ChatBubble = ({
2906
2905
  };
2907
2906
  setMessages((prev) => [...prev, pendingMessage]);
2908
2907
  try {
2909
- const sentMessage = await conn.send(content);
2910
- if (sentMessage) {
2911
- seenMessageIds.current.add(sentMessage.id);
2908
+ const response = await conn.send(content);
2909
+ if (response) {
2910
+ seenMessageIds.current.add(response.id);
2912
2911
  setMessages(
2913
- (prev) => prev.map((m) => m.id === tempId ? { ...sentMessage, is_pending: false } : m)
2912
+ (prev) => prev.map((m) => m.id === tempId ? { ...response, is_pending: false } : m)
2914
2913
  );
2914
+ if (response.bot_response) {
2915
+ seenMessageIds.current.add(response.bot_response.id);
2916
+ setMessages((prev) => [...prev, response.bot_response]);
2917
+ }
2915
2918
  }
2916
2919
  } catch (error) {
2917
2920
  console.error("Failed to send message:", error);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@diffsome/react",
3
- "version": "1.2.16",
3
+ "version": "1.2.18",
4
4
  "description": "React hooks and providers for Diffsome SDK - Headless e-commerce & CMS",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",