@cntyclub/agent-react 0.4.0 → 0.6.0

package/dist/index.js

@@ -1,6 +1,6 @@
-import { ChatMessage, ChatMessageBubble, Markdown, ChatToolChip, DataTablePaged, ChatToolCard, ChatToolCardHeader, ChatToolCardActions, Button, Spinner, ChatHeader, ChatHeaderAvatar, ChatHeaderTitle, ChatHeaderActions, Tooltip, TooltipTrigger, TooltipContent, Chat, ChatMessages, ChatEmptyState, ChatEmptyStateIcon, ChatEmptyStateTitle, ChatEmptyStateDescription, ChatSuggestions, ChatSuggestion, ChatTypingIndicator, cn, ChatInput, useMediaQuery, TooltipProvider, Fab } from '@cntyclub/ui-react';
-import { WrenchIcon, CheckIcon, ShieldAlertIcon, HistoryIcon, SquarePenIcon, Minimize2Icon, Maximize2Icon, XIcon, Trash2Icon, SparklesIcon } from 'lucide-react';
-import * as React2 from 'react';
+import { Button, cn, ChatMessage, ChatMessageBubble, Markdown, Spinner, Checkbox, Collapsible, CollapsibleTrigger, ChatToolChip, CollapsiblePanel, ChatToolCard, ChatToolCardHeader, ChatToolCardActions, Group, Menu, MenuTrigger, MenuPopup, MenuItem, ChatHeader, ChatHeaderAvatar, ChatHeaderTitle, ChatHeaderActions, Tooltip, TooltipTrigger, TooltipContent, Chat, ChatMessages, ChatEmptyState, ChatEmptyStateIcon, ChatEmptyStateTitle, ChatEmptyStateDescription, ChatSuggestions, ChatSuggestion, ChatTypingIndicator, useMediaQuery, TooltipProvider, Fab, DataTablePaged } from '@cntyclub/ui-react';
+import { FileTextIcon, XIcon, PaperclipIcon, ArrowUpIcon, Maximize2Icon, ListChecksIcon, ChevronDownIcon, CheckIcon, ShieldAlertIcon, CheckCheckIcon, UploadCloudIcon, HistoryIcon, SquarePenIcon, Minimize2Icon, Trash2Icon, SparklesIcon, DownloadIcon, CodeIcon } from 'lucide-react';
+import * as React5 from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // src/api-client.ts
@@ -25,13 +25,15 @@ var AgentApiClient = class {
     const base = this.config.apiBaseUrl.replace(/\/$/, "");
     const separator = path.includes("?") ? "&" : "?";
     const url = `${base}${path}${separator}client_id=${encodeURIComponent(this.config.clientId)}`;
+    const isFormData = typeof FormData !== "undefined" && options.body instanceof FormData;
+    const headers = {
+      Authorization: `Bearer ${token}`,
+      "X-Agent-Client-Id": this.config.clientId
+    };
+    if (!isFormData) headers["Content-Type"] = "application/json";
     const response = await fetch(url, {
-      body: options.body === void 0 ? void 0 : JSON.stringify(options.body),
-      headers: {
-        Authorization: `Bearer ${token}`,
-        "Content-Type": "application/json",
-        "X-Agent-Client-Id": this.config.clientId
-      },
+      body: options.body === void 0 ? void 0 : isFormData ? options.body : JSON.stringify(options.body),
+      headers,
       method: options.method ?? "GET"
     });
     if (response.status === 204) return void 0;
@@ -49,7 +51,15 @@ var AgentApiClient = class {
   getConfig() {
     return this.request("/agent-mode/config/");
   }
-  sendMessage(message, conversationId) {
+  sendMessage(message, conversationId, files) {
+    if (files && files.length > 0) {
+      const form = new FormData();
+      form.append("client_id", this.config.clientId);
+      form.append("message", message);
+      if (conversationId) form.append("conversation_id", conversationId);
+      for (const file of files) form.append("files", file, file.name);
+      return this.request("/agent-mode/chat/", { body: form, method: "POST" });
+    }
     return this.request("/agent-mode/chat/", {
       body: {
         client_id: this.config.clientId,
@@ -77,6 +87,268 @@ var AgentApiClient = class {
     });
   }
 };
+
+// src/file-support.ts
+var DEFAULT_ACCEPT = [".txt", ".md", ".markdown", ".csv", ".tsv", ".log", ".docx"];
+var DEFAULT_MAX_SIZE_MB = 5;
+function fileUploadEnabled(config) {
+  return config.fileUpload?.enabled !== false;
+}
+function acceptedExtensions(config) {
+  const accept = config.fileUpload?.accept;
+  return accept && accept.length > 0 ? accept.map((ext) => ext.toLowerCase()) : DEFAULT_ACCEPT;
+}
+function maxSizeMb(config) {
+  return config.fileUpload?.maxSizeMb ?? DEFAULT_MAX_SIZE_MB;
+}
+function acceptAttribute(config) {
+  return acceptedExtensions(config).join(",");
+}
+function extensionOf(filename) {
+  const dot = filename.lastIndexOf(".");
+  return dot >= 0 ? filename.slice(dot).toLowerCase() : "";
+}
+function validateFile(config, file) {
+  const extensions = acceptedExtensions(config);
+  if (!extensions.includes(extensionOf(file.name))) {
+    return `\u201C${file.name}\u201D isn\u2019t a supported text file. Allowed: ${extensions.join(", ")}.`;
+  }
+  const limit = maxSizeMb(config);
+  if (file.size > limit * 1024 * 1024) {
+    return `\u201C${file.name}\u201D is too large (max ${limit} MB).`;
+  }
+  return null;
+}
+function formatBytes(bytes) {
+  if (!bytes && bytes !== 0) return "";
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${Math.round(bytes / 1024)} KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+function AgentComposer({
+  acceptAttribute: acceptAttribute2,
+  className,
+  disabled,
+  files,
+  onPickFiles,
+  onRemoveFile,
+  onSubmit,
+  onValueChange,
+  placeholder = "Ask anything\u2026",
+  value
+}) {
+  const textareaRef = React5.useRef(null);
+  const inputRef = React5.useRef(null);
+  const canSubmit = !disabled && (value.trim().length > 0 || files.length > 0);
+  const submit = React5.useCallback(() => {
+    if (!canSubmit) return;
+    onSubmit(value.trim());
+  }, [canSubmit, onSubmit, value]);
+  React5.useEffect(() => {
+    const textarea = textareaRef.current;
+    if (!textarea) return;
+    textarea.style.height = "auto";
+    textarea.style.height = `${Math.min(textarea.scrollHeight, 144)}px`;
+  }, [value]);
+  const handlePick = (event) => {
+    const picked = Array.from(event.target.files ?? []);
+    if (picked.length) onPickFiles?.(picked);
+    event.target.value = "";
+  };
+  return /* @__PURE__ */ jsx(
+    "form",
+    {
+      className: cn("shrink-0 bg-background p-3 pt-1.5", className),
+      "data-slot": "agent-composer",
+      onSubmit: (event) => {
+        event.preventDefault();
+        submit();
+      },
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "flex flex-col gap-1.5 rounded-2xl border border-input bg-popover p-1.5 shadow-xs transition-[border-color,box-shadow] duration-150 focus-within:border-ring/64 focus-within:ring-2 focus-within:ring-ring/24 dark:bg-input/32",
+            disabled && "opacity-64"
+          ),
+          children: [
+            files.length > 0 ? /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1.5 px-1 pt-1", children: files.map((file, index) => /* @__PURE__ */ jsxs(
+              "span",
+              {
+                className: "flex max-w-52 items-center gap-1.5 rounded-lg border border-border/72 bg-muted/48 py-1 pr-1 pl-2 text-xs",
+                children: [
+                  /* @__PURE__ */ jsx(FileTextIcon, { className: "size-3.5 shrink-0 text-muted-foreground" }),
+                  /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate", children: file.name }),
+                  /* @__PURE__ */ jsx("span", { className: "shrink-0 text-muted-foreground", children: formatBytes(file.size) }),
+                  onRemoveFile ? /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      "aria-label": `Remove ${file.name}`,
+                      className: "flex size-4 shrink-0 cursor-pointer items-center justify-center rounded-full text-muted-foreground hover:bg-background hover:text-foreground [&_svg]:size-3",
+                      onClick: () => onRemoveFile(index),
+                      type: "button",
+                      children: /* @__PURE__ */ jsx(XIcon, {})
+                    }
+                  ) : null
+                ]
+              },
+              `${file.name}-${index}`
+            )) }) : null,
+            /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-1.5", children: [
+              onPickFiles ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    accept: acceptAttribute2,
+                    className: "hidden",
+                    multiple: true,
+                    onChange: handlePick,
+                    ref: inputRef,
+                    type: "file"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    "aria-label": "Attach files",
+                    className: "shrink-0",
+                    disabled,
+                    onClick: () => inputRef.current?.click(),
+                    size: "icon-sm",
+                    type: "button",
+                    variant: "ghost",
+                    children: /* @__PURE__ */ jsx(PaperclipIcon, {})
+                  }
+                )
+              ] }) : null,
+              /* @__PURE__ */ jsx(
+                "textarea",
+                {
+                  className: "max-h-36 min-h-8 flex-1 resize-none self-center bg-transparent py-1.5 pl-1.5 text-sm outline-none placeholder:text-muted-foreground",
+                  disabled,
+                  onChange: (event) => onValueChange(event.target.value),
+                  onKeyDown: (event) => {
+                    if (event.key === "Enter" && !event.shiftKey) {
+                      event.preventDefault();
+                      submit();
+                    }
+                  },
+                  placeholder,
+                  ref: textareaRef,
+                  rows: 1,
+                  value
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  "aria-label": "Send message",
+                  className: "shrink-0 rounded-full before:rounded-full",
+                  disabled: !canSubmit,
+                  size: "icon-sm",
+                  type: "submit",
+                  children: /* @__PURE__ */ jsx(ArrowUpIcon, {})
+                }
+              )
+            ] })
+          ]
+        }
+      )
+    }
+  );
+}
+
+// src/message-group.ts
+function groupMessages(messages) {
+  const items = [];
+  let group = null;
+  let groupKey = "";
+  const stepIndexByCallId = /* @__PURE__ */ new Map();
+  const flush = () => {
+    if (group && group.length > 0) {
+      items.push({ key: `tools-${groupKey}`, kind: "tool-activity", steps: group });
+    }
+    group = null;
+    groupKey = "";
+    stepIndexByCallId.clear();
+  };
+  for (const message of messages) {
+    if (message.role === "user") {
+      flush();
+      items.push({ key: message.id, kind: "user", message });
+      continue;
+    }
+    if (message.role === "assistant") {
+      const hasText = Boolean(message.content && message.content.trim());
+      if (hasText) {
+        flush();
+        items.push({ key: message.id, kind: "assistant-text", message });
+      }
+      for (const toolCall of message.tool_calls ?? []) {
+        const callId2 = toolCall.id ?? `${message.id}-${toolCall.name}`;
+        if (!group) {
+          group = [];
+          groupKey = message.id;
+        }
+        stepIndexByCallId.set(callId2, group.length);
+        group.push({
+          args: toolCall.arguments ?? {},
+          callId: callId2,
+          name: toolCall.name ?? "tool",
+          status: "running"
+        });
+      }
+      continue;
+    }
+    const callId = message.tool_call_id ?? "";
+    if (!group) {
+      group = [];
+      groupKey = message.id;
+    }
+    const existingIndex = callId ? stepIndexByCallId.get(callId) : void 0;
+    if (existingIndex !== void 0) {
+      const step = group[existingIndex];
+      step.status = "done";
+      step.result = message.result || step.result;
+      step.blocks = message.blocks ?? step.blocks;
+    } else {
+      group.push({
+        args: {},
+        blocks: message.blocks,
+        callId: callId || message.id,
+        name: message.tool_name ?? "tool",
+        result: message.result,
+        status: "done"
+      });
+    }
+  }
+  flush();
+  return items;
+}
+function MessageItem({ message }) {
+  if (message.role === "user") {
+    const attachments = message.attachments ?? [];
+    return /* @__PURE__ */ jsxs(ChatMessage, { from: "user", children: [
+      attachments.length > 0 ? /* @__PURE__ */ jsx("div", { className: "flex flex-wrap justify-end gap-1.5", children: attachments.map((attachment) => /* @__PURE__ */ jsxs(
+        "span",
+        {
+          className: "flex max-w-52 items-center gap-1.5 rounded-lg border border-border/72 bg-muted/48 px-2 py-1 text-muted-foreground text-xs",
+          children: [
+            /* @__PURE__ */ jsx(FileTextIcon, { className: "size-3.5 shrink-0" }),
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate", children: attachment.filename })
+          ]
+        },
+        attachment.id
+      )) }) : null,
+      message.content ? /* @__PURE__ */ jsx(ChatMessageBubble, { from: "user", children: message.content }) : null
+    ] });
+  }
+  if (message.role === "assistant") {
+    if (!message.content || !message.content.trim()) return null;
+    return /* @__PURE__ */ jsx(ChatMessage, { from: "assistant", children: /* @__PURE__ */ jsx(ChatMessageBubble, { from: "assistant", children: /* @__PURE__ */ jsx(Markdown, { children: message.content }) }) });
+  }
+  return null;
+}
 var NOISE_KEYS = /* @__PURE__ */ new Set([
   "id",
   "pk",
@@ -215,87 +487,328 @@ function toDisplayTable(block) {
   });
   return { columns, rows: displayRows };
 }
