@kite-copilot/chat-panel 0.2.38 → 0.2.40

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/auto.cjs CHANGED
@@ -39,7 +39,7 @@ var import_react = __toESM(require("react"), 1);
39
39
  var import_client = require("react-dom/client");
40
40
 
41
41
  // src/ChatPanel.tsx
42
- var React4 = __toESM(require("react"), 1);
42
+ var React5 = __toESM(require("react"), 1);
43
43
  var import_supabase_js = require("@supabase/supabase-js");
44
44
 
45
45
  // src/lib/utils.ts
@@ -338,6 +338,58 @@ function useGuideCursor() {
338
338
  };
339
339
  }
340
340
 
341
+ // src/hooks/useUserAuth.ts
342
+ var React4 = __toESM(require("react"), 1);
343
+ function useUserAuth({
344
+ productBackendUrl,
345
+ sessionId,
346
+ enabled = true
347
+ }) {
348
+ const [authState, setAuthState] = React4.useState({ status: "idle" });
349
+ const lastSessionIdRef = React4.useRef(null);
350
+ const fetchUser = React4.useCallback(async () => {
351
+ if (!productBackendUrl || !enabled) {
352
+ setAuthState({ status: "idle" });
353
+ return;
354
+ }
355
+ setAuthState({ status: "loading" });
356
+ try {
357
+ const response = await fetch(`${productBackendUrl}/users/me`, {
358
+ method: "GET",
359
+ credentials: "include",
360
+ // Include cookies for authentication
361
+ headers: {
362
+ "Accept": "application/json"
363
+ }
364
+ });
365
+ if (!response.ok) {
366
+ if (response.status === 401) {
367
+ throw new Error("Please log in to use the chat assistant.");
368
+ }
369
+ if (response.status === 403) {
370
+ throw new Error("You do not have permission to access this feature.");
371
+ }
372
+ throw new Error(`Authentication failed (${response.status})`);
373
+ }
374
+ const user = await response.json();
375
+ setAuthState({ status: "authenticated", user });
376
+ } catch (error) {
377
+ const message = error instanceof Error ? error.message : "Unable to verify your identity. Please try again.";
378
+ setAuthState({ status: "error", error: message });
379
+ }
380
+ }, [productBackendUrl, enabled]);
381
+ React4.useEffect(() => {
382
+ if (sessionId !== lastSessionIdRef.current) {
383
+ lastSessionIdRef.current = sessionId;
384
+ fetchUser();
385
+ }
386
+ }, [sessionId, fetchUser]);
387
+ const retry = React4.useCallback(() => {
388
+ fetchUser();
389
+ }, [fetchUser]);
390
+ return { authState, retry };
391
+ }
392
+
341
393
  // src/components/ui/card.tsx
342
394
  var import_jsx_runtime7 = require("react/jsx-runtime");
