- TypeScript 76.4%
- MDX 19.3%
- JavaScript 4.3%
| Filename | Latest commit message | Latest commit date |
|---|---|---|
c7ef5f009b* fix(app): add source validation to default PostMessageTransport App.connect() now passes window.parent as both eventTarget and eventSource, enabling source validation by default. This ensures apps only accept messages from their parent window, preventing potential cross-app message spoofing attacks. Previously, the default transport only specified the target but not the source for validation, meaning apps would accept messages from ANY window. * fix(sandbox): add origin validation for host messages The sandbox proxy now validates that messages from the parent window come from the expected host origin (derived from document.referrer). This prevents malicious pages from sending spoofed messages to the sandbox. Changes: - Extract EXPECTED_HOST_ORIGIN from document.referrer - Validate event.origin against expected origin for parent messages - Use specific origin instead of '*' when sending to parent - Reject and log messages from unexpected origins This addresses the TODO comment that was previously in the code. * validate messages from app come from same origin as sandbox proxy * fix(basic-host): be resilient to individual server connection failures Use Promise.allSettled instead of Promise.all when connecting to servers, so that a single server failure doesn't crash the entire UI. Failed connections are logged as warnings but the UI continues with the servers that connected successfully. Also fixes video-resource-server missing server-utils.ts. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> --------- Co-authored-by: Claude <noreply@anthropic.com> |
||
| .github/workflows | ||
| .husky | ||
| docs | ||
| examples | ||
| scripts | ||
| specification/draft | ||
| src | ||
| tests/e2e | ||
| .gitattributes | ||
| .gitignore | ||
| .prettierignore | ||
| .prettierrc.json | ||
| build.bun.ts | ||
| CONTRIBUTING.md | ||
| LICENSE | ||
| package-lock.json | ||
| package.json | ||
| playwright.config.ts | ||
| README.md | ||
| tsconfig.json | ||
| typedoc.json | ||
@modelcontextprotocol/ext-apps
This repo contains the SDK and specification for MCP Apps Extension (SEP-1865).
MCP Apps are a proposed standard inspired by MCP-UI and OpenAI's Apps SDK to allow MCP Servers to display interactive UI elements in conversational MCP clients / chatbots.
Overview
This SDK serves two audiences:
App Developers
Build interactive UIs that run inside MCP-enabled chat clients.
- SDK for Apps:
@modelcontextprotocol/ext-apps— API Docs - React hooks:
@modelcontextprotocol/ext-apps/react— API Docs
Host Developers
Embed and communicate with MCP Apps in your chat application.
- SDK for Hosts:
@modelcontextprotocol/ext-apps/app-bridge— API Docs
There's no supported host implementation in this repo (beyond the examples/basic-host example).
We have contributed a tentative implementation of hosting / iframing / sandboxing logic to the MCP-UI repository, and expect OSS clients may use it, while other clients might roll their own hosting logic.
Installation
npm install -S @modelcontextprotocol/ext-apps
Or edit your package.json manually:
{
"dependencies": {
"@modelcontextprotocol/ext-apps": "^0.0.1"
}
}
Examples
Start with these foundational examples to learn the SDK:
examples/basic-server-vanillajs— Example MCP server with tools that return UI Apps (vanilla JS)examples/basic-server-react— Example MCP server with tools that return UI Apps (React)examples/basic-host— Bare-bones example of hosting MCP Apps
The examples/ directory contains additional demo apps showcasing real-world use cases.
To run all examples together:
npm install
npm start
Then open http://localhost:8080/.