+
+// src/tool-presentation.ts
 function humanizeToolName(toolName) {
   return toolName.replace(/^[a-z]+_/, "").replaceAll("_", " ");
 }
-function MessageItem({ message }) {
-  if (message.role === "user") {
-    return /* @__PURE__ */ jsx(ChatMessage, { from: "user", children: /* @__PURE__ */ jsx(ChatMessageBubble, { from: "user", children: message.content }) });
+var UUID_RE2 = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+function isTechnicalKey(key) {
+  const lower = key.toLowerCase();
+  return lower === "id" || lower === "client_id" || lower === "slug" || lower.endsWith("_id") || lower.endsWith("_ids") || lower.endsWith("_key") || lower.endsWith("_slug") || lower.endsWith("_uuid") || lower === "uuid" || lower.endsWith("_s3_key") || lower === "embedding";
+}
+function isTechnicalValue(value) {
+  return typeof value === "string" && UUID_RE2.test(value.trim());
+}
+function humanizeKey(key) {
+  const spaced = key.replaceAll("_", " ").trim();
+  return spaced.charAt(0).toUpperCase() + spaced.slice(1);
+}
+function formatValue(value) {
+  if (value === null || value === void 0) return "\u2014";
+  if (typeof value === "boolean") return value ? "Yes" : "No";
+  if (typeof value === "string" || typeof value === "number") return String(value);
+  if (Array.isArray(value)) {
+    const items = value.filter((item) => !isTechnicalValue(item)).map((item) => formatValue(item));
+    return items.length ? items.join(", ") : `${value.length} item${value.length === 1 ? "" : "s"}`;
   }
-  if (message.role === "assistant") {
-    const requestedTools = message.tool_calls ?? [];
-    if (!message.content && requestedTools.length === 0) return null;
-    return /* @__PURE__ */ jsxs(ChatMessage, { from: "assistant", children: [
-      message.content ? /* @__PURE__ */ jsx(ChatMessageBubble, { from: "assistant", children: /* @__PURE__ */ jsx(Markdown, { children: message.content }) }) : null,
-      requestedTools.map((toolCall) => /* @__PURE__ */ jsxs(ChatToolChip, { icon: /* @__PURE__ */ jsx(WrenchIcon, {}), children: [
-        "Using ",
-        humanizeToolName(toolCall.name ?? "tool"),
-        "\u2026"
-      ] }, toolCall.id ?? toolCall.name))
-    ] });
+  if (typeof value === "object") {
+    const record = value;
+    for (const key of ["name", "title", "label", "email"]) {
+      if (typeof record[key] === "string") return record[key];
+    }
+    return JSON.stringify(value);
+  }
+  return String(value);
+}
+function deriveDetails(args) {
+  const details = [];
+  for (const [key, value] of Object.entries(args ?? {})) {
+    if (isTechnicalKey(key)) continue;
+    if (isTechnicalValue(value)) continue;
+    if (value === "" || value === null || value === void 0) continue;
+    const formatted = formatValue(value);
+    if (!formatted || formatted === "\u2014") continue;
+    details.push({ label: humanizeKey(key), value: formatted.length > 140 ? `${formatted.slice(0, 140)}\u2026` : formatted });
+  }
+  return details;
+}
+function resolveToolPresentation(describe, toolName, args) {
+  let description;
+  try {
+    description = describe?.(toolName, args ?? {});
+  } catch {
+    description = null;
+  }
+  const title = description?.title?.trim() || humanizeToolName(toolName);
+  const summary = description?.summary?.trim() || null;
+  let details = description?.details ?? [];
+  const wantsDerived = description?.showDerivedDetails ?? description?.details === void 0;
+  if (details.length === 0 && wantsDerived) {
+    details = deriveDetails(args ?? {});
   }
-  const tableBlocks = (message.blocks ?? []).filter((block) => block.type === "table");
-  return /* @__PURE__ */ jsx(ChatMessage, { from: "assistant", children: tableBlocks.length > 0 ? tableBlocks.map((block, index) => {
-    const { columns, rows } = toDisplayTable(block);
+  return { details, summary, title };
+}
+function DownloadButton({ block, size = "sm" }) {
+  if (!block.download_url) {
+    return /* @__PURE__ */ jsx(Button, { disabled: true, size, variant: "outline", children: size === "icon-sm" ? /* @__PURE__ */ jsx(DownloadIcon, {}) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(DownloadIcon, {}),
+      " Download"
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      render: (
+        // eslint-disable-next-line jsx-a11y/anchor-has-content
+        /* @__PURE__ */ jsx("a", { download: block.filename, href: block.download_url, rel: "noopener noreferrer", target: "_blank" })
+      ),
+      size,
+      variant: size === "icon-sm" ? "outline" : "default",
+      children: [
+        /* @__PURE__ */ jsx(DownloadIcon, {}),
+        size === "icon-sm" ? null : "Download"
+      ]
+    }
+  );
+}
+function DocumentViewer({ block, onClose }) {
+  React5.useEffect(() => {
+    const onKey = (event) => event.key === "Escape" && onClose();
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [onClose]);
+  return /* @__PURE__ */ jsxs("div", { "aria-modal": "true", className: "fixed inset-0 z-[60] flex flex-col bg-background", role: "dialog", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2 border-border/72 border-b px-4 py-3", children: [
+      /* @__PURE__ */ jsx(FileTextIcon, { className: "size-4 shrink-0 text-muted-foreground" }),
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx("div", { className: "truncate font-medium text-sm", children: block.title || block.filename }),
+        /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground text-xs uppercase", children: [
+          block.format,
+          block.size_bytes ? ` \xB7 ${formatBytes(block.size_bytes)}` : ""
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(DownloadButton, { block }),
+      /* @__PURE__ */ jsx(Button, { "aria-label": "Close preview", onClick: onClose, size: "icon-sm", variant: "ghost", children: /* @__PURE__ */ jsx(XIcon, {}) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4", children: /* @__PURE__ */ jsxs("pre", { className: "mx-auto max-w-3xl whitespace-pre-wrap break-words font-mono text-xs leading-relaxed text-foreground", children: [
+      block.preview || "(no preview available \u2014 download to view)",
+      block.preview_truncated ? "\n\n\u2026 preview truncated. Download for the full file." : ""
+    ] }) })
+  ] });
+}
+function DocumentCard({ block }) {
+  const [open, setOpen] = React5.useState(false);
+  const previewLines = (block.preview || "").split("\n").slice(0, 6).join("\n");
+  return /* @__PURE__ */ jsxs("div", { className: "w-full max-w-full overflow-hidden rounded-xl border border-border bg-card shadow-xs", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-border/72 border-b px-3 py-2", children: [
+      /* @__PURE__ */ jsx("span", { className: "flex size-7 shrink-0 items-center justify-center rounded-lg bg-primary/8 text-primary [&_svg]:size-4", children: /* @__PURE__ */ jsx(FileTextIcon, {}) }),
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx("div", { className: "truncate font-medium text-sm", children: block.title || block.filename }),
+        /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground text-xs uppercase", children: [
+          block.format,
+          block.size_bytes ? ` \xB7 ${formatBytes(block.size_bytes)}` : ""
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Button, { "aria-label": "Preview", onClick: () => setOpen(true), size: "icon-sm", variant: "ghost", children: /* @__PURE__ */ jsx(Maximize2Icon, {}) }),
+      /* @__PURE__ */ jsx(DownloadButton, { block, size: "icon-sm" })
+    ] }),
+    previewLines ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: cn(
+          "block w-full cursor-pointer px-3 py-2 text-left transition-colors hover:bg-accent/40"
+        ),
+        onClick: () => setOpen(true),
+        type: "button",
+        children: /* @__PURE__ */ jsx("pre", { className: "max-h-28 overflow-hidden whitespace-pre-wrap break-words font-mono text-[11px] leading-snug text-muted-foreground", children: previewLines })
+      }
+    ) : null,
+    open ? /* @__PURE__ */ jsx(DocumentViewer, { block, onClose: () => setOpen(false) }) : null
+  ] });
+}
+function TaskChecklist({ tasks }) {
+  if (!tasks || tasks.length === 0) return null;
+  const done = tasks.filter((task) => task.status === "done").length;
+  return /* @__PURE__ */ jsxs("div", { className: "w-full max-w-full rounded-xl border border-border bg-card p-3 shadow-xs", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center gap-1.5 font-medium text-sm", children: [
+      /* @__PURE__ */ jsx(ListChecksIcon, { className: "size-4 text-muted-foreground" }),
+      "Tasks",
+      /* @__PURE__ */ jsxs("span", { className: "ml-auto text-muted-foreground text-xs", children: [
+        done,
+        "/",
+        tasks.length
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-1.5", children: tasks.map((task, index) => /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-2 text-sm", children: [
+      task.status === "in_progress" ? /* @__PURE__ */ jsx("span", { className: "flex size-4 shrink-0 items-center justify-center [&_svg]:size-3.5", children: /* @__PURE__ */ jsx(Spinner, {}) }) : /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          "aria-hidden": true,
+          checked: task.status === "done",
+          className: "pointer-events-none shrink-0",
+          readOnly: true,
+          tabIndex: -1
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(
+            "min-w-0",
+            task.status === "done" && "text-muted-foreground line-through",
+            task.status === "in_progress" && "font-medium"
+          ),
+          children: task.title
+        }
+      )
+    ] }, `${index}-${task.title}`)) })
+  ] });
+}
+function StepBlocks({ blocks, stepKey }) {
+  const visible = (blocks ?? []).filter(
+    (block) => block.type === "table" || block.type === "document" || block.type === "tasks"
+  );
+  if (visible.length === 0) return null;
+  return /* @__PURE__ */ jsx(Fragment, { children: visible.map((block, index) => {
+    const key = `${stepKey}-block-${index}`;
+    if (block.type === "document") {
+      return /* @__PURE__ */ jsx(DocumentCard, { block }, key);
+    }
+    if (block.type === "tasks") {
+      return /* @__PURE__ */ jsx(TaskChecklist, { tasks: block.tasks }, key);
+    }
+    const table = block;
+    const { columns, rows } = toDisplayTable(table);
     return /* @__PURE__ */ jsx("div", { className: "w-full max-w-full", children: /* @__PURE__ */ jsx(
       DataTablePaged,
       {
         columns,
         pageSize: 8,
         rows,
-        totalCount: typeof block.pagination?.count === "number" ? block.pagination.count : block.row_count
+        totalCount: typeof table.pagination?.count === "number" ? table.pagination.count : table.row_count
       }
-    ) }, `${message.id}-${index}`);
-  }) : /* @__PURE__ */ jsxs(ChatToolChip, { icon: /* @__PURE__ */ jsx(CheckIcon, {}), children: [
-    humanizeToolName(message.tool_name ?? "tool"),
-    " finished"
-  ] }) });
+    ) }, key);
+  }) });
 }
