@docyrus/ui-pro-ai-assistant 0.0.8 → 0.0.9

package/dist/index.js

@@ -3,13 +3,14 @@ import { useChat as useChat$1 } from '@ai-sdk/react';
 import { Button } from '@docyrus/ui-pro-shared/components/button';
 import { toast, Toaster } from 'sonner';
 import { Dialog as Dialog$1, DialogContent, DialogTitle, DialogHeader, DialogFooter } from '@docyrus/ui-pro-shared/components/dialog';
-import { DropdownMenu as DropdownMenu$1, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSub as DropdownMenuSub$1, DropdownMenuSubTrigger as DropdownMenuSubTrigger$1, DropdownMenuSubContent as DropdownMenuSubContent$1, DropdownMenuSeparator as DropdownMenuSeparator$1 } from '@docyrus/ui-pro-shared/components/dropdown-menu';
+import { DropdownMenu as DropdownMenu$1, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator as DropdownMenuSeparator$1, DropdownMenuSub as DropdownMenuSub$1, DropdownMenuSubTrigger as DropdownMenuSubTrigger$1, DropdownMenuSubContent as DropdownMenuSubContent$1 } from '@docyrus/ui-pro-shared/components/dropdown-menu';
 import { Textarea } from '@docyrus/ui-pro-shared/components/textarea';
 import { Input } from '@docyrus/ui-pro-shared/components/input';
 import { Tabs as Tabs$1, TabsList as TabsList$1, TabsTrigger as TabsTrigger$1, TabsContent as TabsContent$1 } from '@docyrus/ui-pro-shared/components/tabs';
 import { cn } from '@docyrus/ui-pro-shared/lib/utils';
+import { ScrollArea } from '@docyrus/ui-pro-shared/components/scroll-area';
 import { DefaultChatTransport, lastAssistantMessageIsCompleteWithToolCalls } from 'ai';
