> ## Documentation Index
> Fetch the complete documentation index at: https://smithers.sh/llms.txt
> Use this file to discover all available pages before exploring further.

# ToolCall

> Render tool lifecycle status, JSON input and output, and approval content.

`ToolCall` renders all eight input, approval, execution, output, failure, and
denial states of an agent tool invocation, tinted through the shared status
vocabulary.

```tsx theme={"theme":{"light":"github-light","dark":"github-dark"}}
import { ToolCall } from "smithers-orchestrator/ui";

<ToolCall
  name="search"
  state="output-available"
  args={{ query: "run status" }}
  result={{ matches: 3 }}
/>
```

Use `argsText` for partial JSON while input streams; it overrides `args`, and
`resultText` similarly overrides `result`. Object rendering is BigInt- and
cyclic-safe via the exported `formatJsonSafe` helper.

## Lifecycle states

| State                | Visible label   | Shared status      |
| -------------------- | --------------- | ------------------ |
| `input-streaming`    | Streaming input | `running`          |
| `input-available`    | Ready           | `pending`          |
| `approval-requested` | Needs approval  | `waiting-approval` |
| `approval-responded` | Approved        | `pending`          |
| `running`            | Running         | `running`          |
| `output-available`   | Done            | `complete`         |
| `output-error`       | Failed          | `error`            |
| `output-denied`      | Denied          | `denied`           |

The default `compact` layout discloses details via a native button; `expanded`
always mounts details and ignores disclosure props. Inject approve/deny
controls through `approvalSlot`, which renders only during
`approval-requested`.