-function humanizeToolName2(toolName) {
-  return toolName.replace(/^[a-z]+_/, "").replaceAll("_", " ");
+function RawJsonDisclosure({ result }) {
+  return /* @__PURE__ */ jsxs(Collapsible, { className: "mt-1.5", children: [
+    /* @__PURE__ */ jsxs(CollapsibleTrigger, { className: "group flex items-center gap-1 text-muted-foreground text-xs hover:text-foreground", children: [
+      /* @__PURE__ */ jsx(CodeIcon, { className: "size-3" }),
+      /* @__PURE__ */ jsx("span", { children: "Raw JSON" }),
+      /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-3 transition-transform group-data-[panel-open]:rotate-180" })
+    ] }),
+    /* @__PURE__ */ jsx(CollapsiblePanel, { children: /* @__PURE__ */ jsx("pre", { className: "mt-1 max-h-64 overflow-auto rounded-lg bg-muted p-2 font-mono text-[11px] leading-snug text-muted-foreground", children: result }) })
+  ] });
+}
+function StepDetail({
+  describeToolCall,
+  step
+}) {
+  const { details, summary, title } = resolveToolPresentation(describeToolCall, step.name, step.args);
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-border/72 bg-card p-2.5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 font-medium text-sm", children: [
+      step.status === "running" ? /* @__PURE__ */ jsx("span", { className: "size-1.5 animate-pulse rounded-full bg-warning" }) : /* @__PURE__ */ jsx(CheckIcon, { className: "size-3.5 text-success" }),
+      title
+    ] }),
+    summary ? /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-muted-foreground text-xs", children: summary }) : null,
+    details.length > 0 ? /* @__PURE__ */ jsx("dl", { className: "mt-1.5 space-y-0.5 text-xs", children: details.map((detail) => /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsx("dt", { className: "shrink-0 text-muted-foreground", children: detail.label }),
+      /* @__PURE__ */ jsx("dd", { className: "min-w-0 break-words", children: detail.value })
+    ] }, detail.label)) }) : null,
+    step.result ? /* @__PURE__ */ jsx(RawJsonDisclosure, { result: step.result }) : null
+  ] });
+}
+function ToolActivityGroup({ describeToolCall, steps }) {
+  const [open, setOpen] = React5.useState(false);
+  if (steps.length === 0) return null;
+  const last = steps[steps.length - 1];
+  const anyRunning = steps.some((step) => step.status === "running");
+  const lastTitle = resolveToolPresentation(describeToolCall, last.name, last.args).title || humanizeToolName(last.name);
+  const chipLabel = anyRunning ? `${lastTitle}\u2026` : steps.length > 1 ? lastTitle : `${lastTitle} finished`;
+  return /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col gap-2", children: [
+    /* @__PURE__ */ jsxs(Collapsible, { onOpenChange: setOpen, open, children: [
+      /* @__PURE__ */ jsx(
+        CollapsibleTrigger,
+        {
+          render: /* @__PURE__ */ jsx(
+            ChatToolChip,
+            {
+              className: "cursor-pointer pr-2 hover:bg-muted",
+              icon: anyRunning ? /* @__PURE__ */ jsx("span", { className: "size-1.5 animate-pulse rounded-full bg-warning" }) : /* @__PURE__ */ jsx(CheckIcon, {}),
+              children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
+                /* @__PURE__ */ jsx("span", { className: "truncate", children: chipLabel }),
+                steps.length > 1 ? /* @__PURE__ */ jsxs("span", { className: "rounded-full bg-background px-1.5 text-[10px] text-foreground/72", children: [
+                  steps.length,
+                  " steps"
+                ] }) : null,
+                /* @__PURE__ */ jsx(ChevronDownIcon, { className: cn("size-3 transition-transform", open && "rotate-180") })
+              ] })
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(CollapsiblePanel, { children: /* @__PURE__ */ jsx("div", { className: "mt-2 flex flex-col gap-1.5", children: steps.map((step) => /* @__PURE__ */ jsx(StepDetail, { describeToolCall, step }, step.callId)) }) })
+    ] }),
+    steps.map((step) => /* @__PURE__ */ jsx(StepBlocks, { blocks: step.blocks, stepKey: step.callId }, `${step.callId}-blocks`))
+  ] });
 }
