@docyrus/ui-pro-ai-assistant 0.5.3 → 0.5.5

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 { Pencil, 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, X, 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, PlusCircle, HelpCircle, Maximize2, Download, FileSpreadsheet, ChevronDown, ChevronLeft, ChevronRight, CheckCircle, XCircle, Search, Globe, 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, AlertCircle, ArrowUpDown, ArrowDownToLine, PenLine, PencilIcon, TrashIcon, FileIcon, Star, ChevronsUpDown, FolderIcon, MessageSquare, Hash, Table, CheckSquare, Calendar as Calendar$1, Clock, Phone, Mail, Send, RefreshCcw, Undo2, ChevronsUpDownIcon, ChevronsRight, ChevronsLeft, CalendarDays, RefreshCwIcon, PaintRoller, MessageSquareText, ArrowLeft, Users, Bot, Brain, Lightbulb, BookOpen, PenTool, SlidersHorizontal, Wand2, Mic, Code, Trash, Edit, Share, FolderInput, Archive, Building2, ShieldCheck, Sparkles, PanelLeft, 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, Grid3x3Icon, Combine, Ungroup, ArrowUp, ArrowDown, Trash2Icon, LinkIcon, WrapText, OutdentIcon, IndentIcon, EyeIcon, PenIcon } from 'lucide-react';
+import { Pencil, 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, X, 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, PlusCircle, HelpCircle, Maximize2, Download, FileSpreadsheet, ChevronDown, ChevronLeft, ChevronRight, CheckCircle, XCircle, Search, Globe, 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, AlertCircle, ArrowUpDown, ArrowDownToLine, PenLine, PencilIcon, TrashIcon, FileIcon, Star, ChevronsUpDown, FolderIcon, MessageSquare, Hash, Table, CheckSquare, Calendar as Calendar$1, Clock, Phone, Mail, Send, RefreshCcw, Undo2, ChevronsUpDownIcon, ChevronsRight, ChevronsLeft, CalendarDays, RefreshCwIcon, PaintRoller, MessageSquareText, ArrowLeft, Users, Bot, Brain, Lightbulb, BookOpen, PenTool, SlidersHorizontal, Wand2, Mic, Code, Trash, Edit, Share, FolderInput, Archive, Building2, ShieldCheck, Sparkles, PanelLeft, NotebookText, CirclePlus, MoreVertical, FileSearch, Microscope, Ruler, AudioLines, BrainCircuit, File as File$1, Plug, Inbox, Menu, FolderOpen, LayoutDashboard, Table2, WandSparklesIcon, ArrowUpToLineIcon, BoldIcon, ItalicIcon, UnderlineIcon, StrikethroughIcon, HighlighterIcon, Undo2Icon, Redo2Icon, ArrowDownToLineIcon, AlignLeftIcon, AlignCenterIcon, AlignRightIcon, AlignJustifyIcon, ListOrdered, ListTodoIcon, ListCollapseIcon, Grid3x3Icon, Combine, Ungroup, ArrowUp, ArrowDown, Trash2Icon, LinkIcon, WrapText, OutdentIcon, IndentIcon, EyeIcon, PenIcon } from 'lucide-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { ScrollArea as ScrollArea$1 } from '@docyrus/ui-pro-shared/components/scroll-area';
 import { AsyncTokenManager, RestApiClient } from '@docyrus/api-client';
