@kite-copilot/chat-panel 0.2.46 → 0.2.47

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.47" : "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,13 +1484,28 @@ 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 orgConfigState = useOrgConfig({ agentUrl, orgId: orgId || "" });
   const effectiveProductBackendUrl = orgConfigState.config?.productBackendUrl || productBackendUrl;
@@ -2276,7 +2293,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 +2304,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 +3338,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 +3485,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 +4548,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 }),
@@ -4671,9 +4695,10 @@ function ChatPanelWithToggle({
   orgId,
   userName,
   userEmail,
-  userOrganization,
   supabaseUrl,
   supabaseAnonKey,
+  initialCorner,
+  onCornerChange,
   productBackendUrl
 }) {
   const [internalIsOpen, setInternalIsOpen] = React6.useState(defaultOpen);
@@ -4684,16 +4709,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 +4725,10 @@ function ChatPanelWithToggle({
       orgId,
       userName,
       userEmail,
-      userOrganization,
       supabaseUrl,
       supabaseAnonKey,
+      initialCorner,
+      onCornerChange,
       productBackendUrl
     }
   );
@@ -4771,7 +4787,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-XMIO4GMW.js";
 
 // src/auto.ts
 function mountKiteChat(config) {

package/dist/{chunk-4HIWUL6E.js → chunk-XMIO4GMW.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.47" : "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,13 +1485,28 @@ 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 orgConfigState = useOrgConfig({ agentUrl, orgId: orgId || "" });
   const effectiveProductBackendUrl = orgConfigState.config?.productBackendUrl || productBackendUrl;
@@ -2277,7 +2294,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 +2305,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 +3339,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 +3486,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 +4549,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 }),
@@ -4692,9 +4716,10 @@ function ChatPanelWithToggle({
   orgId,
   userName,
   userEmail,
-  userOrganization,
   supabaseUrl,
   supabaseAnonKey,
+  initialCorner,
+  onCornerChange,
   productBackendUrl
 }) {
   const [internalIsOpen, setInternalIsOpen] = React6.useState(defaultOpen);
@@ -4705,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__ */ jsx10(
     ChatPanel,
     {
@@ -4731,9 +4746,10 @@ function ChatPanelWithToggle({
       orgId,
       userName,
       userEmail,
-      userOrganization,
       supabaseUrl,
       supabaseAnonKey,
+      initialCorner,
+      onCornerChange,
       productBackendUrl
     }
   );
@@ -4806,7 +4822,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/{createKiteChat-o5u-5Sor.d.cts → createKiteChat-e6BnJS6T.d.cts}

@@ -82,6 +82,8 @@ type StartingQuestion = {
     icon?: "layout" | "upload" | "setup" | "default";
 };
 
+/** Corner position for the floating panel */
+type PanelCorner = "bottom-left" | "bottom-right";
 interface ChatPanelProps {
     /** Whether the panel is open (controlled mode) */
     isOpen?: boolean;
@@ -100,22 +102,24 @@ interface ChatPanelProps {
     startingQuestionsEndpoint?: string;
     /** Unique identifier for the current user */
     userId?: string;
-    /** Organization identifier */
+    /** Organization ID for multi-tenant data isolation */
     orgId?: string;
     /** User's display name (for personalization and support) */
     userName?: string;
     /** User's email address (for support agent context) */
     userEmail?: string;
-    /** User's organization/company name (for support agent context) */
-    userOrganization?: string;
     /** Supabase URL for realtime features (typing indicators in live chat) */
     supabaseUrl?: string;
     /** Supabase anonymous key for realtime features */
     supabaseAnonKey?: string;
+    /** Initial corner position for the panel (default: "bottom-left") */
+    initialCorner?: PanelCorner;
+    /** Callback when panel corner changes after drag */
+    onCornerChange?: (corner: PanelCorner) => void;
     /** Product backend URL for user authentication (e.g., https://dev.api.rocketalumnisolutions.com) */
     productBackendUrl?: string;
 }
-declare function ChatPanel({ isOpen, onClose, onOpen, onBack, onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions: startingQuestionsProp, startingQuestionsEndpoint, userId, orgId, userName, userEmail, userOrganization, supabaseUrl, supabaseAnonKey, productBackendUrl, }?: ChatPanelProps): react_jsx_runtime.JSX.Element;
+declare function ChatPanel({ isOpen, onClose, onOpen, onBack, onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions: startingQuestionsProp, startingQuestionsEndpoint, userId, orgId, userName, userEmail, supabaseUrl, supabaseAnonKey, initialCorner, onCornerChange, productBackendUrl, }?: 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)
@@ -162,22 +166,24 @@ interface ChatPanelWithToggleProps {
     onOpenChange?: (isOpen: boolean) => void;
     /** Unique identifier for the current user */
     userId?: string;
-    /** Organization identifier */
+    /** Organization ID for multi-tenant data isolation */
     orgId?: string;
     /** User's display name (for personalization and support) */
     userName?: string;
     /** User's email address (for support agent context) */
     userEmail?: string;
-    /** User's organization/company name (for support agent context) */
-    userOrganization?: string;
     /** Supabase URL for realtime features (typing indicators in live chat) */
     supabaseUrl?: string;
     /** Supabase anonymous key for realtime features */
     supabaseAnonKey?: string;
+    /** Initial corner position for the panel (default: "bottom-left") */
+    initialCorner?: PanelCorner;
+    /** Callback when panel corner changes after drag */
+    onCornerChange?: (corner: PanelCorner) => void;
     /** Product backend URL for user authentication (e.g., https://dev.api.rocketalumnisolutions.com) */
     productBackendUrl?: string;
 }
-declare function ChatPanelWithToggle({ onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions, startingQuestionsEndpoint, defaultOpen, isOpen: controlledIsOpen, onOpenChange, userId, orgId, userName, userEmail, userOrganization, supabaseUrl, supabaseAnonKey, productBackendUrl, }: ChatPanelWithToggleProps): react_jsx_runtime.JSX.Element;
+declare function ChatPanelWithToggle({ onNavigate, onActionComplete, currentPage, agentUrl, startingQuestions, startingQuestionsEndpoint, defaultOpen, isOpen: controlledIsOpen, onOpenChange, userId, orgId, userName, userEmail, supabaseUrl, supabaseAnonKey, initialCorner, onCornerChange, productBackendUrl, }: ChatPanelWithToggleProps): react_jsx_runtime.JSX.Element;
 /**
  * @deprecated Use ChatPanelWithToggle instead for the new side panel UX
  */
@@ -203,7 +209,6 @@ declare function HelpButton({ onClick, className }: HelpButtonProps): react_jsx_
  *
  * const chat = createKiteChat({
  *   userId: 'user-123',
- *   orgId: 'org-456',
  *   agentUrl: 'https://api.example.com',
  *   onNavigate: (page) => router.push(`/${page}`),
  * });
@@ -222,8 +227,8 @@ declare function HelpButton({ onClick, className }: HelpButtonProps): react_jsx_
 interface KiteChatConfig {
     /** Unique identifier for the current user */
     userId: string;
-    /** Organization identifier */
-    orgId: string;
+    /** Organization ID for multi-tenant data isolation */
+    orgId?: string;
     /** Backend agent API URL (defaults to http://localhost:5002) */
     agentUrl?: string;
     /** Current page context for the chat (e.g., 'dashboard', 'settings') */
@@ -242,8 +247,6 @@ interface KiteChatConfig {
     userName?: string;
     /** User's email address (optional - for support agent context) */
     userEmail?: string;
-    /** User's organization/company name (optional - for support agent context) */
-    userOrganization?: string;
     /** Supabase URL for realtime features (typing indicators in live chat) */
     supabaseUrl?: string;
     /** Supabase anonymous key for realtime features */
@@ -269,7 +272,7 @@ interface KiteChatInstance {
     isOpen: () => boolean;
     /** Update the current page context */
     setCurrentPage: (page: string) => void;
-    /** Update configuration (userId, orgId, callbacks, etc.) */
+    /** Update configuration (userId, callbacks, etc.) */
     updateConfig: (config: Partial<KiteChatConfig>) => void;
     /** Check if the widget is currently mounted */
     isMounted: () => boolean;
@@ -287,7 +290,6 @@ interface KiteChatInstance {
  * ```ts
  * const chat = createKiteChat({
  *   userId: 'user-123',
- *   orgId: 'org-456',
  *   onNavigate: (page) => router.push(`/${page}`)
  * });
  *
@@ -297,4 +299,4 @@ interface KiteChatInstance {
  */
 declare function createKiteChat(config: KiteChatConfig): KiteChatInstance;
 
-export { type ActionType as A, ChatPanel as C, HelpButton as H, type KiteChatConfig as K, type NavigationTarget as N, PanelToggle as P, type SettingsTab as S, type KiteChatInstance as a, ChatPanelWithToggle as b, createKiteChat as c, type ChatPanelProps as d, type ChatPanelWithToggleProps as e, type PanelToggleProps as f, type HelpButtonProps as g, type Page as h, type ActionData as i, type StartingQuestion as j };
+export { type ActionType as A, ChatPanel as C, HelpButton as H, type KiteChatConfig as K, type NavigationTarget as N, PanelToggle as P, type SettingsTab as S, type KiteChatInstance as a, ChatPanelWithToggle as b, createKiteChat as c, type ChatPanelProps as d, type ChatPanelWithToggleProps as e, type PanelToggleProps as f, type HelpButtonProps as g, type Page as h, type ActionData as i, type StartingQuestion as j, type PanelCorner as k };