-function ToolApprovalCard({ approval, onResolve, resolving }) {
-  const argumentEntries = Object.entries(approval.arguments ?? {});
+function ToolApprovalCard({
+  approval,
+  describeToolCall,
+  onAlwaysApprove,
+  onResolve,
+  resolving
+}) {
+  const { details, summary, title } = resolveToolPresentation(
+    describeToolCall,
+    approval.tool_name,
+    approval.arguments ?? {}
+  );
   return /* @__PURE__ */ jsxs(ChatToolCard, { className: "border-warning/40", children: [
     /* @__PURE__ */ jsxs(ChatToolCardHeader, { children: [
       /* @__PURE__ */ jsx(ShieldAlertIcon, { className: "size-4 text-warning" }),
       "Approval needed"
     ] }),
-    /* @__PURE__ */ jsxs("p", { className: "mt-1 text-muted-foreground", children: [
-      "The assistant wants to run",
-      " ",
-      /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: humanizeToolName2(approval.tool_name) }),
-      " ",
-      "\u2014 this will change your data."
-    ] }),
-    argumentEntries.length > 0 && /* @__PURE__ */ jsxs("dl", { className: "mt-2 space-y-0.5 rounded-lg bg-muted p-2 font-mono text-xs", children: [
-      argumentEntries.slice(0, 8).map(([key, value]) => /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
-        /* @__PURE__ */ jsxs("dt", { className: "shrink-0 text-muted-foreground", children: [
-          key,
-          ":"
-        ] }),
-        /* @__PURE__ */ jsx("dd", { className: "truncate", children: typeof value === "object" ? JSON.stringify(value) : String(value) })
-      ] }, key)),
-      argumentEntries.length > 8 && /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground", children: [
-        "\u2026and ",
-        argumentEntries.length - 8,
-        " more"
-      ] })
-    ] }),
+    /* @__PURE__ */ jsx("p", { className: "mt-1 text-muted-foreground", children: summary ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+      "The assistant wants to ",
+      /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: title.toLowerCase() }),
+      " \u2014 this will change your data."
+    ] }) }),
+    details.length > 0 && /* @__PURE__ */ jsx("dl", { className: "mt-2 space-y-1 rounded-lg bg-muted p-2 text-xs", children: details.map((detail) => /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsx("dt", { className: "shrink-0 text-muted-foreground", children: detail.label }),
+      /* @__PURE__ */ jsx("dd", { className: "min-w-0 break-words font-medium text-foreground", children: detail.value })
+    ] }, detail.label)) }),
     /* @__PURE__ */ jsxs(ChatToolCardActions, { children: [
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          disabled: resolving,
-          onClick: () => onResolve(approval.id, false),
-          size: "sm",
-          variant: "outline",
-          children: "Decline"
-        }
-      ),
-      /* @__PURE__ */ jsxs(Button, { disabled: resolving, onClick: () => onResolve(approval.id, true), size: "sm", children: [
-        resolving ? /* @__PURE__ */ jsx(Spinner, {}) : null,
-        "Approve"
+      /* @__PURE__ */ jsx(Button, { disabled: resolving, onClick: () => onResolve(approval.id, false), size: "sm", variant: "outline", children: "Decline" }),
+      /* @__PURE__ */ jsxs(Group, { children: [
+        /* @__PURE__ */ jsxs(Button, { disabled: resolving, onClick: () => onResolve(approval.id, true), size: "sm", children: [
+          resolving ? /* @__PURE__ */ jsx(Spinner, {}) : null,
+          "Approve"
+        ] }),
+        /* @__PURE__ */ jsxs(Menu, { children: [
+          /* @__PURE__ */ jsx(
+            MenuTrigger,
+            {
+              render: /* @__PURE__ */ jsx(Button, { "aria-label": "More approve options", disabled: resolving, size: "icon-sm", variant: "default", children: /* @__PURE__ */ jsx(ChevronDownIcon, {}) })
+            }
+          ),
+          /* @__PURE__ */ jsx(MenuPopup, { align: "end", children: /* @__PURE__ */ jsxs(
+            MenuItem,
+            {
+              onClick: () => {
+                onAlwaysApprove(approval.tool_name);
+                onResolve(approval.id, true);
+              },
+              children: [
+                /* @__PURE__ */ jsx(CheckCheckIcon, {}),
+                "Always approve \u201C",
+                title,
+                "\u201D"
+              ]
+            }
+          ) })
+        ] })
       ] })
     ] })
   ] });