@@ -3884,6 +3884,7 @@ function useAssistantApi({
   const { user: configUser } = useAssistantConfig();
   const [agentDetails, setAgentDetails] = useState(null);
   const [isLoadingAgentDetails, setIsLoadingAgentDetails] = useState(!!tenantAiAgentId);
+  const [subagents, setSubagents] = useState([]);
   const apiClientRef = useRef(apiClient);
   const fetchedAgentIdRef = useRef(null);
   apiClientRef.current = apiClient;
@@ -3894,6 +3895,7 @@ function useAssistantApi({
     let cancelled = false;
     const fetchAgentDetails = async () => {
       setAgentDetails(null);
+      setSubagents([]);
       setIsLoadingAgentDetails(true);
       try {
         const response = await apiClientRef.current.get(endpoint);
@@ -3905,6 +3907,13 @@ function useAssistantApi({
           const name = data.name || data.agent?.agentName || data.agent?.name;
           const welcomeMessage = data.welcomeMessage || data.agent?.welcomeMessage;
           setAgentDetails({ logo: avatar, name, welcomeMessage });
+          const direct = data.agent?.agents || [];
+          const connected = (data.agent?.connectedAgents || []).map((c) => ({
+            ...c,
+            id: c.id || c.agentId,
+            name: c.name || c.agentName
+          }));
+          setSubagents([...direct, ...connected]);
         } else {
           setAgentDetails({ logo, name: title });
         }
@@ -4190,6 +4199,7 @@ function useAssistantApi({
   return {
     agentDetails,
     isLoadingAgentDetails,
+    subagents,
     fetchThreads,
     fetchProjectThreads: fetchProjectThreads2,
     loadThreadMessages: loadThreadMessages2,
@@ -10233,6 +10243,152 @@ function CreateRecord({
     resultMessage && /* @__PURE__ */ jsx("div", { className: `text-xs font-medium ${resultError ? "text-destructive" : "text-green-600"}`, children: resultMessage })
   ] });
 }
+function safeParseArray(value) {
+  if (value == null) return null;
+  if (Array.isArray(value)) return value.filter((id) => typeof id === "string");
+  if (typeof value === "string") {
+    try {
+      const parsed = JSON.parse(value);
+      return Array.isArray(parsed) ? parsed.filter((id) => typeof id === "string") : null;
+    } catch {
+      return null;
+    }
+  }
+  return null;
+}
+function DeleteRecord({
+  dataSourceId,
+  recordId,
+  recordIds,
+  state,
+  toolName = "deleteRecord",
+  toolCallId,
+  onToolAction
+}) {
+  const apiClient = useApiClient();
+  const [loading, setLoading] = useState(false);
+  const [submitted, setSubmitted] = useState(false);
+  const [resultMessage, setResultMessage] = useState("");
+  const [resultError, setResultError] = useState(false);
+  const { dataSource, loading: fieldsLoading } = useResolvedRecordFields(dataSourceId);
+  const parsedRecordIds = useMemo(() => safeParseArray(recordIds), [recordIds]);
+  const isBatch = parsedRecordIds != null && parsedRecordIds.length > 0;
+  const recordCount = isBatch && parsedRecordIds ? parsedRecordIds.length : 1;
+  const dataSourceName = dataSource?.name || "record";
+  const emitResult = (input) => {
+    onToolAction({
+      tool: toolName,
+      toolCallId,
+      decision: "submit",
+      input
+    });
+  };
+  const handleApprove = async () => {
+    if (!dataSource) {
+      const message = "Data source metadata not available";
+      setResultError(true);
+      setResultMessage(message);
+      emitResult({ success: false, error: message });
+      return;
+    }
+    if (!isBatch && !recordId) {
+      const message = "Either recordId or recordIds must be provided";
+      setResultError(true);
+      setResultMessage(message);
+      emitResult({ success: false, error: message });
+      return;
+    }
+    setLoading(true);
+    setResultError(false);
+    try {
+      const { appSlug, dsSlug } = dataSource;
+      const baseEndpoint = `/apps/${appSlug}/data-sources/${dsSlug}/items/`;
+      const result = isBatch && parsedRecordIds ? await apiClient.deleteWithBody(baseEndpoint, { recordIds: parsedRecordIds }) : await apiClient.delete(`${baseEndpoint}${recordId}`);
+      if (!result?.success) {
+        throw new Error(
+          typeof result?.error === "string" ? result.error : "Failed to delete record(s)"
+        );
+      }
+      setSubmitted(true);
+      setResultMessage(
+        isBatch ? `${recordCount} record(s) deleted successfully` : "Record deleted successfully"
+      );
+      emitResult({
+        success: true,
+        data: result.data,
+        count: isBatch ? recordCount : 1
+      });
+    } catch (error) {
+      const message = error instanceof Error ? error.message : "Failed to delete record(s)";
+      console.warn("[delete-record] delete failed", error);
+      setResultError(true);
+      setResultMessage(message);
+      emitResult({ success: false, error: message });
+    } finally {
+      setLoading(false);
+    }
+  };
+  const handleReject = () => {
+    setSubmitted(true);
+    setResultError(true);
+    setResultMessage("Deletion cancelled by user");
+    emitResult({ success: false, error: "User cancelled the deletion" });
+  };
+  const showActionButtons = state !== "output-available" && !submitted;
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-lg border bg-card p-4 space-y-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(Trash2, { className: "size-5 text-rose-500" }),
+      /* @__PURE__ */ jsx("h4", { className: "font-medium text-sm", children: isBatch ? `Delete ${recordCount} ${dataSourceName}` : `Delete ${dataSourceName}` })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground", children: isBatch ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      recordCount,
+      " record(s) will be permanently deleted."
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      "Record ",
+      /* @__PURE__ */ jsx("span", { className: "font-mono", children: recordId || "-" }),
+      " will be permanently deleted."
+    ] }) }),
+    fieldsLoading && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 animate-spin" }),
+      "Loading data source\u2026"
+    ] }),
+    showActionButtons && /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          variant: "destructive",
+          size: "sm",
+          disabled: loading || fieldsLoading,
+          onClick: handleApprove,
+          children: [
+            loading ? /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ jsx(Trash2, { className: "size-3.5" }),
+            isBatch ? `Delete ${recordCount} Records` : "Delete Record"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          disabled: loading,
+          onClick: handleReject,
+          children: [
+            /* @__PURE__ */ jsx(XCircle, { className: "size-3.5" }),
+            "Cancel"
+          ]
+        }
+      )
+    ] }),
+    resultMessage && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `text-xs font-medium ${resultError ? "text-destructive" : "text-emerald-600"}`,
+        children: resultMessage
+      }
+    )
+  ] });
+}
 function safeParse2(value) {
   if (value == null) return null;
   if (typeof value === "string") {
@@ -13315,26 +13471,58 @@ function WorkCanvas({
     isStreaming && /* @__PURE__ */ jsx(Loader2, { className: "size-8 animate-spin text-primary flex-none" })
   ] });
 }
