@vadimcomanescu/nadicode-design-system 2.0.6 → 2.0.8

package/dist/components/ui/ChatReasoning.js

@@ -0,0 +1,91 @@
+'use client';
+import { ChatShimmer } from '../../chunk-JDJY4ABS.js';
+import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '../../chunk-VJIL7W55.js';
+import '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import { ChevronDownIcon } from '../../chunk-HJBXUXTD.js';
+import '../../chunk-ASKFAYYR.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { createContext, useState, useRef, useEffect, useContext } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var ChatReasoningContext = createContext({
+  isStreaming: false
+});
+function ChatReasoning({
+  isStreaming,
+  autoCloseDelay = 1e3,
+  duration,
+  defaultOpen = false,
+  children,
+  className,
+  ref
+}) {
+  const [open, setOpen] = useState(defaultOpen);
+  const timerRef = useRef(void 0);
+  const wasStreamingRef = useRef(isStreaming);
+  useEffect(() => {
+    if (wasStreamingRef.current && !isStreaming) {
+      timerRef.current = setTimeout(() => {
+        setOpen(false);
+      }, autoCloseDelay);
+    }
+    wasStreamingRef.current = isStreaming;
+    return () => {
+      if (timerRef.current) clearTimeout(timerRef.current);
+    };
+  }, [isStreaming, autoCloseDelay]);
+  return /* @__PURE__ */ jsx(ChatReasoningContext.Provider, { value: { isStreaming, duration }, children: /* @__PURE__ */ jsx(
+    Collapsible,
+    {
+      ref,
+      open,
+      onOpenChange: setOpen,
+      className: cn("rounded-lg border border-border/60", className),
+      children
+    }
+  ) });
+}
+function ChatReasoningTrigger({ className }) {
+  const { isStreaming, duration } = useContext(ChatReasoningContext);
+  const durationText = duration != null ? `${(duration / 1e3).toFixed(1)}s` : null;
+  return /* @__PURE__ */ jsxs(
+    CollapsibleTrigger,
+    {
+      className: cn(
+        "flex w-full items-center gap-2 px-3 py-2 text-xs transition-colors hover:bg-surface/60 rounded-lg",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(
+          ChevronDownIcon,
+          {
+            size: 14,
+            "aria-hidden": "true",
+            className: "text-text-tertiary transition-transform [[data-state=open]>&]:rotate-180"
+          }
+        ),
+        isStreaming ? /* @__PURE__ */ jsx(ChatShimmer, { className: "text-text-secondary", children: "Thinking..." }) : /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: "Reasoning" }),
+        !!durationText && !isStreaming && /* @__PURE__ */ jsx("span", { className: "ml-auto text-text-tertiary", children: durationText })
+      ]
+    }
+  );
+}
+function ChatReasoningContent({
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    CollapsibleContent,
+    {
+      className: cn(
+        "border-t border-border/40 px-3 py-2 text-xs text-text-secondary",
+        className
+      ),
+      children
+    }
+  );
+}
+
+export { ChatReasoning, ChatReasoningContent, ChatReasoningTrigger };

package/dist/components/ui/ChatResponse.d.ts

