Tool

A disclosure for what the model is doing — a tool call or a step of reasoning. The row is telemetry, not a key: a quiet debossed strip with a status chip; the result opens in the well below. Reasoning is the same shape for chain-of-thought.

Found 3 matches for “spring config”.

json
{ "query": "spring config", "results": 3 }
tsx
import { CodeBlock } from "@/registry/seam/ui/code-block"
import { Tool, ToolContent, ToolHeader } from "@/registry/seam/ui/tool"

export default function ToolDemo() {
  return (
    <div className="flex w-full max-w-md flex-col gap-2">
      <Tool defaultOpen>
        <ToolHeader title="search_docs" status="done" />
        <ToolContent>
          <p className="text-muted-foreground">
            Found 3 matches for &ldquo;spring config&rdquo;.
          </p>
          <CodeBlock
            language="json"
            code={`{ "query": "spring config", "results": 3 }`}
          />
        </ToolContent>
      </Tool>

      <Tool>
        <ToolHeader title="fetch_weather" status="running" />
        <ToolContent>
          <p className="text-muted-foreground">Calling the weather API…</p>
        </ToolContent>
      </Tool>

      <Tool>
        <ToolHeader title="write_file" status="pending" />
        <ToolContent>
          <p className="text-muted-foreground">Queued.</p>
        </ToolContent>
      </Tool>
    </div>
  )
}
bunx --bun @seamui/cli@latest add tool

Notes

  • status is one of pending, running, done, or error — it maps onto the AI SDK's tool-part states without depending on them.
  • Expanding eases the panel height (the one thing seamui animates with a duration, like opacity) and snaps instantly under reduced motion; the status Spinner carries its own reduced-motion pulse.
  • The trigger presses with depth.pressed — dogfooded via buttonVariants and a motion render, since Collapsible owns the trigger's ref.
  • Built on Base UI Collapsible: the trigger exposes aria-expanded and the panel is properly associated. The status chip is a polite live region, so a state change is announced without re-reading the whole row.

Press feedback, reduced motion, and haptics follow the global policy — see Motion and Haptics.