+var stringify = (val) => {
+  try {
+    return typeof val === "string" ? val : JSON.stringify(val, null, 2);
+  } catch {
+    return String(val ?? "");
+  }
+};
+var resolveAvatarUrl = (subagent) => {
+  const avatar = subagent?.avatar;
+  if (!avatar) {
+    return null;
+  }
+  if (typeof avatar === "string") {
+    return avatar;
+  }
+  return avatar.signed_url || avatar.url || null;
+};
 function SubagentTool({
   toolState,
   input,
   status,
-  skillName,
-  agentName,
   step,
   result,
-  agent,
+  subagent,
   openCanvasView
 }) {
+  const [open, setOpen] = useState(true);
   const [steps, setSteps] = useState([]);
+  const [avatarLoaded, setAvatarLoaded] = useState(false);
+  const [streamedContent, setStreamedContent] = useState("");
   const hasOpenedXlsx = useRef(false);
   const prevStep = useRef(void 0);
+  const lastDeltaRef = useRef(void 0);
+  useEffect(() => {
+    const delta = result?.delta;
+    if (typeof delta === "string" && delta && delta !== lastDeltaRef.current) {
+      lastDeltaRef.current = delta;
+      setStreamedContent((prev) => prev + delta);
+    }
+  }, [result?.delta]);
+  const avatarUrl = useMemo(() => resolveAvatarUrl(subagent), [subagent]);
   useEffect(() => {
-    if (!step?.step || step === prevStep.current) return;
+    setAvatarLoaded(false);
+  }, [avatarUrl]);
+  useEffect(() => {
+    if (!step?.step || step === prevStep.current) {
+      return;
+    }
     prevStep.current = step;
     let message = step.step?.name || "Processing...";
-    if (agent?.steps) {
-      const stepConfig = agent.steps.find((s) => s.id === step.step?.id);
+    if (Array.isArray(subagent?.steps)) {
+      const stepConfig = subagent.steps.find((s) => s.id === step.step?.id);
       const messageTemplates = stepConfig?.messageTemplates;
       const template = step.eventType === "start" ? messageTemplates?.in_progress : messageTemplates?.completed;
       if (template) {
@@ -13342,82 +13530,139 @@ function SubagentTool({
       }
     }
     setSteps((prev) => [...prev, { data: step, message }]);
-  }, [step, agent]);
+  }, [step, subagent]);
+  const effectiveType = input?.type ?? result?.type ?? null;
   useEffect(() => {
-    if (input?.type === "xlsx" && status === "success" && result?.workId && !hasOpenedXlsx.current) {
+    if (effectiveType === "xlsx" && status === "success" && result?.workId && !hasOpenedXlsx.current) {
       hasOpenedXlsx.current = true;
       openCanvasView?.({
         type: "xlsx",
         id: result.workId,
         versionId: result.workVersionId,
+        workId: result.workId,
         title: result.title,
         contentJson: result.content
       });
     }
   }, [
-    input?.type,
+    effectiveType,
     status,
     result,
     openCanvasView
   ]);
+  const displayName = subagent?.agentName || subagent?.name || input?.agentName || "";
   const isLoading = toolState === "input-streaming" || status === "started";
-  return /* @__PURE__ */ jsxs("div", { className: "relative pl-4 ml-4 mt-4 pt-4 border-l border-slate-100", children: [
-    /* @__PURE__ */ jsxs("div", { className: "absolute -top-4 -left-4 rounded-full px-2 py-1 text-[10px] bg-slate-100 w-fit flex items-center gap-1", children: [
-      skillName && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(FolderOpen, { className: "size-4" }),
-        /* @__PURE__ */ jsx("i", { children: skillName }),
-        /* @__PURE__ */ jsx("span", { children: "skill loaded" })
-      ] }),
-      agentName && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(User, { className: "size-4" }),
-        /* @__PURE__ */ jsx("i", { children: agentName }),
-        /* @__PURE__ */ jsx("span", { children: "agent called" })
-      ] })
-    ] }),
-    isLoading ? /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin text-muted-foreground" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-      input?.type === "text" && /* @__PURE__ */ jsx("div", { className: "text-sm", children: result?.delta || result?.content || "" }),
-      input?.type === "xlsx" && (status !== "success" ? /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin text-muted-foreground" }) : /* @__PURE__ */ jsx(
+  const renderBody = () => {
+    if (isLoading) {
+      return /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin text-muted-foreground" });
+    }
+    if (effectiveType === "text") {
+      const content = result?.content || streamedContent;
+      if (content) {
+        const isStreaming = !result?.content && status !== "success";
+        return /* @__PURE__ */ jsx(MessageResponse, { mode: isStreaming ? "streaming" : "static", children: content });
+      }
+      return /* @__PURE__ */ jsx("div", { className: "text-xs text-slate-500 italic", children: "No content returned." });
+    }
+    if (effectiveType === "image") {
+      return /* @__PURE__ */ jsx(
+        preview_image_default,
+        {
+          title: result?.title || input?.prompt || "Generated image",
+          images: result?.images || result?.url
+        }
+      );
+    }
+    if (effectiveType === "xlsx") {
+      if (status !== "success") {
+        return /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin text-muted-foreground" });
+      }
+      return /* @__PURE__ */ jsx(
         WorkCanvas,
         {
           title: result?.title,
           description: result?.description,
           id: result?.workId || "streaming",
-          content: JSON.stringify(result?.content, null, 2),
+          content: stringify(result?.content),
           state: toolState,
           onOpen: () => openCanvasView?.({
             type: "xlsx",
             id: result?.workId,
             versionId: result?.workVersionId,
+            workId: result?.workId,
             title: result?.title,
             contentJson: result?.content
           })
         }
-      )),
-      input?.type === "work" && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-        steps.length > 0 && /* @__PURE__ */ jsx("div", { className: "space-y-1", children: steps.map((stepItem, idx) => /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
-          /* @__PURE__ */ jsx(CheckCircle, { className: "size-4 text-green-500 flex-none" }),
-          /* @__PURE__ */ jsx("div", { className: "text-sm", children: stepItem.message })
+      );
+    }
+    if (effectiveType === "work") {
+      return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        steps.length > 0 && /* @__PURE__ */ jsx("div", { className: "space-y-1 mb-2", children: steps.map((stepItem, idx) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-slate-600", children: [
+          /* @__PURE__ */ jsx(CheckCircle, { className: "size-4" }),
+          /* @__PURE__ */ jsx("span", { children: stepItem.message })
         ] }, idx)) }),
         status === "success" && /* @__PURE__ */ jsx(
           WorkCanvas,
           {
-            title: result?.title || result?.content?.layout?.title,
-            description: result?.description || result?.content?.layout?.description,
+            title: result?.title,
+            description: result?.description,
             id: result?.workId || "streaming",
-            content: JSON.stringify(result?.content, null, 2),
+            content: stringify(result?.content),
             state: toolState,
             onOpen: () => openCanvasView?.({
               type: input?.workType,
               id: result?.workId || "streaming",
               versionId: result?.workVersionId || "streaming",
-              title: result?.content?.layout?.title || result?.content?.title || result?.title,
-              description: result?.content?.layout?.description || result?.content?.description,
+              title: result?.content?.title,
+              description: result?.content?.description,
               contentJson: result?.content
             })
           }
         )
-      ] })
-    ] })
+      ] });
+    }
+    if (typeof result?.content === "string" && result.content) {
+      return /* @__PURE__ */ jsx(MessageResponse, { children: result.content });
+    }
+    if (result) {
+      return /* @__PURE__ */ jsx("pre", { className: "text-xs text-slate-600 whitespace-pre-wrap break-words", children: stringify(result) });
+    }
+    return /* @__PURE__ */ jsx("div", { className: "text-xs text-slate-500 italic", children: "No content returned." });
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "my-3", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "flex items-center gap-1.5 text-xs text-slate-600 hover:text-slate-900 transition-colors",
+        onClick: () => setOpen((o) => !o),
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "text-slate-500", children: "Agent Called:" }),
+          /* @__PURE__ */ jsx("span", { className: "size-4 rounded-full bg-slate-100 flex-shrink-0 overflow-hidden inline-flex items-center justify-center", children: avatarUrl ? /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: avatarUrl,
+              alt: displayName,
+              className: cn("size-4 object-cover", !avatarLoaded && "invisible"),
+              onLoad: () => setAvatarLoaded(true)
+            },
+            avatarUrl
+          ) : /* @__PURE__ */ jsx(User, { className: "size-3 text-slate-400" }) }),
+          /* @__PURE__ */ jsx("span", { className: "font-medium text-slate-900 truncate", children: displayName }),
+          /* @__PURE__ */ jsx(
+            ChevronDown,
+            {
+              className: cn(
+                "size-3 text-slate-400 flex-shrink-0 transition-transform",
+                !open && "-rotate-90"
+              )
+            }
+          )
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsx("div", { className: "mt-2 pt-2 border-t border-slate-100", children: renderBody() })
   ] });
 }
 var commandConfig = {
@@ -13631,7 +13876,7 @@ function TextEditorTool({
     isStreaming && /* @__PURE__ */ jsx(Loader2, { className: "size-6 animate-spin text-primary flex-none" })
   ] });
 }
