tools-ui
React/Next.js components for displaying tool calls across their full lifecycle: pending, running, approval, success, and error states.
- Includes three core components: ToolCall for displaying pending/running tool invocations, ToolResult for showing completed outputs, and ToolApproval for human-in-the-loop approval flows with approve/deny callbacks
- Automatic icon assignment based on tool name patterns (search, read, write, delete, send, etc.) with fallback to wrench icon
- Five distinct tool states (pending, running, approval, success, error) with customizable styling via className prop
- Integrates seamlessly with the Agent component for automatic tool lifecycle management and optional approval gates on sensitive operations
Tool UI Components
Tool lifecycle components from ui.inference.sh.
Quick Start
npx shadcn@latest add https://ui.inference.sh/r/tools.json
Tool States
More from inferen-sh/skills
og-image-design
0ai-marketing-videos
Create AI marketing videos for ads, promos, product launches, and brand content. Models: Veo, Seedance, Wan, FLUX for visuals, Kokoro for voiceover. Types: product demos, testimonials, explainers, social ads, brand videos. Use for: Facebook ads, YouTube ads, product launches, brand awareness. Triggers: marketing video, ad video, promo video, commercial, brand video, product video, explainer video, ad creative, video ad, facebook ad video, youtube ad, instagram ad, tiktok ad, promotional video, launch video
0character-design-sheet
0ai-automation-workflows
0customer-persona
0qwen-image-2
Generate and edit images with Alibaba Qwen-Image-2.0 models via inference.sh CLI. Models: Qwen-Image-2.0 (fast), Qwen-Image-2.0-Pro (professional text rendering). Capabilities: text-to-image, multi-image editing, complex text rendering. Triggers: qwen image, qwen-image, alibaba image, dashscope image, qwen image 2, qwen image pro
0