A timeline card that shows one AI agent passing a task to another (or to a person), including what was handed off so you can verify nothing was dropped in a multi-agent workflow.
import AgentHandoff from "@/components/ui/agent-handoff";
export default function AgentHandoffDemo() {
return (
<div className="flex w-full max-w-md flex-col gap-6 p-6">
<AgentHandoff
from="Market research"
fromNote="Read 11 sources and pulled the figures"
fromWhen="Finished 2:14pm"
passLabel="Passed on"
to="Writing the one-pager"
toNote="Turning those figures into a page"
toWhen="Working on it now"
carriedLabel="What came with it"
carried={[
"Eleven figures, each with the page it came from",
"Two claims it could not confirm, marked as such",
"The exchange rate used, and the date it was taken",
]}
/>
<AgentHandoff
from="Writing the one-pager"
fromWhen="Finished 2:31pm"
passLabel="Handed to a person"
to="Felix"
toNote="Nothing is sent until you say so"
toWhen="Waiting for you"
carriedLabel="What came with it"
carried={["redrob-one-pager.docx, one page"]}
/>
</div>
);
}