-var stringify = (val) => {
+var stringify2 = (val) => {
   try {
     return typeof val === "string" ? val : JSON.stringify(val, null, 2);
   } catch {
@@ -13649,7 +13894,7 @@ function GenerativeUITool({
   onInsertText,
   onReplaceText,
   workId,
-  agent
+  subagents
 }) {
   const { t } = useAssistantTranslation();
   const emitToolAction = (decision) => {
@@ -13782,6 +14027,20 @@ function GenerativeUITool({
       }
     ) });
   }
+  if (toolName === "deleteRecord") {
+    return /* @__PURE__ */ jsx("div", { className: "not-prose mb-4 w-full", children: /* @__PURE__ */ jsx(
+      DeleteRecord,
+      {
+        dataSourceId: part.input?.dataSourceId,
+        recordId: part.input?.recordId,
+        recordIds: part.input?.recordIds,
+        state: part.state,
+        toolName,
+        toolCallId: part.toolCallId,
+        onToolAction
+      }
+    ) });
+  }
   if (toolName === "showCreateRecordForm" || toolName === "showUpdateRecordForm" || toolName === "showRecordDetailsForm") {
     const recordMode = toolName === "showCreateRecordForm" ? "add" : toolName === "showUpdateRecordForm" ? "edit" : "view";
     const dataSourceId = part.input?.dataSourceId || part.output?.result?.dataSourceId;
@@ -13969,19 +14228,17 @@ function GenerativeUITool({
   }
   if (toolName.startsWith("call") && toolName.endsWith("Agent") && (part.state === "input-available" || part.state === "input-streaming" || part.state === "output-available")) {
     const output = part.output;
+    const agentId = output?.result?.agentId || part.input?.agentId;
+    const subagent = agentId && subagents?.length ? subagents.find((a) => (a.id || a.agentId) === agentId) || null : null;
     return /* @__PURE__ */ jsx("div", { className: "not-prose mb-4 w-full", children: /* @__PURE__ */ jsx(
       SubagentTool,
       {
         toolState: part.state,
         input: part.input,
         status: output?.status,
-        text: output?.text,
-        icon: output?.icon,
-        skillName: output?.skillName,
-        agentName: output?.agentName,
         step: output?.step,
         result: output?.result,
-        agent,
+        subagent,
         openCanvasView
       }
     ) });
@@ -14106,7 +14363,7 @@ function GenerativeUITool({
   if (part.state === "output-available") {
     return /* @__PURE__ */ jsx("div", { className: "not-prose mb-4 w-full", children: /* @__PURE__ */ jsxs("div", { className: "rounded-lg border bg-card p-3", children: [
       /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-muted-foreground mb-1", children: t("sections.output") }),
-      /* @__PURE__ */ jsx(CodeBlock, { code: stringify(part.output), language: "json", children: /* @__PURE__ */ jsx(CodeBlockCopyButton, {}) })
+      /* @__PURE__ */ jsx(CodeBlock, { code: stringify2(part.output), language: "json", children: /* @__PURE__ */ jsx(CodeBlockCopyButton, {}) })
     ] }) });
   }
   if (part.state === "output-error") {
@@ -14295,7 +14552,8 @@ var INTERACTIVE_GENERATIVE_TOOLS = /* @__PURE__ */ new Set([
   "requestUserInput",
   "createRecord",
   "updateRecord",
-  "viewRecord"
+  "viewRecord",
+  "deleteRecord"
 ]);
 function CopyButton({ text }) {
   const { t } = useAssistantTranslation();
@@ -14376,7 +14634,8 @@ var MessageItem = memo(({
           onToolAction: onToolAction ?? (() => {
           }),
           openCanvasView,
-          onForwardToAgent
+          onForwardToAgent,
+          subagents: agents
         },
         `${messageId}-gentool-${idx}`
       );
@@ -14614,7 +14873,8 @@ function ChatPanel({
   onSessionClick,
   threadId,
   initialModelId,
-  initialFeatures
+  initialFeatures,
+  subagents
 }) {
   const renderInputArea = (hideFooter = false) => /* @__PURE__ */ jsx(
     AIInputArea,
@@ -14707,6 +14967,7 @@ function ChatPanel({
         welcomeMessage,
         isLoadingAgent,
         agentId: tenantAiAgentId,
+        agents: subagents,
         onToolAction,
         openCanvasView,
         onEditPrompt,
@@ -17637,7 +17898,7 @@ var buttonVariants = cva(
     }
   }
 );
-var Button30 = withTooltip(({
+var Button31 = withTooltip(({
   active,
   asChild = false,
   children,
@@ -18245,7 +18506,7 @@ function AIMenu() {
               }
             ),
             /* @__PURE__ */ jsx(
-              Button30,
+              Button31,
               {
                 className: "no-focus-ring mt-1 shrink-0",
                 disabled: !isLoading && input.trim().length === 0,
@@ -19119,7 +19380,7 @@ function Comment(props) {
           ] }),
           isMyComment && (hovering || dropdownOpen) && /* @__PURE__ */ jsxs("div", { className: "absolute top-0 right-0 flex space-x-1", children: [
             index === 0 && /* @__PURE__ */ jsx(
-              Button30,
+              Button31,
               {
                 className: "h-6 p-1 text-muted-foreground",
                 onClick: onResolveComment,
@@ -19168,7 +19429,7 @@ function Comment(props) {
             ),
             isEditing && /* @__PURE__ */ jsxs("div", { className: "ml-auto flex shrink-0 gap-1", children: [
               /* @__PURE__ */ jsx(
-                Button30,
+                Button31,
                 {
                   className: "size-[28px]",
                   onClick: (e) => {
@@ -19181,7 +19442,7 @@ function Comment(props) {
                 }
               ),
               /* @__PURE__ */ jsx(
-                Button30,
+                Button31,
                 {
                   onClick: (e) => {
                     e.stopPropagation();
@@ -19249,7 +19510,7 @@ function CommentMoreDropdown(props) {
       onOpenChange: setDropdownOpen,
       open: dropdownOpen,
       children: [
-        /* @__PURE__ */ jsx(DropdownMenuTrigger3, { asChild: true, onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(Button30, { className: cn("h-6 p-1 text-muted-foreground"), variant: "ghost", children: /* @__PURE__ */ jsx(MoreHorizontalIcon, { className: "size-4" }) }) }),
+        /* @__PURE__ */ jsx(DropdownMenuTrigger3, { asChild: true, onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(Button31, { className: cn("h-6 p-1 text-muted-foreground"), variant: "ghost", children: /* @__PURE__ */ jsx(MoreHorizontalIcon, { className: "size-4" }) }) }),
         /* @__PURE__ */ jsx(
           DropdownMenuContent3,
           {
@@ -19421,7 +19682,7 @@ function CommentCreateForm({
             }
           ),
           /* @__PURE__ */ jsx(
-            Button30,
+            Button31,
             {
               className: "absolute right-0 bottom-0 ml-auto shrink-0",
               disabled: commentContent.trim().length === 0,
@@ -19755,7 +20016,7 @@ function BlockSuggestionCard({
           )),
           hovering && /* @__PURE__ */ jsxs("div", { className: "absolute top-4 right-4 flex gap-2", children: [
             /* @__PURE__ */ jsx(
-              Button30,
+              Button31,
               {
                 variant: "ghost",
                 className: "size-6 p-1 text-muted-foreground",
@@ -19764,7 +20025,7 @@ function BlockSuggestionCard({
               }
             ),
             /* @__PURE__ */ jsx(
-              Button30,
+              Button31,
               {
                 variant: "ghost",
                 className: "size-6 p-1 text-muted-foreground",
@@ -20234,7 +20495,7 @@ var BlockCommentsContent = ({
           }
         ),
         totalCount > 0 && /* @__PURE__ */ jsx("div", { className: "relative left-0 size-0 select-none", children: /* @__PURE__ */ jsx(PopoverTrigger11, { asChild: true, children: /* @__PURE__ */ jsxs(
-          Button30,
+          Button31,
           {
             className: "mt-1 ml-1 flex h-6 gap-1 px-1.5 py-0 text-muted-foreground/80 hover:text-muted-foreground/80 data-[active=true]:bg-muted",
             contentEditable: false,
@@ -22150,7 +22411,7 @@ function BlockActionButton({
   const editor = useEditorRef();
   const element = useElement();
   return /* @__PURE__ */ jsx(
-    Button30,
+    Button31,
     {
       className: cn(
         defaultStyles && "absolute top-1 right-1 opacity-0 transition-opacity group-hover:opacity-100",
@@ -22489,7 +22750,7 @@ function EmojiPickerSearchAndClear({
       }
     ),
     searchValue && /* @__PURE__ */ jsx(
-      Button30,
+      Button31,
       {
         "aria-label": "Clear",
         className: cn(
@@ -22578,7 +22839,7 @@ function EmojiPickerNavigation({
       id: "emoji-nav",
       children: /* @__PURE__ */ jsxs("div", { className: "relative flex items-center", children: [
         emojiLibrary.getGrid().sections().map(({ id }) => /* @__PURE__ */ jsx(
-          Button30,
+          Button31,
           {
             "aria-label": i18n.categories[id],
             className: cn(
@@ -22740,7 +23001,7 @@ function CalloutElement(props) {
           {
             ...emojiToolbarDropdownProps,
             control: /* @__PURE__ */ jsx(
-              Button30,
+              Button31,
               {
                 className: "size-6 select-none p-1 text-[18px] hover:bg-muted-foreground/15",
                 contentEditable: false,
@@ -22979,7 +23240,7 @@ function CodeBlockElement(props) {
             contentEditable: false,
             children: [
               /* @__PURE__ */ jsxs(
-                Button30,
+                Button31,
                 {
                   className: "relative top-0 right-0 w-auto",
                   onClick: () => {
@@ -23024,7 +23285,7 @@ function CodeBlockCombobox({ className }) {
   if (readOnly) return null;
   return /* @__PURE__ */ jsxs(Popover11, { onOpenChange: setOpen, open, children: [
     /* @__PURE__ */ jsx(PopoverTrigger11, { asChild: true, children: /* @__PURE__ */ jsxs(
-      Button30,
+      Button31,
       {
         "aria-expanded": open,
         className: cn(
@@ -23385,7 +23646,7 @@ function Draggable(props) {
                 ),
                 children: [
                   /* @__PURE__ */ jsx(
-                    Button30,
+                    Button31,
                     {
                       className: "absolute right-0 h-6 w-6 p-0",
                       "data-plate-prevent-deselect": true,
@@ -23572,7 +23833,7 @@ var DraggableInsertHandle = () => {
   const editor = useEditorRef();
   const element = useElement();
   return /* @__PURE__ */ jsx(
-    Button30,
+    Button31,
     {
       className: "size-6 shrink-0 p-1",
       onClick: (event) => {
@@ -24803,7 +25064,7 @@ function EquationPopoverContent({
             ...props
           }
         ),
-        /* @__PURE__ */ jsxs(Button30, { className: "px-3", onClick: onClose, variant: "brand", children: [
+        /* @__PURE__ */ jsxs(Button31, { className: "px-3", onClick: onClose, variant: "brand", children: [
           "Done ",
           /* @__PURE__ */ jsx(CornerDownLeftIcon, { className: "size-3.5" })
         ] })
@@ -25681,7 +25942,7 @@ function MediaPlaceholderPopover({ children }) {
             /* @__PURE__ */ jsx(TabsTrigger, { value: "password", children: "Embed link" })
           ] }),
           /* @__PURE__ */ jsxs(TabsContent, { className: "w-[300px] px-3 py-2", value: "account", children: [
-            /* @__PURE__ */ jsx(Button30, { className: "w-full", onClick: openFilePicker, variant: "brand", children: currentMedia.buttonText }),
+            /* @__PURE__ */ jsx(Button31, { className: "w-full", onClick: openFilePicker, variant: "brand", children: currentMedia.buttonText }),
             /* @__PURE__ */ jsx("div", { className: "mt-3 text-muted-foreground text-xs", children: "The maximum size per file is 5MB" })
           ] }),
           /* @__PURE__ */ jsxs(
@@ -25699,7 +25960,7 @@ function MediaPlaceholderPopover({ children }) {
                   }
                 ),
                 /* @__PURE__ */ jsx(
-                  Button30,
+                  Button31,
                   {
                     className: "mt-2 w-full max-w-[300px]",
                     onClick: () => onEmbed(embedValue),
@@ -25819,12 +26080,12 @@ function ImagePreview() {
             onClick: (e) => e.stopPropagation(),
             children: [
               !prevDisabled && !nextDisabled && /* @__PURE__ */ jsxs("div", { className: "flex rounded-sm bg-black/70", children: [
-                /* @__PURE__ */ jsx(Button30, { ...prevProps, disabled: prevDisabled, children: /* @__PURE__ */ jsx(ArrowLeftIcon, { className: "size-5" }) }),
-                /* @__PURE__ */ jsx(Button30, { ...nextProps, disabled: nextDisabled, children: /* @__PURE__ */ jsx(ArrowRightIcon, { className: "size-5" }) })
+                /* @__PURE__ */ jsx(Button31, { ...prevProps, disabled: prevDisabled, children: /* @__PURE__ */ jsx(ArrowLeftIcon, { className: "size-5" }) }),
+                /* @__PURE__ */ jsx(Button31, { ...nextProps, disabled: nextDisabled, children: /* @__PURE__ */ jsx(ArrowRightIcon, { className: "size-5" }) })
               ] }),
               currentPreview && /* @__PURE__ */ jsxs("div", { className: "flex rounded-sm bg-black/70", children: [
                 /* @__PURE__ */ jsx(
-                  Button30,
+                  Button31,
                   {
                     ...zommOutProps,
                     disabled: zoomOutDisabled,
@@ -25837,7 +26098,7 @@ function ImagePreview() {
                   /* @__PURE__ */ jsx("div", { children: "%" })
                 ] }),
                 /* @__PURE__ */ jsx(
-                  Button30,
+                  Button31,
                   {
                     ...zoomInProps,
                     disabled: zoomInDisabled,
@@ -25846,7 +26107,7 @@ function ImagePreview() {
                   }
                 ),
                 /* @__PURE__ */ jsx(
-                  Button30,
+                  Button31,
                   {
                     onClick: () => {
                       void downloadFile(currentPreview.url, currentPreview.id);
@@ -25855,7 +26116,7 @@ function ImagePreview() {
                     children: /* @__PURE__ */ jsx(CircleArrowDown, { className: "size-4" })
                   }
                 ),
-                /* @__PURE__ */ jsx(Button30, { ...closeProps, tooltip: "Close", children: /* @__PURE__ */ jsx(Minimize2, { className: "size-4" }) })
+                /* @__PURE__ */ jsx(Button31, { ...closeProps, tooltip: "Close", children: /* @__PURE__ */ jsx(Minimize2, { className: "size-4" }) })
               ] })
             ]
           }
@@ -26495,7 +26756,7 @@ var TableElement = withHOC(
                   "group-has-[tr:last-child:hover]/table:opacity-100 max-sm:group-has-[tr[data-selected]:last-child]/table:opacity-100"
                 ),
                 children: /* @__PURE__ */ jsx(
-                  Button30,
+                  Button31,
                   {
                     className: "flex h-4 w-full grow items-center justify-center bg-muted",
                     onClick: () => tf.insert.tableRow({ at: editor.api.findPath(element) }),
@@ -26517,7 +26778,7 @@ var TableElement = withHOC(
                   "group-has-[td:last-child:hover,th:last-child:hover]/table:opacity-100 max-sm:group-has-[td[data-selected]:last-child,th[data-selected]:last-child]/table:opacity-100"
                 ),
                 children: /* @__PURE__ */ jsx(
-                  Button30,
+                  Button31,
                   {
                     className: "flex h-full w-4 grow items-center justify-center bg-muted",
                     onClick: () => tf.insert.tableColumn({
@@ -26541,7 +26802,7 @@ var TableElement = withHOC(
                   "group-has-[td:last-child:hover,th:last-child:hover]/table:group-has-[tr:last-child:hover]/table:opacity-100 max-sm:group-has-[td[data-selected]:last-child,th[data-selected]:last-child]/table:group-has-[tr[data-selected]:last-child]/table:opacity-100"
                 ),
                 children: /* @__PURE__ */ jsx(
-                  Button30,
+                  Button31,
                   {
                     className: "flex size-4 items-center justify-center rounded-full bg-muted",
                     onClick: () => {
@@ -26747,7 +27008,7 @@ function TocElement(props) {
   const { headingList } = state;
   return /* @__PURE__ */ jsxs(PlateElement, { ...props, className: "my-1", children: [
     /* @__PURE__ */ jsx("div", { contentEditable: false, children: headingList.length > 0 ? headingList.map((item) => /* @__PURE__ */ jsx(
-      Button30,
+      Button31,
       {
         "aria-current": true,
         className: headingItemVariants({ depth: item.depth }),
@@ -27849,7 +28110,7 @@ function TocElementStatic(props) {
   const headingList = getHeadingList(editor);
   return /* @__PURE__ */ jsxs(SlateElement, { ...props, className: "mb-1 p-0", children: [
     /* @__PURE__ */ jsx("div", { children: headingList.length > 0 ? headingList.map((item) => /* @__PURE__ */ jsx(
-      Button30,
+      Button31,
       {
         className: headingItemVariants2({ depth: item.depth }),
         variant: "ghost",
@@ -29816,6 +30077,7 @@ var AssistantView = ({ ref, ...props }) => {
         threadId: commonProps2.threadId,
         initialModelId: commonProps2.initialModelId,
         initialFeatures: commonProps2.initialFeatures,
+        subagents: commonProps2.subagents,
         messagesClassName: "p-4"
       }
     );
@@ -30275,6 +30537,7 @@ var AssistantView = ({ ref, ...props }) => {
                   threadId: commonProps.threadId,
                   initialModelId: commonProps.initialModelId,
                   initialFeatures: commonProps.initialFeatures,
+                  subagents: commonProps.subagents,
                   compactToolbar: !isFullscreen
                 }
               )
@@ -31789,7 +32052,7 @@ var DocyAssistant = ({
   ]);
   const apiClientRef = useRef(apiClient);
   apiClientRef.current = apiClient;
-  const { agentDetails, isLoadingAgentDetails } = useAssistantApi({
+  const { agentDetails, isLoadingAgentDetails, subagents } = useAssistantApi({
     tenantAiAgentId: activeAgentId,
     deploymentId,
     logo,
@@ -32210,6 +32473,7 @@ var DocyAssistant = ({
       supportMultiModels,
       deploymentId,
       tenantAiAgentId: activeAgentId,
+      subagents,
       initialModelId,
       initialFeatures,
       enableMicrophone,