@@ -306,24 +819,77 @@ function AgentPanel({
   chat,
   className,
   config,
+  onAlwaysApprove,
   onClose,
   onToggleAgentMode
 }) {
-  const [draft, setDraft] = React2.useState("");
-  const [view, setView] = React2.useState("chat");
+  const [draft, setDraft] = React5.useState("");
+  const [view, setView] = React5.useState("chat");
+  const [files, setFiles] = React5.useState([]);
+  const [uploadError, setUploadError] = React5.useState(null);
+  const [dragging, setDragging] = React5.useState(false);
+  const dragDepth = React5.useRef(0);
   const agentName = config.agentName ?? chat.agentInfo?.name ?? "Assistant";
+  const uploadEnabled = fileUploadEnabled(config);
   const suggestions = config.suggestions ?? [
     "What can you help me with?",
     "Give me a quick summary of my data."
   ];
-  const handleSubmit = React2.useCallback(
+  const addFiles = React5.useCallback(
+    (incoming) => {
+      const accepted = [];
+      let rejection = null;
+      for (const file of incoming) {
+        const error = validateFile(config, file);
+        if (error) {
+          rejection = error;
+          continue;
+        }
+        accepted.push(file);
+      }
+      setUploadError(rejection);
+      if (accepted.length) setFiles((current) => [...current, ...accepted].slice(0, 10));
+    },
+    [config]
+  );
+  const removeFile = React5.useCallback((index) => {
+    setFiles((current) => current.filter((_, i) => i !== index));
+  }, []);
+  const handleSubmit = React5.useCallback(
     (text) => {
+      const staged = files;
       setDraft("");
-      void chat.send(text);
+      setFiles([]);
+      setUploadError(null);
+      void chat.send(text, staged);
+    },
+    [chat, files]
+  );
+  const onDragEnter = React5.useCallback(
+    (event) => {
+      if (!uploadEnabled || !event.dataTransfer?.types?.includes("Files")) return;
+      dragDepth.current += 1;
+      setDragging(true);
     },
-    [chat]
+    [uploadEnabled]
   );
-  const openHistory = React2.useCallback(() => {
+  const onDragLeave = React5.useCallback((event) => {
+    if (!event.dataTransfer?.types?.includes("Files")) return;
+    dragDepth.current = Math.max(0, dragDepth.current - 1);
+    if (dragDepth.current === 0) setDragging(false);
+  }, []);
+  const onDrop = React5.useCallback(
+    (event) => {
+      if (!uploadEnabled) return;
+      event.preventDefault();
+      dragDepth.current = 0;
+      setDragging(false);
+      const dropped = Array.from(event.dataTransfer?.files ?? []);
+      if (dropped.length) addFiles(dropped);
+    },
+    [addFiles, uploadEnabled]
+  );
+  const openHistory = React5.useCallback(() => {
     setView("history");
     void chat.refreshConversations();
   }, [chat]);
@@ -332,11 +898,20 @@ function AgentPanel({
     "div",
     {
       className: cn(
-        "flex min-h-0 flex-col overflow-hidden bg-background text-foreground",
+        "relative flex min-h-0 flex-col overflow-hidden bg-background text-foreground",
         className
       ),
       "data-slot": "agent-panel",
+      onDragEnter,
+      onDragLeave,
+      onDragOver: uploadEnabled ? (event) => event.preventDefault() : void 0,
+      onDrop,
       children: [
+        dragging && view === "chat" ? /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-0 z-40 flex flex-col items-center justify-center gap-2 bg-background/85 backdrop-blur-sm", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2 rounded-2xl border-2 border-primary/40 border-dashed px-8 py-6 text-center", children: [
+          /* @__PURE__ */ jsx(UploadCloudIcon, { className: "size-8 text-primary" }),
+          /* @__PURE__ */ jsx("div", { className: "font-medium text-sm", children: "Drop text files to attach" }),
+          /* @__PURE__ */ jsx("div", { className: "text-muted-foreground text-xs", children: acceptAttribute(config).replaceAll(",", " \xB7 ") })
+        ] }) }) : null,
         /* @__PURE__ */ jsxs(ChatHeader, { children: [
           /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2.5", children: [
             /* @__PURE__ */ jsx(ChatHeaderAvatar, {}),
@@ -461,11 +1036,15 @@ function AgentPanel({
               suggestion
             )) })
           ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-            chat.messages.map((message) => /* @__PURE__ */ jsx(MessageItem, { message }, message.id)),
+            groupMessages(chat.messages).map(
+              (item) => item.kind === "tool-activity" ? /* @__PURE__ */ jsx(ChatMessage, { from: "assistant", children: /* @__PURE__ */ jsx(ToolActivityGroup, { describeToolCall: config.describeToolCall, steps: item.steps }) }, item.key) : /* @__PURE__ */ jsx(MessageItem, { message: item.message }, item.key)
+            ),
             chat.pendingApprovals.map((approval) => /* @__PURE__ */ jsx(
               ToolApprovalCard,
               {
                 approval,
+                describeToolCall: config.describeToolCall,
+                onAlwaysApprove,
                 onResolve: (callId, approve) => void chat.resolveApproval(callId, approve),
                 resolving: chat.resolvingApprovalId === approval.id
               },
@@ -473,15 +1052,30 @@ function AgentPanel({
             )),
             busy ? /* @__PURE__ */ jsx(ChatTypingIndicator, {}) : null
           ] }) }),
-          chat.error ? /* @__PURE__ */ jsxs("div", { className: "mx-3 mb-1 flex items-center justify-between gap-2 rounded-lg bg-destructive/10 px-3 py-2 text-destructive text-xs", children: [
-            /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate", children: chat.error }),
-            /* @__PURE__ */ jsx("button", { className: "shrink-0 cursor-pointer font-medium", onClick: chat.clearError, type: "button", children: "Dismiss" })
+          chat.error || uploadError ? /* @__PURE__ */ jsxs("div", { className: "mx-3 mb-1 flex items-center justify-between gap-2 rounded-lg bg-destructive/10 px-3 py-2 text-destructive text-xs", children: [
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate", children: chat.error ?? uploadError }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: "shrink-0 cursor-pointer font-medium",
+                onClick: () => {
+                  chat.clearError();
+                  setUploadError(null);
+                },
+                type: "button",
+                children: "Dismiss"
+              }
+            )
           ] }) : null,
           /* @__PURE__ */ jsx(
-            ChatInput,
+            AgentComposer,
             {
+              acceptAttribute: acceptAttribute(config),
               className: cn(agentMode && "mx-auto w-full max-w-3xl"),
               disabled: busy || chat.pendingApprovals.length > 0,
+              files,
+              onPickFiles: uploadEnabled ? addFiles : void 0,
+              onRemoveFile: removeFile,
               onSubmit: handleSubmit,
               onValueChange: setDraft,
               placeholder: chat.pendingApprovals.length > 0 ? "Approve or decline the pending action first\u2026" : `Ask ${agentName}\u2026`,
@@ -494,16 +1088,16 @@ function AgentPanel({
   );
 }
 function useAgentChat(config) {
-  const client = React2.useMemo(() => new AgentApiClient(config), [config]);
-  const [agentInfo, setAgentInfo] = React2.useState(null);
-  const [conversationId, setConversationId] = React2.useState(null);
-  const [conversations, setConversations] = React2.useState([]);
-  const [messages, setMessages] = React2.useState([]);
-  const [pendingApprovals, setPendingApprovals] = React2.useState([]);
-  const [sending, setSending] = React2.useState(false);
-  const [resolvingApprovalId, setResolvingApprovalId] = React2.useState(null);
-  const [error, setError] = React2.useState(null);
-  React2.useEffect(() => {
+  const client = React5.useMemo(() => new AgentApiClient(config), [config]);
+  const [agentInfo, setAgentInfo] = React5.useState(null);
+  const [conversationId, setConversationId] = React5.useState(null);
+  const [conversations, setConversations] = React5.useState([]);
+  const [messages, setMessages] = React5.useState([]);
+  const [pendingApprovals, setPendingApprovals] = React5.useState([]);
+  const [sending, setSending] = React5.useState(false);
+  const [resolvingApprovalId, setResolvingApprovalId] = React5.useState(null);
+  const [error, setError] = React5.useState(null);
+  React5.useEffect(() => {
     let cancelled = false;
     client.getConfig().then((info) => {
       if (!cancelled) setAgentInfo(info);
@@ -513,11 +1107,11 @@ function useAgentChat(config) {
       cancelled = true;
     };
   }, [client]);
-  const handleFailure = React2.useCallback((err) => {
+  const handleFailure = React5.useCallback((err) => {
     const message = err instanceof AgentApiError ? err.message : "Something went wrong. Please try again.";
     setError(message);
   }, []);
-  const applyResponse = React2.useCallback(
+  const applyResponse = React5.useCallback(
     (response) => {
       if (response.status === "error" && !response.messages?.length) {
         setError(response.message ?? "The assistant could not answer.");
@@ -538,13 +1132,14 @@ function useAgentChat(config) {
     },
     []
   );
-  const send = React2.useCallback(
-    async (text) => {
+  const send = React5.useCallback(
+    async (text, files) => {
       if (sending) return;
+      if (!text.trim() && !(files && files.length)) return;
       setSending(true);
       setError(null);
       try {
-        const response = await client.sendMessage(text, conversationId);
+        const response = await client.sendMessage(text, conversationId, files);
         applyResponse(response);
       } catch (err) {
         handleFailure(err);
@@ -554,7 +1149,7 @@ function useAgentChat(config) {
     },
     [applyResponse, client, conversationId, handleFailure, sending]
   );
-  const resolveApproval = React2.useCallback(
+  const resolveApproval = React5.useCallback(
     async (callId, approve) => {
       if (resolvingApprovalId) return;
       setResolvingApprovalId(callId);
@@ -570,13 +1165,13 @@ function useAgentChat(config) {
     },
     [applyResponse, client, handleFailure, resolvingApprovalId]
   );
-  const newChat = React2.useCallback(() => {
+  const newChat = React5.useCallback(() => {
     setConversationId(null);
     setMessages([]);
     setPendingApprovals([]);
     setError(null);
   }, []);
-  const refreshConversations = React2.useCallback(async () => {
+  const refreshConversations = React5.useCallback(async () => {
     try {
       const { conversations: list } = await client.listConversations();
       setConversations(list);
@@ -584,7 +1179,7 @@ function useAgentChat(config) {
       handleFailure(err);
     }
   }, [client, handleFailure]);
-  const openConversation = React2.useCallback(
+  const openConversation = React5.useCallback(
     async (id) => {
       setError(null);
       try {
@@ -598,7 +1193,7 @@ function useAgentChat(config) {
     },
     [client, handleFailure]
   );
-  const deleteConversation = React2.useCallback(
+  const deleteConversation = React5.useCallback(
     async (id) => {
       try {
         await client.deleteConversation(id);
@@ -610,7 +1205,7 @@ function useAgentChat(config) {
     },
     [client, conversationId, handleFailure, newChat]
   );
-  const clearError = React2.useCallback(() => setError(null), []);
+  const clearError = React5.useCallback(() => setError(null), []);
   return {
     agentInfo,
     clearError,
@@ -629,26 +1224,86 @@ function useAgentChat(config) {
     sending
   };
 }
+var STORAGE_PREFIX = "cc-agent-always-approve:";
+function storageKey(clientId) {
+  return `${STORAGE_PREFIX}${clientId || "default"}`;
+}
+function readStored(clientId) {
+  if (typeof window === "undefined") return /* @__PURE__ */ new Set();
+  try {
+    const raw = window.localStorage.getItem(storageKey(clientId));
+    if (!raw) return /* @__PURE__ */ new Set();
+    const parsed = JSON.parse(raw);
+    return Array.isArray(parsed) ? new Set(parsed.filter((v) => typeof v === "string")) : /* @__PURE__ */ new Set();
+  } catch {
+    return /* @__PURE__ */ new Set();
+  }
+}
+function useAlwaysApprove(clientId) {
+  const [approved, setApproved] = React5.useState(() => /* @__PURE__ */ new Set());
+  React5.useEffect(() => {
+    setApproved(readStored(clientId));
+  }, [clientId]);
+  const persist = React5.useCallback(
+    (next) => {
+      setApproved(next);
+      if (typeof window === "undefined") return;
+      try {
+        window.localStorage.setItem(storageKey(clientId), JSON.stringify([...next]));
+      } catch {
+      }
+    },
+    [clientId]
+  );
+  const isAlwaysApproved = React5.useCallback((toolName) => approved.has(toolName), [approved]);
+  const setAlwaysApprove = React5.useCallback(
+    (toolName) => {
+      if (approved.has(toolName)) return;
+      const next = new Set(approved);
+      next.add(toolName);
+      persist(next);
+    },
+    [approved, persist]
+  );
+  const clearAlwaysApprove = React5.useCallback(
+    (toolName) => {
+      if (!approved.has(toolName)) return;
+      const next = new Set(approved);
+      next.delete(toolName);
+      persist(next);
+    },
+    [approved, persist]
+  );
+  return { clearAlwaysApprove, isAlwaysApproved, setAlwaysApprove };
+}
 function AgentWidget({ config, onOpenChange, open: controlledOpen }) {
-  const [uncontrolledOpen, setUncontrolledOpen] = React2.useState(false);
+  const [uncontrolledOpen, setUncontrolledOpen] = React5.useState(false);
   const open = controlledOpen ?? uncontrolledOpen;
-  const setOpen = React2.useCallback(
+  const setOpen = React5.useCallback(
     (next) => {
       setUncontrolledOpen(next);
       onOpenChange?.(next);
     },
     [onOpenChange]
   );
-  const [agentMode, setAgentMode] = React2.useState(false);
+  const [agentMode, setAgentMode] = React5.useState(false);
   const isDesktop = useMediaQuery("(min-width: 640px)", {
     defaultSSRValue: true,
     ssr: true
   });
   const fullscreen = !isDesktop || agentMode;
   const chat = useAgentChat(config);
-  const lastNavigatedMessageId = React2.useRef(null);
+  const alwaysApprove = useAlwaysApprove(config.clientId);
+  const { pendingApprovals, resolveApproval, resolvingApprovalId } = chat;
+  const { isAlwaysApproved } = alwaysApprove;
+  React5.useEffect(() => {
+    if (!open || resolvingApprovalId) return;
+    const target = pendingApprovals.find((approval) => isAlwaysApproved(approval.tool_name));
+    if (target) void resolveApproval(target.id, true);
+  }, [open, pendingApprovals, resolvingApprovalId, isAlwaysApproved, resolveApproval]);
+  const lastNavigatedMessageId = React5.useRef(null);
   const { messages } = chat;
-  React2.useEffect(() => {
+  React5.useEffect(() => {
     if (!open || fullscreen || !config.navigate || !config.pages?.length) return;
     const toolMessages = messages.filter((message) => message.role === "tool");
     const latest = toolMessages[toolMessages.length - 1];
@@ -660,7 +1315,7 @@ function AgentWidget({ config, onOpenChange, open: controlledOpen }) {
     const path = mapping.buildRoute ? mapping.buildRoute(args) : mapping.route;
     if (path) config.navigate(path);
   }, [config, fullscreen, messages, open]);
-  const closePanel = React2.useCallback(() => {
+  const closePanel = React5.useCallback(() => {
     setOpen(false);
     setAgentMode(false);
   }, [setOpen]);
@@ -688,6 +1343,7 @@ function AgentWidget({ config, onOpenChange, open: controlledOpen }) {
             chat,
             className: "flex-1",
             config,
+            onAlwaysApprove: alwaysApprove.setAlwaysApprove,
             onClose: closePanel,
             onToggleAgentMode: () => setAgentMode((value) => !value)
           }
@@ -713,6 +1369,7 @@ function AgentWidget({ config, onOpenChange, open: controlledOpen }) {
             chat,
             className: "flex-1",
             config,
+            onAlwaysApprove: alwaysApprove.setAlwaysApprove,
             onClose: closePanel,
             onToggleAgentMode: () => setAgentMode(true)
           }
@@ -737,6 +1394,6 @@ function defineAgentConfig(config) {
   return config;
 }
 
-export { AgentApiClient, AgentApiError, AgentPanel, AgentWidget, MessageItem, ToolApprovalCard, defineAgentConfig, useAgentChat };
+export { AgentApiClient, AgentApiError, AgentComposer, AgentPanel, AgentWidget, DEFAULT_ACCEPT, DocumentCard, MessageItem, TaskChecklist, ToolActivityGroup, ToolApprovalCard, acceptAttribute, acceptedExtensions, defineAgentConfig, deriveDetails, fileUploadEnabled, formatBytes, groupMessages, humanizeToolName, resolveToolPresentation, useAgentChat, useAlwaysApprove, validateFile };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map