tools-uilisted
Install: claude install-skill aiskillstore/marketplace
# Tool UI Components
Tool lifecycle components from [ui.inference.sh](https://ui.inference.sh).
## Quick Start
```bash
npx shadcn@latest add https://ui.inference.sh/r/tools.json
```
## Tool States
| State | Description |
|-------|-------------|
| `pending` | Tool call requested, waiting to execute |
| `running` | Tool is currently executing |
| `approval` | Requires human approval before execution |
| `success` | Tool completed successfully |
| `error` | Tool execution failed |
## Components
### Tool Call Display
```tsx
import { ToolCall } from "@/registry/blocks/tools/tool-call"
<ToolCall
name="search_web"
args={{ query: "latest AI news" }}
status="running"
/>
```
### Tool Result
```tsx
import { ToolResult } from "@/registry/blocks/tools/tool-result"
<ToolResult
name="search_web"
result={{ results: [...] }}
status="success"
/>
```
### Tool Approval
```tsx
import { ToolApproval } from "@/registry/blocks/tools/tool-approval"
<ToolApproval
name="send_email"
args={{ to: "user@example.com", subject: "Hello" }}
onApprove={() => executeTool()}
onDeny={() => cancelTool()}
/>
```
## Full Example
```tsx
import { ToolCall, ToolResult, ToolApproval } from "@/registry/blocks/tools"
function ToolDisplay({ tool }) {
if (tool.status === 'approval') {
return (
<ToolApproval
name={tool.name}
args={tool.args}