mcp-ui is a TypeScript SDK designed to bring rich, interactive web-based user interfaces to the Model Context Protocol (MCP). It enables MCP servers to deliver dynamic UI resources, such as HTML content or external URLs, which are then rendered by an MCP client. This allows for enhanced AI interactions by embedding interactive elements directly within the AI's context.

How It Works

The SDK consists of two packages: @mcp-ui/server for generating HtmlResourceBlock payloads on the server, and @mcp-ui/client for rendering these blocks using a React component (<HtmlResource />) in the client. The core concept is the HtmlResourceBlock, which specifies a uri, mimeType (either text/html or text/uri-list), and content via text or blob. The client component renders this resource, typically within an iframe, and handles UI events by sending them back to the MCP host via the onUiAction callback. This approach aims to provide a secure and flexible way to integrate UIs without local code execution.

Quick Start & Requirements

• Install: npm install @mcp-ui/server @mcp-ui/client (or pnpm, yarn)
• Prerequisites: React for client-side rendering.
• Links: Examples, Hosted UI Inspector

Highlighted Details

• Enables servers to deliver interactive UIs with ergonomic APIs.
• Allows any host to support UI with its own look-and-feel.
• Aims to eliminate security concerns by limiting local code execution.
• Supports rendering raw HTML or external URLs via iframes.
• UI actions can be captured and handled by the host environment.

Maintenance & Community

• Community playground for MCP UI ideas with rapid iteration.
• Contributions and bug reports are welcome.
• Links: Contributing Guidelines

Licensing & Compatibility

• License: Apache License 2.0.
• Compatible with commercial use and closed-source linking under the terms of Apache 2.0.

Limitations & Caveats

The project is described as experimental and a community playground, indicating potential for rapid changes and instability. While Web Components and Remote-DOM support are in progress, they are not yet fully implemented.