Tool Call
Closed, it is one line you can scan: the action in plain words, the tool's real name, and the one fact it found. Open, it is the evidence, with input and output as coloured JSON, a Copy on each block, and long results cut with Show all.
Ready for AI tools one file typed props installs by name prompt included
The decision inside it
A label for people, a name for debugging
"Read the audit trail" is what a person reads; `audit.list_events` sits beside it in small type for whoever has to trace it. Neither replaces the other.
Installation
How you get it
Paste this into Claude Code, Cursor, Codex or any coding agent. It installs the file and uses it as it is, instead of writing a new one.
Use Layro's Tool Call for this.
Install it: npx shadcn@latest add https://layropro.com/r/tool-call
Import it from @/components/ui/tool-call.
Do not rewrite or restyle it. Pass my data through its props
and keep its built-in states.For the full brief with every prop and the mistakes assistants usually make, use Copy prompt above.
API
“Copy prompt” above puts a full brief on your clipboard — install command, dependencies, props, and the mistakes an assistant usually makes with this component.
Props
Read from the component’s own TypeScript interface when the site is built, so this table cannot drift from the file you install.
| Prop | Type | Notes |
|---|---|---|
namerequired | string | The tool's real name: `email.send`. |
label | React.ReactNode | What it did, in plain words. Defaults to the name. |
icon | React.ReactNode | — |
statusrequired | ToolStatus | — |
summary | React.ReactNode | The one fact worth reading while it is closed. |
input | unknown | What was sent. An object is shown as JSON. |
output | unknown | What came back: an object, a string, or a node to render as it is. |
error | React.ReactNode | Why it failed. Shown when `status` is `error`, and opens the card. |
duration | number | string | Milliseconds as a number, or your own text. |
defaultOpen | boolean | — |
open | boolean | — |
onOpenChange | (open: boolean) => void | — |
onRetry | () => void | — |
maxLines | number | Lines of a block shown before "Show all". Default 12. |
Dependencies
npm packages
clsxframer-motionlucide-reacttailwind-mergeLayro foundations, installed alongside it
layro-themebuttonLifetime access
Every component, and everything we ship next.
- All 112 components, source included
- The template, and everything released after you buy
- shadcn CLI or download — React 18/19, Tailwind v4
- One payment. No subscription.
More in AI Agent
All AI Agent components
Approval Request
PaidThe agent stops and asks first, showing the exact thing it wants to do.
Included with lifetime access
Agent Timeline
PaidEverything a run did, in order: follow it live, or inspect it step by step.
Included with lifetime access
Run History
PaidEvery past run: how it ended, how long it took, what it cost.
Included with lifetime access
Run Summary
PaidThe receipt at the end: the outcome, what changed, what it made, the cost.
Included with lifetime access
Agent Settings
PaidSet up an agent: model, instructions, limits, and what each tool may do.
Included with lifetime access
Failure Recovery
PaidWhat failed in a run, every attempt so far, and only the safe ways out.
Included with lifetime access