@aigentyc/chat-sdk 0.2.5 → 0.3.1

package/dist/{chunk-FOZXDUSZ.js → chunk-YG2COKFR.js}

@@ -1,13 +1,13 @@
 "use client";
 import { useIsMobile, useLiveChat, usePreviewEmbed } from './chunk-5F3O3ZJH.js';
 import { useTheme } from './chunk-IU7Q7O5G.js';
-import { Conversation, ConversationContent, Sources, SourcesTrigger, SourcesContent, Source, Loader } from './chunk-A7PCSWIK.js';
+import { Conversation, ConversationContent, ConversationEmptyState, Sources, SourcesTrigger, SourcesContent, Source, MessageFeedback, Loader } from './chunk-B27JIQ4Z.js';
 import { useI18n } from './chunk-QYCEHFAB.js';
-import { ToolRenderer } from './chunk-U3FXVLUK.js';
-import { useChatContext, useSlots, renderSlot } from './chunk-FYPJSHCL.js';
+import { ToolRenderer } from './chunk-AD6XWKWB.js';
+import { useChatContext, useSlots, renderSlot } from './chunk-FPQ3UCCJ.js';
 import { cn } from './chunk-3RW7O444.js';
-import { memo, useState, useRef, useEffect, useCallback, useMemo } from 'react';
-import { X, ArrowLeft, ShoppingCart, Plus, Ticket, FerrisWheel, Flag, Building, Heart, Star, Calendar, MapPin, Hotel, Coffee, Utensils, Settings, Users, FileText, HelpCircle, Search, Zap, MessageSquare, Shield, Minus, Trash2, SparklesIcon, Headset, Send, ThumbsUp, ThumbsDown, ExternalLink } from 'lucide-react';
+import { memo, useState, useRef, useEffect, useCallback, Component, useMemo } from 'react';
+import { X, ArrowLeft, ShoppingCart, Plus, Ticket, FerrisWheel, Flag, Building, Heart, Star, Calendar, MapPin, Hotel, Coffee, Utensils, Settings, Users, FileText, HelpCircle, Search, Zap, MessageSquare, Shield, Minus, Trash2, Headset, Send, ThumbsUp, ThumbsDown, ExternalLink, SparklesIcon } from 'lucide-react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
 function BotIcon({ className }) {
@@ -759,6 +759,78 @@ function CartDrawer({ storeOrigin, isOpen, onClose, onCartUpdate }) {
     ] })
   ] }) });
 }
