@rodrigocoliveira/agno-react 1.4.0 → 2.0.0

package/dist/index.js

@@ -48,6 +48,7 @@ __export(exports_src, {
   useAgnoSessionState: () => useAgnoSessionState,
   useAgnoSession: () => useAgnoSession,
   useAgnoMetrics: () => useAgnoMetrics,
+  useAgnoMessageContext: () => useAgnoMessageContext,
   useAgnoMemory: () => useAgnoMemory,
   useAgnoKnowledge: () => useAgnoKnowledge,
   useAgnoEvals: () => useAgnoEvals,
@@ -76,10 +77,21 @@ __export(exports_src, {
   createBarChart: () => createBarChart,
   createArtifact: () => createArtifact,
   createAreaChart: () => createAreaChart,
+  byToolName: () => byToolName,
   ToolHandlerProvider: () => ToolHandlerProvider,
+  ToolGenerativeUI: () => ToolGenerativeUI,
+  ToolDebugCard: () => ToolDebugCard,
   GenerativeUIRenderer: () => GenerativeUIRenderer,
   ComponentRegistry: () => ComponentRegistry,
-  AgnoProvider: () => AgnoProvider
+  AgnoProvider: () => AgnoProvider,
+  AgnoMessageTools: () => AgnoMessageTools,
+  AgnoMessageReferences: () => AgnoMessageReferences,
+  AgnoMessageReasoning: () => AgnoMessageReasoning,
+  AgnoMessageMedia: () => AgnoMessageMedia,
+  AgnoMessageFooter: () => AgnoMessageFooter,
+  AgnoMessageContext: () => AgnoMessageContext,
+  AgnoMessageContent: () => AgnoMessageContent,
+  AgnoMessage: () => AgnoMessage
 });
 module.exports = __toCommonJS(exports_src);
 
@@ -1150,14 +1162,1653 @@ function useAgnoActions() {
     error
   };
 }
-// src/hooks/useAgnoCustomEvents.ts
+// src/ui/composed/agno-chat/render-tool.ts
+function byToolName(map, fallback) {
+  return (tool, args) => {
+    if (!Object.prototype.hasOwnProperty.call(map, tool.tool_name)) {
+      return fallback ? fallback(tool, args) : args.defaultRender();
+    }
+    const entry = map[tool.tool_name];
+    if (entry === false)
+      return null;
+    return entry(tool, args);
+  };
+}
+// src/ui/primitives/badge.tsx
+var import_class_variance_authority = require("class-variance-authority");
+
+// src/ui/lib/cn.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return import_tailwind_merge.twMerge(import_clsx.clsx(inputs));
+}
+
+// src/ui/primitives/badge.tsx
+var jsx_runtime4 = require("react/jsx-runtime");
+var badgeVariants = import_class_variance_authority.cva("inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", {
+  variants: {
+    variant: {
+      default: "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80",
+      secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+      destructive: "border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80",
+      outline: "text-foreground"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+function Badge({ className, variant, ...props }) {
+  return /* @__PURE__ */ jsx_runtime4.jsx("div", {
+    className: cn(badgeVariants({ variant }), className),
+    ...props
+  });
+}
+
+// src/ui/primitives/collapsible.tsx
+var CollapsiblePrimitive = __toESM(require("@radix-ui/react-collapsible"));
+var Collapsible = CollapsiblePrimitive.Root;
+var CollapsibleTrigger2 = CollapsiblePrimitive.CollapsibleTrigger;
+var CollapsibleContent2 = CollapsiblePrimitive.CollapsibleContent;
+
+// src/ui/components/tool.tsx
+var import_lucide_react2 = require("lucide-react");
+var import_react9 = require("react");
+
+// src/ui/primitives/button.tsx
+var React4 = __toESM(require("react"));
+var import_react_slot = require("@radix-ui/react-slot");
+var import_class_variance_authority2 = require("class-variance-authority");
+var jsx_runtime5 = require("react/jsx-runtime");
+var buttonVariants = import_class_variance_authority2.cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", {
+  variants: {
+    variant: {
+      default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+      destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+      outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+      secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+      ghost: "hover:bg-accent hover:text-accent-foreground",
+      link: "text-primary underline-offset-4 hover:underline"
+    },
+    size: {
+      default: "h-9 px-4 py-2",
+      sm: "h-8 rounded-md px-3 text-xs",
+      lg: "h-10 rounded-md px-8",
+      icon: "h-9 w-9"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+var Button = React4.forwardRef(({ className, variant, size, asChild = false, ...props }, ref) => {
+  const Comp = asChild ? import_react_slot.Slot : "button";
+  return /* @__PURE__ */ jsx_runtime5.jsx(Comp, {
+    className: cn(buttonVariants({ variant, size, className })),
+    ref,
+    ...props
+  });
+});
+Button.displayName = "Button";
+
+// src/ui/components/code-block.tsx
+var import_lucide_react = require("lucide-react");
 var import_react8 = require("react");
+var jsx_runtime6 = require("react/jsx-runtime");
+var CodeBlockContext = import_react8.createContext({
+  code: ""
+});
+async function highlightCode(code, language, showLineNumbers = false) {
+  try {
+    const shiki = await import("shiki");
+    const lineNumberTransformer = showLineNumbers ? [
+      {
+        name: "line-numbers",
+        line(node, line) {
+          node.children.unshift({
+            type: "element",
+            tagName: "span",
+            properties: {
+              className: ["inline-block", "min-w-10", "mr-4", "text-right", "select-none", "text-muted-foreground"]
+            },
+            children: [{ type: "text", value: String(line) }]
+          });
+        }
+      }
+    ] : [];
+    const [light, dark] = await Promise.all([
+      shiki.codeToHtml(code, { lang: language, theme: "one-light", transformers: lineNumberTransformer }),
+      shiki.codeToHtml(code, { lang: language, theme: "one-dark-pro", transformers: lineNumberTransformer })
+    ]);
+    return [light, dark];
+  } catch {
+    return ["", ""];
+  }
+}
+var CodeBlock = ({
+  code,
+  language,
+  showLineNumbers = false,
+  className,
+  children,
+  ...props
+}) => {
+  const [html, setHtml] = import_react8.useState("");
+  const [darkHtml, setDarkHtml] = import_react8.useState("");
+  const effectIdRef = import_react8.useRef(0);
+  import_react8.useEffect(() => {
+    const id = ++effectIdRef.current;
+    highlightCode(code, language, showLineNumbers).then(([light, dark]) => {
+      if (id === effectIdRef.current) {
+        setHtml(light);
+        setDarkHtml(dark);
+      }
+    });
+  }, [code, language, showLineNumbers]);
+  const useFallback = !html && !darkHtml;
+  return /* @__PURE__ */ jsx_runtime6.jsx(CodeBlockContext.Provider, {
+    value: { code },
+    children: /* @__PURE__ */ jsx_runtime6.jsx("div", {
+      className: cn("group relative w-full overflow-hidden rounded-md border bg-background text-foreground", className),
+      ...props,
+      children: /* @__PURE__ */ jsx_runtime6.jsxs("div", {
+        className: "relative",
+        children: [
+          useFallback ? /* @__PURE__ */ jsx_runtime6.jsx("pre", {
+            className: "m-0 overflow-auto bg-background p-4 text-foreground text-sm",
+            children: /* @__PURE__ */ jsx_runtime6.jsx("code", {
+              className: "font-mono text-sm",
+              children: code
+            })
+          }) : /* @__PURE__ */ jsx_runtime6.jsxs(jsx_runtime6.Fragment, {
+            children: [
+              /* @__PURE__ */ jsx_runtime6.jsx("div", {
+                className: "overflow-hidden dark:hidden [&>pre]:m-0 [&>pre]:bg-background! [&>pre]:p-4 [&>pre]:text-foreground! [&>pre]:text-sm [&_code]:font-mono [&_code]:text-sm",
+                dangerouslySetInnerHTML: { __html: html }
+              }),
+              /* @__PURE__ */ jsx_runtime6.jsx("div", {
+                className: "hidden overflow-hidden dark:block [&>pre]:m-0 [&>pre]:bg-background! [&>pre]:p-4 [&>pre]:text-foreground! [&>pre]:text-sm [&_code]:font-mono [&_code]:text-sm",
+                dangerouslySetInnerHTML: { __html: darkHtml }
+              })
+            ]
+          }),
+          children && /* @__PURE__ */ jsx_runtime6.jsx("div", {
+            className: "absolute top-2 right-2 flex items-center gap-2",
+            children
+          })
+        ]
+      })
+    })
+  });
+};
+
+// src/ui/components/tool.tsx
+var jsx_runtime7 = require("react/jsx-runtime");
+var Tool = ({ className, ...props }) => /* @__PURE__ */ jsx_runtime7.jsx(Collapsible, {
+  className: cn("not-prose mb-4 w-full rounded-md border", className),
+  ...props
+});
+var getStatusBadge = (status) => {
+  const labels = {
+    "input-streaming": "Pending",
+    "input-available": "Running",
+    "approval-requested": "Awaiting Approval",
+    "approval-responded": "Responded",
+    "output-available": "Completed",
+    "output-error": "Error",
+    "output-denied": "Denied"
+  };
+  const icons = {
+    "input-streaming": /* @__PURE__ */ jsx_runtime7.jsx(import_lucide_react2.CircleIcon, {
+      className: "size-4"
+    }),
+    "input-available": /* @__PURE__ */ jsx_runtime7.jsx(import_lucide_react2.ClockIcon, {
+      className: "size-4 animate-pulse"
+    }),
+    "approval-requested": /* @__PURE__ */ jsx_runtime7.jsx(import_lucide_react2.ClockIcon, {
+      className: "size-4 text-yellow-600"
+    }),
+    "approval-responded": /* @__PURE__ */ jsx_runtime7.jsx(import_lucide_react2.CheckCircleIcon, {
+      className: "size-4 text-blue-600"
+    }),
+    "output-available": /* @__PURE__ */ jsx_runtime7.jsx(import_lucide_react2.CheckCircleIcon, {
+      className: "size-4 text-green-600"
+    }),
+    "output-error": /* @__PURE__ */ jsx_runtime7.jsx(import_lucide_react2.XCircleIcon, {
+      className: "size-4 text-red-600"
+    }),
+    "output-denied": /* @__PURE__ */ jsx_runtime7.jsx(import_lucide_react2.XCircleIcon, {
+      className: "size-4 text-orange-600"
+    })
+  };
+  return /* @__PURE__ */ jsx_runtime7.jsxs(Badge, {
+    className: "gap-1.5 rounded-full text-xs",
+    variant: "secondary",
+    children: [
+      icons[status],
+      labels[status]
+    ]
+  });
+};
+var ToolHeader = ({ className, title, type, state, ...props }) => /* @__PURE__ */ jsx_runtime7.jsxs(CollapsibleTrigger2, {
+  className: cn("group flex w-full items-center justify-between gap-4 p-3", className),
+  ...props,
+  children: [
+    /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+      className: "flex items-center gap-2",
+      children: [
+        /* @__PURE__ */ jsx_runtime7.jsx(import_lucide_react2.WrenchIcon, {
+          className: "size-4 text-muted-foreground"
+        }),
+        /* @__PURE__ */ jsx_runtime7.jsx("span", {
+          className: "font-medium text-sm",
+          children: title ?? type?.split("-").slice(1).join("-") ?? "Tool"
+        }),
+        getStatusBadge(state)
+      ]
+    }),
+    /* @__PURE__ */ jsx_runtime7.jsx(import_lucide_react2.ChevronDownIcon, {
+      className: "size-4 text-muted-foreground transition-transform group-data-[state=open]:rotate-180"
+    })
+  ]
+});
+var ToolContent = ({ className, ...props }) => /* @__PURE__ */ jsx_runtime7.jsx(CollapsibleContent2, {
+  className: cn("data-[state=closed]:fade-out-0 data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2 text-popover-foreground outline-none data-[state=closed]:animate-out data-[state=open]:animate-in", className),
+  ...props
+});
+var ToolInput = ({ className, input, ...props }) => /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+  className: cn("space-y-2 overflow-hidden p-4", className),
+  ...props,
+  children: [
+    /* @__PURE__ */ jsx_runtime7.jsx("h4", {
+      className: "font-medium text-muted-foreground text-xs uppercase tracking-wide",
+      children: "Parameters"
+    }),
+    /* @__PURE__ */ jsx_runtime7.jsx("div", {
+      className: "rounded-md bg-muted/50",
+      children: /* @__PURE__ */ jsx_runtime7.jsx(CodeBlock, {
+        code: JSON.stringify(input, null, 2),
+        language: "json"
+      })
+    })
+  ]
+});
+var ToolOutput = ({ className, output, errorText, ...props }) => {
+  if (!(output || errorText)) {
+    return null;
+  }
+  let Output = /* @__PURE__ */ jsx_runtime7.jsx("div", {
+    children: output
+  });
+  if (typeof output === "object" && !import_react9.isValidElement(output)) {
+    Output = /* @__PURE__ */ jsx_runtime7.jsx(CodeBlock, {
+      code: JSON.stringify(output, null, 2),
+      language: "json"
+    });
+  } else if (typeof output === "string") {
+    Output = /* @__PURE__ */ jsx_runtime7.jsx(CodeBlock, {
+      code: output,
+      language: "json"
+    });
+  }
+  return /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+    className: cn("space-y-2 p-4", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx_runtime7.jsx("h4", {
+        className: "font-medium text-muted-foreground text-xs uppercase tracking-wide",
+        children: errorText ? "Error" : "Result"
+      }),
+      /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+        className: cn("overflow-x-auto rounded-md text-xs [&_table]:w-full", errorText ? "bg-destructive/10 text-destructive" : "bg-muted/50 text-foreground"),
+        children: [
+          errorText && /* @__PURE__ */ jsx_runtime7.jsx("div", {
+            children: errorText
+          }),
+          Output
+        ]
+      })
+    ]
+  });
+};
+
+// src/ui/primitives/tooltip.tsx
+var React5 = __toESM(require("react"));
+var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"));
+var jsx_runtime8 = require("react/jsx-runtime");
+var TooltipProvider = TooltipPrimitive.Provider;
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipContent = React5.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx_runtime8.jsx(TooltipPrimitive.Portal, {
+  children: /* @__PURE__ */ jsx_runtime8.jsx(TooltipPrimitive.Content, {
+    ref,
+    sideOffset,
+    className: cn("z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-tooltip-content-transform-origin]", className),
+    ...props
+  })
+}));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+
+// src/ui/components/artifact.tsx
+var import_lucide_react3 = require("lucide-react");
+var jsx_runtime9 = require("react/jsx-runtime");
+var Artifact = ({ className, ...props }) => /* @__PURE__ */ jsx_runtime9.jsx("div", {
+  className: cn("flex flex-col overflow-hidden rounded-lg border bg-background shadow-sm", className),
+  ...props
+});
+
+// src/ui/composed/agno-chat/tool-building-blocks.tsx
+var jsx_runtime10 = require("react/jsx-runtime");
+var getToolState = (tool) => tool.tool_call_error ? "output-error" : "output-available";
+function ToolDebugCard({ tool, defaultOpen }) {
+  const output = tool.result ?? tool.content;
+  return /* @__PURE__ */ jsx_runtime10.jsxs(Tool, {
+    defaultOpen,
+    children: [
+      /* @__PURE__ */ jsx_runtime10.jsx(ToolHeader, {
+        title: tool.tool_name,
+        type: "tool-use",
+        state: getToolState(tool)
+      }),
+      /* @__PURE__ */ jsx_runtime10.jsxs(ToolContent, {
+        children: [
+          /* @__PURE__ */ jsx_runtime10.jsx(ToolInput, {
+            input: tool.tool_args
+          }),
+          output ? /* @__PURE__ */ jsx_runtime10.jsx(ToolOutput, {
+            output,
+            errorText: tool.tool_call_error ? "Tool execution failed" : undefined
+          }) : null
+        ]
+      })
+    ]
+  });
+}
+function ToolGenerativeUI({ tool }) {
+  const uiComponent = tool.ui_component;
+  if (!uiComponent)
+    return null;
+  return uiComponent.layout === "artifact" ? /* @__PURE__ */ jsx_runtime10.jsx(Artifact, {
+    children: /* @__PURE__ */ jsx_runtime10.jsx(GenerativeUIRenderer, {
+      spec: uiComponent,
+      className: "w-full p-2"
+    })
+  }) : /* @__PURE__ */ jsx_runtime10.jsx(GenerativeUIRenderer, {
+    spec: uiComponent,
+    className: "w-full"
+  });
+}
+// src/ui/composed/agno-message/message.tsx
+var import_react14 = require("react");
+var import_lucide_react13 = require("lucide-react");
+
+// src/ui/lib/format-timestamp.ts
+function formatSmartTimestamp(date) {
+  const now = new Date;
+  const isToday = date.getFullYear() === now.getFullYear() && date.getMonth() === now.getMonth() && date.getDate() === now.getDate();
+  if (isToday) {
+    return new Intl.DateTimeFormat(undefined, {
+      hour: "numeric",
+      minute: "2-digit",
+      hour12: true
+    }).format(date);
+  }
+  const isSameYear = date.getFullYear() === now.getFullYear();
+  if (isSameYear) {
+    return new Intl.DateTimeFormat(undefined, {
+      month: "short",
+      day: "numeric"
+    }).format(date);
+  }
+  return new Intl.DateTimeFormat(undefined, {
+    month: "short",
+    day: "numeric",
+    year: "numeric"
+  }).format(date);
+}
+function formatFullTimestamp(date) {
+  return new Intl.DateTimeFormat(undefined, {
+    month: "short",
+    day: "numeric",
+    year: "numeric",
+    hour: "numeric",
+    minute: "2-digit",
+    hour12: true
+  }).format(date);
+}
+
+// src/ui/components/smart-timestamp.tsx
+var jsx_runtime11 = require("react/jsx-runtime");
+function SmartTimestamp({ date, formatShort, className }) {
+  const shortText = formatShort ? formatShort(date) : formatSmartTimestamp(date);
+  const fullText = formatFullTimestamp(date);
+  return /* @__PURE__ */ jsx_runtime11.jsx(TooltipProvider, {
+    children: /* @__PURE__ */ jsx_runtime11.jsxs(Tooltip, {
+      children: [
+        /* @__PURE__ */ jsx_runtime11.jsx(TooltipTrigger, {
+          asChild: true,
+          children: /* @__PURE__ */ jsx_runtime11.jsx("span", {
+            className,
+            children: shortText
+          })
+        }),
+        /* @__PURE__ */ jsx_runtime11.jsx(TooltipContent, {
+          children: /* @__PURE__ */ jsx_runtime11.jsx("p", {
+            children: fullText
+          })
+        })
+      ]
+    })
+  });
+}
+
+// src/ui/lib/file-utils.ts
+function getFilePreviewType(mimeType) {
+  if (!mimeType)
+    return "none";
+  if (mimeType.startsWith("image/"))
+    return "image";
+  if (mimeType === "application/pdf")
+    return "pdf";
+  if (mimeType.startsWith("text/"))
+    return "text";
+  if (mimeType.startsWith("video/"))
+    return "video";
+  if (mimeType.startsWith("audio/"))
+    return "audio";
+  return "none";
+}
+function formatFileSize(bytes) {
+  if (bytes === 0)
+    return "0 B";
+  const units = ["B", "KB", "MB", "GB", "TB"];
+  const k = 1024;
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  const value = bytes / Math.pow(k, i);
+  return `${value % 1 === 0 ? value : value.toFixed(1)} ${units[i]}`;
+}
+function getFileExtension(filename, mimeType) {
+  const lastDot = filename.lastIndexOf(".");
+  if (lastDot !== -1 && lastDot !== 0) {
+    return filename.slice(lastDot + 1).toLowerCase();
+  }
+  if (mimeType) {
+    return extensionFromMime(mimeType);
+  }
+  return "";
+}
+var mimeToExt = {
+  "application/pdf": "pdf",
+  "application/zip": "zip",
+  "application/x-rar-compressed": "rar",
+  "application/json": "json",
+  "application/xml": "xml",
+  "application/msword": "doc",
+  "application/vnd.openxmlformats-officedocument.wordprocessingml.document": "docx",
+  "application/vnd.ms-excel": "xls",
+  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "xlsx",
+  "application/vnd.ms-powerpoint": "ppt",
+  "application/vnd.openxmlformats-officedocument.presentationml.presentation": "pptx",
+  "text/csv": "csv",
+  "text/plain": "txt",
+  "text/html": "html",
+  "text/css": "css",
+  "text/javascript": "js"
+};
+function extensionFromMime(mimeType) {
+  if (mimeToExt[mimeType])
+    return mimeToExt[mimeType];
+  const subtype = mimeType.split("/")[1];
+  if (subtype && !subtype.includes(".") && !subtype.includes("+")) {
+    return subtype.toLowerCase();
+  }
+  return "";
+}
+function isPreviewable(mimeType) {
+  const type = getFilePreviewType(mimeType);
+  return type === "image" || type === "pdf";
+}
+
+// src/ui/components/file-preview-card.tsx
+var import_lucide_react4 = require("lucide-react");
+var jsx_runtime12 = require("react/jsx-runtime");
+function ExtBadge({ ext }) {
+  if (!ext)
+    return null;
+  return /* @__PURE__ */ jsx_runtime12.jsx("span", {
+    className: "absolute bottom-1.5 left-1.5 rounded px-1 py-0.5 text-[9px] font-semibold uppercase leading-none bg-background/80 text-muted-foreground border border-border/50 backdrop-blur-sm",
+    children: ext
+  });
+}
+function FilePreviewCard({ file, onClick, className }) {
+  const previewType = getFilePreviewType(file.type);
+  const isClickable = !!onClick;
+  const ext = getFileExtension(file.name, file.type);
+  const cardBase = cn("group relative flex flex-col overflow-hidden rounded-xl border border-border bg-muted/20 w-28 h-28", isClickable && "cursor-pointer hover:border-foreground/20 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 transition-colors", className);
+  if (previewType === "image" && file.url) {
+    return /* @__PURE__ */ jsx_runtime12.jsxs("button", {
+      type: "button",
+      onClick,
+      disabled: !isClickable,
+      className: cardBase,
+      children: [
+        /* @__PURE__ */ jsx_runtime12.jsx("img", {
+          src: file.url,
+          alt: file.name,
+          className: "w-full h-full object-cover"
+        }),
+        /* @__PURE__ */ jsx_runtime12.jsx(ExtBadge, {
+          ext
+        }),
+        isClickable && /* @__PURE__ */ jsx_runtime12.jsx("div", {
+          className: "absolute inset-0 flex items-center justify-center bg-black/0 group-hover:bg-black/30 transition-colors",
+          children: /* @__PURE__ */ jsx_runtime12.jsx(import_lucide_react4.Search, {
+            className: "h-5 w-5 text-white opacity-0 group-hover:opacity-100 transition-opacity"
+          })
+        })
+      ]
+    });
+  }
+  if (previewType === "pdf" && file.url) {
+    return /* @__PURE__ */ jsx_runtime12.jsxs("button", {
+      type: "button",
+      onClick,
+      disabled: !isClickable,
+      className: cardBase,
+      children: [
+        /* @__PURE__ */ jsx_runtime12.jsx("div", {
+          className: "w-full h-full overflow-hidden pointer-events-none",
+          children: /* @__PURE__ */ jsx_runtime12.jsx("object", {
+            data: `${file.url}#page=1&view=FitH`,
+            type: "application/pdf",
+            className: "w-[200%] h-[200%] origin-top-left scale-50",
+            "aria-label": file.name,
+            children: /* @__PURE__ */ jsx_runtime12.jsx("div", {
+              className: "flex items-center justify-center w-full h-full",
+              children: /* @__PURE__ */ jsx_runtime12.jsx(import_lucide_react4.FileIcon, {
+                className: "h-8 w-8 text-muted-foreground/40"
+              })
+            })
+          })
+        }),
+        /* @__PURE__ */ jsx_runtime12.jsx(ExtBadge, {
+          ext
+        }),
+        isClickable && /* @__PURE__ */ jsx_runtime12.jsx("div", {
+          className: "absolute inset-0 flex items-center justify-center bg-black/0 group-hover:bg-black/10 transition-colors",
+          children: /* @__PURE__ */ jsx_runtime12.jsx(import_lucide_react4.Search, {
+            className: "h-5 w-5 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity"
+          })
+        })
+      ]
+    });
+  }
+  return /* @__PURE__ */ jsx_runtime12.jsxs("button", {
+    type: "button",
+    onClick,
+    disabled: !isClickable,
+    className: cardBase,
+    children: [
+      /* @__PURE__ */ jsx_runtime12.jsx("div", {
+        className: "flex-1 flex items-center justify-center",
+        children: /* @__PURE__ */ jsx_runtime12.jsx(import_lucide_react4.FileIcon, {
+          className: "h-8 w-8 text-muted-foreground/40"
+        })
+      }),
+      /* @__PURE__ */ jsx_runtime12.jsxs("div", {
+        className: "w-full text-center min-w-0 px-2 pb-2 space-y-0.5",
+        children: [
+          /* @__PURE__ */ jsx_runtime12.jsx("p", {
+            className: "text-[10px] text-foreground truncate leading-tight",
+            title: file.name,
+            children: file.name
+          }),
+          file.size != null && file.size > 0 && /* @__PURE__ */ jsx_runtime12.jsx("p", {
+            className: "text-[9px] text-muted-foreground leading-tight",
+            children: formatFileSize(file.size)
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx_runtime12.jsx(ExtBadge, {
+        ext
+      })
+    ]
+  });
+}
+
+// src/ui/primitives/dialog.tsx
+var React6 = __toESM(require("react"));
+var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"));
+var import_class_variance_authority3 = require("class-variance-authority");
+var import_lucide_react5 = require("lucide-react");
+var jsx_runtime13 = require("react/jsx-runtime");
+var Dialog = DialogPrimitive.Root;
+var DialogPortal = DialogPrimitive.Portal;
+var DialogOverlay = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx_runtime13.jsx(DialogPrimitive.Overlay, {
+  ref,
+  className: cn("fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className),
+  ...props
+}));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var dialogContentVariants = import_class_variance_authority3.cva("fixed left-[50%] top-[50%] z-50 grid translate-x-[-50%] translate-y-[-50%] gap-4 border shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg", {
+  variants: {
+    variant: {
+      default: "w-full max-w-lg bg-background p-6",
+      lightbox: "max-w-[90vw] max-h-[90vh] bg-background/95 backdrop-blur-sm p-2"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+var DialogContent = React6.forwardRef(({ className, variant, children, ...props }, ref) => /* @__PURE__ */ jsx_runtime13.jsxs(DialogPortal, {
+  children: [
+    /* @__PURE__ */ jsx_runtime13.jsx(DialogOverlay, {}),
+    /* @__PURE__ */ jsx_runtime13.jsxs(DialogPrimitive.Content, {
+      ref,
+      className: cn(dialogContentVariants({ variant }), className),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx_runtime13.jsxs(DialogPrimitive.Close, {
+          className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground",
+          children: [
+            /* @__PURE__ */ jsx_runtime13.jsx(import_lucide_react5.X, {
+              className: "h-4 w-4"
+            }),
+            /* @__PURE__ */ jsx_runtime13.jsx("span", {
+              className: "sr-only",
+              children: "Close"
+            })
+          ]
+        })
+      ]
+    })
+  ]
+}));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx_runtime13.jsx("div", {
+  className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className),
+  ...props
+});
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx_runtime13.jsx("div", {
+  className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
+  ...props
+});
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx_runtime13.jsx(DialogPrimitive.Title, {
+  ref,
+  className: cn("text-lg font-semibold leading-none tracking-tight", className),
+  ...props
+}));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx_runtime13.jsx(DialogPrimitive.Description, {
+  ref,
+  className: cn("text-sm text-muted-foreground", className),
+  ...props
+}));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+
+// src/ui/components/file-preview-modal.tsx
+var import_lucide_react6 = require("lucide-react");
+var jsx_runtime14 = require("react/jsx-runtime");
+function FilePreviewModal({ open, onOpenChange, file }) {
+  if (!file)
+    return null;
+  const previewType = getFilePreviewType(file.type);
+  const canPreview = isPreviewable(file.type) && !!file.url;
+  return /* @__PURE__ */ jsx_runtime14.jsx(Dialog, {
+    open,
+    onOpenChange,
+    children: previewType === "image" && file.url ? /* @__PURE__ */ jsx_runtime14.jsxs(DialogContent, {
+      variant: "lightbox",
+      "aria-describedby": undefined,
+      children: [
+        /* @__PURE__ */ jsx_runtime14.jsx(DialogTitle, {
+          className: "sr-only",
+          children: file.name
+        }),
+        /* @__PURE__ */ jsx_runtime14.jsx("img", {
+          src: file.url,
+          alt: file.name,
+          className: "max-h-[85vh] max-w-full object-contain rounded-md"
+        })
+      ]
+    }) : previewType === "pdf" && file.url ? /* @__PURE__ */ jsx_runtime14.jsxs(DialogContent, {
+      variant: "lightbox",
+      className: "w-[80vw] h-[85vh]",
+      "aria-describedby": undefined,
+      children: [
+        /* @__PURE__ */ jsx_runtime14.jsx(DialogTitle, {
+          className: "sr-only",
+          children: file.name
+        }),
+        /* @__PURE__ */ jsx_runtime14.jsx("object", {
+          data: file.url,
+          type: "application/pdf",
+          className: "w-full h-full rounded-md",
+          children: /* @__PURE__ */ jsx_runtime14.jsxs("div", {
+            className: "flex flex-col items-center justify-center h-full gap-3 text-muted-foreground",
+            children: [
+              /* @__PURE__ */ jsx_runtime14.jsx("p", {
+                className: "text-sm",
+                children: "Unable to display PDF"
+              }),
+              /* @__PURE__ */ jsx_runtime14.jsxs("a", {
+                href: file.url,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                className: "inline-flex items-center gap-1.5 text-sm text-primary hover:underline",
+                children: [
+                  /* @__PURE__ */ jsx_runtime14.jsx(import_lucide_react6.Download, {
+                    className: "h-4 w-4"
+                  }),
+                  "Download ",
+                  file.name
+                ]
+              })
+            ]
+          })
+        })
+      ]
+    }) : /* @__PURE__ */ jsx_runtime14.jsxs(DialogContent, {
+      children: [
+        /* @__PURE__ */ jsx_runtime14.jsxs(DialogHeader, {
+          children: [
+            /* @__PURE__ */ jsx_runtime14.jsxs(DialogTitle, {
+              className: "flex items-center gap-2",
+              children: [
+                /* @__PURE__ */ jsx_runtime14.jsx(import_lucide_react6.FileIcon, {
+                  className: "h-5 w-5 text-muted-foreground"
+                }),
+                file.name
+              ]
+            }),
+            /* @__PURE__ */ jsx_runtime14.jsxs(DialogDescription, {
+              children: [
+                file.size != null && file.size > 0 && /* @__PURE__ */ jsx_runtime14.jsx("span", {
+                  children: formatFileSize(file.size)
+                }),
+                !canPreview && /* @__PURE__ */ jsx_runtime14.jsx("span", {
+                  children: " · Preview not available for this file type"
+                })
+              ]
+            })
+          ]
+        }),
+        /* @__PURE__ */ jsx_runtime14.jsxs("div", {
+          className: "flex flex-col items-center justify-center py-8 text-muted-foreground gap-3",
+          children: [
+            /* @__PURE__ */ jsx_runtime14.jsx(import_lucide_react6.FileIcon, {
+              className: "h-12 w-12"
+            }),
+            /* @__PURE__ */ jsx_runtime14.jsx("p", {
+              className: "text-sm",
+              children: "Preview not available"
+            }),
+            file.url && /^https?:\/\//i.test(file.url) && /* @__PURE__ */ jsx_runtime14.jsxs("a", {
+              href: file.url,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className: "inline-flex items-center gap-1.5 text-sm text-primary hover:underline",
+              children: [
+                /* @__PURE__ */ jsx_runtime14.jsx(import_lucide_react6.Download, {
+                  className: "h-4 w-4"
+                }),
+                "Download file"
+              ]
+            })
+          ]
+        })
+      ]
+    })
+  });
+}
+
+// src/ui/components/image-lightbox.tsx
+var import_react10 = require("react");
+var import_lucide_react7 = require("lucide-react");
+var jsx_runtime15 = require("react/jsx-runtime");
+function ImageLightbox({ open, onOpenChange, images, initialIndex = 0 }) {
+  const [currentIndex, setCurrentIndex] = import_react10.useState(initialIndex);
+  const hasMultiple = images.length > 1;
+  import_react10.useEffect(() => {
+    if (open)
+      setCurrentIndex(initialIndex);
+  }, [open, initialIndex]);
+  const goNext = import_react10.useCallback(() => {
+    setCurrentIndex((i) => (i + 1) % images.length);
+  }, [images.length]);
+  const goPrev = import_react10.useCallback(() => {
+    setCurrentIndex((i) => (i - 1 + images.length) % images.length);
+  }, [images.length]);
+  import_react10.useEffect(() => {
+    if (!open || !hasMultiple)
+      return;
+    const handler = (e) => {
+      if (e.key === "ArrowRight")
+        goNext();
+      if (e.key === "ArrowLeft")
+        goPrev();
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [open, hasMultiple, goNext, goPrev]);
+  if (images.length === 0)
+    return null;
+  const current = images[currentIndex];
+  if (!current)
+    return null;
+  return /* @__PURE__ */ jsx_runtime15.jsx(Dialog, {
+    open,
+    onOpenChange,
+    children: /* @__PURE__ */ jsx_runtime15.jsxs(DialogContent, {
+      variant: "lightbox",
+      "aria-describedby": undefined,
+      children: [
+        /* @__PURE__ */ jsx_runtime15.jsx(DialogTitle, {
+          className: "sr-only",
+          children: current.alt || `Image ${currentIndex + 1} of ${images.length}`
+        }),
+        /* @__PURE__ */ jsx_runtime15.jsxs("div", {
+          className: "relative flex items-center justify-center",
+          children: [
+            /* @__PURE__ */ jsx_runtime15.jsx("img", {
+              src: current.url,
+              alt: current.alt || "Image preview",
+              className: "max-h-[85vh] max-w-full object-contain rounded-md"
+            }),
+            hasMultiple && /* @__PURE__ */ jsx_runtime15.jsxs(jsx_runtime15.Fragment, {
+              children: [
+                /* @__PURE__ */ jsx_runtime15.jsxs("button", {
+                  type: "button",
+                  onClick: goPrev,
+                  className: cn("absolute left-2 top-1/2 -translate-y-1/2 rounded-full bg-black/50 p-2 text-white", "hover:bg-black/70 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring transition-colors"),
+                  children: [
+                    /* @__PURE__ */ jsx_runtime15.jsx(import_lucide_react7.ChevronLeft, {
+                      className: "h-5 w-5"
+                    }),
+                    /* @__PURE__ */ jsx_runtime15.jsx("span", {
+                      className: "sr-only",
+                      children: "Previous image"
+                    })
+                  ]
+                }),
+                /* @__PURE__ */ jsx_runtime15.jsxs("button", {
+                  type: "button",
+                  onClick: goNext,
+                  className: cn("absolute right-2 top-1/2 -translate-y-1/2 rounded-full bg-black/50 p-2 text-white", "hover:bg-black/70 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring transition-colors"),
+                  children: [
+                    /* @__PURE__ */ jsx_runtime15.jsx(import_lucide_react7.ChevronRight, {
+                      className: "h-5 w-5"
+                    }),
+                    /* @__PURE__ */ jsx_runtime15.jsx("span", {
+                      className: "sr-only",
+                      children: "Next image"
+                    })
+                  ]
+                }),
+                /* @__PURE__ */ jsx_runtime15.jsxs("div", {
+                  className: "absolute bottom-2 left-1/2 -translate-x-1/2 rounded-full bg-black/50 px-3 py-1 text-xs text-white",
+                  children: [
+                    currentIndex + 1,
+                    " / ",
+                    images.length
+                  ]
+                })
+              ]
+            })
+          ]
+        })
+      ]
+    })
+  });
+}
+
+// src/ui/composed/agno-message/context.ts
+var import_react11 = require("react");
+var AgnoMessageContext = import_react11.createContext(null);
+function useAgnoMessageContext() {
+  const ctx = import_react11.useContext(AgnoMessageContext);
+  if (!ctx) {
+    throw new Error("useAgnoMessageContext must be used within an <AgnoMessage> provider. " + "Wrap your slots with <AgnoMessage message={...}>.");
+  }
+  return ctx;
+}
+
+// src/ui/composed/agno-message/reasoning.tsx
+var import_lucide_react9 = require("lucide-react");
+
+// src/ui/primitives/accordion.tsx
+var React7 = __toESM(require("react"));
+var AccordionPrimitive = __toESM(require("@radix-ui/react-accordion"));
+var import_lucide_react8 = require("lucide-react");
+var jsx_runtime16 = require("react/jsx-runtime");
+var Accordion = AccordionPrimitive.Root;
+var AccordionItem = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx_runtime16.jsx(AccordionPrimitive.Item, {
+  ref,
+  className: cn("border-b", className),
+  ...props
+}));
+AccordionItem.displayName = "AccordionItem";
+var AccordionTrigger = React7.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx_runtime16.jsx(AccordionPrimitive.Header, {
+  className: "flex",
+  children: /* @__PURE__ */ jsx_runtime16.jsxs(AccordionPrimitive.Trigger, {
+    ref,
+    className: cn("flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline text-left [&[data-state=open]>svg]:rotate-180", className),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx_runtime16.jsx(import_lucide_react8.ChevronDown, {
+        className: "h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200"
+      })
+    ]
+  })
+}));
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
+var AccordionContent = React7.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx_runtime16.jsx(AccordionPrimitive.Content, {
+  ref,
+  className: "overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
+  ...props,
+  children: /* @__PURE__ */ jsx_runtime16.jsx("div", {
+    className: cn("pb-4 pt-0", className),
+    children
+  })
+}));
+AccordionContent.displayName = AccordionPrimitive.Content.displayName;
+
+// src/ui/composed/agno-message/reasoning.tsx
+var jsx_runtime17 = require("react/jsx-runtime");
+function AgnoMessageReasoning() {
+  const { message, classNames } = useAgnoMessageContext();
+  const steps = message.extra_data?.reasoning_steps;
+  if (!steps || steps.length === 0)
+    return null;
+  return /* @__PURE__ */ jsx_runtime17.jsxs("div", {
+    className: cn("space-y-2 pt-1", classNames?.assistant?.reasoning),
+    children: [
+      /* @__PURE__ */ jsx_runtime17.jsxs("div", {
+        className: "flex items-center gap-2 text-xs font-medium text-muted-foreground",
+        children: [
+          /* @__PURE__ */ jsx_runtime17.jsx(import_lucide_react9.Lightbulb, {
+            className: "h-3.5 w-3.5"
+          }),
+          "Reasoning (",
+          steps.length,
+          " steps)"
+        ]
+      }),
+      /* @__PURE__ */ jsx_runtime17.jsx(Accordion, {
+        type: "multiple",
+        className: "w-full",
+        children: steps.map((step, idx) => /* @__PURE__ */ jsx_runtime17.jsxs(AccordionItem, {
+          value: `reasoning-${idx}`,
+          className: "border-muted",
+          children: [
+            /* @__PURE__ */ jsx_runtime17.jsx(AccordionTrigger, {
+              className: "text-xs py-1.5 hover:no-underline",
+              children: step.title || `Step ${idx + 1}`
+            }),
+            /* @__PURE__ */ jsx_runtime17.jsxs(AccordionContent, {
+              className: "space-y-1.5 text-xs text-muted-foreground",
+              children: [
+                step.action && /* @__PURE__ */ jsx_runtime17.jsxs("div", {
+                  children: [
+                    /* @__PURE__ */ jsx_runtime17.jsx("span", {
+                      className: "font-medium text-foreground",
+                      children: "Action:"
+                    }),
+                    " ",
+                    step.action
+                  ]
+                }),
+                step.reasoning && /* @__PURE__ */ jsx_runtime17.jsxs("div", {
+                  children: [
+                    /* @__PURE__ */ jsx_runtime17.jsx("span", {
+                      className: "font-medium text-foreground",
+                      children: "Reasoning:"
+                    }),
+                    " ",
+                    step.reasoning
+                  ]
+                }),
+                step.result && /* @__PURE__ */ jsx_runtime17.jsxs("div", {
+                  children: [
+                    /* @__PURE__ */ jsx_runtime17.jsx("span", {
+                      className: "font-medium text-foreground",
+                      children: "Result:"
+                    }),
+                    " ",
+                    step.result
+                  ]
+                }),
+                step.confidence !== undefined && /* @__PURE__ */ jsx_runtime17.jsxs("div", {
+                  children: [
+                    /* @__PURE__ */ jsx_runtime17.jsx("span", {
+                      className: "font-medium text-foreground",
+                      children: "Confidence:"
+                    }),
+                    " ",
+                    (step.confidence * 100).toFixed(1),
+                    "%"
+                  ]
+                })
+              ]
+            })
+          ]
+        }, idx))
+      })
+    ]
+  });
+}
+
+// src/ui/composed/agno-message/media.tsx
+var import_lucide_react10 = require("lucide-react");
+var jsx_runtime18 = require("react/jsx-runtime");
+function AgnoMessageMedia() {
+  const {
+    message,
+    classNames,
+    showImageLightbox,
+    showFilePreview,
+    openImageLightbox,
+    openFilePreview
+  } = useAgnoMessageContext();
+  const mediaClassName = classNames?.assistant?.media;
+  const hasImages = !!message.images && message.images.length > 0;
+  const hasVideos = !!message.videos && message.videos.length > 0;
+  const hasAudio = !!message.audio && message.audio.length > 0;
+  const hasFiles = !!message.files && message.files.length > 0;
+  const hasResponseAudio = !!message.response_audio;
+  if (!hasImages && !hasVideos && !hasAudio && !hasFiles && !hasResponseAudio)
+    return null;
+  return /* @__PURE__ */ jsx_runtime18.jsxs(jsx_runtime18.Fragment, {
+    children: [
+      hasImages && /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+        className: cn("space-y-2 pt-1", mediaClassName),
+        children: [
+          /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+            className: "flex items-center gap-2 text-xs font-medium text-muted-foreground",
+            children: [
+              /* @__PURE__ */ jsx_runtime18.jsx(import_lucide_react10.Image, {
+                className: "h-3.5 w-3.5"
+              }),
+              "Images (",
+              message.images.length,
+              ")"
+            ]
+          }),
+          /* @__PURE__ */ jsx_runtime18.jsx("div", {
+            className: "grid grid-cols-2 gap-2",
+            children: message.images.map((img, idx) => /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+              className: "space-y-1",
+              children: [
+                showImageLightbox ? /* @__PURE__ */ jsx_runtime18.jsx("button", {
+                  type: "button",
+                  onClick: () => openImageLightbox(message.images.map((i) => ({ url: i.url, alt: i.revised_prompt })), idx),
+                  className: "group relative w-full overflow-hidden rounded-lg border border-border cursor-pointer hover:border-primary/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring transition-colors",
+                  children: /* @__PURE__ */ jsx_runtime18.jsx("img", {
+                    src: img.url,
+                    alt: img.revised_prompt || "Generated image",
+                    className: "w-full rounded-lg"
+                  })
+                }) : /* @__PURE__ */ jsx_runtime18.jsx("img", {
+                  src: img.url,
+                  alt: img.revised_prompt || "Generated image",
+                  className: "w-full rounded-lg border border-border"
+                }),
+                img.revised_prompt && /* @__PURE__ */ jsx_runtime18.jsx("p", {
+                  className: "text-[11px] text-muted-foreground italic px-0.5",
+                  children: img.revised_prompt
+                })
+              ]
+            }, idx))
+          })
+        ]
+      }),
+      hasVideos && /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+        className: cn("space-y-2 pt-1", mediaClassName),
+        children: [
+          /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+            className: "flex items-center gap-2 text-xs font-medium text-muted-foreground",
+            children: [
+              /* @__PURE__ */ jsx_runtime18.jsx(import_lucide_react10.Video, {
+                className: "h-3.5 w-3.5"
+              }),
+              "Videos (",
+              message.videos.length,
+              ")"
+            ]
+          }),
+          /* @__PURE__ */ jsx_runtime18.jsx("div", {
+            className: "space-y-2",
+            children: message.videos.map((video, idx) => /* @__PURE__ */ jsx_runtime18.jsx("div", {
+              children: video.url ? /* @__PURE__ */ jsx_runtime18.jsx("video", {
+                src: video.url,
+                controls: true,
+                className: "w-full rounded-lg border border-border"
+              }) : /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+                className: "bg-muted/50 border border-border p-2.5 rounded-lg text-xs text-muted-foreground",
+                children: [
+                  "Video ID: ",
+                  video.id,
+                  " (ETA: ",
+                  video.eta,
+                  "s)"
+                ]
+              })
+            }, idx))
+          })
+        ]
+      }),
+      hasAudio && /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+        className: cn("space-y-2 pt-1", mediaClassName),
+        children: [
+          /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+            className: "flex items-center gap-2 text-xs font-medium text-muted-foreground",
+            children: [
+              /* @__PURE__ */ jsx_runtime18.jsx(import_lucide_react10.Music, {
+                className: "h-3.5 w-3.5"
+              }),
+              "Audio (",
+              message.audio.length,
+              ")"
+            ]
+          }),
+          /* @__PURE__ */ jsx_runtime18.jsx("div", {
+            className: "space-y-2",
+            children: message.audio.map((audio, idx) => /* @__PURE__ */ jsx_runtime18.jsx("div", {
+              children: audio.url ? /* @__PURE__ */ jsx_runtime18.jsx("audio", {
+                src: audio.url,
+                controls: true,
+                className: "w-full"
+              }) : audio.base64_audio ? /* @__PURE__ */ jsx_runtime18.jsx("audio", {
+                src: `data:${audio.mime_type || "audio/wav"};base64,${audio.base64_audio}`,
+                controls: true,
+                className: "w-full"
+              }) : /* @__PURE__ */ jsx_runtime18.jsx("div", {
+                className: "bg-muted/50 border border-border p-2.5 rounded-lg text-xs text-muted-foreground",
+                children: "Audio data unavailable"
+              })
+            }, idx))
+          })
+        ]
+      }),
+      hasFiles && /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+        className: cn("space-y-2 pt-1", mediaClassName),
+        children: [
+          /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+            className: "flex items-center gap-2 text-xs font-medium text-muted-foreground",
+            children: [
+              /* @__PURE__ */ jsx_runtime18.jsx(import_lucide_react10.Paperclip, {
+                className: "h-3.5 w-3.5"
+              }),
+              "Files (",
+              message.files.length,
+              ")"
+            ]
+          }),
+          /* @__PURE__ */ jsx_runtime18.jsx("div", {
+            className: "flex flex-wrap gap-2",
+            children: message.files.map((file, idx) => showFilePreview ? /* @__PURE__ */ jsx_runtime18.jsx(FilePreviewCard, {
+              file: { name: file.name, type: file.type, url: file.url, size: file.size },
+              onClick: () => openFilePreview({ name: file.name, type: file.type, url: file.url, size: file.size })
+            }, idx) : /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+              className: "flex items-center gap-2 rounded-lg border border-border px-3 py-2 text-xs bg-muted/30 hover:bg-muted/50 transition-colors",
+              children: [
+                /* @__PURE__ */ jsx_runtime18.jsx(import_lucide_react10.FileIcon, {
+                  className: "h-3.5 w-3.5 shrink-0 text-muted-foreground"
+                }),
+                /* @__PURE__ */ jsx_runtime18.jsx("span", {
+                  className: "truncate max-w-[180px]",
+                  children: file.name
+                }),
+                file.size && /* @__PURE__ */ jsx_runtime18.jsxs("span", {
+                  className: "text-muted-foreground/70",
+                  children: [
+                    "(",
+                    (file.size / 1024).toFixed(1),
+                    "KB)"
+                  ]
+                }),
+                file.url && /^https?:\/\//i.test(file.url) && /* @__PURE__ */ jsx_runtime18.jsx("a", {
+                  href: file.url,
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  className: "text-primary hover:underline font-medium",
+                  children: "View"
+                })
+              ]
+            }, idx))
+          })
+        ]
+      }),
+      hasResponseAudio && message.response_audio && /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+        className: cn("space-y-2 pt-1", mediaClassName),
+        children: [
+          /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+            className: "flex items-center gap-2 text-xs font-medium text-muted-foreground",
+            children: [
+              /* @__PURE__ */ jsx_runtime18.jsx(import_lucide_react10.Music, {
+                className: "h-3.5 w-3.5"
+              }),
+              "Response Audio"
+            ]
+          }),
+          message.response_audio.transcript && /* @__PURE__ */ jsx_runtime18.jsxs("div", {
+            className: "text-xs italic bg-muted/50 border border-border p-2.5 rounded-lg text-muted-foreground",
+            children: [
+              '"',
+              message.response_audio.transcript,
+              '"'
+            ]
+          }),
+          message.response_audio.content && /* @__PURE__ */ jsx_runtime18.jsx("audio", {
+            src: `data:audio/wav;base64,${message.response_audio.content}`,
+            controls: true,
+            className: "w-full"
+          })
+        ]
+      })
+    ]
+  });
+}
+
+// src/ui/composed/agno-chat/context.ts
+var import_react12 = require("react");
+var AgnoChatContext = import_react12.createContext(null);
+function useAgnoChatContext() {
+  const ctx = import_react12.useContext(AgnoChatContext);
+  if (!ctx) {
+    throw new Error("useAgnoChatContext must be used within an <AgnoChat> provider. " + "Wrap your component tree with <AgnoChat>.");
+  }
+  return ctx;
+}
+
+// src/ui/composed/agno-message/tools.tsx
+var jsx_runtime19 = require("react/jsx-runtime");
+function AgnoMessageTools({ renderTool: renderToolProp } = {}) {
+  const { message, classNames, renderTool: ctxMsgRenderTool } = useAgnoMessageContext();
+  const { renderTool: ctxChatRenderTool, isDebug } = useAgnoChatContext();
+  const renderTool = renderToolProp ?? ctxMsgRenderTool ?? ctxChatRenderTool;
+  if (!message.tool_calls || message.tool_calls.length === 0)
+    return null;
+  return /* @__PURE__ */ jsx_runtime19.jsx("div", {
+    className: cn("space-y-2 pt-1", classNames?.assistant?.toolCalls),
+    children: message.tool_calls.map((tool, idx) => {
+      const defaultRender = () => /* @__PURE__ */ jsx_runtime19.jsxs(jsx_runtime19.Fragment, {
+        children: [
+          /* @__PURE__ */ jsx_runtime19.jsx(ToolGenerativeUI, {
+            tool
+          }),
+          isDebug ? /* @__PURE__ */ jsx_runtime19.jsx(ToolDebugCard, {
+            tool,
+            defaultOpen: idx === 0
+          }) : null
+        ]
+      });
+      const node = renderTool ? renderTool(tool, { index: idx, isDebug, defaultRender }) : defaultRender();
+      if (node === null || node === undefined)
+        return null;
+      return /* @__PURE__ */ jsx_runtime19.jsx("div", {
+        children: node
+      }, tool.tool_call_id || idx);
+    })
+  });
+}
+
+// src/ui/components/response.tsx
+var import_react13 = require("react");
+var import_streamdown = require("streamdown");
+var jsx_runtime20 = require("react/jsx-runtime");
+var Response = import_react13.memo(({ className, ...props }) => /* @__PURE__ */ jsx_runtime20.jsx(import_streamdown.Streamdown, {
+  className: cn("size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", className),
+  ...props
+}), (prevProps, nextProps) => prevProps.children === nextProps.children);
+Response.displayName = "Response";
+
+// src/ui/composed/agno-message/content.tsx
+var jsx_runtime21 = require("react/jsx-runtime");
+function AgnoMessageContent() {
+  const { message } = useAgnoMessageContext();
+  if (!message.content)
+    return null;
+  return /* @__PURE__ */ jsx_runtime21.jsx("div", {
+    className: "prose prose-sm dark:prose-invert max-w-none prose-p:leading-relaxed prose-pre:bg-muted prose-pre:border prose-pre:border-border",
+    children: /* @__PURE__ */ jsx_runtime21.jsx(Response, {
+      children: message.content
+    })
+  });
+}
+
+// src/ui/composed/agno-message/references.tsx
+var import_lucide_react11 = require("lucide-react");
+var jsx_runtime22 = require("react/jsx-runtime");
+function AgnoMessageReferences() {
+  const { message, classNames } = useAgnoMessageContext();
+  const references = message.extra_data?.references;
+  if (!references || references.length === 0)
+    return null;
+  return /* @__PURE__ */ jsx_runtime22.jsxs("div", {
+    className: cn("space-y-2 pt-1", classNames?.assistant?.references),
+    children: [
+      /* @__PURE__ */ jsx_runtime22.jsxs("div", {
+        className: "flex items-center gap-2 text-xs font-medium text-muted-foreground",
+        children: [
+          /* @__PURE__ */ jsx_runtime22.jsx(import_lucide_react11.FileText, {
+            className: "h-3.5 w-3.5"
+          }),
+          "References (",
+          references.length,
+          ")"
+        ]
+      }),
+      /* @__PURE__ */ jsx_runtime22.jsx("div", {
+        className: "space-y-2",
+        children: references.map((refData, idx) => /* @__PURE__ */ jsx_runtime22.jsxs("div", {
+          className: "text-xs space-y-1.5",
+          children: [
+            refData.query && /* @__PURE__ */ jsx_runtime22.jsxs("div", {
+              className: "font-medium text-foreground",
+              children: [
+                "Query: ",
+                refData.query
+              ]
+            }),
+            refData.references.map((ref, refIdx) => /* @__PURE__ */ jsx_runtime22.jsxs("div", {
+              className: "bg-muted/50 border border-border p-2.5 rounded-lg",
+              children: [
+                /* @__PURE__ */ jsx_runtime22.jsxs("div", {
+                  className: "italic text-muted-foreground mb-1",
+                  children: [
+                    '"',
+                    ref.content,
+                    '"'
+                  ]
+                }),
+                /* @__PURE__ */ jsx_runtime22.jsxs("div", {
+                  className: "text-muted-foreground/70",
+                  children: [
+                    "Source: ",
+                    ref.name,
+                    " (chunk ",
+                    ref.meta_data.chunk,
+                    "/",
+                    ref.meta_data.chunk_size,
+                    ")"
+                  ]
+                })
+              ]
+            }, refIdx))
+          ]
+        }, idx))
+      })
+    ]
+  });
+}
+
+// src/ui/composed/agno-message/footer.tsx
+var import_lucide_react12 = require("lucide-react");
+var jsx_runtime23 = require("react/jsx-runtime");
+function AgnoMessageFooter({ showTimestamp = true } = {}) {
+  const { message, classNames, actions, isLastAssistantMessage, formatTimestamp } = useAgnoMessageContext();
+  const hasError = message.streamingError;
+  const isCustomTimestamp = !!formatTimestamp;
+  const resolvedFormatTimestamp = formatTimestamp ?? formatSmartTimestamp;
+  if (!actions?.assistant && !showTimestamp && !hasError)
+    return null;
+  return /* @__PURE__ */ jsx_runtime23.jsxs("div", {
+    className: "flex items-center gap-2 pt-1",
+    children: [
+      actions?.assistant && (() => {
+        const visibility = actions.visibility ?? "visible";
+        if (visibility === "last-assistant" && !isLastAssistantMessage)
+          return null;
+        const useHover = visibility === "hover" || visibility === "hover-last-visible" && !isLastAssistantMessage;
+        return /* @__PURE__ */ jsx_runtime23.jsx("div", {
+          className: cn("flex items-center gap-1 transition-opacity", useHover && "opacity-0 group-hover/message:opacity-100", classNames?.assistant?.actions),
+          children: actions.assistant(message)
+        });
+      })(),
+      hasError && /* @__PURE__ */ jsx_runtime23.jsxs("span", {
+        className: "flex items-center gap-1 text-[11px] text-destructive",
+        children: [
+          /* @__PURE__ */ jsx_runtime23.jsx(import_lucide_react12.AlertCircle, {
+            className: "h-3 w-3"
+          }),
+          "Error"
+        ]
+      }),
+      showTimestamp && /* @__PURE__ */ jsx_runtime23.jsx(SmartTimestamp, {
+        date: new Date(message.created_at * 1000),
+        formatShort: isCustomTimestamp ? resolvedFormatTimestamp : undefined,
+        className: "text-[11px] text-muted-foreground"
+      })
+    ]
+  });
+}
+
+// src/ui/composed/agno-message/message.tsx
+var jsx_runtime24 = require("react/jsx-runtime");
+function DefaultAssistantComposition({ showTimestamp }) {
+  return /* @__PURE__ */ jsx_runtime24.jsxs(jsx_runtime24.Fragment, {
+    children: [
+      /* @__PURE__ */ jsx_runtime24.jsx(AgnoMessageReasoning, {}),
+      /* @__PURE__ */ jsx_runtime24.jsx(AgnoMessageMedia, {}),
+      /* @__PURE__ */ jsx_runtime24.jsx(AgnoMessageTools, {}),
+      /* @__PURE__ */ jsx_runtime24.jsx(AgnoMessageContent, {}),
+      /* @__PURE__ */ jsx_runtime24.jsx(AgnoMessageReferences, {}),
+      /* @__PURE__ */ jsx_runtime24.jsx(AgnoMessageFooter, {
+        showTimestamp
+      })
+    ]
+  });
+}
+function AgnoMessage({
+  message,
+  className,
+  classNames,
+  avatars,
+  actions,
+  isLastAssistantMessage = false,
+  showFilePreview = true,
+  showImageLightbox = true,
+  showTimestamp = true,
+  formatTimestamp,
+  renderTool,
+  children
+}) {
+  const isUser = message.role === "user";
+  const hasError = message.streamingError;
+  const [preview, setPreview] = import_react14.useState(null);
+  const isCustomTimestamp = !!formatTimestamp;
+  const resolvedFormatTimestamp = formatTimestamp ?? formatSmartTimestamp;
+  const ctx = import_react14.useMemo(() => ({
+    message,
+    isLastAssistantMessage,
+    classNames,
+    actions,
+    avatars,
+    formatTimestamp,
+    showFilePreview,
+    showImageLightbox,
+    openImageLightbox: (images, index) => {
+      if (!showImageLightbox)
+        return;
+      setPreview({ type: "image", images, initialIndex: index });
+    },
+    openFilePreview: (file) => {
+      if (!showFilePreview)
+        return;
+      setPreview({ type: "file", file });
+    },
+    renderTool
+  }), [
+    message,
+    isLastAssistantMessage,
+    classNames,
+    actions,
+    avatars,
+    formatTimestamp,
+    showFilePreview,
+    showImageLightbox,
+    renderTool
+  ]);
+  const closePreview = () => setPreview(null);
+  return /* @__PURE__ */ jsx_runtime24.jsx(AgnoMessageContext.Provider, {
+    value: ctx,
+    children: /* @__PURE__ */ jsx_runtime24.jsxs("div", {
+      className: cn("py-5 first:pt-2", isUser ? "flex justify-end" : "", classNames?.root, className),
+      children: [
+        isUser ? /* @__PURE__ */ jsx_runtime24.jsx(UserMessageLayout, {
+          message,
+          classNames,
+          avatars,
+          actions,
+          isCustomTimestamp,
+          resolvedFormatTimestamp,
+          showTimestamp,
+          showImageLightbox,
+          showFilePreview,
+          openImageLightbox: ctx.openImageLightbox,
+          openFilePreview: ctx.openFilePreview,
+          hasError
+        }) : /* @__PURE__ */ jsx_runtime24.jsxs("div", {
+          className: "flex items-start gap-3 group/message",
+          children: [
+            avatars?.assistant,
+            /* @__PURE__ */ jsx_runtime24.jsx("div", {
+              className: cn("flex-1 min-w-0 space-y-3", classNames?.assistant?.container),
+              children: children ?? /* @__PURE__ */ jsx_runtime24.jsx(DefaultAssistantComposition, {
+                showTimestamp
+              })
+            })
+          ]
+        }),
+        preview?.type === "image" && /* @__PURE__ */ jsx_runtime24.jsx(ImageLightbox, {
+          open: true,
+          onOpenChange: (open) => {
+            if (!open)
+              closePreview();
+          },
+          images: preview.images,
+          initialIndex: preview.initialIndex
+        }),
+        preview?.type === "file" && /* @__PURE__ */ jsx_runtime24.jsx(FilePreviewModal, {
+          open: true,
+          onOpenChange: (open) => {
+            if (!open)
+              closePreview();
+          },
+          file: preview.file
+        })
+      ]
+    })
+  });
+}
+AgnoMessage.Reasoning = AgnoMessageReasoning;
+AgnoMessage.Media = AgnoMessageMedia;
+AgnoMessage.Tools = AgnoMessageTools;
+AgnoMessage.Content = AgnoMessageContent;
+AgnoMessage.References = AgnoMessageReferences;
+AgnoMessage.Footer = AgnoMessageFooter;
+function UserMessageLayout({
+  message,
+  classNames,
+  avatars,
+  actions,
+  isCustomTimestamp,
+  resolvedFormatTimestamp,
+  showTimestamp,
+  showImageLightbox,
+  showFilePreview,
+  openImageLightbox,
+  openFilePreview,
+  hasError
+}) {
+  return /* @__PURE__ */ jsx_runtime24.jsxs("div", {
+    className: "flex items-start gap-2.5 max-w-[80%] flex-row-reverse",
+    children: [
+      avatars?.user,
+      /* @__PURE__ */ jsx_runtime24.jsxs("div", {
+        className: "space-y-1.5 flex flex-col items-end min-w-0",
+        children: [
+          (message.images && message.images.length > 0 || message.audio && message.audio.length > 0 || message.files && message.files.length > 0) && /* @__PURE__ */ jsx_runtime24.jsxs("div", {
+            className: "flex flex-wrap gap-2 justify-end",
+            children: [
+              message.images?.map((img, idx) => /* @__PURE__ */ jsx_runtime24.jsx(FilePreviewCard, {
+                file: { name: img.revised_prompt || `Image ${idx + 1}`, type: "image/png", url: img.url },
+                onClick: showImageLightbox ? () => openImageLightbox(message.images.map((i) => ({ url: i.url, alt: i.revised_prompt })), idx) : undefined
+              }, `img-${idx}`)),
+              message.audio?.map((audio, idx) => /* @__PURE__ */ jsx_runtime24.jsxs("div", {
+                className: "flex items-center gap-1.5 rounded-lg border border-border bg-muted/50 px-2.5 py-1.5 text-xs text-foreground self-end",
+                children: [
+                  /* @__PURE__ */ jsx_runtime24.jsx(import_lucide_react13.Music, {
+                    className: "h-3.5 w-3.5 text-muted-foreground"
+                  }),
+                  /* @__PURE__ */ jsx_runtime24.jsx("span", {
+                    className: "truncate max-w-[150px]",
+                    children: audio.id || `Audio ${idx + 1}`
+                  })
+                ]
+              }, `audio-${idx}`)),
+              message.files?.map((file, idx) => showFilePreview ? /* @__PURE__ */ jsx_runtime24.jsx(FilePreviewCard, {
+                file: { name: file.name, type: file.type, url: file.url, size: file.size },
+                onClick: () => openFilePreview({ name: file.name, type: file.type, url: file.url, size: file.size })
+              }, `file-${idx}`) : /* @__PURE__ */ jsx_runtime24.jsxs("div", {
+                className: "flex items-center gap-1.5 rounded-lg border border-border bg-muted/50 px-2.5 py-1.5 text-xs text-foreground self-end",
+                children: [
+                  /* @__PURE__ */ jsx_runtime24.jsx(import_lucide_react13.FileIcon, {
+                    className: "h-3.5 w-3.5 text-muted-foreground"
+                  }),
+                  /* @__PURE__ */ jsx_runtime24.jsx("span", {
+                    className: "truncate max-w-[150px]",
+                    children: file.name
+                  })
+                ]
+              }, `file-${idx}`))
+            ]
+          }),
+          message.content && /* @__PURE__ */ jsx_runtime24.jsx("div", {
+            className: cn("rounded-2xl rounded-br-md px-4 py-2.5", classNames?.user?.bubble ?? "bg-primary text-primary-foreground", hasError && "opacity-70"),
+            children: /* @__PURE__ */ jsx_runtime24.jsx("p", {
+              className: "text-sm whitespace-pre-wrap",
+              children: message.content
+            })
+          }),
+          (showTimestamp || actions?.user) && /* @__PURE__ */ jsx_runtime24.jsxs("div", {
+            className: "flex items-center justify-end gap-1.5 px-1",
+            children: [
+              actions?.user && /* @__PURE__ */ jsx_runtime24.jsx("div", {
+                className: "flex items-center gap-1",
+                children: actions.user(message)
+              }),
+              /* @__PURE__ */ jsx_runtime24.jsx(SmartTimestamp, {
+                date: new Date(message.created_at * 1000),
+                formatShort: isCustomTimestamp ? resolvedFormatTimestamp : undefined,
+                className: "text-[11px] text-muted-foreground"
+              }),
+              hasError && /* @__PURE__ */ jsx_runtime24.jsx(import_lucide_react13.AlertCircle, {
+                className: "h-3 w-3 text-destructive"
+              })
+            ]
+          })
+        ]
+      })
+    ]
+  });
+}
+// src/hooks/useAgnoCustomEvents.ts
+var import_react15 = require("react");
 function useAgnoCustomEvents(handler) {
   const client = useAgnoClient();
-  const [events, setEvents] = import_react8.useState([]);
-  const handlerRef = import_react8.useRef(handler);
+  const [events, setEvents] = import_react15.useState([]);
+  const handlerRef = import_react15.useRef(handler);
   handlerRef.current = handler;
-  import_react8.useEffect(() => {
+  import_react15.useEffect(() => {
     const handleCustomEvent = (event) => {
       setEvents((prev) => [...prev, event]);
       handlerRef.current?.(event);
@@ -1167,20 +2818,20 @@ function useAgnoCustomEvents(handler) {
       client.off("custom:event", handleCustomEvent);
     };
   }, [client]);
-  const clearEvents = import_react8.useCallback(() => {
+  const clearEvents = import_react15.useCallback(() => {
     setEvents([]);
   }, []);
   return { events, clearEvents };
 }
 // src/hooks/useAgnoMemory.ts
-var import_react9 = require("react");
+var import_react16 = require("react");
 function useAgnoMemory() {
   const client = useAgnoClient();
-  const [memories, setMemories] = import_react9.useState([]);
-  const [topics, setTopics] = import_react9.useState([]);
-  const [isLoading, setIsLoading] = import_react9.useState(false);
-  const [error, setError] = import_react9.useState();
-  import_react9.useEffect(() => {
+  const [memories, setMemories] = import_react16.useState([]);
+  const [topics, setTopics] = import_react16.useState([]);
+  const [isLoading, setIsLoading] = import_react16.useState(false);
+  const [error, setError] = import_react16.useState();
+  import_react16.useEffect(() => {
     const handleMemoryCreated = (memory) => {
       setMemories((prev) => [memory, ...prev]);
     };
@@ -1215,7 +2866,7 @@ function useAgnoMemory() {
       client.off("state:change", handleStateChange);
     };
   }, [client]);
-  const fetchMemories = import_react9.useCallback(async (queryParams, options) => {
+  const fetchMemories = import_react16.useCallback(async (queryParams, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1230,7 +2881,7 @@ function useAgnoMemory() {
       setIsLoading(false);
     }
   }, [client]);
-  const getMemoryById = import_react9.useCallback(async (memoryId, options) => {
+  const getMemoryById = import_react16.useCallback(async (memoryId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1243,7 +2894,7 @@ function useAgnoMemory() {
       setIsLoading(false);
     }
   }, [client]);
-  const getMemoryTopics = import_react9.useCallback(async (options) => {
+  const getMemoryTopics = import_react16.useCallback(async (options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1258,7 +2909,7 @@ function useAgnoMemory() {
       setIsLoading(false);
     }
   }, [client]);
-  const getUserMemoryStats = import_react9.useCallback(async (queryParams, options) => {
+  const getUserMemoryStats = import_react16.useCallback(async (queryParams, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1271,7 +2922,7 @@ function useAgnoMemory() {
       setIsLoading(false);
     }
   }, [client]);
-  const createMemory = import_react9.useCallback(async (request, options) => {
+  const createMemory = import_react16.useCallback(async (request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1284,7 +2935,7 @@ function useAgnoMemory() {
       setIsLoading(false);
     }
   }, [client]);
-  const updateMemory = import_react9.useCallback(async (memoryId, request, options) => {
+  const updateMemory = import_react16.useCallback(async (memoryId, request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1297,7 +2948,7 @@ function useAgnoMemory() {
       setIsLoading(false);
     }
   }, [client]);
-  const deleteMemory = import_react9.useCallback(async (memoryId, options) => {
+  const deleteMemory = import_react16.useCallback(async (memoryId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1310,7 +2961,7 @@ function useAgnoMemory() {
       setIsLoading(false);
     }
   }, [client]);
-  const deleteMultipleMemories = import_react9.useCallback(async (memoryIds, options) => {
+  const deleteMultipleMemories = import_react16.useCallback(async (memoryIds, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1339,12 +2990,12 @@ function useAgnoMemory() {
   };
 }
 // src/hooks/useAgnoSessionState.ts
-var import_react10 = require("react");
+var import_react17 = require("react");
 function useAgnoSessionState() {
   const client = useAgnoClient();
-  const [sessionState, setLocalSessionState] = import_react10.useState(() => client.getSessionState());
-  const [isRefreshing, setIsRefreshing] = import_react10.useState(() => client.getState().isSessionStateRefreshing ?? false);
-  import_react10.useEffect(() => {
+  const [sessionState, setLocalSessionState] = import_react17.useState(() => client.getSessionState());
+  const [isRefreshing, setIsRefreshing] = import_react17.useState(() => client.getState().isSessionStateRefreshing ?? false);
+  import_react17.useEffect(() => {
     const handleStateChange = (state) => {
       setLocalSessionState(state);
     };
@@ -1361,16 +3012,16 @@ function useAgnoSessionState() {
       client.off("session-state:refresh:end", handleRefreshEnd);
     };
   }, [client]);
-  const setSessionState = import_react10.useCallback(async (next) => {
+  const setSessionState = import_react17.useCallback(async (next) => {
     const resolved = typeof next === "function" ? next(client.getSessionState()) : next;
     await client.setSessionState(resolved);
   }, [client]);
-  const mergeSessionState = import_react10.useCallback(async (partial) => {
+  const mergeSessionState = import_react17.useCallback(async (partial) => {
     const current = client.getSessionState() ?? {};
     const merged = { ...current, ...partial };
     await client.setSessionState(merged);
   }, [client]);
-  const refreshSessionState = import_react10.useCallback(async () => {
+  const refreshSessionState = import_react17.useCallback(async () => {
     const result = await client.refreshSessionState();
     return result ?? null;
   }, [client]);
@@ -1383,14 +3034,14 @@ function useAgnoSessionState() {
   };
 }
 // src/hooks/useAgnoKnowledge.ts
-var import_react11 = require("react");
+var import_react18 = require("react");
 function useAgnoKnowledge() {
   const client = useAgnoClient();
-  const [isLoading, setIsLoading] = import_react11.useState(false);
-  const [error, setError] = import_react11.useState();
-  const [config, setConfig] = import_react11.useState();
-  const [content, setContent] = import_react11.useState([]);
-  const getConfig = import_react11.useCallback(async (options) => {
+  const [isLoading, setIsLoading] = import_react18.useState(false);
+  const [error, setError] = import_react18.useState();
+  const [config, setConfig] = import_react18.useState();
+  const [content, setContent] = import_react18.useState([]);
+  const getConfig = import_react18.useCallback(async (options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1405,7 +3056,7 @@ function useAgnoKnowledge() {
       setIsLoading(false);
     }
   }, [client]);
-  const listContent = import_react11.useCallback(async (listOptions, options) => {
+  const listContent = import_react18.useCallback(async (listOptions, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1420,7 +3071,7 @@ function useAgnoKnowledge() {
       setIsLoading(false);
     }
   }, [client]);
-  const getContent = import_react11.useCallback(async (contentId, options) => {
+  const getContent = import_react18.useCallback(async (contentId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1433,7 +3084,7 @@ function useAgnoKnowledge() {
       setIsLoading(false);
     }
   }, [client]);
-  const getContentStatus = import_react11.useCallback(async (contentId, options) => {
+  const getContentStatus = import_react18.useCallback(async (contentId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1446,7 +3097,7 @@ function useAgnoKnowledge() {
       setIsLoading(false);
     }
   }, [client]);
-  const search = import_react11.useCallback(async (request, options) => {
+  const search = import_react18.useCallback(async (request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1459,7 +3110,7 @@ function useAgnoKnowledge() {
       setIsLoading(false);
     }
   }, [client]);
-  const uploadContent = import_react11.useCallback(async (data, options) => {
+  const uploadContent = import_react18.useCallback(async (data, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1474,7 +3125,7 @@ function useAgnoKnowledge() {
       setIsLoading(false);
     }
   }, [client]);
-  const updateContent = import_react11.useCallback(async (contentId, request, options) => {
+  const updateContent = import_react18.useCallback(async (contentId, request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1489,7 +3140,7 @@ function useAgnoKnowledge() {
       setIsLoading(false);
     }
   }, [client]);
-  const deleteAllContent = import_react11.useCallback(async (options) => {
+  const deleteAllContent = import_react18.useCallback(async (options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1503,7 +3154,7 @@ function useAgnoKnowledge() {
       setIsLoading(false);
     }
   }, [client]);
-  const deleteContent = import_react11.useCallback(async (contentId, options) => {
+  const deleteContent = import_react18.useCallback(async (contentId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1535,14 +3186,14 @@ function useAgnoKnowledge() {
   };
 }
 // src/hooks/useAgnoMetrics.ts
-var import_react12 = require("react");
+var import_react19 = require("react");
 function useAgnoMetrics() {
   const client = useAgnoClient();
-  const [isLoading, setIsLoading] = import_react12.useState(false);
-  const [isRefreshing, setIsRefreshing] = import_react12.useState(false);
-  const [error, setError] = import_react12.useState();
-  const [metrics, setMetrics] = import_react12.useState();
-  const fetchMetrics = import_react12.useCallback(async (options) => {
+  const [isLoading, setIsLoading] = import_react19.useState(false);
+  const [isRefreshing, setIsRefreshing] = import_react19.useState(false);
+  const [error, setError] = import_react19.useState();
+  const [metrics, setMetrics] = import_react19.useState();
+  const fetchMetrics = import_react19.useCallback(async (options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1557,7 +3208,7 @@ function useAgnoMetrics() {
       setIsLoading(false);
     }
   }, [client]);
-  const refreshMetrics = import_react12.useCallback(async (options) => {
+  const refreshMetrics = import_react19.useCallback(async (options) => {
     setIsRefreshing(true);
     setError(undefined);
     try {
@@ -1571,7 +3222,7 @@ function useAgnoMetrics() {
       setIsRefreshing(false);
     }
   }, [client]);
-  const clearMetrics = import_react12.useCallback(() => {
+  const clearMetrics = import_react19.useCallback(() => {
     setMetrics(undefined);
     setError(undefined);
   }, []);
@@ -1586,14 +3237,14 @@ function useAgnoMetrics() {
   };
 }
 // src/hooks/useAgnoEvals.ts
-var import_react13 = require("react");
+var import_react20 = require("react");
 function useAgnoEvals() {
   const client = useAgnoClient();
-  const [evalRuns, setEvalRuns] = import_react13.useState([]);
-  const [pagination, setPagination] = import_react13.useState();
-  const [isLoading, setIsLoading] = import_react13.useState(false);
-  const [error, setError] = import_react13.useState();
-  const listEvalRuns = import_react13.useCallback(async (listParams = {}, options) => {
+  const [evalRuns, setEvalRuns] = import_react20.useState([]);
+  const [pagination, setPagination] = import_react20.useState();
+  const [isLoading, setIsLoading] = import_react20.useState(false);
+  const [error, setError] = import_react20.useState();
+  const listEvalRuns = import_react20.useCallback(async (listParams = {}, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1609,7 +3260,7 @@ function useAgnoEvals() {
       setIsLoading(false);
     }
   }, [client]);
-  const getEvalRun = import_react13.useCallback(async (evalRunId, options) => {
+  const getEvalRun = import_react20.useCallback(async (evalRunId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1622,7 +3273,7 @@ function useAgnoEvals() {
       setIsLoading(false);
     }
   }, [client]);
-  const executeEval = import_react13.useCallback(async (request, options) => {
+  const executeEval = import_react20.useCallback(async (request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1637,7 +3288,7 @@ function useAgnoEvals() {
       setIsLoading(false);
     }
   }, [client]);
-  const updateEvalRun = import_react13.useCallback(async (evalRunId, request, options) => {
+  const updateEvalRun = import_react20.useCallback(async (evalRunId, request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1652,7 +3303,7 @@ function useAgnoEvals() {
       setIsLoading(false);
     }
   }, [client]);
-  const deleteEvalRuns = import_react13.useCallback(async (evalRunIds, options) => {
+  const deleteEvalRuns = import_react20.useCallback(async (evalRunIds, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1667,7 +3318,7 @@ function useAgnoEvals() {
       setIsLoading(false);
     }
   }, [client]);
-  const renameEvalRun = import_react13.useCallback(async (evalRunId, newName, options) => {
+  const renameEvalRun = import_react20.useCallback(async (evalRunId, newName, options) => {
     return updateEvalRun(evalRunId, { name: newName }, options);
   }, [updateEvalRun]);
   return {
@@ -1684,14 +3335,14 @@ function useAgnoEvals() {
   };
 }
 // src/hooks/useAgnoTraces.ts
-var import_react14 = require("react");
+var import_react21 = require("react");
 function useAgnoTraces() {
   const client = useAgnoClient();
-  const [traces, setTraces] = import_react14.useState([]);
-  const [traceSessionStats, setTraceSessionStats] = import_react14.useState([]);
-  const [isLoading, setIsLoading] = import_react14.useState(false);
-  const [error, setError] = import_react14.useState();
-  import_react14.useEffect(() => {
+  const [traces, setTraces] = import_react21.useState([]);
+  const [traceSessionStats, setTraceSessionStats] = import_react21.useState([]);
+  const [isLoading, setIsLoading] = import_react21.useState(false);
+  const [error, setError] = import_react21.useState();
+  import_react21.useEffect(() => {
     const handleStateChange = () => {
       const state2 = client.getState();
       setTraces(state2.traces);
@@ -1705,7 +3356,7 @@ function useAgnoTraces() {
       client.off("state:change", handleStateChange);
     };
   }, [client]);
-  const fetchTraces = import_react14.useCallback(async (options = {}, requestOptions) => {
+  const fetchTraces = import_react21.useCallback(async (options = {}, requestOptions) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1720,7 +3371,7 @@ function useAgnoTraces() {
       setIsLoading(false);
     }
   }, [client]);
-  const getTraceDetail = import_react14.useCallback(async (traceId, options = {}, requestOptions) => {
+  const getTraceDetail = import_react21.useCallback(async (traceId, options = {}, requestOptions) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1733,7 +3384,7 @@ function useAgnoTraces() {
       setIsLoading(false);
     }
   }, [client]);
-  const fetchTraceSessionStats = import_react14.useCallback(async (options = {}, requestOptions) => {
+  const fetchTraceSessionStats = import_react21.useCallback(async (options = {}, requestOptions) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1759,13 +3410,13 @@ function useAgnoTraces() {
   };
 }
 // src/hooks/useAgnoComponents.ts
-var import_react15 = require("react");
+var import_react22 = require("react");
 function useAgnoComponents() {
   const client = useAgnoClient();
-  const [components, setComponents] = import_react15.useState([]);
-  const [isLoading, setIsLoading] = import_react15.useState(false);
-  const [error, setError] = import_react15.useState();
-  import_react15.useEffect(() => {
+  const [components, setComponents] = import_react22.useState([]);
+  const [isLoading, setIsLoading] = import_react22.useState(false);
+  const [error, setError] = import_react22.useState();
+  import_react22.useEffect(() => {
     const handleComponentCreated = (component) => {
       setComponents((prev) => [component, ...prev]);
     };
@@ -1790,7 +3441,7 @@ function useAgnoComponents() {
       client.off("state:change", handleStateChange);
     };
   }, [client]);
-  const fetchComponents = import_react15.useCallback(async (queryParams, options) => {
+  const fetchComponents = import_react22.useCallback(async (queryParams, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1805,7 +3456,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const getComponentById = import_react15.useCallback(async (componentId, options) => {
+  const getComponentById = import_react22.useCallback(async (componentId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1818,7 +3469,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const createComponent = import_react15.useCallback(async (request, options) => {
+  const createComponent = import_react22.useCallback(async (request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1831,7 +3482,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const updateComponent = import_react15.useCallback(async (componentId, request, options) => {
+  const updateComponent = import_react22.useCallback(async (componentId, request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1844,7 +3495,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const deleteComponent = import_react15.useCallback(async (componentId, options) => {
+  const deleteComponent = import_react22.useCallback(async (componentId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1857,7 +3508,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const fetchComponentConfigs = import_react15.useCallback(async (componentId, options) => {
+  const fetchComponentConfigs = import_react22.useCallback(async (componentId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1870,7 +3521,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const createComponentConfig = import_react15.useCallback(async (componentId, request, options) => {
+  const createComponentConfig = import_react22.useCallback(async (componentId, request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1883,7 +3534,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const getCurrentComponentConfig = import_react15.useCallback(async (componentId, options) => {
+  const getCurrentComponentConfig = import_react22.useCallback(async (componentId, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1896,7 +3547,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const getComponentConfigByVersion = import_react15.useCallback(async (componentId, version, options) => {
+  const getComponentConfigByVersion = import_react22.useCallback(async (componentId, version, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1909,7 +3560,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const updateComponentConfig = import_react15.useCallback(async (componentId, version, request, options) => {
+  const updateComponentConfig = import_react22.useCallback(async (componentId, version, request, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1922,7 +3573,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const deleteComponentConfig = import_react15.useCallback(async (componentId, version, options) => {
+  const deleteComponentConfig = import_react22.useCallback(async (componentId, version, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1935,7 +3586,7 @@ function useAgnoComponents() {
       setIsLoading(false);
     }
   }, [client]);
-  const setCurrentComponentConfig = import_react15.useCallback(async (componentId, version, options) => {
+  const setCurrentComponentConfig = import_react22.useCallback(async (componentId, version, options) => {
     setIsLoading(true);
     setError(undefined);
     try {
@@ -1967,4 +3618,4 @@ function useAgnoComponents() {
   };
 }
 
-//# debugId=D27FED2F9BD03ABF64756E2164756E21
+//# debugId=0C208D91FC5F482E64756E2164756E21