Skip to content

Reasoning

A model’s thinking, collapsed. It opens while the model thinks, closes once when it’s done, and says how long it took. Once you open or close it, it stays that way.

Sourcecomponents/reasoning.tsx

Usage

Reasoning usage
import { Reasoning, ReasoningContent, ReasoningTrigger } from "@/components/reasoning";
export function ReasoningUsage({ text, isStreaming }: { text: string; isStreaming: boolean }) {  return (    <Reasoning isStreaming={isStreaming}>      <ReasoningTrigger />      <ReasoningContent>{text}</ReasoningContent>    </Reasoning>  );}

When to use

Use when

A model's thinking, collapsed under "Thought for N seconds". Pass isStreaming and it opens while thinking and closes once after

Don’t use when

The steps or tool calls an agent took (use Trace or Chain of Thought); the answer itself (use Message)