+var TRANSLATIONS = {
+  operator_joined: "\u05D4\u05E0\u05E6\u05D9\u05D2 \u05D4\u05E6\u05D8\u05E8\u05E3 \u05DC\u05E9\u05D9\u05D7\u05D4",
+  chat_ended: "\u05D4\u05E9\u05D9\u05D7\u05D4 \u05D4\u05E1\u05EA\u05D9\u05D9\u05DE\u05D4",
+  handed_to_ai: "\u05D4\u05E9\u05D9\u05D7\u05D4 \u05D4\u05D5\u05E2\u05D1\u05E8\u05D4 \u05D7\u05D6\u05E8\u05D4 \u05DC\u05E2\u05D5\u05D6\u05E8 AI",
+  operator_disconnected: "\u05D4\u05E0\u05E6\u05D9\u05D2 \u05D4\u05EA\u05E0\u05EA\u05E7. \u05DE\u05DE\u05EA\u05D9\u05DF \u05DC\u05D7\u05D9\u05D1\u05D5\u05E8 \u05DE\u05D7\u05D3\u05E9...",
+  operator_offline: "\u05D4\u05E0\u05E6\u05D9\u05D2 \u05DC\u05D0 \u05D6\u05DE\u05D9\u05DF \u05DB\u05E8\u05D2\u05E2",
+  operator_online: "\u05D4\u05E0\u05E6\u05D9\u05D2 \u05D7\u05D6\u05E8 \u05DC\u05E9\u05D9\u05D7\u05D4",
+  reassigned: "\u05D4\u05E9\u05D9\u05D7\u05D4 \u05D4\u05D5\u05E2\u05D1\u05E8\u05D4 \u05DC\u05E0\u05E6\u05D9\u05D2 \u05D0\u05D7\u05E8",
+  idle_warning: "\u05D4\u05E0\u05E6\u05D9\u05D2 \u05DC\u05D0 \u05E4\u05E2\u05D9\u05DC \u05DB\u05E8\u05D2\u05E2"
+};
+function translateMessage(message, type) {
+  if (type && TRANSLATIONS[type]) {
+    const nameMatch = message.match(/^([A-Za-z\u0590-\u05FF\s]+?) (joined|left|ended|disconnected)/);
+    if (nameMatch && type === "operator_joined") {
+      return `${nameMatch[1]} \u05D4\u05E6\u05D8\u05E8\u05E3/\u05D4 \u05DC\u05E9\u05D9\u05D7\u05D4`;
+    }
+    return TRANSLATIONS[type];
+  }
+  return message;
+}
+function SystemMessage({ message, type }) {
+  const displayMessage = translateMessage(message, type);
+  return /* @__PURE__ */ jsx("div", { className: "flex justify-center my-3", children: /* @__PURE__ */ jsx("span", { className: "text-[11px] text-muted-foreground bg-muted px-4 py-1.5 rounded-full border border-border/50", children: displayMessage }) });
+}
+var ChatErrorBoundary = class extends Component {
+  state = { error: null };
+  static getDerivedStateFromError(error) {
+    return { error };
+  }
+  componentDidCatch(error, info) {
+    this.props.onError?.(error, info);
+    if (process.env.NODE_ENV !== "production") {
+      console.error(
+        `[aigentyc-chat-sdk] ${this.props.label || "component"} threw:`,
+        error,
+        info
+      );
+    }
+  }
+  reset = () => {
+    this.setState({ error: null });
+  };
+  render() {
+    if (this.state.error) {
+      if (this.props.fallback) {
+        return this.props.fallback(this.state.error, this.reset);
+      }
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          role: "alert",
+          className: "my-2 rounded-md border border-destructive/30 bg-destructive/10 p-3 text-xs",
+          style: { color: "var(--ac-destructive, #dc2626)" },
+          children: [
+            /* @__PURE__ */ jsx("div", { className: "font-medium", children: this.props.label ? `Failed to render ${this.props.label}` : "Something went wrong" }),
+            process.env.NODE_ENV !== "production" && /* @__PURE__ */ jsx("div", { className: "mt-1 opacity-80 font-mono truncate", children: this.state.error.message }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: this.reset,
+                className: "mt-1 underline text-xs opacity-80 hover:opacity-100",
+                children: "Retry"
+              }
+            )
+          ]
+        }
+      );
+    }
+    return this.props.children;
+  }
+};
 function extractKbSources(parts) {
   if (!Array.isArray(parts)) return [];
   const out = [];
@@ -789,6 +861,36 @@ function extractKbSources(parts) {
   }
   return deduped;
 }