@@ -0,0 +1,14 @@
+import { type Ref } from 'react';
+import { Streamdown } from 'streamdown';
+import type { ComponentProps } from 'react';
+export interface ChatResponseProps extends Omit<ComponentProps<typeof Streamdown>, 'mode' | 'isAnimating' | 'ref'> {
+    /** True while the response is still streaming. */
+    isStreaming?: boolean;
+    ref?: Ref<HTMLDivElement>;
+}
+/**
+ * Streaming-safe markdown rendering via `streamdown`.
+ * Handles unterminated code fences, partial syntax, and streaming content
+ * growth without layout breaks.
+ */
+export declare function ChatResponse({ children, isStreaming, className, ref, ...props }: ChatResponseProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/ChatResponse.js

@@ -0,0 +1,25 @@
+'use client';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { Streamdown } from 'streamdown';
+import { jsx } from 'react/jsx-runtime';
+
+function ChatResponse({
+  children,
+  isStreaming = false,
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx("div", { ref, className: cn("prose prose-sm dark:prose-invert max-w-none [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", className), children: /* @__PURE__ */ jsx(
+    Streamdown,
+    {
+      mode: isStreaming ? "streaming" : "static",
+      isAnimating: isStreaming,
+      parseIncompleteMarkdown: isStreaming,
+      ...props,
+      children
+    }
+  ) });
+}
+
+export { ChatResponse };

package/dist/components/ui/ChatShimmer.d.ts

@@ -0,0 +1,23 @@
+import { type Ref } from 'react';
+export interface ChatShimmerProps {
+    /** Text content to shimmer. */
+    children: string;
+    /** HTML element type to render (default: "span"). */
+    as?: 'span' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div';
+    className?: string;
+    /** Animation cycle duration in seconds. */
+    duration?: number;
+    /** Pixel spread per character for the highlight sweep. */
+    spread?: number;
+    ref?: Ref<HTMLElement>;
+}
+/**
+ * ChatShimmer - CSS background-clip sliding highlight sweep on text.
+ *
+ * Used by ChatReasoning trigger ("Thinking" label) and ChatPlan title
+ * to indicate active streaming. Falls back to static text when
+ * prefers-reduced-motion is active.
+ */
+declare function ChatShimmerInner({ children, as: Component, className, duration, spread, ref, }: ChatShimmerProps): import("react/jsx-runtime").JSX.Element;
+export declare const ChatShimmer: import("react").MemoExoticComponent<typeof ChatShimmerInner>;
+export {};

package/dist/components/ui/ChatShimmer.js

@@ -0,0 +1,6 @@
+'use client';
+export { ChatShimmer } from '../../chunk-JDJY4ABS.js';
+import '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import '../../chunk-QYZT24TS.js';

package/dist/components/ui/ChatSources.d.ts

@@ -0,0 +1,30 @@
+import { type ReactNode } from 'react';
+export interface ChatSourcesProps {
+    children: ReactNode;
+    className?: string;
+    defaultOpen?: boolean;
+}
+export declare function ChatSources({ children, className, defaultOpen, }: ChatSourcesProps): import("react/jsx-runtime").JSX.Element;
+export interface ChatSourcesTriggerProps {
+    count: number;
+    className?: string;
+}
+export declare function ChatSourcesTrigger({ count, className }: ChatSourcesTriggerProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatSourcesContent({ children, className, }: {
+    children: ReactNode;
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+export interface ChatSourceProps {
+    title: string;
+    url: string;
+    description?: string;
+    className?: string;
+}
+export declare function ChatSource({ title, url, description, className }: ChatSourceProps): import("react/jsx-runtime").JSX.Element;
+export interface ChatInlineCitationProps {
+    index: number;
+    href?: string;
+    onClick?: () => void;
+    className?: string;
+}
+export declare function ChatInlineCitation({ index, href, onClick, className, }: ChatInlineCitationProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/ChatSources.js

@@ -0,0 +1,113 @@
+'use client';
+import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '../../chunk-VJIL7W55.js';
+import { LinkIcon } from '../../chunk-TBKJ34BB.js';
+import { ChevronDownIcon } from '../../chunk-HJBXUXTD.js';
+import '../../chunk-ASKFAYYR.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function ChatSources({
+  children,
+  className,
+  defaultOpen = false
+}) {
+  return /* @__PURE__ */ jsx(Collapsible, { defaultOpen, className: cn("space-y-1", className), children });
+}
+function ChatSourcesTrigger({ count, className }) {
+  const label = `Used ${count} source${count === 1 ? "" : "s"}`;
+  return /* @__PURE__ */ jsxs(
+    CollapsibleTrigger,
+    {
+      "aria-label": label,
+      className: cn(
+        "inline-flex min-h-10 min-w-10 items-center gap-1.5 rounded-lg px-2 py-1",
+        "text-xs text-text-secondary",
+        "hover:bg-surface/80 hover:text-text-primary transition-colors",
+        "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(LinkIcon, { size: 14, "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx("span", { children: label }),
+        /* @__PURE__ */ jsx(
+          ChevronDownIcon,
+          {
+            size: 14,
+            "aria-hidden": "true",
+            className: "transition-transform [[data-state=open]>&]:rotate-180"
+          }
+        )
+      ]
+    }
+  );
+}
+function ChatSourcesContent({
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "list",
+      className: cn("space-y-1 rounded-lg border border-border p-2", className),
+      children
+    }
+  ) });
+}
+function ChatSource({ title, url, description, className }) {
+  let hostname = "";
+  try {
+    hostname = new URL(url).hostname.replace(/^www\./, "");
+  } catch {
+    hostname = url;
+  }
+  return /* @__PURE__ */ jsxs("div", { role: "listitem", className: cn("rounded-md px-2 py-1.5", className), children: [
+    /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: url,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: cn(
+          "text-sm font-medium text-text-primary hover:underline",
+          "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent rounded"
+        ),
+        children: title
+      }
+    ),
+    /* @__PURE__ */ jsx("p", { className: "text-xs text-text-tertiary", children: hostname }),
+    !!description && /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-xs text-text-secondary", children: description })
+  ] });
+}
+function ChatInlineCitation({
+  index,
+  href,
+  onClick,
+  className
+}) {
+  const baseClass = cn(
+    "inline-flex h-4 min-w-4 items-center justify-center rounded-sm",
+    "bg-accent/10 px-0.5 text-[10px] font-medium leading-none text-accent",
+    "hover:bg-accent/20 transition-colors",
+    "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent",
+    className
+  );
+  if (href) {
+    return /* @__PURE__ */ jsx("sup", { children: /* @__PURE__ */ jsx("a", { href, "aria-label": `Source ${index}`, className: baseClass, children: index }) });
+  }
+  if (onClick) {
+    return /* @__PURE__ */ jsx("sup", { children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick,
+        "aria-label": `Source ${index}`,
+        className: baseClass,
+        children: index
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx("sup", { children: /* @__PURE__ */ jsx("span", { "aria-label": `Source ${index}`, className: baseClass, children: index }) });
+}
+
+export { ChatInlineCitation, ChatSource, ChatSources, ChatSourcesContent, ChatSourcesTrigger };

package/dist/components/ui/ChatSuggestion.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from 'react';
+export interface ChatSuggestionsProps {
+    children: ReactNode;
+    className?: string;
+}
+export declare function ChatSuggestions({ children, className }: ChatSuggestionsProps): import("react/jsx-runtime").JSX.Element;
+export interface ChatSuggestionProps {
+    value: string;
+    onSelect: (value: string) => void;
+    children: ReactNode;
+    className?: string;
+}
+export declare function ChatSuggestion({ value, onSelect, children, className, }: ChatSuggestionProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/ChatSuggestion.js

@@ -0,0 +1,41 @@
+'use client';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { jsx } from 'react/jsx-runtime';
+
+function ChatSuggestions({ children, className }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "group",
+      "aria-label": "Suggested prompts",
+      className: cn(
+        "flex gap-2 overflow-x-auto scrollbar-none pb-1",
+        className
+      ),
+      children
+    }
+  );
+}
+function ChatSuggestion({
+  value,
+  onSelect,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: () => onSelect(value),
+      className: cn(
+        "shrink-0 rounded-full border border-border px-3 py-1.5 text-xs text-text-secondary",
+        "hover:bg-surface/80 hover:text-text-primary",
+        "transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent",
+        className
+      ),
+      children
+    }
+  );
+}
+
+export { ChatSuggestion, ChatSuggestions };

package/dist/components/ui/ChatThinkingMessage.d.ts

@@ -0,0 +1,12 @@
+import { type Ref } from 'react';
+export interface ChatThinkingMessageProps extends React.HTMLAttributes<HTMLDivElement> {
+    ref?: Ref<HTMLDivElement>;
+}
+/**
+ * ChatThinkingMessage - animated "thinking" dots for pre-first-token wait.
+ *
+ * Renders 3 dots with staggered opacity pulse (0s, 0.2s, 0.4s delay).
+ * Respects prefers-reduced-motion by rendering static dots.
+ * Includes role="status" and aria-live="polite" for screen readers.
+ */
+export declare function ChatThinkingMessage({ className, ref, ...props }: ChatThinkingMessageProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/ChatThinkingMessage.js

@@ -0,0 +1,55 @@
+'use client';
+import { m } from '../../chunk-PD2YEH3H.js';
+import { bezier } from '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { useReducedMotion } from 'motion/react';
+import { jsx } from 'react/jsx-runtime';
+
+var DOT_COUNT = 3;
+var DOT_DELAY_S = 0.2;
+var PULSE_TRANSITION = {
+  duration: 1.2,
+  repeat: Infinity,
+  ease: bezier["ease-in-out"]
+};
+function ChatThinkingMessage({
+  className,
+  ref,
+  ...props
+}) {
+  const prefersReduced = useReducedMotion();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      role: "status",
+      "aria-live": "polite",
+      "aria-label": "Thinking",
+      className: cn("flex items-center gap-1", className),
+      ...props,
+      children: Array.from(
+        { length: DOT_COUNT },
+        (_, i) => prefersReduced ? /* @__PURE__ */ jsx(
+          "span",
+          {
+            "data-dot": i,
+            className: "h-1.5 w-1.5 rounded-full bg-text-secondary"
+          },
+          i
+        ) : /* @__PURE__ */ jsx(
+          m.span,
+          {
+            "data-dot": i,
+            className: "h-1.5 w-1.5 rounded-full bg-accent",
+            animate: { opacity: [0.3, 1, 0.3] },
+            transition: { ...PULSE_TRANSITION, delay: i * DOT_DELAY_S }
+          },
+          i
+        )
+      )
+    }
+  );
+}
+
+export { ChatThinkingMessage };

