Loading page…
Loading page…
DarwinUI is an open-source interface framework for agents. Visual controls and structured capabilities describe the same operations.
Spreadsheet agent · Needs your approval
Review the destination before continuing.
Agent work is more than a message. It can involve a choice to review, a task to follow, or a result to inspect. DarwinUI gives these moments a shared set of components for people and AI agents.
A paragraph can describe a decision. A control lets someone make it. Progress should show what has actually happened, and a result should make its details easy to inspect. Try the same task information as text and as an interactive view below.
Clean this spreadsheet and let me review the export.
The spreadsheet has been cleaned. The next step is to export a CSV. Review the destination and approve the export before continuing.
Spreadsheet agent · Needs your approval
Choose whether to continue with this destination.
The interface follows the state supplied by the application. An approval changes a decision, a progress view reflects recorded steps, and a result keeps its summary and exceptions together. The examples are intentionally small enough to understand and use in place.
The example uses the real DarwinUI DecisionRequest component. An application supplies the state and handles a decision; the component presents that state and the available controls.
import { DecisionRequest } from "@darwinui/react"; <DecisionRequest title="Export the cleaned spreadsheet" agent="Spreadsheet agent" description="Review the destination before continuing." details={[{ label: "Destination", value: "Download" }]} decision={decision} onDecision={setDecision} approveLabel="Approve export" declineLabel="Keep for review"/>A shared thread is useful only when participants can understand who is directing the work and who may approve a sensitive action. Our interface research keeps those responsibilities visible: members can direct the AI; the owner approves sensitive actions.
| Interface concern | What remains explicit |
|---|---|
| Inputs | What the operation needs and which required information is still missing. |
| Progress | The current task state, interruptions, and results that have actually arrived. |
| Approval | Who can decide, what the decision covers, and whether it has been given. |
| Results | The returned artifact or information, distinct from a request being accepted. |
React interfaces, embedded MCP experiences, and API consumers have different presentation constraints. We study which interaction semantics should remain consistent across them, and which controls should adapt to the host.
A reusable view does not make a host capable of executing every action. Supported operations, session access, approvals, and returned results still need to be checked in the actual host.
DarwinUI’s open-source library includes reusable agent, thread, operation, decision, progress, and result components. Explore the documentation and source to see the supported contracts and build with your own application state.
Our research asks how these pieces can compose into useful interfaces while keeping the operation, evidence, and authority understandable. We evaluate clarity, state continuity, accessibility, and the behavior of each interaction in its host.
Inspect the components and build interfaces around your application’s own operations and authorization.
Visit DarwinUI
