Overview
What an AI agent does between question and answer: tool calls with their JSON, results as cards, its plan, failures with retry, approvals and the tool picker. Every piece is wired into one full screen you can run, and each one also works on its own. Pieces (6): tool call card, approval request, result cards, reasoning steps, tool error card and tool chips. Keyboard and screen readers: every piece works with the keyboard, and its guide lists its screen reader and reduced-motion behavior. Built with React 19 and TypeScript, Tailwind CSS 4, Lucide icons, Motion and Base UI. Light and dark themes come from CSS variables you can edit, and every demo uses believable sample data you replace with your own. Included: the source of all 6 components, the composed tool calls screen, sample data, light and dark theme variables, a runnable demo app, and setup guides for people and for AI coding agents.
Highlights
- Production-ready, documented source
- Clean, componentized architecture
- Drops into your stack with minimal setup
