@docyrus/ui-pro-ai-assistant 0.2.5 → 0.2.7

package/dist/index.js

@@ -9,7 +9,7 @@ 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 { 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, Check, Copy, FilesIcon, Link, Text, ExternalLink, Unlink, Bold, Italic, Underline, Strikethrough, Code2, MoreHorizontal, ArrowLeftIcon, ArrowRightIcon, Minus, Plus, CircleArrowDown, Minimize2, Trash2, FileUp, CheckCircle2, FileText, Loader2, CornerDownLeftIcon, PencilLineIcon, MessageSquareTextIcon, MessagesSquareIcon, ArrowUpIcon, CheckIcon, CaptionsIcon, ZoomInIcon, CircleArrowDownIcon, MoveUpRightIcon, MoreHorizontalIcon, Eye, Pencil, PlusCircle, HelpCircle, Maximize2, X, Download, FileSpreadsheet, ChevronDown, Search, Globe, CheckCircle, FolderOpen, User, ArrowRight, MapPin, CalendarClock, List, RefreshCw, FilePlus, XIcon, CornerUpLeftIcon, AlbumIcon, FeatherIcon, ListMinusIcon, ListPlusIcon, ListEnd, Wand, LanguagesIcon, BadgeHelpIcon, PenLineIcon, SearchIcon, MusicIcon, CompassIcon, SmileIcon, LeafIcon, ClockIcon, AppleIcon, FlagIcon, StarIcon, DeleteIcon, AlignLeft, AlignCenter, AlignRight, RotateCcw, AlertTriangle, XCircle, AlertCircle, ArrowUpDown, ArrowDownToLine, PenLine, PencilIcon, TrashIcon, RefreshCwIcon, PaintRoller, MessageSquareText, ArrowLeft, RefreshCcw, Code, Brain, Star, Trash, Edit, FolderInput, Archive, Sparkles, PanelLeft, MessageSquare, NotebookText, CirclePlus, MoreVertical, 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, Check, Copy, FilesIcon, Link, Text, ExternalLink, Unlink, Bold, Italic, Underline, Strikethrough, Code2, MoreHorizontal, ArrowLeftIcon, ArrowRightIcon, Minus, Plus, CircleArrowDown, Minimize2, Trash2, FileUp, CheckCircle2, FileText, Loader2, CornerDownLeftIcon, PencilLineIcon, MessageSquareTextIcon, MessagesSquareIcon, ArrowUpIcon, CheckIcon, CaptionsIcon, ZoomInIcon, CircleArrowDownIcon, MoveUpRightIcon, MoreHorizontalIcon, Eye, Pencil, PlusCircle, HelpCircle, Maximize2, X, Download, FileSpreadsheet, ChevronDown, Search, Globe, CheckCircle, FolderOpen, User, ArrowRight, MapPin, CalendarClock, List, RefreshCw, FilePlus, XIcon, CornerUpLeftIcon, AlbumIcon, FeatherIcon, ListMinusIcon, ListPlusIcon, ListEnd, Wand, LanguagesIcon, BadgeHelpIcon, PenLineIcon, SearchIcon, MusicIcon, CompassIcon, SmileIcon, LeafIcon, ClockIcon, AppleIcon, FlagIcon, StarIcon, DeleteIcon, AlignLeft, AlignCenter, AlignRight, RotateCcw, AlertTriangle, XCircle, AlertCircle, ArrowUpDown, ArrowDownToLine, PenLine, PencilIcon, TrashIcon, RefreshCwIcon, PaintRoller, MessageSquareText, ArrowLeft, ChevronLeft, Bot, ChevronRight, Brain, Lightbulb, BookOpen, PenTool, SlidersHorizontal, Mic, RefreshCcw, Code, Star, Trash, Edit, FolderInput, Archive, Sparkles, PanelLeft, MessageSquare, NotebookText, CirclePlus, MoreVertical, FileSearch, Microscope, Ruler, AudioLines, BrainCircuit, File as File$1, Plug, Inbox, Menu, 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$1, TooltipTrigger, TooltipContent } from '@docyrus/ui-pro-shared/components/tooltip';
@@ -2520,7 +2520,116 @@ function useApiClient() {
   }, [config3]);
 }
 
