@alquimia-ai/ui 1.8.2 → 1.8.4

package/dist/components/organisms/index.mjs

@@ -2491,6 +2491,7 @@ RatingComment.displayName = "RatingComment";
 
 // src/components/molecules/call-out.tsx
 import * as React33 from "react";
+import { ChevronDown as ChevronDown3, ChevronUp as ChevronUp2 } from "lucide-react";
 
 // src/components/hooks/use-text-streaming.ts
 import { useState as useState10, useEffect as useEffect10, useRef, useCallback as useCallback2 } from "react";
@@ -2621,10 +2622,26 @@ var CallOutActions = React33.forwardRef(({ className, actions, role, message, ..
   )) });
 });
 var CallOutResponse = React33.forwardRef(
-  ({ className, children, role, additionalInfo, isStreaming, handleIsTextStreaming, ...props }, ref) => {
+  ({
+    className,
+    children,
+    role,
+    additionalInfo,
+    toggleAdditionalInfo,
+    isStreaming,
+    handleIsTextStreaming,
+    ...props
+  }, ref) => {
+    const [isAdditionalInfoOpen, setIsAdditionalInfoOpen] = React33.useState(false);
     const content = String(children || "");
     const shouldStream = role === "assistant" && isStreaming;
-    const displayedContent = useTextStreaming(content, shouldStream ?? false, handleIsTextStreaming);
+    const displayedContent = useTextStreaming(
+      content,
+      shouldStream ?? false,
+      handleIsTextStreaming
+    );
+    const showAsToggle = additionalInfo && toggleAdditionalInfo;
+    const showInline = additionalInfo && !toggleAdditionalInfo;
     return /* @__PURE__ */ jsxs19(
       "div",
       {
@@ -2639,16 +2656,52 @@ var CallOutResponse = React33.forwardRef(
         ...props,
         children: [
           /* @__PURE__ */ jsx42(RichText, { content: displayedContent }),
-          additionalInfo && /* @__PURE__ */ jsx42(
+          showInline && /* @__PURE__ */ jsx42(
             "div",
             {
               className: cn(
                 "alq--callout-response-additional-info",
-                "mt-2 text-sm text-muted-foreground",
+                "mt-2 text-sm text-muted-foreground whitespace-pre-line",
                 "border-t border-border pt-2"
               ),
               children: additionalInfo
             }
+          ),
+          showAsToggle && /* @__PURE__ */ jsxs19(
+            "div",
+            {
+              className: cn(
+                "alq--callout-response-additional-info",
+                "mt-2 border-t border-border pt-2"
+              ),
+              children: [
+                /* @__PURE__ */ jsxs19(
+                  Button,
+                  {
+                    type: "button",
+                    variant: "ghost",
+                    size: "sm",
+                    className: "h-auto py-1.5 px-0 text-xs text-muted-foreground hover:bg-transparent hover:text-muted-foreground -ml-1",
+                    onClick: () => setIsAdditionalInfoOpen((prev) => !prev),
+                    "aria-expanded": isAdditionalInfoOpen,
+                    children: [
+                      isAdditionalInfoOpen ? /* @__PURE__ */ jsx42(ChevronUp2, { className: "h-4 w-4 mr-1.5 shrink-0 transition-transform" }) : /* @__PURE__ */ jsx42(ChevronDown3, { className: "h-4 w-4 mr-1.5 shrink-0 transition-transform" }),
+                      isAdditionalInfoOpen ? "Hide details" : "Show details"
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx42(
+                  "div",
+                  {
+                    className: cn(
+                      "grid transition-[grid-template-rows] duration-200 ease-out",
+                      isAdditionalInfoOpen ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
+                    ),
+                    children: /* @__PURE__ */ jsx42("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx42("div", { className: "text-sm text-muted-foreground pt-1 whitespace-pre-line", children: additionalInfo }) })
+                  }
+                )
+              ]
+            }
           )
         ]
       }
@@ -2737,7 +2790,9 @@ var AssistantMessageArea = React34.forwardRef(
                   {
                     role: "assistant",
                     "data-error-code": message.error_code,
-                    additionalInfo: showDetailedErrors ? message.error_detail : void 0,
+                    additionalInfo: showDetailedErrors ? `${message.error_detail}
+stream id: ${message.stream_id}` : void 0,
+                    toggleAdditionalInfo: true,
                     children: getErrorMessage(message.error_code)
                   }
                 ),