package/dist/components/ui/ChatToolCall.d.ts

@@ -0,0 +1,41 @@
+import { type ReactNode, type Ref } from 'react';
+export type ChatToolCallState = 'input-streaming' | 'input-available' | 'approval-requested' | 'approval-responded' | 'output-available' | 'output-error' | 'output-denied';
+declare const chatToolCallVariants: (props?: ({
+    state?: "input-streaming" | "input-available" | "approval-requested" | "approval-responded" | "output-available" | "output-error" | "output-denied" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface ChatToolCallProps {
+    state: ChatToolCallState;
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    children: ReactNode;
+    className?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare const ChatToolCall: import("react").NamedExoticComponent<ChatToolCallProps>;
+export interface ChatToolCallHeaderProps {
+    name?: string;
+    summary?: string | null;
+    children?: ReactNode;
+    className?: string;
+}
+export declare const ChatToolCallHeader: import("react").NamedExoticComponent<ChatToolCallHeaderProps>;
+export interface ChatToolCallContentProps {
+    children: ReactNode;
+    className?: string;
+}
+export declare const ChatToolCallContent: import("react").NamedExoticComponent<ChatToolCallContentProps>;
+export interface ChatToolCallInputProps {
+    children: string;
+    className?: string;
+}
+export declare function ChatToolCallInput({ children, className }: ChatToolCallInputProps): import("react/jsx-runtime").JSX.Element;
+export interface ChatToolCallOutputProps {
+    children: string;
+    className?: string;
+}
+export declare function ChatToolCallOutput({ children, className }: ChatToolCallOutputProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChatToolCallStatus({ className }: {
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+export { chatToolCallVariants };

package/dist/components/ui/ChatToolCall.js

@@ -0,0 +1,192 @@
+'use client';
+import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '../../chunk-VJIL7W55.js';
+import { LoaderCircleIcon } from '../../chunk-BRP6D56U.js';
+import { ClockIcon } from '../../chunk-6G3RRWJT.js';
+import { CheckIcon } from '../../chunk-CXACRCZ4.js';
+import { ShieldCheckIcon } from '../../chunk-BFLN54VR.js';
+import { XIcon } from '../../chunk-UIUMTURU.js';
+import { Badge } from '../../chunk-S4JAHKOP.js';
+import { ChevronDownIcon } from '../../chunk-HJBXUXTD.js';
+import '../../chunk-ASKFAYYR.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { createContext, memo, useContext } from 'react';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var ChatToolCallContext = createContext(void 0);
+function useChatToolCallState() {
+  return useContext(ChatToolCallContext);
+}
+var chatToolCallVariants = cva(
+  "rounded-xl border glass-panel transition-colors",
+  {
+    variants: {
+      state: {
+        "input-streaming": "border-accent/40",
+        "input-available": "border-accent/40",
+        "approval-requested": "border-warning/40",
+        "approval-responded": "border-accent/40",
+        "output-available": "border-success/40",
+        "output-error": "border-destructive/40",
+        "output-denied": "border-destructive/40"
+      }
+    },
+    defaultVariants: {
+      state: "input-streaming"
+    }
+  }
+);
+function getStatusMeta(state) {
+  switch (state) {
+    case "input-streaming":
+      return {
+        label: "Streaming",
+        icon: /* @__PURE__ */ jsx(LoaderCircleIcon, { size: 12, className: "animate-spin text-text-tertiary" }),
+        badgeVariant: "secondary"
+      };
+    case "input-available":
+      return {
+        label: "Running",
+        icon: /* @__PURE__ */ jsx(LoaderCircleIcon, { size: 12, className: "animate-spin text-accent" }),
+        badgeVariant: "accent"
+      };
+    case "approval-requested":
+      return {
+        label: "Approval needed",
+        icon: /* @__PURE__ */ jsx(ClockIcon, { size: 12, className: "text-warning" }),
+        badgeVariant: "outline"
+      };
+    case "approval-responded":
+      return {
+        label: "Approved",
+        icon: /* @__PURE__ */ jsx(ShieldCheckIcon, { size: 12, className: "text-accent" }),
+        badgeVariant: "accent"
+      };
+    case "output-available":
+      return {
+        label: "Completed",
+        icon: /* @__PURE__ */ jsx(CheckIcon, { size: 12, className: "text-success" }),
+        badgeVariant: "secondary"
+      };
+    case "output-error":
+      return {
+        label: "Error",
+        icon: /* @__PURE__ */ jsx(XIcon, { size: 12, className: "text-destructive" }),
+        badgeVariant: "destructive"
+      };
+    case "output-denied":
+      return {
+        label: "Denied",
+        icon: /* @__PURE__ */ jsx(XIcon, { size: 12, className: "text-warning" }),
+        badgeVariant: "destructive"
+      };
+    default:
+      return {
+        label: "Pending",
+        icon: /* @__PURE__ */ jsx(LoaderCircleIcon, { size: 12, className: "animate-spin text-text-tertiary" }),
+        badgeVariant: "secondary"
+      };
+  }
+}
+var ChatToolCall = memo(function ChatToolCall2({
+  state,
+  defaultOpen = false,
+  open,
+  onOpenChange,
+  children,
+  className,
+  ref
+}) {
+  return /* @__PURE__ */ jsx(ChatToolCallContext.Provider, { value: state, children: /* @__PURE__ */ jsx(
+    Collapsible,
+    {
+      ref,
+      defaultOpen,
+      open,
+      onOpenChange,
+      className: cn(chatToolCallVariants({ state }), className),
+      children
+    }
+  ) });
+});
+var ChatToolCallHeader = memo(function ChatToolCallHeader2({
+  name,
+  summary,
+  children,
+  className
+}) {
+  const state = useChatToolCallState();
+  const { label, icon, badgeVariant } = getStatusMeta(state);
+  return /* @__PURE__ */ jsx(
+    CollapsibleTrigger,
+    {
+      className: cn(
+        "flex w-full items-center gap-2 px-3 py-2 text-xs transition-colors hover:bg-surface/60 rounded-xl",
+        className
+      ),
+      children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+        icon,
+        /* @__PURE__ */ jsx("code", { className: "font-medium text-text-primary", children: name ?? "Tool" }),
+        Boolean(summary) && /* @__PURE__ */ jsx("span", { className: "truncate text-[11px] text-text-tertiary", children: summary }),
+        /* @__PURE__ */ jsx(
+          Badge,
+          {
+            variant: badgeVariant,
+            "data-testid": "chat-tool-call-badge",
+            className: "ml-auto rounded-full px-2 py-0 text-[10px]",
+            children: label
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ChevronDownIcon,
+          {
+            size: 12,
+            className: "text-text-tertiary transition-transform [[data-state=open]>&]:rotate-180"
+          }
+        )
+      ] })
+    }
+  );
+});
+var ChatToolCallContent = memo(function ChatToolCallContent2({
+  children,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    CollapsibleContent,
+    {
+      className: cn("border-t border-border/40 px-3 py-2", className),
+      children
+    }
+  );
+});
+function ChatToolCallInput({ children, className }) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("text-xs", className), children: [
+    /* @__PURE__ */ jsx("p", { className: "mb-1 font-medium text-text-secondary", children: "Input" }),
+    /* @__PURE__ */ jsx("pre", { className: "overflow-x-auto rounded-lg bg-surface/60 p-2 text-[11px] text-text-secondary", children })
+  ] });
+}
+function ChatToolCallOutput({ children, className }) {
+  const state = useChatToolCallState();
+  const isError = state === "output-error" || state === "output-denied";
+  return /* @__PURE__ */ jsxs("div", { className: cn("text-xs", className), children: [
+    /* @__PURE__ */ jsx("p", { className: "mb-1 font-medium text-text-secondary", children: "Output" }),
+    /* @__PURE__ */ jsx(
+      "pre",
+      {
+        className: cn(
+          "overflow-x-auto rounded-lg p-2 text-[11px]",
+          isError ? "bg-destructive/10 text-destructive" : "bg-surface/60 text-text-secondary"
+        ),
+        children
+      }
+    )
+  ] });
+}
+function ChatToolCallStatus({ className }) {
+  const state = useChatToolCallState();
+  const { icon } = getStatusMeta(state);
+  return /* @__PURE__ */ jsx("span", { "data-testid": "chat-tool-call-status", className, children: icon });
+}
+
+export { ChatToolCall, ChatToolCallContent, ChatToolCallHeader, ChatToolCallInput, ChatToolCallOutput, ChatToolCallStatus, chatToolCallVariants };

package/dist/components/ui/CheckStatus.d.ts

@@ -1,6 +1,6 @@
 import { type VariantProps } from 'class-variance-authority';
 declare const checkStatusVariants: (props?: ({
-    status?: "passing" | "failing" | "pending" | "neutral" | null | undefined;
+    status?: "pending" | "passing" | "failing" | "neutral" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface CheckStatusProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof checkStatusVariants> {
     count?: number;