@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 +16 -0
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +23 -20
- package/dist/index.mjs +23 -20
- package/package.json +1 -1
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
|
-
|
|
2619
|
-
|
|
2620
|
-
{
|
|
2621
|
-
|
|
2622
|
-
|
|
2623
|
-
|
|
2624
|
-
|
|
2625
|
-
|
|
2626
|
-
|
|
2627
|
-
|
|
2628
|
-
|
|
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
|
|
3002
|
-
if (
|
|
3003
|
-
seenMessageIds.current.add(
|
|
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 ? { ...
|
|
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
|
-
|
|
2527
|
-
|
|
2528
|
-
{
|
|
2529
|
-
|
|
2530
|
-
|
|
2531
|
-
|
|
2532
|
-
|
|
2533
|
-
|
|
2534
|
-
|
|
2535
|
-
|
|
2536
|
-
|
|
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
|
|
2910
|
-
if (
|
|
2911
|
-
seenMessageIds.current.add(
|
|
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 ? { ...
|
|
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);
|