Save your spot

Live eventA single Agent, 3 surfaces

Mastra is now fully AG-UI compatible

By Anmol Baranwal and Nathan Tarbert
August 24, 2026
Mastra is now fully AG-UI compatible

Mastra is now fully AG-UI compatible!

We improved the AG-UI Mastra integration (@ag-ui/mastra), so the full CopilotKit feature set now works on any Mastra agent. Generative UI, live shared state, real interrupts, and activity cards all come through the integration. A2UI got its own upgrades along the way, including self-healing output and generation in a dedicated sub-agent.

Drop a Mastra agent into any AG-UI frontend, and it works the same everywhere: React, React Native, Next.js, Vue, Angular as well as Slack, Teams, and other messaging platforms via the Channels SDK. All open source.

The setup

You can use the CLI: npx copilotkit@latest create and pick Mastra as the integration to get started.

Or register your Mastra agents with the Copilot Runtime:

// app/api/copilotkit/[[...slug]]/route.ts
import {
  CopilotRuntime,
  createCopilotRuntimeHandler,
  InMemoryAgentRunner,
} from "@copilotkit/runtime/v2";
import { MastraAgent } from "@ag-ui/mastra";
import { mastra } from "@/mastra"; // the path to your Mastra instance

const runtime = new CopilotRuntime({
  agents: MastraAgent.getLocalAgents({ mastra }),
  runner: new InMemoryAgentRunner(),
});

const handler = createCopilotRuntimeHandler({
  runtime,
  basePath: "/api/copilotkit",
});

export const GET = handler;
export const POST = handler;

Then wrap your app and add a chat UI component.

<CopilotKit runtimeUrl="/api/copilotkit" agent="myAgent" useSingleEndpoint={false}>
  <CopilotSidebar />
</CopilotKit>

What works now

Everything below works on local and remote agents alike.

  • Agentic chat: sidebar, popup, inline, or fully headless
  • Generative UI: tool rendering, state rendering, A2UI, MCP apps
  • Shared state that streams field by field, and takes your edits back
  • Human-in-the-loop that suspends the run mid-flight and resumes where it stopped
  • Background tasks and memory formation, surfaced as live activity cards
  • Frontend tools the agent calls in your app, sync or async
  • Subagents, multimodal, voice, reasoning, thread persistence and more

Full setup and guides are in the CopilotKit docs and Mastra's integration guide, which also walks through bringing your agent to Slack and Teams with the Channels SDK.

__wf_reserved_inherit

Self-healing generative UI with A2UI

A2UI is Google's framework-agnostic open standard for generative UI. The agent describes an interface as data, and your app draws it with the components you already have. It's transport-agnostic by design.

We improved the developer experience of using A2UI with your Mastra agent:

  • No server-side setup: the catalog reaches the agent on the run input, so registering it on the client is all it takes
  • Generation in a dedicated sub-agent: the catalog and protocol rules stay out of your main agent's context, and the surface streams as it's built
  • Self-healing output: invalid generations go back with the specific errors for a correction, so nothing broken reaches the screen
  • Updates in place: the agent re-emits against the same surface, so a form becomes a confirmation with no flicker
  • Graceful failure: when retries run out, the surface resolves to a short message and the conversation continues

Registering the catalog on the provider, and it's on.

<CopilotKit runtimeUrl="/api/copilotkit" agent="myAgent" a2ui={{ catalog: myCatalog }}>
  {/* your app */}
</CopilotKit>

See it running in Dojo

Try all of these agentic features live in the CopilotKit Dojo and the Mastra Dojo.

Getting started

CopilotKit gives you all the building blocks to put your Mastra agent in front of real users.

Want to bring CopilotKit into your stack? Talk to our engineers and we'll help you set it up.

Follow CopilotKit on Twitter for updates. If you get stuck, reach out in the CopilotKit or AG-UI communities.

Are you ready?

Stay in the know

Subscribe to our blog and get updates on CopilotKit in your inbox.