HeadlinesBriefing favicon HeadlinesBriefing.com

CopilotKit Supports MCP Apps for Interactive UIs

DEV Community •
×

CopilotKit has announced support for MCP Apps, allowing developers to integrate interactive user interfaces directly into their applications. This development addresses a critical gap in agent frameworks, where presenting information and collecting user input has traditionally required custom UI logic for each tool. MCP Apps standardize the process, enabling MCP servers to ship HTML UIs alongside tool outputs, reducing the need for hosts to rebuild the same UI logic.

The integration is powered by AG-UI, an event/state protocol that ensures synchronization between the agent, UI, and application. This protocol handles tool lifecycle, user interactions, and agent state updates, providing a seamless experience. Developers can use the CopilotKit CLI to get started, with a simple command generating a starter repository that demonstrates an end-to-end integration.

For those integrating into existing Next.js applications, CopilotKit provides middleware that fetches and renders UI resources, keeping the UI state in sync with the agent. This middleware supports both HTTP and SSE transports, offering flexibility in how data is exchanged. The setup involves configuring the CopilotKit API route and wrapping the application with the CopilotKit provider to enable real-time interactions.

This advancement is significant for agent builders, as it allows them to ship interactive UIs without rebuilding them for each host. It also facilitates the inclusion of human-in-the-loop steps within applications, enhancing user engagement and control. With this support, developers can expect more examples and tighter integration patterns in the coming weeks, further solidifying the role of AG-UI as a bridge in this ecosystem.