+function DefaultAssistantMessage({ text }) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex gap-[10px] items-start rounded-2xl",
+      style: {
+        backgroundColor: "var(--ac-assistant-bubble-bg, transparent)",
+        padding: "var(--ac-assistant-bubble-padding, 0)",
+        color: "var(--ac-assistant-bubble-text, var(--ac-text))"
+      },
+      children: [
+        /* @__PURE__ */ jsx(SparklesIcon, { className: "mt-[2px] w-4 h-4 shrink-0", style: { color: "var(--ac-primary)" } }),
+        /* @__PURE__ */ jsx("div", { className: "flex-1 min-w-0 whitespace-pre-wrap", children: text })
+      ]
+    }
+  );
+}
+function DefaultUserMessage({ text }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "inline-block rounded-2xl px-3 py-2 max-w-[85%]",
+      style: {
+        backgroundColor: "var(--ac-user-bubble-bg, var(--ac-primary))",
+        color: "var(--ac-primary-foreground, #fff)"
+      },
+      children: text
+    }
+  );
+}
 function ChatInterface(props) {
   const { showSources = false } = props;
   const { messages, status, sendMessage, sessionId, config, clearMessages } = useChatContext();
@@ -810,6 +912,7 @@ function ChatInterface(props) {
   const isProcessing = status === "streaming";
   useEffect(() => {
     if (messages.length > 0 && showWelcome) setShowWelcome(false);
+    if (messages.length === 0 && !showWelcome) setShowWelcome(true);
   }, [messages.length, showWelcome]);
   const handleSubmit = useCallback(
     (text) => {
@@ -909,48 +1012,28 @@ function ChatInterface(props) {
       }
     ),
     /* @__PURE__ */ jsx(Conversation, { className: "flex-1", children: /* @__PURE__ */ jsxs(ConversationContent, { className: "px-[15px] md:px-[40px] py-6 sm:py-8 w-full space-y-6", children: [
+      messages.length === 0 && renderSlot("emptyState", {}, ConversationEmptyState, slots),
       messages.map((message, messageIndex) => {
         if (hideFirstUserMessage && messageIndex === 0 && message.role === "user") return null;
+        if (message.role === "system") {
+          return /* @__PURE__ */ jsx("div", { children: renderSlot("systemMessage", { message: message.content }, SystemMessage, slots) }, message.id);
+        }
         return /* @__PURE__ */ jsxs(
           "div",
           {
             className: `group ${message.role === "assistant" ? "is-assistant" : "is-user"}`,
             children: [
-              [...message.parts || []].sort((a, b) => {
-                if (a.type === "text" && b.type !== "text") return -1;
-                if (a.type !== "text" && b.type === "text") return 1;
+              (props.messagePartOrder === "stream-order" ? message.parts || [] : [...message.parts || []].sort((a, b) => {
+                const textFirst = props.messagePartOrder !== "tools-first";
+                if (a.type === "text" && b.type !== "text") return textFirst ? -1 : 1;
+                if (a.type !== "text" && b.type === "text") return textFirst ? 1 : -1;
                 return 0;
-              }).map((part, i) => {
+              })).map((part, i) => {
                 if (part.type === "text") {
                   if (message.role === "assistant") {
-                    return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(
-                      "div",
-                      {
-                        className: "flex gap-[10px] items-start rounded-2xl",
-                        style: {
-                          backgroundColor: "var(--ac-assistant-bubble-bg, transparent)",
-                          padding: "var(--ac-assistant-bubble-padding, 0)",
-                          color: "var(--ac-assistant-bubble-text, var(--ac-text))"
-                        },
-                        children: [
-                          /* @__PURE__ */ jsx(SparklesIcon, { className: "mt-[2px] w-4 h-4 shrink-0", style: { color: "var(--ac-primary)" } }),
-                          /* @__PURE__ */ jsx("div", { className: "flex-1 min-w-0 whitespace-pre-wrap", children: part.text })
-                        ]
-                      }
-                    ) }, `${message.id}-${i}`);
+                    return /* @__PURE__ */ jsx("div", { children: renderSlot("assistantMessage", { message, partIndex: i, text: part.text || "" }, DefaultAssistantMessage, slots) }, `${message.id}-${i}`);
                   }
-                  return /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      className: "inline-block rounded-2xl px-3 py-2 max-w-[85%]",
-                      style: {
-                        backgroundColor: "var(--ac-user-bubble-bg, var(--ac-primary))",
-                        color: "var(--ac-primary-foreground, #fff)"
-                      },
-                      children: part.text
-                    },
-                    `${message.id}-${i}`
-                  );
+                  return /* @__PURE__ */ jsx("div", { children: renderSlot("userMessage", { message, partIndex: i, text: part.text || "" }, DefaultUserMessage, slots) }, `${message.id}-${i}`);
                 }
                 if (part.type.startsWith("tool-")) {
                   const toolName = part.type.replace("tool-", "");
@@ -964,14 +1047,20 @@ function ChatInterface(props) {
                   }
                   const result = output && typeof output === "object" && !Array.isArray(output) && ("data" in output || "uiRenderMode" in output) ? output : { data: output };
                   return /* @__PURE__ */ jsx(
-                    ToolRenderer,
+                    ChatErrorBoundary,
                     {
-                      toolName,
-                      state: part.state ?? "output-available",
-                      args: part.input ?? {},
-                      result,
-                      onSendMessage: handleSubmit,
-                      isProcessing
+                      label: `tool "${toolName}"`,
+                      children: /* @__PURE__ */ jsx(
+                        ToolRenderer,
+                        {
+                          toolName,
+                          state: part.state ?? "output-available",
+                          args: part.input ?? {},
+                          result,
+                          onSendMessage: handleSubmit,
+                          isProcessing
+                        }
+                      )
                     },
                     `${message.id}-tool-${i}`
                   );
@@ -992,7 +1081,15 @@ function ChatInterface(props) {
                     `${message.id}-src-${idx}`
                   )) })
                 ] });
-              })()
+              })(),
+              message.role === "assistant" && renderSlot("feedback", {
+                messageId: message.id,
+                projectId: config.projectId,
+                sessionId,
+                apiKey: config.apiKey,
+                apiEndpoint: config.apiEndpoint,
+                textContent: (message.parts || []).filter((p) => p.type === "text").map((p) => p.text || "").join("\n") || (typeof message.content === "string" ? message.content : "")
+              }, MessageFeedback, slots)
             ]
           },
           message.id
@@ -1103,7 +1200,7 @@ function FloatingButton({
           "div",
           {
             dir: isRtl ? "rtl" : "ltr",
-            className: `relative bg-white rounded-sm animate-fadeIn ${isBottom ? "mb-1" : "mt-1"}`,
+            className: `relative bg-card rounded-sm animate-fadeIn ${isBottom ? "mb-1" : "mt-1"}`,
             style: {
               animation: "fadeIn 0.3s ease-out",
               boxShadow: "0 4px 16px rgba(0, 0, 0, 0.12)",
@@ -1126,7 +1223,7 @@ function FloatingButton({
                   style: {
                     width: "14px",
                     height: "14px",
-                    background: "white",
+                    background: "var(--ac-card)",
                     transform: "translateY(-50%) rotate(45deg)",
                     boxShadow: "2px -2px 4px rgba(0, 0, 0, 0.06)",
                     ...isRightSide ? { right: "-7px" } : { left: "-7px" }
@@ -1479,12 +1576,12 @@ function ChatView() {
                 /* @__PURE__ */ jsx(
                   "div",
                   {
-                    className: `rounded-2xl px-3.5 py-2.5 text-[14px] leading-relaxed ${isOperator ? "bg-white border border-gray-200 text-gray-900 rounded-bl-md" : "text-white rounded-br-md"}`,
+                    className: `rounded-2xl px-3.5 py-2.5 text-[14px] leading-relaxed ${isOperator ? "bg-card border border-border text-foreground rounded-bl-md" : "text-white rounded-br-md"}`,
                     style: !isOperator ? { backgroundColor: "var(--ac-primary, #2f80ed)" } : void 0,
                     children: msg.content
                   }
                 ),
-                /* @__PURE__ */ jsx("p", { className: `text-[10px] text-gray-400 mt-0.5 px-1 ${isOperator ? "" : "text-end"}`, children: timeStr })
+                /* @__PURE__ */ jsx("p", { className: `text-[10px] text-muted-foreground mt-0.5 px-1 ${isOperator ? "" : "text-end"}`, children: timeStr })
               ] })
             ]
           },
@@ -1493,7 +1590,7 @@ function ChatView() {
       }),
       /* @__PURE__ */ jsx("div", { ref: messagesEndRef })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "shrink-0 border-t bg-white p-3", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+    /* @__PURE__ */ jsx("div", { className: "shrink-0 border-t bg-background p-3", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ jsx(
         "input",
         {
@@ -1558,7 +1655,7 @@ function EndedView() {
         {
           type: "button",
           onClick: () => setSelected("positive"),
-          className: `p-3 rounded-full transition-colors ${selected === "positive" ? "bg-green-100 text-green-600" : "hover:bg-gray-100 text-gray-400"}`,
+          className: `p-3 rounded-full transition-colors ${selected === "positive" ? "bg-green-100 text-green-600" : "hover:bg-muted text-muted-foreground"}`,
           children: /* @__PURE__ */ jsx(ThumbsUp, { className: "h-6 w-6" })
         }
       ),
@@ -1567,7 +1664,7 @@ function EndedView() {
         {
           type: "button",
           onClick: () => setSelected("negative"),
-          className: `p-3 rounded-full transition-colors ${selected === "negative" ? "bg-red-100 text-red-600" : "hover:bg-gray-100 text-gray-400"}`,
+          className: `p-3 rounded-full transition-colors ${selected === "negative" ? "bg-red-100 text-red-600" : "hover:bg-muted text-muted-foreground"}`,
           children: /* @__PURE__ */ jsx(ThumbsDown, { className: "h-6 w-6" })
         }
       )
@@ -1674,6 +1771,6 @@ function PreviewEmbedPanel({ isOpen, isRightSide, zIndex }) {
   );
 }
 
-export { CartDrawer, ChatFooter, ChatHeader, ChatInput, ChatInterface, FloatingButton, LiveChatPanel, MobileLiveChatDrawer, PreviewEmbedPanel, QuickQuestions, WelcomePage };
-//# sourceMappingURL=chunk-FOZXDUSZ.js.map
-//# sourceMappingURL=chunk-FOZXDUSZ.js.map
+export { CartDrawer, ChatErrorBoundary, ChatFooter, ChatHeader, ChatInput, ChatInterface, FloatingButton, LiveChatPanel, MobileLiveChatDrawer, PreviewEmbedPanel, QuickQuestions, SystemMessage, WelcomePage };
+//# sourceMappingURL=chunk-YG2COKFR.js.map
+//# sourceMappingURL=chunk-YG2COKFR.js.map