Patterns for agent UIs
Start from the problem. Each page says what the problem is, which Candor components solve it, and how to install them. The docs have every component on its own.
- Human-in-the-loop approval UI for AI agentsLet an agent ask before it acts: allow or deny a tool call in the chat, or have a second person approve the exact change. React components on shadcn/ui.
- Agent trace viewer for ReactShow one agent run as a timeline: model calls, tool calls and waits for a person on a shared clock, opening on the first failure. React, on shadcn/ui.
- Tool call UI for AI agentsShow an agent's tool calls in plain words: what each did, its status and how long it took, opening to the input and output. Free, on shadcn/ui.
- Agent plan UI: show the plan before it runsShow an agent's plan as steps a person can read, trim and accept before anything runs, then as a live run. React components on shadcn/ui.
- AI chat interface components for ReactA free, accessible AI chat UI on shadcn/ui: a thread that follows new messages, typed messages, a composer with mentions, reasoning and message actions.
- A React UI for the Claude Agent SDKStream a Claude Agent SDK agent to a React chat UI, with tool permission requests answered by a person in the browser. Free adapters on shadcn/ui.
- AG-UI React componentsConnect an AG-UI agent (LangGraph, Mastra, CrewAI, Google ADK, Pydantic AI) to a React chat UI, with interrupts a person approves. Free, on shadcn/ui.
- Agent cost guard: estimates, budgets and spendShow what an agent run will likely cost before it starts, what it did cost, and what's used against each limit. Never a guessed number. React, on shadcn/ui.
- Audit log UI for AI agentsAn audit log of what agents and people did, refusals included, with retention and data controls. React components on shadcn/ui.
- A2UI renderer for ReactRender A2UI v0.9 surfaces an agent sends, with shadcn/ui parts: streamed messages, a data model inputs write to, and actions back to your app.
- Durable approvals for long-running agentsApprovals that outlive the request that asked: keep them in a store, answer from your own route or workflow, re-attach after a reload, replay a run.
- Coming from AI ElementsMoving off AI SDK Elements or shadcn's AI patterns: which Candor item does each job, what Candor adds, and how it sits beside Trace and Message Scroller.
- Telling people they're talking to an AISay plainly that a chat is an AI, and label what it made, from your app's own records. Helps with EU AI Act Article 50; not legal advice.