-// src/hooks/use-assistant-api.ts
+// src/hooks/use-agents-data.ts
+function resolveAvatar(agent) {
+  for (const key of ["agentAvatar", "avatar", "agentsAvatar"]) {
+    const val = agent[key];
+    if (val && typeof val === "object" && "signed_url" in val) {
+      const url = val.signed_url;
+      if (url) return url;
+    }
+    if (typeof val === "string" && val) return val;
+  }
+  return null;
+}
+function extractCapabilities(agent) {
+  return {
+    supportWebSearch: agent.supportWebSearch ?? false,
+    supportDocumentSearch: agent.documentSearch ?? false,
+    supportDeepResearch: agent.supportDeepResearch ?? false,
+    supportThinking: agent.supportThinking ?? false,
+    supportWorkCanvas: agent.featureWorks ?? false,
+    supportFiles: agent.supportFiles ?? false
+  };
+}
+function toAgentTriggerData(id, data) {
+  const agent = data.agent ?? data;
+  return {
+    id,
+    name: agent.agent_name || agent.name || "",
+    avatar: resolveAvatar(agent),
+    welcomeMessage: agent.welcomeMessage || agent.welcome_message || null,
+    description: agent.description ?? null,
+    capabilities: extractCapabilities(agent),
+    models: agent.models ?? [],
+    standardSuggestions: agent.standardSuggestions ?? agent.standard_suggestions ?? []
+  };
+}
+function useAgentsData(agentIds) {
+  const apiClient = useApiClient();
+  const apiClientRef = useRef(apiClient);
+  apiClientRef.current = apiClient;
+  const [agents, setAgents] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [retryCount, setRetryCount] = useState(0);
+  const idsKey = agentIds.join(",");
+  useEffect(() => {
+    let cancelled = false;
+    const run = async () => {
+      const ids = idsKey.split(",").filter(Boolean);
+      if (ids.length === 0) {
+        setAgents([]);
+        return;
+      }
+      setIsLoading(true);
+      setError(null);
+      try {
+        const BATCH_SIZE = 3;
+        const BATCH_DELAY = 200;
+        const resolved = [];
+        const client = apiClientRef.current;
+        for (let start = 0; start < ids.length; start += BATCH_SIZE) {
+          if (cancelled) return;
+          if (start > 0) {
+            await new Promise((resolve) => {
+              const timer = setTimeout(resolve, BATCH_DELAY);
+              if (cancelled) clearTimeout(timer);
+            });
+          }
+          const batch = ids.slice(start, start + BATCH_SIZE);
+          const results = await Promise.allSettled(
+            batch.map((id) => client.get(`/ai/agent-deployments/base/${id}`))
+          );
+          for (let i = 0; i < batch.length; i++) {
+            const result = results[i];
+            if (result.status === "fulfilled" && result.value.success && result.value.data) {
+              resolved.push(
+                toAgentTriggerData(batch[i], result.value.data)
+              );
+            }
+          }
+        }
+        if (!cancelled) {
+          setAgents(resolved);
+        }
+      } catch (err) {
+        if (!cancelled) {
+          setError(
+            err instanceof Error ? err : new Error("Failed to fetch agents")
+          );
+        }
+      } finally {
+        if (!cancelled) {
+          setIsLoading(false);
+        }
+      }
+    };
+    void run();
+    return () => {
+      cancelled = true;
+    };
+  }, [idsKey, retryCount]);
+  const retry = useCallback(() => {
+    setRetryCount((c) => c + 1);
+  }, []);
+  return {
+    agents,
+    isLoading,
+    error,
+    retry
+  };
+}
 function useAssistantApi({
   tenantAiAgentId,
   deploymentId,
@@ -24567,6 +24676,7 @@ var DocyAssistant = ({
   agentSelectorUrl = "/ai/agent-deployments",
   baseAgentSelectorUrl = "/ai/agent-deployments/base",
   onAgentChange,
+  initialPrompt,
   ...props
 }) => {
   const config3 = useAssistantConfig();
@@ -24602,6 +24712,7 @@ var DocyAssistant = ({
   const selectedSessionIdRef = useRef(null);
   const authTokenRef = useRef("");
   const messageOptionsRef = useRef(null);
+  const initialPromptSentRef = useRef(false);
   useEffect(() => {
     selectedSessionIdRef.current = sessionState.selectedSessionId;
   }, [sessionState.selectedSessionId]);
@@ -24909,6 +25020,14 @@ var DocyAssistant = ({
       }
     });
   };
+  useEffect(() => {
+    if (!initialPrompt || initialPromptSentRef.current) return;
+    initialPromptSentRef.current = true;
+    setInput(initialPrompt);
+    setTimeout(() => {
+      handleSendMessage();
+    }, 300);
+  }, [initialPrompt]);
   const handleInputChange = useCallback((e) => {
     setInput(e.target.value);
   }, []);
@@ -25513,7 +25632,630 @@ var DocyAssistant = ({
     assistantDialogs
   ] });
 };
+function computeVisibleSlots(agents, index) {
+  const len = agents.length;
+  if (len === 0) return [];
+  if (len === 1) return [
+    null,
+    null,
+    agents[0],
+    null,
+    null
+  ];
+  if (len === 2) {
+    const prev3 = index === 0 ? 1 : 0;
+    return [
+      null,
+      agents[prev3],
+      agents[index],
+      agents[prev3],
+      null
+    ];
+  }
+  if (len === 3) {
+    const prev3 = (index - 1 + len) % len;
+    const next3 = (index + 1) % len;
+    return [
+      null,
+      agents[prev3],
+      agents[index],
+      agents[next3],
+      null
+    ];
+  }
+  if (len === 4) {
+    const prev22 = (index - 2 + len) % len;
+    const prev3 = (index - 1 + len) % len;
+    const next3 = (index + 1) % len;
+    return [
+      agents[prev22],
+      agents[prev3],
+      agents[index],
+      agents[next3],
+      agents[prev22]
+    ];
+  }
+  const prev2 = (index - 2 + len) % len;
+  const prev = (index - 1 + len) % len;
+  const next = (index + 1) % len;
+  const next2 = (index + 2) % len;
+  return [
+    agents[prev2],
+    agents[prev],
+    agents[index],
+    agents[next],
+    agents[next2]
+  ];
+}
+var SLOT_OUTER_CLASS = {
+  0: "z-0 mx-2",
+  1: "z-5 mx-4",
+  2: "z-10 mx-6",
+  3: "z-5 mx-4",
+  4: "z-0 mx-2"
+};
+var SLOT_CIRCLE_CLASS = {
+  0: "size-12 bg-muted opacity-40",
+  1: "size-20 bg-muted opacity-70",
+  2: "size-28 bg-gradient-to-br from-sky-100 to-indigo-100 ring-4 ring-sky-400 dark:from-sky-900/30 dark:to-indigo-900/30 dark:ring-sky-600",
+  3: "size-20 bg-muted opacity-70",
+  4: "size-12 bg-muted opacity-40"
+};
+var SLOT_IMG_CLASS = {
+  0: "size-10",
+  1: "size-16",
+  2: "size-24",
+  3: "size-16",
+  4: "size-10"
+};
+var SLOT_BOT_CLASS = {
+  0: "size-8 text-slate-400",
+  1: "size-12 text-slate-500",
+  2: "size-16 text-sky-600",
+  3: "size-12 text-slate-500",
+  4: "size-8 text-slate-400"
+};
+function isImageUrl(url) {
+  if (!url) return false;
+  return url.startsWith("http") || url.startsWith("/") || url.startsWith("data:");
+}
+function AgentCarousel({
+  agents,
+  selectedIndex,
+  onSelect,
+  onNavigate
+}) {
+  const visibleSlots = computeVisibleSlots(agents, selectedIndex);
+  const handleKeyDown = useCallback(
+    (e) => {
+      const target = e.target;
+      if (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.isContentEditable)
+        return;
+      if (e.key === "ArrowLeft") {
+        e.preventDefault();
+        onNavigate(-1);
+      } else if (e.key === "ArrowRight") {
+        e.preventDefault();
+        onNavigate(1);
+      }
+    },
+    [onNavigate]
+  );
+  if (agents.length === 0) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex h-32 items-center justify-center gap-6",
+      onKeyDown: handleKeyDown,
+      tabIndex: 0,
+      children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "flex size-12 shrink-0 items-center justify-center rounded-full bg-muted transition-colors hover:bg-muted/80 disabled:cursor-not-allowed disabled:opacity-50",
+            disabled: agents.length <= 1,
+            onClick: () => onNavigate(-1),
+            "aria-label": "Previous agent",
+            children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-6 text-muted-foreground" })
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: visibleSlots.map((slot, i) => slot ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "shrink-0 cursor-pointer transition-all duration-500 ease-out",
+              SLOT_OUTER_CLASS[i]
+            ),
+            onClick: () => {
+              const idx = agents.findIndex((a) => a.id === slot.id);
+              if (idx !== -1) onSelect(idx);
+            },
+            children: /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn(
+                  "flex items-center justify-center rounded-full shadow-lg transition-all duration-500 ease-out",
+                  SLOT_CIRCLE_CLASS[i]
+                ),
+                children: slot.avatar && isImageUrl(slot.avatar) ? /* @__PURE__ */ jsx(
+                  "img",
+                  {
+                    src: slot.avatar,
+                    alt: slot.name,
+                    className: cn(
+                      "rounded-full object-cover transition-all duration-500 ease-out",
+                      SLOT_IMG_CLASS[i]
+                    )
+                  }
+                ) : /* @__PURE__ */ jsx(Bot, { className: SLOT_BOT_CLASS[i] })
+              }
+            )
+          },
+          slot.id
+        ) : /* @__PURE__ */ jsx("div", { className: "size-12 shrink-0" }, `empty-slot-${i === 0 ? "far-left" : i === 1 ? "left" : i === 3 ? "right" : "far-right"}`)) }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "flex size-12 shrink-0 items-center justify-center rounded-full bg-muted transition-colors hover:bg-muted/80 disabled:cursor-not-allowed disabled:opacity-50",
+            disabled: agents.length <= 1,
+            onClick: () => onNavigate(1),
+            "aria-label": "Next agent",
+            children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-6 text-muted-foreground" })
+          }
+        )
+      ]
+    }
+  );
+}
+var CAPABILITY_TOGGLES = [
+  {
+    key: "webSearch",
+    capKey: "supportWebSearch",
+    icon: Globe,
+    labelKey: "tools.web_search"
+  },
+  {
+    key: "thinking",
+    capKey: "supportThinking",
+    icon: Brain,
+    labelKey: "tools.thinking"
+  },
+  {
+    key: "deepResearch",
+    capKey: "supportDeepResearch",
+    icon: Lightbulb,
+    labelKey: "tools.deep_research"
+  },
+  {
+    key: "documentSearch",
+    capKey: "supportDocumentSearch",
+    icon: BookOpen,
+    labelKey: "tools.document_search"
+  },
+  {
+    key: "workCanvas",
+    capKey: "supportWorkCanvas",
+    icon: PenTool,
+    labelKey: "tools.work_canvas"
+  },
+  {
+    key: "files",
+    capKey: "supportFiles",
+    icon: FileUp,
+    labelKey: "tools.file_upload"
+  }
+];
+function ToggleSwitch({
+  checked,
+  onChange,
+  label
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      role: "switch",
+      "aria-checked": checked,
+      "aria-label": label,
+      onClick: onChange,
+      className: cn(
+        "relative inline-flex h-5 w-9 shrink-0 items-center rounded-full transition-colors focus:outline-none focus:ring-2 focus:ring-sky-500 focus:ring-offset-2",
+        checked ? "bg-sky-500" : "bg-gray-300 dark:bg-gray-600"
+      ),
+      children: /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(
+            "inline-block size-3 rounded-full bg-white transition-transform",
+            checked ? "translate-x-5" : "translate-x-1"
+          )
+        }
+      )
+    }
+  );
+}
+function useClickOutside(ref, open, onClose) {
+  useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      if (ref.current && !ref.current.contains(e.target)) {
+        onClose();
+      }
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [ref, open, onClose]);
+}
+function AgentTriggerPrompt({
+  capabilities,
+  models,
+  suggestions,
+  placeholder,
+  onSubmit
+}) {
+  const { t } = useAssistantTranslation();
+  const [prompt, setPrompt] = useState("");
+  const [selectedModel, setSelectedModel] = useState(
+    models[0]
+  );
+  const [features, setFeatures] = useState({
+    webSearch: false,
+    thinking: false,
+    deepResearch: false,
+    documentSearch: false,
+    workCanvas: false,
+    files: false
+  });
+  const [settingsOpen, setSettingsOpen] = useState(false);
+  const [modelDropdownOpen, setModelDropdownOpen] = useState(false);
+  const [reasoningDropdownOpen, setReasoningDropdownOpen] = useState(false);
+  const [reasoningOverride, setReasoningOverride] = useState(null);
+  const settingsRef = useRef(null);
+  const modelRef = useRef(null);
+  const reasoningRef = useRef(null);
+  useClickOutside(settingsRef, settingsOpen, () => setSettingsOpen(false));
+  useClickOutside(modelRef, modelDropdownOpen, () => setModelDropdownOpen(false));
+  useClickOutside(reasoningRef, reasoningDropdownOpen, () => setReasoningDropdownOpen(false));
+  const hasThinking = capabilities?.supportThinking || selectedModel?.supportThinking;
+  const reasoningLevels = useMemo(
+    () => hasThinking ? selectedModel?.reasoningLevels ?? [] : [],
+    [hasThinking, selectedModel?.reasoningLevels]
+  );
+  const selectedReasoningLevel = useMemo(() => {
+    if (reasoningLevels.length === 0) return null;
+    if (reasoningOverride && reasoningLevels.some((l) => l.id === reasoningOverride.id)) {
+      return reasoningOverride;
+    }
+    const defaultLevel = reasoningLevels.find((l) => l.default === true);
+    return defaultLevel ?? reasoningLevels[0];
+  }, [reasoningLevels, reasoningOverride]);
+  const toggleFeature = useCallback((key) => {
+    setFeatures((prev) => ({ ...prev, [key]: !prev[key] }));
+  }, []);
+  const handleSubmit = useCallback(() => {
+    const trimmed = prompt.trim();
+    if (!trimmed) return;
+    onSubmit(trimmed, features, selectedModel?.id);
+    setPrompt("");
+  }, [
+    prompt,
+    features,
+    selectedModel,
+    onSubmit
+  ]);
+  const handleKeyDown = useCallback(
+    (e) => {
+      if (e.key === "Enter" && !e.shiftKey) {
+        e.preventDefault();
+        handleSubmit();
+      }
+    },
+    [handleSubmit]
+  );
+  const handleSuggestionClick = useCallback(
+    (suggestion) => {
+      setPrompt(suggestion);
+    },
+    []
+  );
+  const availableToggles = capabilities ? CAPABILITY_TOGGLES.filter((toggle) => {
+    if (!capabilities[toggle.capKey]) return false;
+    if (toggle.key === "thinking" && reasoningLevels.length > 0) return false;
+    return true;
+  }) : [];
+  return /* @__PURE__ */ jsxs("div", { className: "mt-4 mb-1 w-full max-w-[54rem]", children: [
+    suggestions.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          title: t("common.generate_suggestions") || "Generate Suggestions",
+          className: "flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-muted-foreground transition-colors hover:bg-muted/80 hover:text-foreground",
+          children: /* @__PURE__ */ jsx(Plus, { className: "size-4" })
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "suggestions-container flex items-center gap-2 overflow-x-auto", children: suggestions.map((s) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          title: s,
+          className: "max-w-64 shrink-0 truncate rounded-lg border border-border bg-muted/50 px-2 py-1 text-xs text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
+          onClick: () => handleSuggestionClick(s),
+          children: s
+        },
+        s
+      )) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "overflow-visible rounded-lg bg-muted/50 text-foreground shadow-md focus-within:ring-2 focus-within:ring-sky-600", children: [
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          value: prompt,
+          onChange: (e) => setPrompt(e.target.value),
+          onKeyDown: handleKeyDown,
+          placeholder: placeholder ?? t("placeholders.type_message"),
+          className: "max-h-34 min-h-20 w-full resize-none bg-transparent py-4 pl-3 pr-4 text-sm outline-none placeholder:text-muted-foreground sm:text-base",
+          rows: 2
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "flex h-10 items-center justify-between px-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+          capabilities?.supportFiles && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              title: t("tools.file_upload"),
+              className: "flex size-7 items-center justify-center rounded text-muted-foreground transition-colors hover:text-foreground",
+              children: /* @__PURE__ */ jsx(Plus, { className: "size-5" })
+            }
+          ),
+          availableToggles.length > 0 && /* @__PURE__ */ jsxs("div", { ref: settingsRef, className: "relative", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                title: t("common.settings") || "Settings",
+                onClick: () => setSettingsOpen((prev) => !prev),
+                className: "flex size-7 items-center justify-center rounded text-muted-foreground transition-colors hover:text-foreground",
+                children: /* @__PURE__ */ jsx(SlidersHorizontal, { className: "size-5" })
+              }
+            ),
+            settingsOpen && /* @__PURE__ */ jsx("div", { className: "absolute bottom-full left-0 z-50 mb-2 min-w-[250px] rounded-lg border border-border bg-background p-3 shadow-lg", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-3", children: availableToggles.map((toggle) => {
+              const Icon = toggle.icon;
+              return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(Icon, { className: "size-4 text-muted-foreground" }),
+                  /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: t(toggle.labelKey) })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  ToggleSwitch,
+                  {
+                    checked: features[toggle.key],
+                    onChange: () => toggleFeature(toggle.key),
+                    label: t(toggle.labelKey)
+                  }
+                )
+              ] }, toggle.key);
+            }) }) })
+          ] }),
+          models.length > 1 && selectedModel && /* @__PURE__ */ jsxs("div", { ref: modelRef, className: "relative ml-1", children: [
+            /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => setModelDropdownOpen((prev) => !prev),
+                className: "flex items-center gap-1.5 rounded-full bg-muted px-2 py-1 text-xs text-foreground transition-colors hover:bg-muted/80",
+                children: [
+                  selectedModel.providerLogoUrl && /* @__PURE__ */ jsx(
+                    "img",
+                    {
+                      src: selectedModel.providerLogoUrl,
+                      alt: "",
+                      className: "size-4 rounded-full object-cover"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "max-w-[8rem] truncate", children: selectedModel.name }),
+                  /* @__PURE__ */ jsx(ChevronDown, { className: "size-3 text-muted-foreground" })
+                ]
+              }
+            ),
+            modelDropdownOpen && /* @__PURE__ */ jsx("div", { className: "absolute bottom-full left-0 z-50 mb-2 min-w-[15rem] rounded-lg border border-border bg-background py-1 shadow-lg", children: models.map((m) => /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  setSelectedModel(m);
+                  setModelDropdownOpen(false);
+                },
+                className: cn(
+                  "flex w-full items-center gap-2 px-3 py-2 text-left text-sm transition-colors hover:bg-muted",
+                  m.id === selectedModel.id && "bg-muted/60"
+                ),
+                children: [
+                  m.providerLogoUrl && /* @__PURE__ */ jsx(
+                    "img",
+                    {
+                      src: m.providerLogoUrl,
+                      alt: "",
+                      className: "size-4 rounded-full object-cover"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { children: m.name })
+                ]
+              },
+              m.id
+            )) })
+          ] }),
+          reasoningLevels.length > 0 && /* @__PURE__ */ jsxs("div", { ref: reasoningRef, className: "relative ml-1", children: [
+            /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                title: t("common.reasoning") || "Use reasoning model to solve complex tasks",
+                onClick: () => setReasoningDropdownOpen((prev) => !prev),
+                className: "flex items-center gap-1.5 rounded-full bg-indigo-100 px-2.5 py-1 text-xs font-medium text-indigo-700 transition-colors hover:bg-indigo-200 dark:bg-indigo-950 dark:text-indigo-300 dark:hover:bg-indigo-900",
+                children: [
+                  /* @__PURE__ */ jsx(Brain, { className: "size-3.5" }),
+                  selectedReasoningLevel && /* @__PURE__ */ jsx("span", { children: selectedReasoningLevel.name })
+                ]
+              }
+            ),
+            reasoningDropdownOpen && /* @__PURE__ */ jsx("div", { className: "absolute bottom-full left-0 z-50 mb-2 min-w-[12rem] rounded-lg border border-border bg-background py-1 shadow-lg", children: reasoningLevels.map((level) => /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  setReasoningOverride(level);
+                  setReasoningDropdownOpen(false);
+                },
+                className: cn(
+                  "flex w-full items-center px-3 py-2 text-left text-sm transition-colors hover:bg-muted",
+                  selectedReasoningLevel?.id === level.id && "bg-indigo-50 dark:bg-indigo-950/50"
+                ),
+                children: /* @__PURE__ */ jsx("span", { children: level.name })
+              },
+              level.id
+            )) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "flex size-7 items-center justify-center rounded text-muted-foreground transition-colors hover:text-foreground",
+            children: /* @__PURE__ */ jsx(Mic, { className: "size-5" })
+          }
+        ) })
+      ] })
+    ] })
+  ] });
+}
+function AgentTriggerWidget({
+  agentIds,
+  className,
+  placeholder,
+  onSubmit
+}) {
+  const { t } = useAssistantTranslation();
+  const {
+    agents,
+    isLoading,
+    error,
+    retry
+  } = useAgentsData(agentIds);
+  const [carouselIndex, setCarouselIndex] = useState(0);
+  const containerRef = useRef(null);
+  const currentAgent = agents[carouselIndex] ?? null;
+  const navigateCarousel = useCallback(
+    (direction) => {
+      if (agents.length <= 1) return;
+      setCarouselIndex(
+        (prev) => (prev + direction + agents.length) % agents.length
+      );
+    },
+    [agents.length]
+  );
+  const handlePromptSubmit = useCallback(
+    (prompt, features, modelId) => {
+      if (!currentAgent) return;
+      onSubmit?.(currentAgent.id, prompt, features, modelId);
+    },
+    [currentAgent, onSubmit]
+  );
+  const welcomeText = useMemo(() => {
+    if (!currentAgent?.welcomeMessage) return "";
+    return currentAgent.welcomeMessage;
+  }, [currentAgent?.welcomeMessage]);
+  if (isLoading) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "flex flex-1 flex-col items-center justify-center gap-3",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx(Loader2, { className: "size-8 animate-spin text-muted-foreground" }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: t("common.loading") || "Loading..." })
+        ]
+      }
+    );
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "flex flex-1 flex-col items-center justify-center gap-3",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error.message }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: retry,
+              className: "rounded-md border border-border px-3 py-1.5 text-sm text-foreground transition-colors hover:bg-muted",
+              children: t("common.retry") || "Retry"
+            }
+          )
+        ]
+      }
+    );
+  }
+  if (agents.length === 0) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "flex flex-1 flex-col items-center justify-center",
+          className
+        ),
+        children: /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("messages.no_agents") || "No agents available" })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: containerRef,
+      className: cn(
+        "relative mx-auto flex h-full w-full max-w-4xl flex-col focus:outline-none",
+        className
+      ),
+      tabIndex: 0,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center space-y-4 px-8 pt-6", children: [
+          /* @__PURE__ */ jsx("h3", { className: "truncate font-mono text-xl font-semibold uppercase tracking-tight text-foreground", children: currentAgent?.name ?? "" }),
+          /* @__PURE__ */ jsx(
+            AgentCarousel,
+            {
+              agents,
+              selectedIndex: carouselIndex,
+              onSelect: setCarouselIndex,
+              onNavigate: navigateCarousel
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "mt-2 text-center", children: welcomeText ? /* @__PURE__ */ jsx("p", { className: "line-clamp-2 min-h-10 max-w-lg text-sm text-muted-foreground", children: welcomeText }) : /* @__PURE__ */ jsx("div", { className: "min-h-10" }) })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "flex h-fit w-full grow items-end justify-center px-6 pb-6", children: /* @__PURE__ */ jsx(
+          AgentTriggerPrompt,
+          {
+            capabilities: currentAgent?.capabilities ?? null,
+            models: currentAgent?.models ?? [],
+            suggestions: currentAgent?.standardSuggestions ?? [],
+            placeholder,
+            onSubmit: handlePromptSubmit
+          }
+        ) })
+      ]
+    }
+  );
+}
 
-export { AssistantI18nProvider, AssistantProvider, DocyAssistant, useAssistantConfig, useAssistantTranslation };
+export { AgentTriggerWidget, AssistantI18nProvider, AssistantProvider, DocyAssistant, useAssistantConfig, useAssistantTranslation };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map