@kite-copilot/chat-panel 0.2.26 → 0.2.27

package/dist/auto.cjs

@@ -885,7 +885,6 @@ function DataRenderer({ type, data }) {
 }
 
 // src/ChatPanel.tsx
-var import_supabase_js = require("@supabase/supabase-js");
 var import_jsx_runtime9 = require("react/jsx-runtime");
 var DEFAULT_AGENT_URL = "http://localhost:5002";
 var PANEL_WIDTH = 340;
@@ -1314,16 +1313,13 @@ function ChatPanel({
   currentPage,
   agentUrl = DEFAULT_AGENT_URL,
   startingQuestions: startingQuestionsProp,
-  startingQuestionsEndpoint,
-  supabaseUrl,
-  supabaseAnonKey
+  startingQuestionsEndpoint
 } = {}) {
   const [messages, setMessages] = React4.useState(initialMessages);
   const [input, setInput] = React4.useState("");
   const [sessionId, setSessionId] = React4.useState(() => crypto.randomUUID());
   const [isEscalated, setIsEscalated] = React4.useState(false);
-  const [supabaseClient, setSupabaseClient] = React4.useState(null);
-  const realtimeChannelRef = React4.useRef(null);
+  const escalationWsRef = React4.useRef(null);
   const resetSession = React4.useCallback(() => {
     setSessionId(crypto.randomUUID());
   }, []);
@@ -1548,68 +1544,66 @@ function ChatPanel({
     guideComplete,
     onNavigate
   ]);
-  React4.useEffect(() => {
-    if (supabaseUrl && supabaseAnonKey && !supabaseClient) {
-      const client = (0, import_supabase_js.createClient)(supabaseUrl, supabaseAnonKey);
-      setSupabaseClient(client);
+  const connectToEscalationWs = React4.useCallback((currentSessionId) => {
+    if (!agentUrl) return;
+    if (escalationWsRef.current) {
+      escalationWsRef.current.close();
     }
-  }, [supabaseUrl, supabaseAnonKey, supabaseClient]);
-  const subscribeToAgentMessages = React4.useCallback((currentSessionId) => {
-    if (!supabaseClient) return;
-    if (realtimeChannelRef.current) {
-      supabaseClient.removeChannel(realtimeChannelRef.current);
-    }
-    const channel = supabaseClient.channel(`user-chat-${currentSessionId}`).on(
-      "postgres_changes",
-      {
-        event: "INSERT",
-        schema: "public",
-        table: "chat_history",
-        filter: `session_id=eq.${currentSessionId}`
-      },
-      (payload) => {
-        const newMsg = payload.new;
-        if (newMsg.role === "agent") {
-          setMessages((prev) => [
-            ...prev,
-            {
-              id: Date.now(),
-              role: "agent",
-              kind: "text",
-              content: newMsg.content
-            }
-          ]);
+    const wsUrl = agentUrl.replace(/^http/, "ws") + `/ws/escalation/${currentSessionId}`;
+    const ws = new WebSocket(wsUrl);
+    ws.onmessage = (event) => {
+      try {
+        const data = JSON.parse(event.data);
+        if (data.type === "agent_message") {
+          setMessages((prev) => [...prev, {
+            id: Date.now(),
+            role: "agent",
+            kind: "text",
+            content: data.content
+          }]);
+        } else if (data.type === "error") {
+          console.error("[KiteChat] Escalation error:", data.message);
         }
-      }
-    ).subscribe();
-    realtimeChannelRef.current = channel;
-  }, [supabaseClient]);
-  React4.useEffect(() => {
-    return () => {
-      if (realtimeChannelRef.current && supabaseClient) {
-        supabaseClient.removeChannel(realtimeChannelRef.current);
+      } catch (err) {
+        console.error("[KiteChat] Failed to parse escalation message:", err);
       }
     };
-  }, [supabaseClient]);
-  React4.useEffect(() => {
-    if (isEscalated && supabaseClient && sessionId) {
-      subscribeToAgentMessages(sessionId);
-    }
-  }, [isEscalated, supabaseClient, sessionId, subscribeToAgentMessages]);
+    ws.onerror = (err) => {
+      console.error("[KiteChat] Escalation WebSocket error:", err);
+    };
+    ws.onclose = () => {
+      console.log("[KiteChat] Escalation WebSocket closed");
+    };
+    escalationWsRef.current = ws;
+  }, [agentUrl]);
   const sendEscalatedMessage = React4.useCallback(async (content) => {
-    if (!supabaseClient || !isEscalated) return false;
+    if (!escalationWsRef.current || escalationWsRef.current.readyState !== WebSocket.OPEN) {
+      console.error("[KiteChat] Escalation WebSocket not connected");
+      return false;
+    }
     try {
-      await supabaseClient.from("chat_history").insert({
-        session_id: sessionId,
-        role: "user",
+      escalationWsRef.current.send(JSON.stringify({
+        type: "user_message",
         content
-      });
+      }));
       return true;
     } catch (err) {
       console.error("[KiteChat] Failed to send escalated message:", err);
       return false;
     }
-  }, [supabaseClient, isEscalated, sessionId]);
+  }, []);
+  React4.useEffect(() => {
+    return () => {
+      if (escalationWsRef.current) {
+        escalationWsRef.current.close();
+      }
+    };
+  }, []);
+  React4.useEffect(() => {
+    if (isEscalated && sessionId) {
+      connectToEscalationWs(sessionId);
+    }
+  }, [isEscalated, sessionId, connectToEscalationWs]);
   function streamAssistantMessage(messageId, fullText, followups) {
     let textToStream = fullText;
     let extractedFollowups = followups;
@@ -1720,7 +1714,7 @@ function ChatPanel({
       return;
     }
     if (!trimmed) return;
-    if (isEscalated && supabaseClient) {
+    if (isEscalated) {
       const userMessage = {
         id: Date.now(),
         role: "user",
@@ -2070,7 +2064,6 @@ function ChatPanel({
                 content: data.message || "You've been connected to our support queue. An agent will be with you shortly."
               };
               setMessages((prev) => [...prev, escalationMessage]);
-              subscribeToAgentMessages(sessionId);
             }
           } catch (parseError) {
             console.error("Failed to parse SSE event:", parseError);
@@ -4135,9 +4128,7 @@ function ChatPanelWithToggle({
   startingQuestionsEndpoint,
   defaultOpen = false,
   isOpen: controlledIsOpen,
-  onOpenChange,
-  supabaseUrl,
-  supabaseAnonKey
+  onOpenChange
 }) {
   const [internalIsOpen, setInternalIsOpen] = React4.useState(defaultOpen);
   const isOpen = controlledIsOpen !== void 0 ? controlledIsOpen : internalIsOpen;
@@ -4168,9 +4159,7 @@ function ChatPanelWithToggle({
       currentPage,
       agentUrl,
       startingQuestions,
-      startingQuestionsEndpoint,
-      supabaseUrl,
-      supabaseAnonKey
+      startingQuestionsEndpoint
     }
   );
 }

package/dist/auto.d.cts

@@ -1,4 +1,4 @@
-import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-CGiuk776.cjs';
+import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-CyoN-YV4.cjs';
 import 'react/jsx-runtime';
 
 /**

package/dist/auto.d.ts

@@ -1,4 +1,4 @@
-import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-CGiuk776.js';
+import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-CyoN-YV4.js';
 import 'react/jsx-runtime';
 
 /**

package/dist/auto.js

@@ -1,6 +1,6 @@
 import {
   createKiteChat
-} from "./chunk-KPTM44LS.js";
+} from "./chunk-4KYS4INW.js";
 
 // src/auto.ts
 function mountKiteChat(config) {

package/dist/{chunk-KPTM44LS.js → chunk-4KYS4INW.js}

@@ -884,7 +884,6 @@ function DataRenderer({ type, data }) {
 // src/ChatPanel.tsx
 import * as React4 from "react";
 import { ArrowLeft, ArrowUp, Command, CornerDownLeft, CheckCircle2 as CheckCircle23, SquarePen, Paperclip, X, FileSpreadsheet, Loader2 as Loader22, ChevronLeft, ChevronRight, Sparkles } from "lucide-react";
-import { createClient } from "@supabase/supabase-js";
 import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
 var DEFAULT_AGENT_URL = "http://localhost:5002";
 var PANEL_WIDTH = 340;
@@ -1313,16 +1312,13 @@ function ChatPanel({
   currentPage,
   agentUrl = DEFAULT_AGENT_URL,
   startingQuestions: startingQuestionsProp,
-  startingQuestionsEndpoint,
-  supabaseUrl,
-  supabaseAnonKey
+  startingQuestionsEndpoint
 } = {}) {
   const [messages, setMessages] = React4.useState(initialMessages);
   const [input, setInput] = React4.useState("");
   const [sessionId, setSessionId] = React4.useState(() => crypto.randomUUID());
   const [isEscalated, setIsEscalated] = React4.useState(false);
-  const [supabaseClient, setSupabaseClient] = React4.useState(null);
-  const realtimeChannelRef = React4.useRef(null);
+  const escalationWsRef = React4.useRef(null);
   const resetSession = React4.useCallback(() => {
     setSessionId(crypto.randomUUID());
   }, []);
@@ -1547,68 +1543,66 @@ function ChatPanel({
     guideComplete,
     onNavigate
   ]);
-  React4.useEffect(() => {
-    if (supabaseUrl && supabaseAnonKey && !supabaseClient) {
-      const client = createClient(supabaseUrl, supabaseAnonKey);
-      setSupabaseClient(client);
+  const connectToEscalationWs = React4.useCallback((currentSessionId) => {
+    if (!agentUrl) return;
+    if (escalationWsRef.current) {
+      escalationWsRef.current.close();
     }
-  }, [supabaseUrl, supabaseAnonKey, supabaseClient]);
-  const subscribeToAgentMessages = React4.useCallback((currentSessionId) => {
-    if (!supabaseClient) return;
-    if (realtimeChannelRef.current) {
-      supabaseClient.removeChannel(realtimeChannelRef.current);
-    }
-    const channel = supabaseClient.channel(`user-chat-${currentSessionId}`).on(
-      "postgres_changes",
-      {
-        event: "INSERT",
-        schema: "public",
-        table: "chat_history",
-        filter: `session_id=eq.${currentSessionId}`
-      },
-      (payload) => {
-        const newMsg = payload.new;
-        if (newMsg.role === "agent") {
-          setMessages((prev) => [
-            ...prev,
-            {
-              id: Date.now(),
-              role: "agent",
-              kind: "text",
-              content: newMsg.content
-            }
-          ]);
+    const wsUrl = agentUrl.replace(/^http/, "ws") + `/ws/escalation/${currentSessionId}`;
+    const ws = new WebSocket(wsUrl);
+    ws.onmessage = (event) => {
+      try {
+        const data = JSON.parse(event.data);
+        if (data.type === "agent_message") {
+          setMessages((prev) => [...prev, {
+            id: Date.now(),
+            role: "agent",
+            kind: "text",
+            content: data.content
+          }]);
+        } else if (data.type === "error") {
+          console.error("[KiteChat] Escalation error:", data.message);
         }
-      }
-    ).subscribe();
-    realtimeChannelRef.current = channel;
-  }, [supabaseClient]);
-  React4.useEffect(() => {
-    return () => {
-      if (realtimeChannelRef.current && supabaseClient) {
-        supabaseClient.removeChannel(realtimeChannelRef.current);
+      } catch (err) {
+        console.error("[KiteChat] Failed to parse escalation message:", err);
       }
     };
-  }, [supabaseClient]);
-  React4.useEffect(() => {
-    if (isEscalated && supabaseClient && sessionId) {
-      subscribeToAgentMessages(sessionId);
-    }
-  }, [isEscalated, supabaseClient, sessionId, subscribeToAgentMessages]);
+    ws.onerror = (err) => {
+      console.error("[KiteChat] Escalation WebSocket error:", err);
+    };
+    ws.onclose = () => {
+      console.log("[KiteChat] Escalation WebSocket closed");
+    };
+    escalationWsRef.current = ws;
+  }, [agentUrl]);
   const sendEscalatedMessage = React4.useCallback(async (content) => {
-    if (!supabaseClient || !isEscalated) return false;
+    if (!escalationWsRef.current || escalationWsRef.current.readyState !== WebSocket.OPEN) {
+      console.error("[KiteChat] Escalation WebSocket not connected");
+      return false;
+    }
     try {
-      await supabaseClient.from("chat_history").insert({
-        session_id: sessionId,
-        role: "user",
+      escalationWsRef.current.send(JSON.stringify({
+        type: "user_message",
         content
-      });
+      }));
       return true;
     } catch (err) {
       console.error("[KiteChat] Failed to send escalated message:", err);
       return false;
     }
-  }, [supabaseClient, isEscalated, sessionId]);
+  }, []);
+  React4.useEffect(() => {
+    return () => {
+      if (escalationWsRef.current) {
+        escalationWsRef.current.close();
+      }
+    };
+  }, []);
+  React4.useEffect(() => {
+    if (isEscalated && sessionId) {
+      connectToEscalationWs(sessionId);
+    }
+  }, [isEscalated, sessionId, connectToEscalationWs]);
   function streamAssistantMessage(messageId, fullText, followups) {
     let textToStream = fullText;
     let extractedFollowups = followups;
@@ -1719,7 +1713,7 @@ function ChatPanel({
       return;
     }
     if (!trimmed) return;
-    if (isEscalated && supabaseClient) {
+    if (isEscalated) {
       const userMessage = {
         id: Date.now(),
         role: "user",
@@ -2069,7 +2063,6 @@ function ChatPanel({
                 content: data.message || "You've been connected to our support queue. An agent will be with you shortly."
               };
               setMessages((prev) => [...prev, escalationMessage]);
-              subscribeToAgentMessages(sessionId);
             }
           } catch (parseError) {
             console.error("Failed to parse SSE event:", parseError);
@@ -4154,9 +4147,7 @@ function ChatPanelWithToggle({
   startingQuestionsEndpoint,
   defaultOpen = false,
   isOpen: controlledIsOpen,
-  onOpenChange,
-  supabaseUrl,
-  supabaseAnonKey
+  onOpenChange
 }) {
   const [internalIsOpen, setInternalIsOpen] = React4.useState(defaultOpen);
   const isOpen = controlledIsOpen !== void 0 ? controlledIsOpen : internalIsOpen;
@@ -4187,9 +4178,7 @@ function ChatPanelWithToggle({
       currentPage,
       agentUrl,
       startingQuestions,
-      startingQuestionsEndpoint,
-      supabaseUrl,
-      supabaseAnonKey
+      startingQuestionsEndpoint
     }
   );
 }

package/dist/{createKiteChat-CGiuk776.d.cts → createKiteChat-CyoN-YV4.d.cts}

@@ -98,12 +98,8 @@ interface ChatPanelProps {
     startingQuestions?: StartingQuestion[];
     /** API endpoint to fetch starting questions */
     startingQuestionsEndpoint?: string;
-    /** Supabase URL for Realtime escalation support */
-    supabaseUrl?: string;
-    /** Supabase anon key for Realtime escalation support */
-    supabaseAnonKey?: string;
 }
-declare function ChatPanel({ isOpen, onClose, onOpen, onBack, onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions: startingQuestionsProp, startingQuestionsEndpoint, supabaseUrl, supabaseAnonKey, }?: ChatPanelProps): react_jsx_runtime.JSX.Element;
+declare function ChatPanel({ isOpen, onClose, onOpen, onBack, onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions: startingQuestionsProp, startingQuestionsEndpoint, }?: ChatPanelProps): react_jsx_runtime.JSX.Element;
 /**
  * PanelToggle - An arrow button on the right edge that toggles the side panel
  * Shows left arrow when closed (click to open), right arrow when open (click to close)
@@ -148,12 +144,8 @@ interface ChatPanelWithToggleProps {
     isOpen?: boolean;
     /** Callback when panel open state changes */
     onOpenChange?: (isOpen: boolean) => void;
-    /** Supabase URL for Realtime escalation support */
-    supabaseUrl?: string;
-    /** Supabase anon key for Realtime escalation support */
-    supabaseAnonKey?: string;
 }
-declare function ChatPanelWithToggle({ onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions, startingQuestionsEndpoint, defaultOpen, isOpen: controlledIsOpen, onOpenChange, supabaseUrl, supabaseAnonKey, }: ChatPanelWithToggleProps): react_jsx_runtime.JSX.Element;
+declare function ChatPanelWithToggle({ onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions, startingQuestionsEndpoint, defaultOpen, isOpen: controlledIsOpen, onOpenChange, }: ChatPanelWithToggleProps): react_jsx_runtime.JSX.Element;
 /**
  * @deprecated Use ChatPanelWithToggle instead for the new side panel UX
  */

package/dist/{createKiteChat-CGiuk776.d.ts → createKiteChat-CyoN-YV4.d.ts}

@@ -98,12 +98,8 @@ interface ChatPanelProps {
     startingQuestions?: StartingQuestion[];
     /** API endpoint to fetch starting questions */
     startingQuestionsEndpoint?: string;
-    /** Supabase URL for Realtime escalation support */
-    supabaseUrl?: string;
-    /** Supabase anon key for Realtime escalation support */
-    supabaseAnonKey?: string;
 }
-declare function ChatPanel({ isOpen, onClose, onOpen, onBack, onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions: startingQuestionsProp, startingQuestionsEndpoint, supabaseUrl, supabaseAnonKey, }?: ChatPanelProps): react_jsx_runtime.JSX.Element;
+declare function ChatPanel({ isOpen, onClose, onOpen, onBack, onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions: startingQuestionsProp, startingQuestionsEndpoint, }?: ChatPanelProps): react_jsx_runtime.JSX.Element;
 /**
  * PanelToggle - An arrow button on the right edge that toggles the side panel
  * Shows left arrow when closed (click to open), right arrow when open (click to close)
@@ -148,12 +144,8 @@ interface ChatPanelWithToggleProps {
     isOpen?: boolean;
     /** Callback when panel open state changes */
     onOpenChange?: (isOpen: boolean) => void;
-    /** Supabase URL for Realtime escalation support */
-    supabaseUrl?: string;
-    /** Supabase anon key for Realtime escalation support */
-    supabaseAnonKey?: string;
 }
-declare function ChatPanelWithToggle({ onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions, startingQuestionsEndpoint, defaultOpen, isOpen: controlledIsOpen, onOpenChange, supabaseUrl, supabaseAnonKey, }: ChatPanelWithToggleProps): react_jsx_runtime.JSX.Element;
+declare function ChatPanelWithToggle({ onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions, startingQuestionsEndpoint, defaultOpen, isOpen: controlledIsOpen, onOpenChange, }: ChatPanelWithToggleProps): react_jsx_runtime.JSX.Element;
 /**
  * @deprecated Use ChatPanelWithToggle instead for the new side panel UX
  */