@kite-copilot/chat-panel 0.2.46 → 0.2.48

package/README.md

@@ -47,12 +47,11 @@ import '@kite-copilot/chat-panel/style.css';
 // Create the chat instance
 const chat = createKiteChat({
   userId: 'user-123',
-  orgId: 'org-456',
+  orgId: 'org-456', // Organization ID for multi-tenant data isolation
   agentUrl: 'https://your-api.example.com',
   // Optional: Pass user info for session tracking in control center
   userName: 'John Doe',
   userEmail: 'john@example.com',
-  userOrganization: 'Acme Inc',
   onNavigate: (page, subtab) => {
     router.push(`/${page}${subtab ? `?tab=${subtab}` : ''}`);
   },
@@ -139,7 +138,6 @@ const router = useRouter();
 
 const { open, close, toggle, setCurrentPage } = useKiteChat({
   userId: 'user-123',
-  orgId: 'org-456',
   agentUrl: 'https://your-api.example.com',
   onNavigate: (page, subtab) => {
     router.push(`/${page}${subtab ? `?tab=${subtab}` : ''}`);
@@ -178,7 +176,6 @@ app.mount('#app');
 // Initialize chat after Vue app is mounted
 const chat = createKiteChat({
   userId: 'user-123',
-  orgId: 'org-456',
   agentUrl: 'https://your-api.example.com',
   onNavigate: (page) => router.push(`/${page}`),
 });
@@ -204,10 +201,8 @@ function App() {
       <ChatPanelWithToggle
         agentUrl="https://your-api.example.com"
         userId="user-123"
-        orgId="org-456"
         userName="John Doe"
         userEmail="john@example.com"
-        userOrganization="Acme Inc"
         onNavigate={(page) => router.push(`/${page}`)}
       />
     </>
@@ -264,7 +259,6 @@ The panel shows suggested questions when empty. These can be customized per-user
 // Option 1: Pass questions directly
 const chat = createKiteChat({
   userId: 'user-123',
-  orgId: 'org-456',
   startingQuestions: [
     { id: '1', label: 'Changing layouts', prompt: 'How do I customize the layout?' },
     { id: '2', label: 'Bulk uploads', prompt: 'How do I upload data in bulk?' },
@@ -275,7 +269,6 @@ const chat = createKiteChat({
 // Option 2: Fetch from backend (per-user)
 const chat = createKiteChat({
   userId: 'user-123',
-  orgId: 'org-456',
   startingQuestionsEndpoint: '/api/user/starting-questions',
 });
 ```
@@ -295,11 +288,9 @@ Pass user information to enable session tracking in the control center. This all
 ```ts
 const chat = createKiteChat({
   userId: 'user-123',
-  orgId: 'org-456',
   // Optional user info for control center display
   userName: 'John Doe',
   userEmail: 'john@example.com',
-  userOrganization: 'Acme Inc',
 });
 ```
 
@@ -307,9 +298,8 @@ const chat = createKiteChat({
 |-------|-------------|
 | `userName` | Displayed in conversations list and live chat |
 | `userEmail` | Shown in user details panel |
-| `userOrganization` | Helps support agents identify the customer's company |
 
-**Note:** If user info is not provided, placeholder values ("Anonymous User", "Not provided", "Unknown") will be displayed in the control center.
+**Note:** If user info is not provided, placeholder values ("Anonymous User", "Not provided") will be displayed in the control center.
 
 ## API Reference
 
@@ -322,12 +312,11 @@ Creates a new chat instance with explicit lifecycle control.
 | Property | Type | Required | Description |
 |----------|------|----------|-------------|
 | `userId` | `string` | Yes | Unique identifier for the current user |
-| `orgId` | `string` | Yes | Organization identifier |
+| `orgId` | `string` | No | Organization ID for multi-tenant data isolation |
 | `agentUrl` | `string` | No | Backend agent API URL |
 | `currentPage` | `string` | No | Current page context |
 | `userName` | `string` | No | User's display name (for control center) |
 | `userEmail` | `string` | No | User's email address (for control center) |
-| `userOrganization` | `string` | No | User's organization name (for control center) |
 | `theme` | `'light' \| 'dark' \| 'system'` | No | Theme preference |
 | `startingQuestions` | `StartingQuestion[]` | No | Custom starting questions |
 | `startingQuestionsEndpoint` | `string` | No | URL to fetch per-user questions |
@@ -363,10 +352,9 @@ import { ChatPanelWithToggle } from '@kite-copilot/chat-panel';
 | `agentUrl` | `string` | `localhost:5002` | Backend agent URL |
 | `currentPage` | `string` | - | Current page for context |
 | `userId` | `string` | - | Unique user identifier |
-| `orgId` | `string` | - | Organization identifier |
+| `orgId` | `string` | - | Organization ID for multi-tenant data isolation |
 | `userName` | `string` | - | User's display name (for control center) |
 | `userEmail` | `string` | - | User's email address (for control center) |
-| `userOrganization` | `string` | - | User's organization name (for control center) |
 | `defaultOpen` | `boolean` | `false` | Initial open state (uncontrolled) |
 | `isOpen` | `boolean` | - | Controlled open state |
 | `onOpenChange` | `(isOpen: boolean) => void` | - | Called when open state changes |
@@ -463,8 +451,7 @@ Main chat endpoint for streaming responses.
   "message": "user message",
   "current_page": "dashboard",
   "user_name": "John Doe",
-  "user_email": "john@example.com",
-  "user_organization": "Acme Inc"
+  "user_email": "john@example.com"
 }
 ```
 

package/dist/auto.cjs

@@ -175,6 +175,7 @@ function ScrollBar({
 
 // src/ChatPanel.tsx
 var import_lucide_react4 = require("lucide-react");
+var import_framer_motion2 = require("framer-motion");
 
 // src/components/AssistantActivity.tsx
 var import_lucide_react = require("lucide-react");
@@ -1023,9 +1024,10 @@ function TypingIndicator({ className = "" }) {
 
 // src/ChatPanel.tsx
 var import_jsx_runtime10 = require("react/jsx-runtime");
-var CHAT_PANEL_VERSION = true ? "0.2.46" : "dev";
+var CHAT_PANEL_VERSION = true ? "0.2.48" : "dev";
 var DEFAULT_AGENT_URL = "http://localhost:5002";
-var PANEL_WIDTH = 340;
+var PANEL_WIDTH = 400;
+var PANEL_HEIGHT = 600;
 function unescapeJsonString(str) {
   return str.replace(/\\\\n/g, "\n").replace(/\\\\t/g, "	").replace(/\\\\"/g, '"').replace(/\\\\\\\\/g, "\\").replace(/\\n/g, "\n").replace(/\\t/g, "	").replace(/\\"/g, '"').replace(/\\\\/g, "\\");
 }
@@ -1482,14 +1484,30 @@ function ChatPanel({
   orgId,
   userName,
   userEmail,
-  userOrganization,
   supabaseUrl,
   supabaseAnonKey,
+  initialCorner = "bottom-left",
+  onCornerChange,
   productBackendUrl
 } = {}) {
   const [messages, setMessages] = React6.useState(initialMessages);
   const [input, setInput] = React6.useState("");
+  const [corner, setCorner] = React6.useState(initialCorner);
+  const [isDragging, setIsDragging] = React6.useState(false);
+  const dragControls = (0, import_framer_motion2.useAnimationControls)();
+  const handleDragEnd = React6.useCallback((_event, info) => {
+    dragControls.set({ x: 0, y: 0 });
+    setIsDragging(false);
+    const viewportWidth = window.innerWidth;
+    const pointerX = info.point.x;
+    const newCorner = pointerX < viewportWidth / 2 ? "bottom-left" : "bottom-right";
+    if (newCorner !== corner) {
+      setCorner(newCorner);
+      onCornerChange?.(newCorner);
+    }
+  }, [corner, onCornerChange, dragControls]);
   const [sessionId, setSessionId] = React6.useState(() => crypto.randomUUID());
+  const [sessionUser, setSessionUser] = React6.useState(null);
   const orgConfigState = useOrgConfig({ agentUrl, orgId: orgId || "" });
   const effectiveProductBackendUrl = orgConfigState.config?.productBackendUrl || productBackendUrl;
   const { authState, retry: retryAuth } = useUserAuth({
@@ -1530,6 +1548,9 @@ function ChatPanel({
     testProductBackendEndpoint();
   }, [effectiveProductBackendUrl, orgConfigState.status]);
   const effectiveUser = React6.useMemo(() => {
+    if (sessionUser) {
+      return sessionUser;
+    }
     if (authState.status === "authenticated") {
       return {
         userId: authState.user.id,
@@ -1546,7 +1567,23 @@ function ChatPanel({
       userRole: void 0,
       isInternal: false
     };
-  }, [authState, userId, userName, userEmail]);
+  }, [sessionUser, authState, userId, userName, userEmail]);
+  React6.useEffect(() => {
+    if (authState.status === "authenticated" && sessionUser === null) {
+      setSessionUser({
+        userId: authState.user.id,
+        userName: authState.user.name,
+        userEmail: authState.user.email,
+        userRole: authState.user.role,
+        isInternal: authState.user.isInternal
+      });
+      console.log("[ChatPanel] Session user captured:", authState.user.id);
+    }
+  }, [authState, sessionUser]);
+  const isWaitingForAuth = React6.useMemo(() => {
+    if (!effectiveProductBackendUrl) return false;
+    return authState.status === "loading" || authState.status === "idle";
+  }, [effectiveProductBackendUrl, authState.status]);
   const [isEscalated, setIsEscalated] = React6.useState(false);
   const escalationWsRef = React6.useRef(null);
   const [agentIsTyping, setAgentIsTyping] = React6.useState(false);
@@ -1574,6 +1611,7 @@ function ChatPanel({
     } else {
       console.log("[KiteChat] Skipping disconnect update - conditions not met");
     }
+    setSessionUser(null);
     setSessionId(crypto.randomUUID());
     setIsEscalated(false);
     if (escalationWsRef.current) {
@@ -2276,7 +2314,6 @@ function ChatPanel({
       console.log("[ChatPanel]   user_id:", effectiveUser.userId);
       console.log("[ChatPanel]   user_name:", effectiveUser.userName);
       console.log("[ChatPanel]   user_email:", effectiveUser.userEmail);
-      console.log("[ChatPanel]   user_organization:", userOrganization);
       console.log("[ChatPanel]   org_id:", orgId);
       console.log("[ChatPanel]   authState.status:", authState.status);
       const response = await fetch(`${agentUrl}/chat/stream`, {
@@ -2288,11 +2325,10 @@ function ChatPanel({
           session_id: sessionId,
           message: userText,
           current_page: currentPage || "dashboard",
-          user_id: effectiveUser.userId,
-          user_name: effectiveUser.userName,
-          user_email: effectiveUser.userEmail,
-          user_organization: userOrganization,
-          org_id: orgId
+          user_id: userId,
+          org_id: orgId,
+          user_name: userName,
+          user_email: userEmail
         }),
         signal: controller.signal
       });
@@ -3323,12 +3359,21 @@ ${userText}`
     }
   }
   return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
-    "section",
+    import_framer_motion2.motion.section,
     {
-      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"}`,
-      style: { width: `${PANEL_WIDTH}px` },
+      drag: true,
+      dragMomentum: false,
+      dragElastic: 0,
+      animate: dragControls,
+      onDragStart: () => setIsDragging(true),
+      onDragEnd: handleDragEnd,
+      className: `fixed bottom-4 z-40 flex flex-col bg-white border border-gray-200 rounded-2xl overflow-hidden shadow-2xl ${isDragging ? "cursor-grabbing" : ""} ${corner === "bottom-left" ? "left-4" : "right-4"} ${isOpen ? "opacity-100 scale-100" : "opacity-0 scale-95 pointer-events-none"}`,
+      style: {
+        width: `${PANEL_WIDTH}px`,
+        height: `${PANEL_HEIGHT}px`
+      },
       children: [
-        /* @__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: [
+        /* @__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 cursor-grab active:cursor-grabbing", children: [
           /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center gap-2.5", children: [
             /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react4.Sparkles, { className: "h-3.5 w-3.5 text-black", fill: "currentColor" }),
             /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h3", { className: "text-sm font-semibold text-gray-800", children: "Copilot" })
@@ -3461,12 +3506,12 @@ ${userText}`
                   return null;
                 }
                 if (isUser) {
-                  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: `flex justify-end ${isRoleChange ? "mt-3" : ""}`, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "max-w-[260px] rounded-2xl rounded-br-md bg-gray-900 px-3 py-2 text-xs text-white shadow-sm", children: message.content }) }, message.id);
+                  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: `flex justify-end ${isRoleChange ? "mt-3" : ""}`, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "max-w-[260px] rounded-2xl rounded-br-md bg-gray-900 px-3 py-2 text-sm text-white shadow-sm", children: message.content }) }, message.id);
                 }
                 if (message.role === "agent") {
                   return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: `flex flex-col items-start ${isRoleChange ? "mt-3" : ""}`, children: [
                     isRoleChange && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[10px] text-gray-500 mb-1 ml-1", children: "Agent" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "max-w-[260px] rounded-2xl rounded-bl-md bg-white border border-gray-200 px-3 py-2 text-xs text-gray-800 shadow-sm", children: message.content })
+                    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "max-w-[300px] rounded-2xl rounded-bl-md bg-gray-100 px-4 py-3 text-sm text-gray-700", children: message.content })
                   ] }, message.id);
                 }
                 if (message.kind === "searchSummary") {
@@ -4524,7 +4569,7 @@ ${userText}`
             ] }) }) }) })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "px-4 py-3 border-t border-gray-100 bg-gray-50/50 shrink-0", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "px-4 py-3 bg-white shrink-0", children: [
           pendingFile && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "mb-2 flex items-center gap-2 rounded-xl bg-blue-50 border border-blue-200 px-3 py-2", children: [
             /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react4.FileSpreadsheet, { className: "h-4 w-4 text-blue-600" }),
             /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-xs text-blue-700 flex-1 truncate", children: pendingFile.name }),
@@ -4636,7 +4681,7 @@ ${userText}`
                 {
                   type: "submit",
                   size: "icon",
-                  disabled: !input.trim() && !pendingFile,
+                  disabled: !input.trim() && !pendingFile || isWaitingForAuth,
                   className: "h-6 w-6 rounded-full bg-gray-900 hover:bg-gray-800 disabled:bg-gray-300",
                   children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react4.ArrowUp, { className: "h-2.5 w-2.5" })
                 }
@@ -4671,9 +4716,10 @@ function ChatPanelWithToggle({
   orgId,
   userName,
   userEmail,
-  userOrganization,
   supabaseUrl,
   supabaseAnonKey,
+  initialCorner,
+  onCornerChange,
   productBackendUrl
 }) {
   const [internalIsOpen, setInternalIsOpen] = React6.useState(defaultOpen);
@@ -4684,16 +4730,6 @@ function ChatPanelWithToggle({
     }
     onOpenChange?.(open);
   };
-  React6.useEffect(() => {
-    const originalPadding = document.body.style.paddingRight;
-    const originalTransition = document.body.style.transition;
-    document.body.style.transition = "padding-right 0.3s ease";
-    document.body.style.paddingRight = isOpen ? `${PANEL_WIDTH}px` : "0px";
-    return () => {
-      document.body.style.paddingRight = originalPadding;
-      document.body.style.transition = originalTransition;
-    };
-  }, [isOpen]);
   return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     ChatPanel,
     {
@@ -4710,9 +4746,10 @@ function ChatPanelWithToggle({
       orgId,
       userName,
       userEmail,
-      userOrganization,
       supabaseUrl,
       supabaseAnonKey,
+      initialCorner,
+      onCornerChange,
       productBackendUrl
     }
   );
@@ -4771,7 +4808,6 @@ function KiteChatWrapper({
       orgId: config.orgId,
       userName: config.userName,
       userEmail: config.userEmail,
-      userOrganization: config.userOrganization,
       supabaseUrl: config.supabaseUrl,
       supabaseAnonKey: config.supabaseAnonKey,
       productBackendUrl: config.productBackendUrl

package/dist/auto.d.cts

@@ -1,4 +1,4 @@
-import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-o5u-5Sor.cjs';
+import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-e6BnJS6T.cjs';
 import 'react/jsx-runtime';
 
 /**
@@ -15,7 +15,6 @@ import 'react/jsx-runtime';
  * const chat = mountKiteChat({
  *   container: '#chat-container',
  *   userId: 'user-123',
- *   orgId: 'org-456',
  * });
  *
  * // Later, if needed:
@@ -45,13 +44,11 @@ interface MountKiteChatConfig extends KiteChatConfig {
  * const chat = mountKiteChat({
  *   container: '#my-chat',
  *   userId: 'user-123',
- *   orgId: 'org-456',
  * });
  *
  * // Or let it create a container automatically
  * const chat = mountKiteChat({
  *   userId: 'user-123',
- *   orgId: 'org-456',
  * });
  * ```
  */

package/dist/auto.d.ts

@@ -1,4 +1,4 @@
-import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-o5u-5Sor.js';
+import { K as KiteChatConfig, a as KiteChatInstance } from './createKiteChat-e6BnJS6T.js';
 import 'react/jsx-runtime';
 
 /**
@@ -15,7 +15,6 @@ import 'react/jsx-runtime';
  * const chat = mountKiteChat({
  *   container: '#chat-container',
  *   userId: 'user-123',
- *   orgId: 'org-456',
  * });
  *
  * // Later, if needed:
@@ -45,13 +44,11 @@ interface MountKiteChatConfig extends KiteChatConfig {
  * const chat = mountKiteChat({
  *   container: '#my-chat',
  *   userId: 'user-123',
- *   orgId: 'org-456',
  * });
  *
  * // Or let it create a container automatically
  * const chat = mountKiteChat({
  *   userId: 'user-123',
- *   orgId: 'org-456',
  * });
  * ```
  */

package/dist/auto.js

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

package/dist/{chunk-4HIWUL6E.js → chunk-LOTJ3U5L.js}

@@ -885,6 +885,7 @@ function DataRenderer({ type, data }) {
 import * as React6 from "react";
 import { createClient } from "@supabase/supabase-js";
 import { ArrowLeft, ArrowUp, Command, CornerDownLeft, CheckCircle2 as CheckCircle23, SquarePen, Paperclip, X, FileSpreadsheet, Loader2 as Loader22, ChevronLeft, ChevronRight, Sparkles, Minus } from "lucide-react";
+import { motion as motion2, useAnimationControls } from "framer-motion";
 
 // src/hooks/useUserAuth.ts
 import * as React4 from "react";
@@ -1024,9 +1025,10 @@ function TypingIndicator({ className = "" }) {
 
 // src/ChatPanel.tsx
 import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
-var CHAT_PANEL_VERSION = true ? "0.2.46" : "dev";
+var CHAT_PANEL_VERSION = true ? "0.2.48" : "dev";
 var DEFAULT_AGENT_URL = "http://localhost:5002";
-var PANEL_WIDTH = 340;
+var PANEL_WIDTH = 400;
+var PANEL_HEIGHT = 600;
 function unescapeJsonString(str) {
   return str.replace(/\\\\n/g, "\n").replace(/\\\\t/g, "	").replace(/\\\\"/g, '"').replace(/\\\\\\\\/g, "\\").replace(/\\n/g, "\n").replace(/\\t/g, "	").replace(/\\"/g, '"').replace(/\\\\/g, "\\");
 }
@@ -1483,14 +1485,30 @@ function ChatPanel({
   orgId,
   userName,
   userEmail,
-  userOrganization,
   supabaseUrl,
   supabaseAnonKey,
+  initialCorner = "bottom-left",
+  onCornerChange,
   productBackendUrl
 } = {}) {
   const [messages, setMessages] = React6.useState(initialMessages);
   const [input, setInput] = React6.useState("");
+  const [corner, setCorner] = React6.useState(initialCorner);
+  const [isDragging, setIsDragging] = React6.useState(false);
+  const dragControls = useAnimationControls();
+  const handleDragEnd = React6.useCallback((_event, info) => {
+    dragControls.set({ x: 0, y: 0 });
+    setIsDragging(false);
+    const viewportWidth = window.innerWidth;
+    const pointerX = info.point.x;
+    const newCorner = pointerX < viewportWidth / 2 ? "bottom-left" : "bottom-right";
+    if (newCorner !== corner) {
+      setCorner(newCorner);
+      onCornerChange?.(newCorner);
+    }
+  }, [corner, onCornerChange, dragControls]);
   const [sessionId, setSessionId] = React6.useState(() => crypto.randomUUID());
+  const [sessionUser, setSessionUser] = React6.useState(null);
   const orgConfigState = useOrgConfig({ agentUrl, orgId: orgId || "" });
   const effectiveProductBackendUrl = orgConfigState.config?.productBackendUrl || productBackendUrl;
   const { authState, retry: retryAuth } = useUserAuth({
@@ -1531,6 +1549,9 @@ function ChatPanel({
     testProductBackendEndpoint();
   }, [effectiveProductBackendUrl, orgConfigState.status]);
   const effectiveUser = React6.useMemo(() => {
+    if (sessionUser) {
+      return sessionUser;
+    }
     if (authState.status === "authenticated") {
       return {
         userId: authState.user.id,
@@ -1547,7 +1568,23 @@ function ChatPanel({
       userRole: void 0,
       isInternal: false
     };
-  }, [authState, userId, userName, userEmail]);
+  }, [sessionUser, authState, userId, userName, userEmail]);
+  React6.useEffect(() => {
+    if (authState.status === "authenticated" && sessionUser === null) {
+      setSessionUser({
+        userId: authState.user.id,
+        userName: authState.user.name,
+        userEmail: authState.user.email,
+        userRole: authState.user.role,
+        isInternal: authState.user.isInternal
+      });
+      console.log("[ChatPanel] Session user captured:", authState.user.id);
+    }
+  }, [authState, sessionUser]);
+  const isWaitingForAuth = React6.useMemo(() => {
+    if (!effectiveProductBackendUrl) return false;
+    return authState.status === "loading" || authState.status === "idle";
+  }, [effectiveProductBackendUrl, authState.status]);
   const [isEscalated, setIsEscalated] = React6.useState(false);
   const escalationWsRef = React6.useRef(null);
   const [agentIsTyping, setAgentIsTyping] = React6.useState(false);
@@ -1575,6 +1612,7 @@ function ChatPanel({
     } else {
       console.log("[KiteChat] Skipping disconnect update - conditions not met");
     }
+    setSessionUser(null);
     setSessionId(crypto.randomUUID());
     setIsEscalated(false);
     if (escalationWsRef.current) {
@@ -2277,7 +2315,6 @@ function ChatPanel({
       console.log("[ChatPanel]   user_id:", effectiveUser.userId);
       console.log("[ChatPanel]   user_name:", effectiveUser.userName);
       console.log("[ChatPanel]   user_email:", effectiveUser.userEmail);
-      console.log("[ChatPanel]   user_organization:", userOrganization);
       console.log("[ChatPanel]   org_id:", orgId);
       console.log("[ChatPanel]   authState.status:", authState.status);
       const response = await fetch(`${agentUrl}/chat/stream`, {
@@ -2289,11 +2326,10 @@ function ChatPanel({
           session_id: sessionId,
           message: userText,
           current_page: currentPage || "dashboard",
-          user_id: effectiveUser.userId,
-          user_name: effectiveUser.userName,
-          user_email: effectiveUser.userEmail,
-          user_organization: userOrganization,
-          org_id: orgId
+          user_id: userId,
+          org_id: orgId,
+          user_name: userName,
+          user_email: userEmail
         }),
         signal: controller.signal
       });
@@ -3324,12 +3360,21 @@ ${userText}`
     }
   }
   return /* @__PURE__ */ jsxs6(
-    "section",
+    motion2.section,
     {
-      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"}`,
-      style: { width: `${PANEL_WIDTH}px` },
+      drag: true,
+      dragMomentum: false,
+      dragElastic: 0,
+      animate: dragControls,
+      onDragStart: () => setIsDragging(true),
+      onDragEnd: handleDragEnd,
+      className: `fixed bottom-4 z-40 flex flex-col bg-white border border-gray-200 rounded-2xl overflow-hidden shadow-2xl ${isDragging ? "cursor-grabbing" : ""} ${corner === "bottom-left" ? "left-4" : "right-4"} ${isOpen ? "opacity-100 scale-100" : "opacity-0 scale-95 pointer-events-none"}`,
+      style: {
+        width: `${PANEL_WIDTH}px`,
+        height: `${PANEL_HEIGHT}px`
+      },
       children: [
-        /* @__PURE__ */ jsxs6("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: [
+        /* @__PURE__ */ jsxs6("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 cursor-grab active:cursor-grabbing", children: [
           /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2.5", children: [
             /* @__PURE__ */ jsx10(Sparkles, { className: "h-3.5 w-3.5 text-black", fill: "currentColor" }),
             /* @__PURE__ */ jsx10("h3", { className: "text-sm font-semibold text-gray-800", children: "Copilot" })
@@ -3462,12 +3507,12 @@ ${userText}`
                   return null;
                 }
                 if (isUser) {
-                  return /* @__PURE__ */ jsx10("div", { className: `flex justify-end ${isRoleChange ? "mt-3" : ""}`, children: /* @__PURE__ */ jsx10("div", { className: "max-w-[260px] rounded-2xl rounded-br-md bg-gray-900 px-3 py-2 text-xs text-white shadow-sm", children: message.content }) }, message.id);
+                  return /* @__PURE__ */ jsx10("div", { className: `flex justify-end ${isRoleChange ? "mt-3" : ""}`, children: /* @__PURE__ */ jsx10("div", { className: "max-w-[260px] rounded-2xl rounded-br-md bg-gray-900 px-3 py-2 text-sm text-white shadow-sm", children: message.content }) }, message.id);
                 }
                 if (message.role === "agent") {
                   return /* @__PURE__ */ jsxs6("div", { className: `flex flex-col items-start ${isRoleChange ? "mt-3" : ""}`, children: [
                     isRoleChange && /* @__PURE__ */ jsx10("span", { className: "text-[10px] text-gray-500 mb-1 ml-1", children: "Agent" }),
-                    /* @__PURE__ */ jsx10("div", { className: "max-w-[260px] rounded-2xl rounded-bl-md bg-white border border-gray-200 px-3 py-2 text-xs text-gray-800 shadow-sm", children: message.content })
+                    /* @__PURE__ */ jsx10("div", { className: "max-w-[300px] rounded-2xl rounded-bl-md bg-gray-100 px-4 py-3 text-sm text-gray-700", children: message.content })
                   ] }, message.id);
                 }
                 if (message.kind === "searchSummary") {
@@ -4525,7 +4570,7 @@ ${userText}`
             ] }) }) }) })
           }
         ),
-        /* @__PURE__ */ jsxs6("div", { className: "px-4 py-3 border-t border-gray-100 bg-gray-50/50 shrink-0", children: [
+        /* @__PURE__ */ jsxs6("div", { className: "px-4 py-3 bg-white shrink-0", children: [
           pendingFile && /* @__PURE__ */ jsxs6("div", { className: "mb-2 flex items-center gap-2 rounded-xl bg-blue-50 border border-blue-200 px-3 py-2", children: [
             /* @__PURE__ */ jsx10(FileSpreadsheet, { className: "h-4 w-4 text-blue-600" }),
             /* @__PURE__ */ jsx10("span", { className: "text-xs text-blue-700 flex-1 truncate", children: pendingFile.name }),
@@ -4637,7 +4682,7 @@ ${userText}`
                 {
                   type: "submit",
                   size: "icon",
-                  disabled: !input.trim() && !pendingFile,
+                  disabled: !input.trim() && !pendingFile || isWaitingForAuth,
                   className: "h-6 w-6 rounded-full bg-gray-900 hover:bg-gray-800 disabled:bg-gray-300",
                   children: /* @__PURE__ */ jsx10(ArrowUp, { className: "h-2.5 w-2.5" })
                 }
@@ -4692,9 +4737,10 @@ function ChatPanelWithToggle({
   orgId,
   userName,
   userEmail,
-  userOrganization,
   supabaseUrl,
   supabaseAnonKey,
+  initialCorner,
+  onCornerChange,
   productBackendUrl
 }) {
   const [internalIsOpen, setInternalIsOpen] = React6.useState(defaultOpen);
@@ -4705,16 +4751,6 @@ function ChatPanelWithToggle({
     }
     onOpenChange?.(open);
   };
-  React6.useEffect(() => {
-    const originalPadding = document.body.style.paddingRight;
-    const originalTransition = document.body.style.transition;
-    document.body.style.transition = "padding-right 0.3s ease";
-    document.body.style.paddingRight = isOpen ? `${PANEL_WIDTH}px` : "0px";
-    return () => {
-      document.body.style.paddingRight = originalPadding;
-      document.body.style.transition = originalTransition;
-    };
-  }, [isOpen]);
   return /* @__PURE__ */ jsx10(
     ChatPanel,
     {
@@ -4731,9 +4767,10 @@ function ChatPanelWithToggle({
       orgId,
       userName,
       userEmail,
-      userOrganization,
       supabaseUrl,
       supabaseAnonKey,
+      initialCorner,
+      onCornerChange,
       productBackendUrl
     }
   );
@@ -4806,7 +4843,6 @@ function KiteChatWrapper({
       orgId: config.orgId,
       userName: config.userName,
       userEmail: config.userEmail,
-      userOrganization: config.userOrganization,
       supabaseUrl: config.supabaseUrl,
       supabaseAnonKey: config.supabaseAnonKey,
       productBackendUrl: config.productBackendUrl