Overview
The agent asks before running a tool with side effects: readable arguments, Approve or Reject with a reason, then a locked record of who decided. It comes from the Tool calls kit and also works on its own. Keyboard and screen readers: The request is a section named by its title; focus lands on Approve when it appears. Reject opens a labelled reason field and focuses it; Esc or Cancel closes it and returns focus to Reject. After a decision the buttons are replaced by the result, focus moves to it and a status message announces it. Approved and rejected differ by icon and word, not only color; the reason field animates without movement under reduced motion. Built with React 19 and TypeScript, Tailwind CSS 4, Lucide icons and Motion. 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 component source, its sample data, light and dark theme variables, a runnable demo page, 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