343
395
  function Card({ className, ...props }) {
@@ -915,7 +967,7 @@ function TypingIndicator({ className = "" }) {
915
967
 
916
968
  // src/ChatPanel.tsx
917
969
  var import_jsx_runtime10 = require("react/jsx-runtime");
918
- var CHAT_PANEL_VERSION = true ? "0.2.38" : "dev";
970
+ var CHAT_PANEL_VERSION = true ? "0.2.40" : "dev";
919
971
  var DEFAULT_AGENT_URL = "http://localhost:5002";
920
972
  var PANEL_WIDTH = 340;
921
973
  function unescapeJsonString(str) {
@@ -1333,6 +1385,32 @@ var guides = {
1333
1385
  }
1334
1386
  };
1335
1387
  var initialMessages = [];
1388
+ function AuthLoadingState() {
1389
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col items-center justify-center h-full p-6", children: [
1390
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react4.Loader2, { className: "h-8 w-8 animate-spin text-gray-400 mb-3" }),
1391
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "text-xs text-gray-500", children: "Verifying your identity..." })
1392
+ ] });
1393
+ }
1394
+ function AuthErrorState({
1395
+ error,
1396
+ onRetry
1397
+ }) {
1398
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col items-center justify-center h-full p-6 text-center", children: [
1399
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "w-12 h-12 rounded-full bg-red-100 flex items-center justify-center mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react4.X, { className: "h-6 w-6 text-red-600" }) }),
1400
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h3", { className: "text-sm font-semibold text-gray-900 mb-2", children: "Unable to Start Chat" }),
1401
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { className: "text-xs text-gray-500 mb-4 max-w-[240px]", children: error }),
1402
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
1403
+ Button,
1404
+ {
1405
+ variant: "secondary",
1406
+ size: "sm",
1407
+ onClick: onRetry,
1408
+ className: "h-8 px-4 text-xs",
1409
+ children: "Try Again"
1410
+ }
1411
+ )
1412
+ ] });
1413
+ }
1336
1414
  function ChatPanel({
1337
1415
  isOpen = true,
1338
1416
  onClose,
@@ -1350,26 +1428,62 @@ function ChatPanel({
1350
1428
  userEmail,
1351
1429
  userOrganization,
1352
1430
  supabaseUrl,
1353
- supabaseAnonKey
1431
+ supabaseAnonKey,
1432
+ productBackendUrl
1354
1433
  } = {}) {
1355
- const [messages, setMessages] = React4.useState(initialMessages);
1356
- const [input, setInput] = React4.useState("");
1357
- const [sessionId, setSessionId] = React4.useState(() => crypto.randomUUID());
1358
- const [isEscalated, setIsEscalated] = React4.useState(false);
1359
- const escalationWsRef = React4.useRef(null);
1360
- const [agentIsTyping, setAgentIsTyping] = React4.useState(false);
1361
- const supabaseRef = React4.useRef(null);
1362
- const typingChannelRef = React4.useRef(null);
1363
- const typingTimeoutRef = React4.useRef(null);
1364
- React4.useEffect(() => {
1434
+ const [messages, setMessages] = React5.useState(initialMessages);
1435
+ const [input, setInput] = React5.useState("");
1436
+ const [sessionId, setSessionId] = React5.useState(() => crypto.randomUUID());
1437
+ const { authState, retry: retryAuth } = useUserAuth({
1438
+ productBackendUrl,
1439
+ sessionId,
1440
+ enabled: !!productBackendUrl
1441
+ // Only enable if URL is provided
1442
+ });
1443
+ const effectiveUser = React5.useMemo(() => {
1444
+ if (authState.status === "authenticated") {
1445
+ return {
1446
+ userId: authState.user.id,
1447
+ userName: authState.user.name,
1448
+ userEmail: authState.user.email,
1449
+ userRole: authState.user.role,
1450
+ isInternal: authState.user.isInternal
1451
+ };
1452
+ }
1453
+ return {
1454
+ userId: userId || "anonymous",
1455
+ userName: userName || "Anonymous User",
1456
+ userEmail: userEmail || "Not provided",
1457
+ userRole: void 0,
1458
+ isInternal: false
1459
+ };
1460
+ }, [authState, userId, userName, userEmail]);
1461
+ const [isEscalated, setIsEscalated] = React5.useState(false);
1462
+ const escalationWsRef = React5.useRef(null);
1463
+ const [agentIsTyping, setAgentIsTyping] = React5.useState(false);
1464
+ const supabaseRef = React5.useRef(null);
1465
+ const typingChannelRef = React5.useRef(null);
1466
+ const typingTimeoutRef = React5.useRef(null);
1467
+ React5.useEffect(() => {
1365
1468
  console.log(`[KiteChat] Chat Panel v${CHAT_PANEL_VERSION} loaded`);
1366
1469
  }, []);
1367
- const resetSession = React4.useCallback(() => {
1470
+ const resetSession = React5.useCallback(() => {
1471
+ console.log("[KiteChat] resetSession called", { isEscalated, hasSupabase: !!supabaseRef.current, sessionId });
1368
1472
  if (isEscalated && supabaseRef.current && sessionId) {
1473
+ console.log("[KiteChat] Updating customer_status to disconnected for session:", sessionId);
1369
1474
  supabaseRef.current.from("escalations").update({
1370
1475
  customer_status: "disconnected",
1371
1476
  customer_last_seen: (/* @__PURE__ */ new Date()).toISOString()
1372
- }).eq("session_id", sessionId);
1477
+ }).eq("session_id", sessionId).then(
1478
+ (result) => {
1479
+ console.log("[KiteChat] Disconnect update result:", result);
1480
+ },
1481
+ (err) => {
1482
+ console.error("[KiteChat] Disconnect update failed:", err);
1483
+ }
1484
+ );
1485
+ } else {
1486
+ console.log("[KiteChat] Skipping disconnect update - conditions not met");
1373
1487
  }
1374
1488
  setSessionId(crypto.randomUUID());
1375
1489
  setIsEscalated(false);
@@ -1383,12 +1497,12 @@ function ChatPanel({
1383
1497
  typingChannelRef.current = null;
1384
1498
  }
1385
1499
  }, [isEscalated, sessionId]);
1386
- React4.useEffect(() => {
1500
+ React5.useEffect(() => {
1387
1501
  if (supabaseUrl && supabaseAnonKey && !supabaseRef.current) {
1388
1502
  supabaseRef.current = (0, import_supabase_js.createClient)(supabaseUrl, supabaseAnonKey);
1389
1503
  }
1390
1504
  }, [supabaseUrl, supabaseAnonKey]);
1391
- React4.useEffect(() => {
1505
+ React5.useEffect(() => {
1392
1506
  if (!isEscalated || !sessionId || !supabaseRef.current) {
1393
1507
  return;
1394
1508
  }
@@ -1425,8 +1539,8 @@ function ChatPanel({
1425
1539
  }
1426
1540
  };
1427
1541
  }, [isEscalated, sessionId]);
1428
- const heartbeatIntervalRef = React4.useRef(null);
1429
- const updateCustomerStatus = React4.useCallback(async (status) => {
1542
+ const heartbeatIntervalRef = React5.useRef(null);
1543
+ const updateCustomerStatus = React5.useCallback(async (status) => {
1430
1544
  if (!supabaseRef.current || !sessionId) return;
1431
1545
  try {
1432
1546
  await supabaseRef.current.from("escalations").update({
@@ -1437,7 +1551,7 @@ function ChatPanel({
1437
1551
  console.error("[KiteChat] Failed to update customer status:", err);
1438
1552
  }
1439
1553
  }, [sessionId]);
1440
- React4.useEffect(() => {
1554
+ React5.useEffect(() => {
1441
1555
  if (!isEscalated || !sessionId || !supabaseRef.current) {
1442
1556
  return;
1443
1557
  }
@@ -1485,7 +1599,7 @@ function ChatPanel({
1485
1599
  }
1486
1600
  };
1487
1601
  }, [isEscalated, sessionId, updateCustomerStatus]);
1488
- const sendTypingIndicator = React4.useCallback((isTyping) => {
1602
+ const sendTypingIndicator = React5.useCallback((isTyping) => {
1489
1603
  if (!typingChannelRef.current) {
1490
1604
  console.log("[KiteChat] Cannot send typing - channel not ready");
1491
1605
  return;
@@ -1501,8 +1615,8 @@ function ChatPanel({
1501
1615
  payload: { sender: "user", isTyping }
1502
1616
  });
1503
1617
  }, [isEscalated]);
1504
- const userTypingTimeoutRef = React4.useRef(null);
1505
- const handleTypingStart = React4.useCallback(() => {
1618
+ const userTypingTimeoutRef = React5.useRef(null);
1619
+ const handleTypingStart = React5.useCallback(() => {
1506
1620
  if (!isEscalated || !supabaseRef.current) return;
1507
1621
  sendTypingIndicator(true);
1508
1622
  updateCustomerStatus("active");
@@ -1513,19 +1627,19 @@ function ChatPanel({
1513
1627
  sendTypingIndicator(false);
1514
1628
  }, 1500);
1515
1629
  }, [isEscalated, sendTypingIndicator, updateCustomerStatus]);
1516
- const streamIntervals = React4.useRef({});
1630
+ const streamIntervals = React5.useRef({});
1517
1631
  const isEmpty = messages.length === 0;
1518
- const [phase, setPhase] = React4.useState("idle");
1519
- const [progressSteps, setProgressSteps] = React4.useState([]);
1520
- const phaseTimers = React4.useRef([]);
1632
+ const [phase, setPhase] = React5.useState("idle");
1633
+ const [progressSteps, setProgressSteps] = React5.useState([]);
1634
+ const phaseTimers = React5.useRef([]);
1521
1635
  const lastRole = messages.length ? messages[messages.length - 1].role : void 0;
1522
- const [panelView, setPanelView] = React4.useState(
1636
+ const [panelView, setPanelView] = React5.useState(
1523
1637
  "landing"
1524
1638
  );
1525
- const [currentFolderId, setCurrentFolderId] = React4.useState(void 0);
1526
- const [startingQuestions, setStartingQuestions] = React4.useState(startingQuestionsProp || defaultStartingQuestions);
1527
- const [loadingQuestions, setLoadingQuestions] = React4.useState(false);
1528
- React4.useEffect(() => {
1639
+ const [currentFolderId, setCurrentFolderId] = React5.useState(void 0);
1640
+ const [startingQuestions, setStartingQuestions] = React5.useState(startingQuestionsProp || defaultStartingQuestions);
1641
+ const [loadingQuestions, setLoadingQuestions] = React5.useState(false);
1642
+ React5.useEffect(() => {
1529
1643
  if (startingQuestionsEndpoint && !startingQuestionsProp) {
1530
1644
  setLoadingQuestions(true);
1531
1645
  fetch(startingQuestionsEndpoint).then((res) => res.json()).then((data) => {
@@ -1537,16 +1651,16 @@ function ChatPanel({
1537
1651
  }).finally(() => setLoadingQuestions(false));
1538
1652
  }
1539
1653
  }, [startingQuestionsEndpoint, startingQuestionsProp]);
1540
- React4.useEffect(() => {
1654
+ React5.useEffect(() => {
1541
1655
  if (startingQuestionsProp) {
1542
1656
  setStartingQuestions(startingQuestionsProp);
1543
1657
  }
1544
1658
  }, [startingQuestionsProp]);
1545
- const [activeGuide, setActiveGuide] = React4.useState(void 0);
1546
- const activeGuideRef = React4.useRef(void 0);
1547
- const latestBulkSummaryNavigationRef = React4.useRef(null);
1548
- const [guideComplete, setGuideComplete] = React4.useState(false);
1549
- React4.useEffect(() => {
1659
+ const [activeGuide, setActiveGuide] = React5.useState(void 0);
1660
+ const activeGuideRef = React5.useRef(void 0);
1661
+ const latestBulkSummaryNavigationRef = React5.useRef(null);
1662
+ const [guideComplete, setGuideComplete] = React5.useState(false);
1663
+ React5.useEffect(() => {
1550
1664
  window.resetIntegrationNotification = () => {
1551
1665
  localStorage.removeItem("gmailNotificationSeen");
1552
1666
  console.log(
@@ -1580,7 +1694,7 @@ function ChatPanel({
1580
1694
  );
1581
1695
  };
1582
1696
  }, []);
1583
- React4.useEffect(() => {
1697
+ React5.useEffect(() => {
1584
1698
  if (activeGuide) {
1585
1699
  if (!activeGuideRef.current || activeGuideRef.current.id !== activeGuide.id || activeGuideRef.current.stepIndex !== activeGuide.stepIndex) {
1586
1700
  activeGuideRef.current = activeGuide;
@@ -1589,21 +1703,21 @@ function ChatPanel({
1589
1703
  activeGuideRef.current = void 0;
1590
1704
  }
1591
1705
  }, [activeGuide]);
1592
- const [pendingNavigation, setPendingNavigation] = React4.useState(null);
1593
- const [pendingAction, setPendingAction] = React4.useState(null);
1594
- const [actionFormData, setActionFormData] = React4.useState({});
1595
- const messagesEndRef = React4.useRef(null);
1596
- const messagesContainerRef = React4.useRef(null);
1597
- const currentStepRef = React4.useRef(null);
1706
+ const [pendingNavigation, setPendingNavigation] = React5.useState(null);
1707
+ const [pendingAction, setPendingAction] = React5.useState(null);
1708
+ const [actionFormData, setActionFormData] = React5.useState({});
1709
+ const messagesEndRef = React5.useRef(null);
1710
+ const messagesContainerRef = React5.useRef(null);
1711
+ const currentStepRef = React5.useRef(null);
1598
1712
  const { cursorState, moveTo, hide } = useGuideCursor();
1599
- const [pendingFile, setPendingFile] = React4.useState(null);
1600
- const [pendingBulkSession, setPendingBulkSession] = React4.useState(null);
1601
- const pendingBulkSessionRef = React4.useRef(null);
1602
- const fileInputRef = React4.useRef(null);
1603
- const [searchExpanded, setSearchExpanded] = React4.useState(false);
1604
- const [searchInput, setSearchInput] = React4.useState("");
1605
- const searchInputRef = React4.useRef(null);
1606
- React4.useEffect(() => {
1713
+ const [pendingFile, setPendingFile] = React5.useState(null);
1714
+ const [pendingBulkSession, setPendingBulkSession] = React5.useState(null);
1715
+ const pendingBulkSessionRef = React5.useRef(null);
1716
+ const fileInputRef = React5.useRef(null);
1717
+ const [searchExpanded, setSearchExpanded] = React5.useState(false);
1718
+ const [searchInput, setSearchInput] = React5.useState("");
1719
+ const searchInputRef = React5.useRef(null);
1720
+ React5.useEffect(() => {
1607
1721
  if (!activeGuide || activeGuide.id !== "add-api-key" || activeGuide.stepIndex !== 2) {
1608
1722
  return;
1609
1723
  }
@@ -1629,7 +1743,7 @@ function ChatPanel({
1629
1743
  const interval = setInterval(checkForDialogOpen, 300);
1630
1744
  return () => clearInterval(interval);
1631
1745
  }, [activeGuide, hide]);
1632
- React4.useEffect(() => {
1746
+ React5.useEffect(() => {
1633
1747
  return () => {
1634
1748
  Object.values(streamIntervals.current).forEach(
1635
1749
  (id) => window.clearInterval(id)
@@ -1639,7 +1753,7 @@ function ChatPanel({
1639
1753
  phaseTimers.current = [];
1640
1754
  };
1641
1755
  }, []);
1642
- React4.useEffect(() => {
1756
+ React5.useEffect(() => {
1643
1757
  if (activeGuide && messages.length > 0) {
1644
1758
  const lastMessage = messages[messages.length - 1];
1645
1759
  if (lastMessage.kind === "guideStep" || lastMessage.kind === "guideComplete") {
@@ -1656,7 +1770,7 @@ function ChatPanel({
1656
1770
  messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
1657
1771
  }
1658
1772
  }, [messages, phase, activeGuide]);
1659
- const latestBulkSummaryNavigation = React4.useMemo(() => {
1773
+ const latestBulkSummaryNavigation = React5.useMemo(() => {
1660
1774
  for (let i = messages.length - 1; i >= 0; i--) {
1661
1775
  const msg = messages[i];
1662
1776
  if (msg.kind === "bulkSummary" && msg.bulkSummary?.navigationPage && msg.bulkSummary.successes > 0) {
@@ -1665,13 +1779,13 @@ function ChatPanel({
1665
1779
  }
1666
1780
  return null;
1667
1781
  }, [messages]);
1668
- React4.useEffect(() => {
1782
+ React5.useEffect(() => {
1669
1783
  latestBulkSummaryNavigationRef.current = latestBulkSummaryNavigation;
1670
1784
  }, [latestBulkSummaryNavigation]);
1671
- React4.useEffect(() => {
1785
+ React5.useEffect(() => {
1672
1786
  pendingBulkSessionRef.current = pendingBulkSession;
1673
1787
  }, [pendingBulkSession]);
1674
- React4.useEffect(() => {
1788
+ React5.useEffect(() => {
1675
1789
  const handleKeyDown = (e) => {
1676
1790
  if ((e.metaKey || e.ctrlKey) && e.key === "Enter") {
1677
1791
  const currentBulkSession = pendingBulkSessionRef.current;
@@ -1734,7 +1848,7 @@ function ChatPanel({
1734
1848
  guideComplete,
1735
1849
  onNavigate
1736
1850
  ]);
1737
- const connectToEscalationWs = React4.useCallback((currentSessionId) => {
1851
+ const connectToEscalationWs = React5.useCallback((currentSessionId) => {
1738
1852
  if (!agentUrl) return;
1739
1853
  if (escalationWsRef.current) {
1740
1854
  escalationWsRef.current.close();
@@ -1777,7 +1891,7 @@ function ChatPanel({
1777
1891
  };
1778
1892
  escalationWsRef.current = ws;
1779
1893
  }, [agentUrl]);
1780
- const sendEscalatedMessage = React4.useCallback(async (content) => {
1894
+ const sendEscalatedMessage = React5.useCallback(async (content) => {
1781
1895
  if (!escalationWsRef.current || escalationWsRef.current.readyState !== WebSocket.OPEN) {
1782
1896
  console.error("[KiteChat] Escalation WebSocket not connected");
1783
1897
  return false;
@@ -1794,14 +1908,14 @@ function ChatPanel({
1794
1908
  return false;
1795
1909
  }
1796
1910
  }, [updateCustomerStatus]);
1797
- React4.useEffect(() => {
1911
+ React5.useEffect(() => {
1798
1912
  return () => {
1799
1913
  if (escalationWsRef.current) {
1800
1914
  escalationWsRef.current.close();
1801
1915
  }
1802
1916
  };
1803
1917
  }, []);
1804
- React4.useEffect(() => {
1918
+ React5.useEffect(() => {
1805
1919
  if (isEscalated && sessionId) {
1806
1920
  connectToEscalationWs(sessionId);
1807
1921
  }
@@ -2076,9 +2190,9 @@ function ChatPanel({
2076
2190
  session_id: sessionId,
2077
2191
  message: userText,
2078
2192
  current_page: currentPage || "dashboard",
2079
- user_id: userId,
2080
- user_name: userName,
2081
- user_email: userEmail,
2193
+ user_id: effectiveUser.userId,
2194
+ user_name: effectiveUser.userName,
2195
+ user_email: effectiveUser.userEmail,
2082
2196
  user_organization: userOrganization,
2083
2197
  org_id: orgId
2084
2198
  }),
@@ -3021,6 +3135,64 @@ ${userText}`
3021
3135
  ] })
3022
3136
  ] }) }) });
3023
3137
  }
3138
+ if (productBackendUrl) {
3139
+ if (authState.status === "loading") {
3140
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
3141
+ "section",
3142
+ {
3143
+ className: `fixed top-0 right-0 z-40 flex flex-col bg-white border-l border-gray-200 h-full overflow-hidden transition-transform duration-300 ${isOpen ? "translate-x-0" : "translate-x-full"}`,
3144
+ style: { width: `${PANEL_WIDTH}px` },
3145
+ children: [
3146
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-100 bg-gradient-to-r from-gray-50 to-white shrink-0", children: [
3147
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center gap-2.5", children: [
3148
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react4.Sparkles, { className: "h-3.5 w-3.5 text-black", fill: "currentColor" }),
3149
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h3", { className: "text-sm font-semibold text-gray-800", children: "Copilot" })
3150
+ ] }),
3151
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
3152
+ Button,
3153
+ {
3154
+ variant: "ghost",
3155
+ size: "sm",
3156
+ className: "h-7 w-7 p-0 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-full",
3157
+ onClick: () => onClose?.(),
3158
+ children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react4.Minus, { className: "h-3.5 w-3.5" })
3159
+ }
3160
+ )
3161
+ ] }),
3162
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AuthLoadingState, {})
3163
+ ]
3164
+ }
3165
+ );
3166
+ }
3167
+ if (authState.status === "error") {
3168
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
3169
+ "section",
3170
+ {
3171
+ className: `fixed top-0 right-0 z-40 flex flex-col bg-white border-l border-gray-200 h-full overflow-hidden transition-transform duration-300 ${isOpen ? "translate-x-0" : "translate-x-full"}`,
3172
+ style: { width: `${PANEL_WIDTH}px` },
3173
+ children: [
3174
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-100 bg-gradient-to-r from-gray-50 to-white shrink-0", children: [
3175
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center gap-2.5", children: [
3176
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react4.Sparkles, { className: "h-3.5 w-3.5 text-black", fill: "currentColor" }),
3177
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h3", { className: "text-sm font-semibold text-gray-800", children: "Copilot" })
3178
+ ] }),
3179
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
3180
+ Button,
3181
+ {
3182
+ variant: "ghost",
3183
+ size: "sm",
3184
+ className: "h-7 w-7 p-0 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-full",
3185
+ onClick: () => onClose?.(),
3186
+ children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react4.Minus, { className: "h-3.5 w-3.5" })
3187
+ }
3188
+ )
3189
+ ] }),
3190
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AuthErrorState, { error: authState.error, onRetry: retryAuth })
3191
+ ]
3192
+ }
3193
+ );
3194
+ }
3195
+ }
3024
3196
  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
3025
3197
  "section",
3026
3198
  {
@@ -4138,7 +4310,7 @@ ${userText}`
4138
4310
  message.id
4139
4311
  );
4140
4312
  }
4141
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(React4.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
4313
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(React5.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
4142
4314
  "div",
4143
4315
  {
4144
4316
  ref: isCurrentGuideStep ? currentStepRef : null,
@@ -4372,9 +4544,10 @@ function ChatPanelWithToggle({
4372
4544
  userEmail,
4373
4545
  userOrganization,
4374
4546
  supabaseUrl,
4375
- supabaseAnonKey
4547
+ supabaseAnonKey,
4548
+ productBackendUrl
4376
4549
  }) {
4377
- const [internalIsOpen, setInternalIsOpen] = React4.useState(defaultOpen);
4550
+ const [internalIsOpen, setInternalIsOpen] = React5.useState(defaultOpen);
4378
4551
  const isOpen = controlledIsOpen !== void 0 ? controlledIsOpen : internalIsOpen;
4379
4552
  const setIsOpen = (open) => {
4380
4553
  if (controlledIsOpen === void 0) {
@@ -4382,7 +4555,7 @@ function ChatPanelWithToggle({
4382
4555
  }
4383
4556
  onOpenChange?.(open);
4384
4557
  };
4385
- React4.useEffect(() => {
4558
+ React5.useEffect(() => {
4386
4559
  const originalPadding = document.body.style.paddingRight;
4387
4560
  const originalTransition = document.body.style.transition;
4388
4561
  document.body.style.transition = "padding-right 0.3s ease";
@@ -4410,7 +4583,8 @@ function ChatPanelWithToggle({
4410
4583
  userEmail,
4411
4584
  userOrganization,
4412
4585
  supabaseUrl,
4413
- supabaseAnonKey
4586
+ supabaseAnonKey,
4587
+ productBackendUrl
4414
4588
  }
4415
4589
  );
4416
4590
  }
@@ -4470,7 +4644,8 @@ function KiteChatWrapper({
4470
4644
  userEmail: config.userEmail,
4471
4645
  userOrganization: config.userOrganization,
4472
4646
  supabaseUrl: config.supabaseUrl,
4473
- supabaseAnonKey: config.supabaseAnonKey
4647
+ supabaseAnonKey: config.supabaseAnonKey,
4648
+ productBackendUrl: config.productBackendUrl
4474
4649
  }
4475
4650
  );
4476
4651
  }
package/dist/auto.d.cts CHANGED
@@ -1,4 +1,4 @@
1
- import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-jmAPjuv_.cjs';
1
+ import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-o5u-5Sor.cjs';
2
2
  import 'react/jsx-runtime';
3
3
 
4
4
  /**
package/dist/auto.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-jmAPjuv_.js';
1
+ import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-o5u-5Sor.js';
2
2
  import 'react/jsx-runtime';
3
3
 
4
4
  /**
package/dist/auto.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  createKiteChat
3
- } from "./chunk-QSVOPKVC.js";
3
+ } from "./chunk-XMA5S556.js";
4
4
 
5
5
  // src/auto.ts
6
6
  function mountKiteChat(config) {