@xpert-ai/chatkit-ui 0.0.2 → 0.0.4

package/dist/index.js

@@ -1,5 +1,6 @@
 // src/components/chat.tsx
 import * as React17 from "react";
+import { FileText as FileText2, Pencil as Pencil3, X as X2 } from "lucide-react";
 
 // src/lib/utils.ts
 import { clsx } from "clsx";
@@ -66,6 +67,10 @@ function useParentMessenger({ onSetOptions } = {}) {
   useEffect(() => {
     parentOriginRef.current = getParentOrigin();
   }, []);
+  const onSetOptionsRef = useRef(onSetOptions);
+  useEffect(() => {
+    onSetOptionsRef.current = onSetOptions;
+  }, [onSetOptions]);
   useEffect(() => {
     if (!isParentAvailable) return;
     const sendResponse = (nonce, response, error) => {
@@ -98,8 +103,8 @@ function useParentMessenger({ onSetOptions } = {}) {
         return;
       }
       if (payload.type == "command" && payload.command === "onSetOptions") {
-        if (onSetOptions) {
-          onSetOptions(payload.data);
+        if (onSetOptionsRef.current) {
+          onSetOptionsRef.current(payload.data);
         }
         if (payload.nonce) {
           sendResponse(payload.nonce, { ok: true });
@@ -180,35 +185,72 @@ var useStreamContext = () => {
 
 // src/components/composer/ComposerMenu.tsx
 import * as React4 from "react";
+import {
+  FileText,
+  Globe,
+  Images,
+  Lightbulb,
+  Paperclip,
+  Pencil,
+  Plus,
+  Search,
+  SlidersHorizontal,
+  Sparkles
+} from "lucide-react";
 
 // src/components/ui/button.tsx
-import * as React2 from "react";
+import "react";
+import { cva } from "class-variance-authority";
+import { Slot } from "@radix-ui/react-slot";
 import { jsx as jsx2 } from "react/jsx-runtime";
-var base = "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 ring-offset-background";
-var variants = {
-  default: "bg-primary text-primary-foreground hover:bg-primary/90",
-  secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-  ghost: "hover:bg-accent hover:text-accent-foreground"
-};
-var sizes = {
-  default: "h-10 px-4 py-2",
-  sm: "h-9 rounded-md px-3",
-  icon: "h-10 w-10"
-};
-var Button = React2.forwardRef(
-  ({ className, variant = "default", size = "default", type, ...props }, ref) => {
-    return /* @__PURE__ */ jsx2(
-      "button",
-      {
-        ref,
-        type: type ?? "button",
-        className: cn(base, variants[variant], sizes[size], className),
-        ...props
+var buttonVariants = cva(
+  "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-md border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] aria-invalid:ring-[3px] [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/80",
+        outline: "border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground shadow-xs",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
+        ghost: "hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground",
+        destructive: "bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-9 gap-1.5 px-2.5 in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+        xs: "h-6 gap-1 rounded-[min(var(--radius-md),8px)] px-2 text-xs in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+        sm: "h-8 gap-1 rounded-[min(var(--radius-md),10px)] px-2.5 in-data-[slot=button-group]:rounded-md has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5",
+        lg: "h-10 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3",
+        icon: "size-9",
+        "icon-xs": "size-6 rounded-[min(var(--radius-md),8px)] in-data-[slot=button-group]:rounded-md [&_svg:not([class*='size-'])]:size-3",
+        "icon-sm": "size-8 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-md",
+        "icon-lg": "size-10"
       }
-    );
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
   }
 );
-Button.displayName = "Button";
+function Button({
+  className,
+  variant = "default",
+  size = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx2(
+    Comp,
+    {
+      "data-slot": "button",
+      "data-variant": variant,
+      "data-size": size,
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }
+  );
+}
 
 // src/components/ui/popover.tsx
 import "react";
@@ -429,56 +471,18 @@ function useChatkitTranslation() {
 import { Fragment, jsx as jsx4, jsxs } from "react/jsx-runtime";
 function getIconComponent(icon) {
   const iconMap = {
-    "plus": /* @__PURE__ */ jsx4("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx4("path", { d: "M5 12h14M12 5v14" }) }),
-    "document": /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx4("path", { d: "M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z" }),
-      /* @__PURE__ */ jsx4("polyline", { points: "14 2 14 8 20 8" })
-    ] }),
-    "write": /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx4("path", { d: "M12 20h9" }),
-      /* @__PURE__ */ jsx4("path", { d: "M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z" })
-    ] }),
-    "sparkle": /* @__PURE__ */ jsx4("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx4("path", { d: "M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z" }) }),
-    "lightbulb": /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx4("path", { d: "M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5" }),
-      /* @__PURE__ */ jsx4("path", { d: "M9 18h6" }),
-      /* @__PURE__ */ jsx4("path", { d: "M10 22h4" })
-    ] }),
-    "settings-slider": /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx4("line", { x1: "4", x2: "4", y1: "21", y2: "14" }),
-      /* @__PURE__ */ jsx4("line", { x1: "4", x2: "4", y1: "10", y2: "3" }),
-      /* @__PURE__ */ jsx4("line", { x1: "12", x2: "12", y1: "21", y2: "12" }),
-      /* @__PURE__ */ jsx4("line", { x1: "12", x2: "12", y1: "8", y2: "3" }),
-      /* @__PURE__ */ jsx4("line", { x1: "20", x2: "20", y1: "21", y2: "16" }),
-      /* @__PURE__ */ jsx4("line", { x1: "20", x2: "20", y1: "12", y2: "3" }),
-      /* @__PURE__ */ jsx4("line", { x1: "2", x2: "6", y1: "14", y2: "14" }),
-      /* @__PURE__ */ jsx4("line", { x1: "10", x2: "14", y1: "8", y2: "8" }),
-      /* @__PURE__ */ jsx4("line", { x1: "18", x2: "22", y1: "16", y2: "16" })
-    ] }),
-    "search": /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx4("circle", { cx: "11", cy: "11", r: "8" }),
-      /* @__PURE__ */ jsx4("path", { d: "m21 21-4.3-4.3" })
-    ] }),
-    "globe": /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "12", r: "10" }),
-      /* @__PURE__ */ jsx4("line", { x1: "2", x2: "22", y1: "12", y2: "12" }),
-      /* @__PURE__ */ jsx4("path", { d: "M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" })
-    ] }),
-    "images": /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx4("path", { d: "M18 22H4a2 2 0 0 1-2-2V6" }),
-      /* @__PURE__ */ jsx4("path", { d: "m22 13-1.296-1.296a2.41 2.41 0 0 0-3.408 0L11 18" }),
-      /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "8", r: "2" }),
-      /* @__PURE__ */ jsx4("rect", { width: "16", height: "16", x: "6", y: "2", rx: "2" })
-    ] })
+    "plus": /* @__PURE__ */ jsx4(Plus, { size: 16 }),
+    "document": /* @__PURE__ */ jsx4(FileText, { size: 16 }),
+    "write": /* @__PURE__ */ jsx4(Pencil, { size: 16 }),
+    "sparkle": /* @__PURE__ */ jsx4(Sparkles, { size: 16 }),
+    "lightbulb": /* @__PURE__ */ jsx4(Lightbulb, { size: 16 }),
+    "settings-slider": /* @__PURE__ */ jsx4(SlidersHorizontal, { size: 16 }),
+    "search": /* @__PURE__ */ jsx4(Search, { size: 16 }),
+    "globe": /* @__PURE__ */ jsx4(Globe, { size: 16 }),
+    "images": /* @__PURE__ */ jsx4(Images, { size: 16 })
   };
   return iconMap[icon] || iconMap["sparkle"];
 }
