Docs / Reasoning and traces /

ThinkingProcess

Streaming text block for the agent's raw chain-of-thought — animated during generation, static once complete.

Preview

Analyzing the user's schema0.4s

Parsed table definitions and identified 14 foreign key relationships.

Checking for constraint violations1.1s

No orphaned rows detected. Nullable columns are safe to tighten.

⠋

Searching "cascade delete edge cases"

Postgres constraint docs

⠋Schema migration best practices/prisma.io

Drafting migration plan

Variants

Compact & inspector variants

compact

Analyzed user schema0.4s

Parsed 14 foreign key relationships. No circular dependencies found.

Verified constraint safety1.1s

inspector

Analyzing the user's schema0.4s

Parsed table definitions and identified 14 foreign key relationships.

Checking for constraint violations1.1s

No orphaned rows detected. Nullable columns are safe to tighten.

⠋

Searching "cascade delete edge cases"

Postgres constraint docs

⠋Schema migration best practices/prisma.io

Props

Prop	Type	Description
status	"idle" \| "running" \| "complete" \| "blocked" \| "error"	Overall process status. Drives the header glyph, colours, and copy.
steps	ThinkingProcessStep[]	Ordered list of reasoning steps. Each step renders as a card row.
label	string	Override for the header label. Defaults to a copy derived from status.
durationLabel	string	Elapsed time string (e.g. "4.6s"). Shown in header when status is running or appended when complete.
summary	React.ReactNode	Optional prose summary shown above the step list inside the disclosure.
defaultOpen	boolean	Whether the disclosure starts open. Defaults to true when status is running.
variant	"default" \| "compact" \| "inspector"	Visual density. compact removes the card border; inspector uses a canvas background.
onStop	() => void	Global stop callback. Renders a Stop button in the header when the process is active.
className	string	Additional class names applied to the root Disclosure element.

Usage

import { ThinkingProcess } from "@/components/agent/thinking-process";

<ThinkingProcess
  label="Reasoning through migration plan"
  durationLabel="4.6s"
  status="complete"
  summary="Reviewed 14 FK relationships and drafted a 3-step migration. Safe to apply."
  steps={[
    { id: "s1", title: "Analyzed schema", kind: "planning", status: "complete", elapsed: "0.4s" },
    { id: "s2", title: "Verified constraints", kind: "verification", status: "complete", elapsed: "1.1s" },
    { id: "s3", title: "Fetched references", kind: "searching", status: "complete", elapsed: "2.3s" },
  ]}
/>