@rodrigocoliveira/agno-react 2.1.0 → 2.2.0

package/README.md

@@ -265,24 +265,47 @@ The library ships with a complete set of pre-built UI components accessible via
 
 ### Peer Dependencies
 
-UI components rely on optional peer dependencies. Install only what you need:
+The library ships UI as peer dependencies so your app controls the versions and avoids duplicate React instances. **Required** vs **optional** depends on which import path you use.
+
+**If you only import from `@rodrigocoliveira/agno-react` (hooks-only, no UI):** zero peer deps beyond React itself.
+
+**If you import anything from `@rodrigocoliveira/agno-react/ui`:** the following are required.
 
 ```bash
-# Core UI dependencies
-npm install @radix-ui/react-slot class-variance-authority clsx tailwind-merge lucide-react
+# Required by /ui (used by <AgnoChat> / <Conversation> / <Response>)
+npm install use-stick-to-bottom streamdown
+
+# Core styling / variant utilities — required by every component in /ui
+npm install class-variance-authority clsx tailwind-merge lucide-react
+```
 
-# For markdown rendering
-npm install shiki streamdown
+**Per-feature optional peer deps** — install only the ones whose components you actually import:
 
-# For auto-scroll behavior
-npm install use-stick-to-bottom
+| If you use… | Install |
+| --- | --- |
+| `<AgnoChat.Input>` with attachments / model select / command palette | `@radix-ui/react-slot @radix-ui/react-dropdown-menu cmdk` |
+| `<Tooltip>` | `@radix-ui/react-tooltip` |
+| `<Avatar>` | `@radix-ui/react-avatar` |
+| `<Accordion>` | `@radix-ui/react-accordion` |
+| `<Collapsible>` (used by `<Tool>` and tool debug card) | `@radix-ui/react-collapsible` |
+| `<HoverCard>` | `@radix-ui/react-hover-card` |
+| `<Select>` | `@radix-ui/react-select` |
+| `<Dialog>` / `<AskUserQuestionModal>` patterns | `@radix-ui/react-dialog` |
+| Code-block syntax highlighting in `<Response>` | `shiki` (auto-loaded by `streamdown` if installed) |
+| `<BarChart>` / `<LineChart>` / `<AreaChart>` / `<PieChart>` | `recharts` |
 
-# For additional primitives (as needed)
-npm install @radix-ui/react-accordion @radix-ui/react-avatar @radix-ui/react-collapsible \
-  @radix-ui/react-tooltip @radix-ui/react-dropdown-menu @radix-ui/react-hover-card \
-  @radix-ui/react-select cmdk
+**Quick install for "I want everything that ships in `/ui`":**
+
+```bash
+npm install use-stick-to-bottom streamdown shiki recharts \
+  class-variance-authority clsx tailwind-merge lucide-react cmdk \
+  @radix-ui/react-accordion @radix-ui/react-avatar @radix-ui/react-collapsible \
+  @radix-ui/react-dialog @radix-ui/react-dropdown-menu @radix-ui/react-hover-card \
+  @radix-ui/react-select @radix-ui/react-slot @radix-ui/react-tooltip
 ```
 
+> **Note:** `use-stick-to-bottom` and `streamdown` were marked `optional` in 2.1.0 and earlier, which prevented `npm install` from warning when they were missing — consumers using `/ui` would then hit a runtime "Could not resolve …" error. As of **2.1.1** they are required peer deps and `npm install` reports them up front.
+
 ### Import Path
 
 All UI components are imported from the `/ui` sub-path:

package/dist/hooks/useAgnoChat.d.ts

@@ -8,6 +8,7 @@ export declare function useAgnoChat(): {
     sendMessage: (message: string | FormData, options?: {
         headers?: Record<string, string>;
         params?: Record<string, string>;
+        background?: boolean;
     }) => Promise<void>;
     clearMessages: () => void;
     cancelRun: () => Promise<void>;

package/dist/hooks/useAgnoChat.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAgnoChat.d.ts","sourceRoot":"","sources":["../../src/hooks/useAgnoChat.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAG7E;;;GAGG;AACH,wBAAgB,WAAW;;2BAkEP,MAAM,GAAG,QAAQ,YAAY;QAAE,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;KAAE;;;;;;;;;;EAsCrH"}
+{"version":3,"file":"useAgnoChat.d.ts","sourceRoot":"","sources":["../../src/hooks/useAgnoChat.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAG7E;;;GAGG;AACH,wBAAgB,WAAW;;2BAkEP,MAAM,GAAG,QAAQ,YAAY;QAAE,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QAAC,UAAU,CAAC,EAAE,OAAO,CAAA;KAAE;;;;;;;;;;EAsC3I"}

package/dist/index.js

@@ -2213,25 +2213,27 @@ function AgnoMessageReferences() {
 var import_lucide_react11 = require("lucide-react");
 var jsx_runtime21 = require("react/jsx-runtime");
 function AgnoMessageFooter({ showTimestamp = true } = {}) {
-  const { message, classNames, actions, isLastAssistantMessage, formatTimestamp } = useAgnoMessageContext();
+  const { message, classNames, actions, isLastAssistantMessage, isStreamingThisMessage, formatTimestamp } = useAgnoMessageContext();
   const hasError = message.streamingError;
   const isCustomTimestamp = !!formatTimestamp;
   const resolvedFormatTimestamp = formatTimestamp ?? formatSmartTimestamp;
-  if (!actions?.assistant && !showTimestamp && !hasError)
+  if (isStreamingThisMessage)
     return null;
+  const hasActions = !!actions?.assistant;
+  const visibility = actions?.visibility ?? "visible";
+  if (hasActions && visibility === "last-assistant" && !isLastAssistantMessage) {
+    return null;
+  }
+  if (!hasActions && !showTimestamp && !hasError)
+    return null;
+  const useHover = hasActions && (visibility === "hover" || visibility === "hover-last-visible" && !isLastAssistantMessage);
   return /* @__PURE__ */ jsx_runtime21.jsxs("div", {
-    className: "flex items-center gap-2 pt-1",
+    className: cn("flex items-center gap-2 pt-1 transition-opacity", useHover && "opacity-0 group-hover/message:opacity-100"),
     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_runtime21.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)
-        });
-      })(),
+      hasActions && /* @__PURE__ */ jsx_runtime21.jsx("div", {
+        className: cn("flex items-center gap-1", classNames?.assistant?.actions),
+        children: actions.assistant(message)
+      }),
       hasError && /* @__PURE__ */ jsx_runtime21.jsxs("span", {
         className: "flex items-center gap-1 text-[11px] text-destructive",
         children: [
@@ -2273,6 +2275,7 @@ function AgnoMessage({
   avatars,
   actions,
   isLastAssistantMessage = false,
+  isStreamingThisMessage = false,
   showFilePreview = true,
   showImageLightbox = true,
   showTimestamp = true,
@@ -2288,6 +2291,7 @@ function AgnoMessage({
   const ctx = import_react13.useMemo(() => ({
     message,
     isLastAssistantMessage,
+    isStreamingThisMessage,
     classNames,
     actions,
     avatars,
@@ -2308,6 +2312,7 @@ function AgnoMessage({
   }), [
     message,
     isLastAssistantMessage,
+    isStreamingThisMessage,
     classNames,
     actions,
     avatars,
@@ -3277,4 +3282,4 @@ function useAgnoComponents() {
   };
 }
 
-//# debugId=6A9B00E27FD63EE064756E2164756E21
+//# debugId=F99024C6D7DF795064756E2164756E21