-function PaperclipIcon() {
-  return /* @__PURE__ */ jsx4("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx4("path", { d: "m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48" }) });
-}
-function PlusIcon() {
-  return /* @__PURE__ */ jsx4("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx4("path", { d: "M5 12h14M12 5v14" }) });
-}
 function ComposerMenu({
   composer,
   onAttachmentClick,
@@ -514,7 +518,7 @@ function ComposerMenu({
           open && "bg-muted"
         ),
         children: [
-          /* @__PURE__ */ jsx4(PlusIcon, {}),
+          /* @__PURE__ */ jsx4(Plus, { size: 18 }),
           /* @__PURE__ */ jsx4("span", { className: "sr-only", children: t("composer.openMenu") })
         ]
       }
@@ -534,7 +538,7 @@ function ComposerMenu({
                 onClick: handleAttachmentClick,
                 className: "flex items-center gap-3 rounded-md px-3 py-2 text-sm hover:bg-muted transition-colors",
                 children: [
-                  /* @__PURE__ */ jsx4("span", { className: "flex h-6 w-6 items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsx4(PaperclipIcon, {}) }),
+                  /* @__PURE__ */ jsx4("span", { className: "flex h-6 w-6 items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsx4(Paperclip, { size: 16 }) }),
                   /* @__PURE__ */ jsx4("span", { children: t("composer.addAttachment") })
                 ]
               }
@@ -565,37 +569,8 @@ function ComposerMenu({
 
 // src/components/composer/SendButton.tsx
 import "react";
+import { ArrowUp, Square } from "lucide-react";
 import { jsx as jsx5 } from "react/jsx-runtime";
-function ArrowUpIcon() {
-  return /* @__PURE__ */ jsx5(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "18",
-      height: "18",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2.5",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx5("path", { d: "M12 19V5M5 12l7-7 7 7" })
-    }
-  );
-}
-function StopIcon() {
-  return /* @__PURE__ */ jsx5(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "14",
-      height: "14",
-      viewBox: "0 0 24 24",
-      fill: "currentColor",
-      children: /* @__PURE__ */ jsx5("rect", { x: "4", y: "4", width: "16", height: "16", rx: "2" })
-    }
-  );
-}
 function SendButton({
   disabled = false,
   isLoading = false,
@@ -610,13 +585,13 @@ function SendButton({
         type: "button",
         onClick: onStop,
         className: cn(
-          "flex h-9 w-9 shrink-0 items-center justify-center rounded-full",
-          "bg-foreground text-background",
+          "flex h-9 w-9 shrink-0 items-center justify-center rounded-full cursor-pointer",
+          "bg-primary text-background",
           "transition-transform duration-150 ease-out",
           "hover:scale-105 active:scale-95"
         ),
         "aria-label": stopLabel,
-        children: /* @__PURE__ */ jsx5(StopIcon, {})
+        children: /* @__PURE__ */ jsx5(Square, { size: 14, fill: "currentColor", stroke: "currentColor", strokeWidth: 0 })
       }
     );
   }
@@ -626,20 +601,21 @@ function SendButton({
       type: "submit",
       disabled,
       className: cn(
-        "flex h-9 w-9 shrink-0 items-center justify-center rounded-full",
-        "bg-foreground text-background",
+        "flex h-9 w-9 shrink-0 items-center justify-center rounded-full cursor-pointer",
+        "bg-primary text-background",
         "transition-all duration-150 ease-out",
         "hover:scale-105 active:scale-95",
         "disabled:opacity-40 disabled:cursor-not-allowed disabled:hover:scale-100"
       ),
       "aria-label": sendLabel,
-      children: /* @__PURE__ */ jsx5(ArrowUpIcon, {})
+      children: /* @__PURE__ */ jsx5(ArrowUp, { size: 18, strokeWidth: 2.5 })
     }
   );
 }
 
 // src/components/history/HistorySidebar.tsx
 import * as React8 from "react";
+import { History, MessageSquare, PlusCircle, Trash2 } from "lucide-react";
 
 // src/components/ui/scroll-area.tsx
 import * as React6 from "react";
@@ -678,6 +654,7 @@ ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 
 // src/components/ui/sheet.tsx
 import "react";
+import { X } from "lucide-react";
 import * as SheetPrimitive from "@radix-ui/react-dialog";
 import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
 function Sheet({ ...props }) {
@@ -731,21 +708,7 @@ function SheetContent({
         children: [
           children,
           /* @__PURE__ */ jsxs3(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
-            /* @__PURE__ */ jsx7(
-              "svg",
-              {
-                xmlns: "http://www.w3.org/2000/svg",
-                width: "16",
-                height: "16",
-                viewBox: "0 0 24 24",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                children: /* @__PURE__ */ jsx7("path", { d: "M18 6 6 18M6 6l12 12" })
-              }
-            ),
+            /* @__PURE__ */ jsx7(X, { size: 16 }),
             /* @__PURE__ */ jsx7("span", { className: "sr-only", children: t("sheet.close") })
           ] })
         ]
@@ -783,85 +746,6 @@ function SheetTitle({
 
 // src/components/history/HistorySidebar.tsx
 import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
-function HistoryIcon() {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "18",
-      height: "18",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx8("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
-        /* @__PURE__ */ jsx8("path", { d: "M3 3v5h5" }),
-        /* @__PURE__ */ jsx8("path", { d: "M12 7v5l4 2" })
-      ]
-    }
-  );
-}
-function PlusCircleIcon() {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "16",
-      height: "16",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx8("circle", { cx: "12", cy: "12", r: "10" }),
-        /* @__PURE__ */ jsx8("path", { d: "M8 12h8M12 8v8" })
-      ]
-    }
-  );
-}
-function MessageIcon() {
-  return /* @__PURE__ */ jsx8(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "16",
-      height: "16",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx8("path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" })
-    }
-  );
-}
-function TrashIcon() {
-  return /* @__PURE__ */ jsxs4(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "14",
-      height: "14",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx8("path", { d: "M3 6h18" }),
-        /* @__PURE__ */ jsx8("path", { d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6" }),
-        /* @__PURE__ */ jsx8("path", { d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2" })
-      ]
-    }
-  );
-}
 function HistorySidebar({
   conversations = [],
   currentConversationId,
@@ -888,9 +772,9 @@ function HistorySidebar({
         variant: "ghost",
         size: "icon",
         disabled,
-        className: "h-8 w-8",
+        className: "h-8 w-8 cursor-pointer",
         children: [
-          /* @__PURE__ */ jsx8(HistoryIcon, {}),
+          /* @__PURE__ */ jsx8(History, { size: 18 }),
           /* @__PURE__ */ jsx8("span", { className: "sr-only", children: t("history.conversationHistory") })
         ]
       }
@@ -904,7 +788,7 @@ function HistorySidebar({
           className: "w-full justify-start gap-2",
           variant: "secondary",
           children: [
-            /* @__PURE__ */ jsx8(PlusCircleIcon, {}),
+            /* @__PURE__ */ jsx8(PlusCircle, { size: 16 }),
             t("history.newChat")
           ]
         }
@@ -919,7 +803,7 @@ function HistorySidebar({
           ),
           onClick: () => handleSelectConversation(conversation.id),
           children: [
-            /* @__PURE__ */ jsx8("span", { className: "text-muted-foreground", children: /* @__PURE__ */ jsx8(MessageIcon, {}) }),
+            /* @__PURE__ */ jsx8("span", { className: "text-muted-foreground", children: /* @__PURE__ */ jsx8(MessageSquare, { size: 16 }) }),
             /* @__PURE__ */ jsx8("span", { className: "flex-1 truncate", children: conversation.title }),
             showDelete && onDeleteConversation && /* @__PURE__ */ jsx8(
               "button",
@@ -930,7 +814,7 @@ function HistorySidebar({
                   onDeleteConversation(conversation.id);
                 },
                 className: "opacity-0 group-hover:opacity-100 p-1 rounded hover:bg-destructive/10 hover:text-destructive transition-all",
-                children: /* @__PURE__ */ jsx8(TrashIcon, {})
+                children: /* @__PURE__ */ jsx8(Trash2, { size: 14 })
               }
             )
           ]
@@ -947,15 +831,15 @@ import "react";
 // src/components/ui/badge.tsx
 import * as React9 from "react";
 import { jsx as jsx9 } from "react/jsx-runtime";
-var base2 = "inline-flex items-center rounded-full border border-transparent px-2.5 py-0.5 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 ring-offset-background";
-var variants2 = {
+var base = "inline-flex items-center rounded-full border border-transparent px-2.5 py-0.5 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 ring-offset-background";
+var variants = {
   default: "bg-primary text-primary-foreground",
   secondary: "bg-secondary text-secondary-foreground",
   outline: "border-input text-foreground"
 };
 var Badge = React9.forwardRef(
   ({ className, variant = "default", ...props }, ref) => {
-    return /* @__PURE__ */ jsx9("span", { ref, className: cn(base2, variants2[variant], className), ...props });
+    return /* @__PURE__ */ jsx9("span", { ref, className: cn(base, variants[variant], className), ...props });
   }
 );
 Badge.displayName = "Badge";
@@ -1124,7 +1008,7 @@ var SyntaxHighlighter = ({
 };
 
 // src/components/thread/tooltip-icon-button.tsx
-import { forwardRef as forwardRef6 } from "react";
+import { forwardRef as forwardRef5 } from "react";
 
 // src/components/ui/tooltip.tsx
 import "react";
@@ -1191,7 +1075,7 @@ function TooltipContent({
 
 // src/components/thread/tooltip-icon-button.tsx
 import { jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime";
-var TooltipIconButton = forwardRef6(({ children, tooltip, side = "bottom", className, ...rest }, ref) => {
+var TooltipIconButton = forwardRef5(({ children, tooltip, side = "bottom", className, ...rest }, ref) => {
   return /* @__PURE__ */ jsx14(TooltipProvider, { children: /* @__PURE__ */ jsxs6(Tooltip, { children: [
     /* @__PURE__ */ jsx14(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs6(
       Button,
@@ -1639,66 +1523,8 @@ function AssistantMessage({ message, className, isStreaming = false }) {
 
 // src/components/thread/MessageActions.tsx
 import * as React14 from "react";
+import { Check, Copy, RefreshCw } from "lucide-react";
 import { jsx as jsx18, jsxs as jsxs9 } from "react/jsx-runtime";
-function CopyIcon2() {
-  return /* @__PURE__ */ jsxs9(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "14",
-      height: "14",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx18("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
-        /* @__PURE__ */ jsx18("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
-      ]
-    }
-  );
-}
-function CheckIcon2() {
-  return /* @__PURE__ */ jsx18(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "14",
-      height: "14",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx18("path", { d: "M20 6 9 17l-5-5" })
-    }
-  );
-}
-function RetryIcon() {
-  return /* @__PURE__ */ jsxs9(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "14",
-      height: "14",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx18("path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8" }),
-        /* @__PURE__ */ jsx18("path", { d: "M21 3v5h-5" }),
-        /* @__PURE__ */ jsx18("path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16" }),
-        /* @__PURE__ */ jsx18("path", { d: "M8 16H3v5" })
-      ]
-    }
-  );
-}
 function MessageActions({
   content,
   isAssistant = false,
@@ -1738,7 +1564,7 @@ function MessageActions({
               copied && "text-green-500"
             ),
             title: copied ? t("messageActions.copied") : t("messageActions.copy"),
-            children: copied ? /* @__PURE__ */ jsx18(CheckIcon2, {}) : /* @__PURE__ */ jsx18(CopyIcon2, {})
+            children: copied ? /* @__PURE__ */ jsx18(Check, { size: 14 }) : /* @__PURE__ */ jsx18(Copy, { size: 14 })
           }
         ),
         isAssistant && onRetry && /* @__PURE__ */ jsx18(
@@ -1748,7 +1574,7 @@ function MessageActions({
             onClick: onRetry,
             className: "p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-muted transition-colors",
             title: t("messageActions.regenerate"),
-            children: /* @__PURE__ */ jsx18(RetryIcon, {})
+            children: /* @__PURE__ */ jsx18(RefreshCw, { size: 14 })
           }
         )
       ]
@@ -1758,42 +1584,29 @@ function MessageActions({
 
 // src/components/thread/StartScreen.tsx
 import "react";
+import {
+  BookOpen,
+  Compass,
+  Globe as Globe2,
+  HelpCircle,
+  Lightbulb as Lightbulb2,
+  Pencil as Pencil2,
+  Search as Search2,
+  Sparkles as Sparkles2,
+  Zap
+} from "lucide-react";
 import { jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
 function getIconComponent2(icon) {
   const iconMap = {
-    "circle-question": /* @__PURE__ */ jsxs10("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx19("circle", { cx: "12", cy: "12", r: "10" }),
-      /* @__PURE__ */ jsx19("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }),
-      /* @__PURE__ */ jsx19("path", { d: "M12 17h.01" })
-    ] }),
-    "lightbulb": /* @__PURE__ */ jsxs10("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx19("path", { d: "M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5" }),
-      /* @__PURE__ */ jsx19("path", { d: "M9 18h6" }),
-      /* @__PURE__ */ jsx19("path", { d: "M10 22h4" })
-    ] }),
-    "sparkle": /* @__PURE__ */ jsx19("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx19("path", { d: "M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z" }) }),
-    "write": /* @__PURE__ */ jsxs10("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx19("path", { d: "M12 20h9" }),
-      /* @__PURE__ */ jsx19("path", { d: "M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z" })
-    ] }),
-    "search": /* @__PURE__ */ jsxs10("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx19("circle", { cx: "11", cy: "11", r: "8" }),
-      /* @__PURE__ */ jsx19("path", { d: "m21 21-4.3-4.3" })
-    ] }),
-    "globe": /* @__PURE__ */ jsxs10("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx19("circle", { cx: "12", cy: "12", r: "10" }),
-      /* @__PURE__ */ jsx19("line", { x1: "2", x2: "22", y1: "12", y2: "12" }),
-      /* @__PURE__ */ jsx19("path", { d: "M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" })
-    ] }),
-    "book-open": /* @__PURE__ */ jsxs10("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx19("path", { d: "M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z" }),
-      /* @__PURE__ */ jsx19("path", { d: "M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z" })
-    ] }),
-    "compass": /* @__PURE__ */ jsxs10("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-      /* @__PURE__ */ jsx19("circle", { cx: "12", cy: "12", r: "10" }),
-      /* @__PURE__ */ jsx19("polygon", { points: "16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76" })
-    ] }),
-    "bolt": /* @__PURE__ */ jsx19("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx19("path", { d: "M13 2 3 14h9l-1 8 10-12h-9l1-8z" }) })
+    "circle-question": /* @__PURE__ */ jsx19(HelpCircle, { size: 20 }),
+    "lightbulb": /* @__PURE__ */ jsx19(Lightbulb2, { size: 20 }),
+    "sparkle": /* @__PURE__ */ jsx19(Sparkles2, { size: 20 }),
+    "write": /* @__PURE__ */ jsx19(Pencil2, { size: 20 }),
+    "search": /* @__PURE__ */ jsx19(Search2, { size: 20 }),
+    "globe": /* @__PURE__ */ jsx19(Globe2, { size: 20 }),
+    "book-open": /* @__PURE__ */ jsx19(BookOpen, { size: 20 }),
+    "compass": /* @__PURE__ */ jsx19(Compass, { size: 20 }),
+    "bolt": /* @__PURE__ */ jsx19(Zap, { size: 20 })
   };
   return icon ? iconMap[icon] || iconMap["sparkle"] : iconMap["sparkle"];
 }
@@ -1853,7 +1666,7 @@ var sortConversations = (conversations) => {
   });
 };
 function useThreads(limit = DEFAULT_LIMIT) {
-  const { client, threadId } = useStreamContext();
+  const { client, threadId, assistantId, isReady } = useStreamContext();
   const [conversationsState, setConversationsState] = React16.useState([]);
   const [isLoading, setIsLoading] = React16.useState(false);
   const [error, setError] = React16.useState(null);
@@ -1868,6 +1681,7 @@ function useThreads(limit = DEFAULT_LIMIT) {
     setError(null);
     try {
       const { items } = await client.conversations.search({
+        where: { xpertId: assistantId },
         limit,
         order: { updatedAt: "DESC" }
       });
@@ -1878,7 +1692,7 @@ function useThreads(limit = DEFAULT_LIMIT) {
     } finally {
       setIsLoading(false);
     }
-  }, [client, limit]);
+  }, [client, limit, assistantId]);
   const createConversation = React16.useCallback(
     async (input) => {
       setError(null);
@@ -1911,9 +1725,11 @@ function useThreads(limit = DEFAULT_LIMIT) {
     [client]
   );
   React16.useEffect(() => {
+    if (!isReady) return;
     void refreshConversations();
-  }, [refreshConversations]);
+  }, [refreshConversations, isReady]);
   React16.useEffect(() => {
+    if (!isReady) return;
     if (!threadId) return;
     if (conversationsState.some((item) => item.threadId === threadId)) return;
     void client.conversations.search({ where: { threadId }, limit: 1 }).then((result) => {
@@ -1922,7 +1738,7 @@ function useThreads(limit = DEFAULT_LIMIT) {
     }).catch((err) => {
       setError(err);
     });
-  }, [client, threadId, conversationsState, upsertConversation]);
+  }, [client, threadId, conversationsState, upsertConversation, isReady]);
   const conversations = React16.useMemo(
     () => conversationsState.map((conversation) => toConversation(conversation)),
     [conversationsState]
@@ -2292,7 +2108,7 @@ function Chat({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between border-b bg-muted/30 px-6 py-4", children: [
+        /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between border-b bg-muted/30 px-6 py-2", children: [
           /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-3", children: [
             /* @__PURE__ */ jsx20("div", { className: "h-2 w-2 rounded-full bg-green-500" }),
             /* @__PURE__ */ jsxs11("div", { children: [
@@ -2308,30 +2124,13 @@ function Chat({
                 onClick: handleNewConversation,
                 disabled: missingConfig || stream.isLoading || isHistoryLoading,
                 className: cn(
-                  "flex h-9 w-9 items-center justify-center rounded-md",
+                  "flex h-8 w-8 cursor-pointer items-center justify-center rounded-md",
                   "text-muted-foreground hover:text-foreground hover:bg-muted",
                   "transition-colors duration-150",
                   "disabled:opacity-50 disabled:cursor-not-allowed"
                 ),
                 title: t("history.newConversation"),
-                children: /* @__PURE__ */ jsxs11(
-                  "svg",
-                  {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    width: "18",
-                    height: "18",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: [
-                      /* @__PURE__ */ jsx20("path", { d: "M12 20h9" }),
-                      /* @__PURE__ */ jsx20("path", { d: "M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z" })
-                    ]
-                  }
-                )
+                children: /* @__PURE__ */ jsx20(Pencil3, { size: 16 })
               }
             ),
             /* @__PURE__ */ jsx20(
@@ -2446,25 +2245,7 @@ function Chat({
             {
               className: "flex items-center gap-2 rounded-md bg-muted px-2 py-1 text-sm",
               children: [
-                /* @__PURE__ */ jsxs11(
-                  "svg",
-                  {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    width: "14",
-                    height: "14",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    className: "text-muted-foreground",
-                    children: [
-                      /* @__PURE__ */ jsx20("path", { d: "M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z" }),
-                      /* @__PURE__ */ jsx20("polyline", { points: "14 2 14 8 20 8" })
-                    ]
-                  }
-                ),
+                /* @__PURE__ */ jsx20(FileText2, { size: 14, className: "text-muted-foreground" }),
                 /* @__PURE__ */ jsx20("span", { className: "max-w-[120px] truncate", children: file.name }),
                 /* @__PURE__ */ jsx20(
                   "button",
@@ -2472,21 +2253,7 @@ function Chat({
                     type: "button",
                     onClick: () => handleRemoveAttachment(index),
                     className: "ml-1 rounded-full p-0.5 hover:bg-muted-foreground/20",
-                    children: /* @__PURE__ */ jsx20(
-                      "svg",
-                      {
-                        xmlns: "http://www.w3.org/2000/svg",
-                        width: "12",
-                        height: "12",
-                        viewBox: "0 0 24 24",
-                        fill: "none",
-                        stroke: "currentColor",
-                        strokeWidth: "2",
-                        strokeLinecap: "round",
-                        strokeLinejoin: "round",
-                        children: /* @__PURE__ */ jsx20("path", { d: "M18 6 6 18M6 6l12 12" })
-                      }
-                    )
+                    children: /* @__PURE__ */ jsx20(X2, { size: 12 })
                   }
                 )
               ]
@@ -2501,21 +2268,7 @@ function Chat({
                 type: "button",
                 onClick: () => setSelectedTool(null),
                 className: "rounded-full p-0.5 text-muted-foreground hover:bg-muted",
-                children: /* @__PURE__ */ jsx20(
-                  "svg",
-                  {
-                    xmlns: "http://www.w3.org/2000/svg",
-                    width: "12",
-                    height: "12",
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    strokeWidth: "2",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    children: /* @__PURE__ */ jsx20("path", { d: "M18 6 6 18M6 6l12 12" })
-                  }
-                )
+                children: /* @__PURE__ */ jsx20(X2, { size: 12 })
               }
             )
           ] }),