-import { PilcrowIcon, Heading1Icon, Heading2Icon, Heading3Icon, SquareIcon, ListIcon, ListOrderedIcon, ChevronDownIcon, Code2Icon, QuoteIcon, LightbulbIcon, Columns3Icon, GripVertical, FileUpIcon, TableIcon, ImageIcon, FilmIcon, AudioLinesIcon, TableOfContentsIcon, RadicalIcon, RectangleVerticalIcon, CalendarIcon, PlusIcon, FileCodeIcon, MinusIcon, ChevronRightIcon, ListTree, PenToolIcon, Link2Icon, FilesIcon, Link, Text, ExternalLink, Unlink, Bold, Italic, Underline, Strikethrough, Code2, MoreHorizontal, ArrowLeftIcon, ArrowRightIcon, Minus, Plus, CircleArrowDown, Minimize2, Trash2, FileUp, Check, Copy, CornerDownLeftIcon, PencilLineIcon, MessageSquareTextIcon, MessagesSquareIcon, ArrowUpIcon, CheckIcon, CaptionsIcon, ZoomInIcon, CircleArrowDownIcon, MoveUpRightIcon, MoreHorizontalIcon, CheckCircle2, FileText, Loader2, XIcon, CornerUpLeftIcon, AlbumIcon, FeatherIcon, ListMinusIcon, ListPlusIcon, ListEnd, Wand, LanguagesIcon, BadgeHelpIcon, X, PenLineIcon, SearchIcon, MusicIcon, CompassIcon, SmileIcon, LeafIcon, ClockIcon, AppleIcon, FlagIcon, StarIcon, DeleteIcon, AlignLeft, AlignCenter, AlignRight, Eye, Pencil, PlusCircle, HelpCircle, Maximize2, Download, FileSpreadsheet, ChevronDown, Search, Globe, CheckCircle, FolderOpen, User, ArrowRight, MapPin, CalendarClock, List, RefreshCw, FilePlus, RotateCcw, AlertTriangle, XCircle, AlertCircle, PencilIcon, TrashIcon, ArrowUpDown, ArrowDownToLine, PenLine, RefreshCwIcon, PaintRoller, MessageSquareText, ArrowLeft, PanelLeft, Edit, RefreshCcw, Code, Brain, Star, Trash, FolderInput, Archive, MessageSquare, NotebookText, CirclePlus, MoreVertical, Sparkles, SlidersHorizontal, FileSearch, Microscope, Ruler, Mic, AudioLines, BrainCircuit, File as File$1, Plug, Inbox, Menu, ChevronRight, LayoutDashboard, Table2, WandSparklesIcon, ArrowUpToLineIcon, BoldIcon, ItalicIcon, UnderlineIcon, StrikethroughIcon, HighlighterIcon, Undo2Icon, Redo2Icon, ArrowDownToLineIcon, AlignLeftIcon, AlignCenterIcon, AlignRightIcon, AlignJustifyIcon, ListOrdered, ListTodoIcon, ListCollapseIcon, Table, Grid3x3Icon, Combine, Ungroup, ArrowUp, ArrowDown, Trash2Icon, LinkIcon, WrapText, OutdentIcon, IndentIcon, EyeIcon, PenIcon } from 'lucide-react';
+import { PilcrowIcon, Heading1Icon, Heading2Icon, Heading3Icon, SquareIcon, ListIcon, ListOrderedIcon, ChevronDownIcon, Code2Icon, QuoteIcon, LightbulbIcon, Columns3Icon, GripVertical, FileUpIcon, TableIcon, ImageIcon, FilmIcon, AudioLinesIcon, TableOfContentsIcon, RadicalIcon, RectangleVerticalIcon, CalendarIcon, PlusIcon, FileCodeIcon, MinusIcon, ChevronRightIcon, ListTree, PenToolIcon, Link2Icon, FilesIcon, Link, Text, ExternalLink, Unlink, Bold, Italic, Underline, Strikethrough, Code2, MoreHorizontal, ArrowLeftIcon, ArrowRightIcon, Minus, Plus, CircleArrowDown, Minimize2, Trash2, FileUp, Check, Copy, CornerDownLeftIcon, PencilLineIcon, MessageSquareTextIcon, MessagesSquareIcon, ArrowUpIcon, CheckIcon, CaptionsIcon, ZoomInIcon, CircleArrowDownIcon, MoveUpRightIcon, MoreHorizontalIcon, CheckCircle2, FileText, Loader2, XIcon, CornerUpLeftIcon, AlbumIcon, FeatherIcon, ListMinusIcon, ListPlusIcon, ListEnd, Wand, LanguagesIcon, BadgeHelpIcon, X, PenLineIcon, SearchIcon, MusicIcon, CompassIcon, SmileIcon, LeafIcon, ClockIcon, AppleIcon, FlagIcon, StarIcon, DeleteIcon, AlignLeft, AlignCenter, AlignRight, Eye, Pencil, PlusCircle, HelpCircle, Maximize2, Download, FileSpreadsheet, ChevronDown, Search, Globe, CheckCircle, FolderOpen, User, ArrowRight, MapPin, CalendarClock, List, RefreshCw, FilePlus, RotateCcw, AlertTriangle, XCircle, AlertCircle, PencilIcon, TrashIcon, ArrowUpDown, ArrowDownToLine, PenLine, RefreshCwIcon, PaintRoller, MessageSquareText, ArrowLeft, Brain, PanelLeft, Edit, RefreshCcw, Code, Star, Trash, FolderInput, Archive, MessageSquare, NotebookText, CirclePlus, MoreVertical, Sparkles, SlidersHorizontal, FileSearch, Microscope, Ruler, Mic, AudioLines, BrainCircuit, File as File$1, Plug, Inbox, Menu, ChevronRight, LayoutDashboard, Table2, WandSparklesIcon, ArrowUpToLineIcon, BoldIcon, ItalicIcon, UnderlineIcon, StrikethroughIcon, HighlighterIcon, Undo2Icon, Redo2Icon, ArrowDownToLineIcon, AlignLeftIcon, AlignCenterIcon, AlignRightIcon, AlignJustifyIcon, ListOrdered, ListTodoIcon, ListCollapseIcon, Table, Grid3x3Icon, Combine, Ungroup, ArrowUp, ArrowDown, Trash2Icon, LinkIcon, WrapText, OutdentIcon, IndentIcon, EyeIcon, PenIcon } from 'lucide-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { AsyncTokenManager, RestApiClient } from '@docyrus/api-client';
 import { TooltipProvider, Tooltip as Tooltip$2, TooltipTrigger as TooltipTrigger$1, TooltipContent as TooltipContent$1 } from '@docyrus/ui-pro-shared/components/tooltip';
@@ -100,7 +101,6 @@ import { BaseTogglePlugin } from '@platejs/toggle';
 import { useFilePicker } from 'use-file-picker';
 import { createPortal } from 'react-dom';
 import { Avatar as Avatar$1, AvatarImage as AvatarImage$1, AvatarFallback as AvatarFallback$1 } from '@docyrus/ui-pro-shared/components/avatar';
-import { ScrollArea } from '@docyrus/ui-pro-shared/components/scroll-area';
 import { Badge } from '@docyrus/ui-pro-shared/components/badge';
 import { Reasoning, ReasoningTrigger, ReasoningContent } from '@docyrus/ui-pro-shared/ai-elements/reasoning';
 import { Spinner as Spinner$1 } from '@docyrus/ui-pro-shared/components/spinner';
@@ -11985,7 +11985,12 @@ var dialogAtomStore = createAtomStore(
   },
   { name: "dialog" }
 );
-var { DialogProvider, useDialogSet, useDialogStore, useDialogValue } = dialogAtomStore;
+var {
+  DialogProvider,
+  useDialogSet,
+  useDialogStore,
+  useDialogValue
+} = dialogAtomStore;
 var dialogContentAtomStore = createAtomStore(
   { fixed: false },
   { name: "dialogContent" }
@@ -22601,7 +22606,7 @@ var AssistantView = ({ ref, ...props }) => {
     {
       className: cn(
         "relative flex flex-col bg-background text-foreground border shadow-sm @container",
-        isFullscreen ? "fixed inset-0 z-[9999] rounded-none h-screen" : "h-full min-h-0 rounded-xl",
+        isFullscreen ? "fixed inset-0 z-[9999] rounded-none h-screen" : "h-full min-h-0 overflow-hidden rounded-xl",
         className
       ),
       "data-render-mode": "inline",
@@ -24688,6 +24693,14 @@ var DocyAssistant = ({
   const currentUserId = configUser?.id || null;
   const [projectSearchQuery, setProjectSearchQuery] = useState("");
   const [isInlineFullscreen, setIsInlineFullscreen] = useState(defaultFullscreen);
+  const [modalAgentSelectorOpen, setModalAgentSelectorOpen] = useState(false);
+  const [modalAgents, setModalAgents] = useState([]);
+  const [modalBaseAgents, setModalBaseAgents] = useState([]);
+  const [modalAgentsLoading, setModalAgentsLoading] = useState(false);
+  const [modalAgentSearch, setModalAgentSearch] = useState("");
+  const [modalSelectedAgent, setModalSelectedAgent] = useState(null);
+  const modalAgentSearchRef = useRef(null);
+  const modalAgentFetchedRef = useRef(false);
   const { isRecording, recognition, handleMicrophoneClick } = useSpeechRecognition({
     enabled: enableMicrophone,
     onTranscript: (transcript) => setInput((prev) => prev + (prev ? " " : "") + transcript),
@@ -24935,6 +24948,44 @@ var DocyAssistant = ({
     uiActions.setActiveTab(0);
     setMessages([]);
   };
+  useEffect(() => {
+    if (!modalAgentSelectorOpen) return;
+    if (modalAgentFetchedRef.current) return;
+    if (!agentSelectorUrl && !baseAgentSelectorUrl) return;
+    modalAgentFetchedRef.current = true;
+    const fetchModalAgents = async () => {
+      setModalAgentsLoading(true);
+      try {
+        const deployedRes = agentSelectorUrl ? await apiClient.get(agentSelectorUrl) : { success: true, data: [] };
+        const baseRes = baseAgentSelectorUrl ? await apiClient.get(baseAgentSelectorUrl) : { success: true, data: [] };
+        if (deployedRes.success) {
+          const raw = Array.isArray(deployedRes.data) ? deployedRes.data : [];
+          setModalAgents(raw.map((d) => ({
+            id: d.deploymentId ?? d.id,
+            name: d.agentName ?? d.name,
+            avatar: d.agentAvatar?.signed_url ?? d.avatar
+          })));
+        }
+        if (baseRes.success) {
+          const rawBase = Array.isArray(baseRes.data) ? baseRes.data : [];
+          setModalBaseAgents(rawBase.map((d) => ({
+            id: d.agentId ?? d.id,
+            name: d.agentName ?? d.name,
+            avatar: d.agentAvatar?.signed_url ?? d.agentAvatar ?? d.avatar
+          })));
+        }
+      } catch {
+      } finally {
+        setModalAgentsLoading(false);
+      }
+    };
+    fetchModalAgents();
+  }, [
+    modalAgentSelectorOpen,
+    agentSelectorUrl,
+    baseAgentSelectorUrl,
+    apiClient
+  ]);
   const handleSendMessage = async (e, options3) => {
     e?.preventDefault();
     if (!input.trim()) return;
@@ -25114,6 +25165,114 @@ var DocyAssistant = ({
     const query = sessionState.searchQuery.toLowerCase();
     return session.title.toLowerCase().includes(query);
   });
+  const modalAllAgents = [...modalAgents, ...modalBaseAgents];
+  const modalActiveAgent = modalSelectedAgent ?? (deploymentId ? modalAgents.find((a) => a.id === deploymentId) : null) ?? (activeAgentId ? modalAllAgents.find((a) => a.id === activeAgentId) : null);
+  const modalFilteredDeployedAgents = modalAgents.filter(
+    (a) => !modalAgentSearch || a.name?.toLowerCase().includes(modalAgentSearch.toLowerCase())
+  );
+  const modalFilteredBaseAgents = modalBaseAgents.filter(
+    (a) => !modalAgentSearch || a.name?.toLowerCase().includes(modalAgentSearch.toLowerCase())
+  );
+  const modalHasAnyAgents = modalFilteredDeployedAgents.length > 0 || modalFilteredBaseAgents.length > 0;
+  const renderModalAgentSelector = () => agentSelectorUrl || baseAgentSelectorUrl ? /* @__PURE__ */ jsxs(
+    DropdownMenu$1,
+    {
+      open: modalAgentSelectorOpen,
+      onOpenChange: (o) => {
+        setModalAgentSelectorOpen(o);
+        if (!o) setModalAgentSearch("");
+      },
+      children: [
+        /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "ghost",
+            className: "h-7 px-2 gap-1 text-sm font-medium text-foreground hover:bg-accent rounded-md flex-1 min-w-0 justify-start",
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "truncate", children: modalActiveAgent?.name ?? (agentDetails?.name ?? title) }),
+              /* @__PURE__ */ jsx(ChevronDown, { className: "w-3 h-3 shrink-0 text-muted-foreground ml-auto" })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ jsxs(
+          DropdownMenuContent,
+          {
+            align: "start",
+            className: "w-64 p-0",
+            onCloseAutoFocus: (e) => e.preventDefault(),
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "p-2 border-b", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+                /* @__PURE__ */ jsx(Search, { className: "absolute left-2 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-muted-foreground pointer-events-none" }),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    ref: modalAgentSearchRef,
+                    value: modalAgentSearch,
+                    onChange: (e) => setModalAgentSearch(e.target.value),
+                    onKeyDown: (e) => e.stopPropagation(),
+                    placeholder: "Search agents...",
+                    className: "h-7 pl-7 text-sm",
+                    autoFocus: true
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ jsx(ScrollArea, { className: "max-h-56", children: modalAgentsLoading ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-4", children: /* @__PURE__ */ jsx(Loader2, { className: "w-4 h-4 animate-spin text-muted-foreground" }) }) : !modalHasAnyAgents ? /* @__PURE__ */ jsx("div", { className: "py-4 text-center text-xs text-muted-foreground", children: "No agents found" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                modalFilteredBaseAgents.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx("div", { className: "px-3 py-1.5 text-xs font-medium text-muted-foreground", children: "Base Agents" }),
+                  modalFilteredBaseAgents.map((agent) => /* @__PURE__ */ jsxs(
+                    DropdownMenuItem,
+                    {
+                      className: "cursor-pointer gap-2 px-3 py-2",
+                      onClick: () => {
+                        setModalSelectedAgent(agent);
+                        setModalAgentSelectorOpen(false);
+                        setModalAgentSearch("");
+                        localStorage.setItem(agentStorageKey, agent.id);
+                        localStorage.removeItem(deploymentStorageKey);
+                        setActiveAgentId(agent.id);
+                        setDeploymentId(void 0);
+                        createNewThread();
+                        onAgentChange?.(agent.id, "base");
+                      },
+                      children: [
+                        /* @__PURE__ */ jsx("div", { className: "w-5 h-5 rounded-full shrink-0 bg-muted flex items-center justify-center", children: /* @__PURE__ */ jsx(Brain, { className: "w-3 h-3 text-muted-foreground" }) }),
+                        /* @__PURE__ */ jsx("span", { className: "truncate text-sm", children: agent.name })
+                      ]
+                    },
+                    agent.id
+                  ))
+                ] }),
+                modalFilteredDeployedAgents.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+                  modalFilteredBaseAgents.length > 0 && /* @__PURE__ */ jsx(DropdownMenuSeparator$1, {}),
+                  /* @__PURE__ */ jsx("div", { className: "px-3 py-1.5 text-xs font-medium text-muted-foreground", children: "Deployed Agents" }),
+                  modalFilteredDeployedAgents.map((agent) => /* @__PURE__ */ jsxs(
+                    DropdownMenuItem,
+                    {
+                      className: "cursor-pointer gap-2 px-3 py-2",
+                      onClick: () => {
+                        setModalSelectedAgent(agent);
+                        setModalAgentSelectorOpen(false);
+                        setModalAgentSearch("");
+                        localStorage.setItem(deploymentStorageKey, agent.id);
+                        setDeploymentId(agent.id);
+                        createNewThread();
+                        onAgentChange?.(agent.id, "deployment");
+                      },
+                      children: [
+                        /* @__PURE__ */ jsx("div", { className: "w-5 h-5 rounded-full shrink-0 bg-muted flex items-center justify-center", children: /* @__PURE__ */ jsx(Brain, { className: "w-3 h-3 text-muted-foreground" }) }),
+                        /* @__PURE__ */ jsx("span", { className: "truncate text-sm", children: agent.name })
+                      ]
+                    },
+                    agent.id
+                  ))
+                ] })
+              ] }) })
+            ]
+          }
+        )
+      ]
+    }
+  ) : /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground truncate flex-1 px-2", children: agentDetails?.name ?? title });
   const renderSidebarContent = () => /* @__PURE__ */ jsx(
     SidebarContent,
     {
@@ -25612,7 +25771,7 @@ var DocyAssistant = ({
                 "div",
                 {
                   className: cn(
-                    "absolute left-0 top-0 h-full w-72 rounded-lg z-100 shadow-xl",
+                    "absolute left-0 top-0 h-full w-72 bg-background border-r rounded-lg z-100 shadow-xl overflow-hidden",
                     // Show floating sidebar when container is smaller than 3xl
                     "@3xl:hidden"
                   ),
@@ -25632,17 +25791,34 @@ var DocyAssistant = ({
                     }
                   },
                   children: /* @__PURE__ */ jsxs("div", { className: "w-full h-full flex flex-col", children: [
-                    /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end h-10 px-2 border-b", children: /* @__PURE__ */ jsx(
-                      Button,
-                      {
-                        variant: "ghost",
-                        size: "icon",
-                        onClick: () => uiActions.setSidebarOpen(false),
-                        className: "h-8 w-8 text-muted-foreground hover:text-foreground",
-                        children: /* @__PURE__ */ jsx(X, { className: "w-4 h-4" })
-                      }
-                    ) }),
-                    /* @__PURE__ */ jsx("div", { className: "flex-1 p-4 flex flex-col min-h-0", children: renderSidebarContent() })
+                    /* @__PURE__ */ jsxs("div", { className: "flex-none flex items-center gap-1 px-2 py-2 border-b bg-background", children: [
+                      renderModalAgentSelector(),
+                      /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          variant: "ghost",
+                          size: "icon",
+                          onClick: () => uiActions.setActiveTab(uiState.activeTab === 4 ? 0 : 4),
+                          className: cn(
+                            "h-7 w-7 shrink-0 text-muted-foreground hover:bg-accent hover:text-accent-foreground rounded-md",
+                            uiState.activeTab === 4 && "bg-accent text-accent-foreground"
+                          ),
+                          title: t("tabs.memories"),
+                          children: /* @__PURE__ */ jsx(Brain, { className: "w-4 h-4" })
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          variant: "ghost",
+                          size: "icon",
+                          onClick: () => uiActions.setSidebarOpen(false),
+                          className: "h-7 w-7 shrink-0 text-muted-foreground hover:bg-accent hover:text-accent-foreground rounded-md",
+                          children: /* @__PURE__ */ jsx(X, { className: "w-4 h-4" })
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsx("div", { className: "flex-1 p-4 flex flex-col min-h-0 overflow-hidden", children: renderSidebarContent() })
                   ] })
                 }
               )
@@ -25712,12 +25888,31 @@ var DocyAssistant = ({
                 "div",
                 {
                   className: cn(
-                    "relative flex-none transition-all duration-300",
+                    "relative flex-none bg-background border-r transition-all duration-300",
                     // Show inline sidebar when container is 3xl or larger (48rem/768px)
-                    "hidden @3xl:block",
+                    "hidden @3xl:flex @3xl:flex-col",
                     uiState.isSidebarOpen ? "w-72" : "w-0 overflow-hidden"
                   ),
-                  children: /* @__PURE__ */ jsx("div", { className: "w-72 h-full flex flex-col", children: /* @__PURE__ */ jsx("div", { className: "flex-1 p-4 flex flex-col min-h-0", children: renderSidebarContent() }) })
+                  children: /* @__PURE__ */ jsxs("div", { className: "w-72 h-full flex flex-col overflow-hidden", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex-none flex items-center gap-1 px-2 py-2 border-b bg-background", children: [
+                      renderModalAgentSelector(),
+                      /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          variant: "ghost",
+                          size: "icon",
+                          onClick: () => uiActions.setActiveTab(uiState.activeTab === 4 ? 0 : 4),
+                          className: cn(
+                            "h-7 w-7 shrink-0 text-muted-foreground hover:bg-accent hover:text-accent-foreground rounded-md",
+                            uiState.activeTab === 4 && "bg-accent text-accent-foreground"
+                          ),
+                          title: t("tabs.memories"),
+                          children: /* @__PURE__ */ jsx(Brain, { className: "w-4 h-4" })
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsx("div", { className: "flex-1 p-4 flex flex-col min-h-0 overflow-hidden", children: renderSidebarContent() })
+                  ] })
                 }
               ),
               /* @__PURE__ */ jsx("div", { className: cn("flex-1 flex flex-col bg-background", uiState.isDocked ? "min-w-0" : "min-w-96"), children: uiState.activeTab === 1 ? /* @__PURE__ */ jsx(