docs: standardize UI terminology to use "view" consistently (#325)

* docs: standardize UI terminology to use "view" consistently

Replaces "widget" and "Guest UI" terminology with "view" across
the codebase as decided in the community survey.

This change updates:
- Specification document
- SDK source code and JSDoc comments
- Example servers and documentation
- Plugin documentation and skills

Closes #71

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Liad Yosef 2026-01-23 04:36:52 +02:00 • committed by GitHub
commit 4fc71656a3
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 381 additions and 393 deletions

View file

@ -1,6 +1,6 @@
# QR Code MCP Server
A minimal Python MCP server that generates customizable QR codes with an interactive widget UI.
A minimal Python MCP server that generates customizable QR codes with an interactive view UI.
![Screenshot](https://modelcontextprotocol.github.io/ext-apps/screenshots/qr-server/screenshot.png)
@ -33,7 +33,7 @@ Then add to your MCP client configuration (stdio transport), replacing the path
- Generate QR codes from any text or URL
- Customizable colors, size, and error correction
- Interactive widget that displays in MCP-UI enabled clients
- Interactive view that displays in MCP-UI enabled clients
- Supports both HTTP (for web clients) and stdio (for MCP clients)
## Prerequisites
@ -151,19 +151,19 @@ Generate a QR code with optional customization.
```
qr-server/
├── server.py # MCP server (FastMCP + uvicorn, deps inline via PEP 723)
├── widget.html # Interactive UI widget
├── view.html # Interactive UI view
└── README.md
```
### Protocol
The widget uses MCP Apps SDK protocol:
The view uses MCP Apps SDK protocol:
1. Widget sends `ui/initialize` request
1. The view sends `ui/initialize` request
2. Host responds with capabilities
3. Widget sends `ui/notifications/initialized`
3. The view sends `ui/notifications/initialized`
4. Host sends `ui/notifications/tool-result` with QR image
5. Widget renders image and sends `ui/notifications/size-changed`
5. The view renders image and sends `ui/notifications/size-changed`
## Dependencies

View file

@ -22,14 +22,14 @@ from mcp.server.fastmcp import FastMCP
from mcp import types
from starlette.middleware.cors import CORSMiddleware
WIDGET_URI = "ui://qr-server/widget.html"
VIEW_URI = "ui://qr-server/view.html"
HOST = os.environ.get("HOST", "0.0.0.0") # 0.0.0.0 for Docker compatibility
PORT = int(os.environ.get("PORT", "3108"))
mcp = FastMCP("QR Code Server")
# Embedded widget HTML for self-contained usage (uv run <url> or unbundled)
EMBEDDED_WIDGET_HTML = """<!DOCTYPE html>
# Embedded View HTML for self-contained usage (uv run <url> or unbundled)
EMBEDDED_VIEW_HTML = """<!DOCTYPE html>
<html>
<head>
<meta name="color-scheme" content="light dark">
@ -60,7 +60,7 @@ EMBEDDED_WIDGET_HTML = """<!DOCTYPE html>
<script type="module">
import { App } from "https://unpkg.com/@modelcontextprotocol/ext-apps@0.4.0/app-with-deps";
const app = new App({ name: "QR Widget", version: "1.0.0" });
const app = new App({ name: "QR View", version: "1.0.0" });
app.ontoolresult = ({ content }) => {
const img = content?.find(c => c.type === 'image');
@ -100,8 +100,8 @@ EMBEDDED_WIDGET_HTML = """<!DOCTYPE html>
@mcp.tool(meta={
"ui":{"resourceUri": WIDGET_URI},
"ui/resourceUri": WIDGET_URI, # legacy support
"ui":{"resourceUri": VIEW_URI},
"ui/resourceUri": VIEW_URI, # legacy support
})
def generate_qr(
text: str = "https://modelcontextprotocol.io",
@ -147,13 +147,13 @@ def generate_qr(
# IMPORTANT: all the external domains used by app must be listed
# in the meta.ui.csp.resourceDomains - otherwise they will be blocked by CSP policy
@mcp.resource(
WIDGET_URI,
VIEW_URI,
mime_type="text/html;profile=mcp-app",
meta={"ui": {"csp": {"resourceDomains": ["https://unpkg.com"]}}},
)
def widget() -> str:
"""Widget HTML resource with CSP metadata for external dependencies."""
return EMBEDDED_WIDGET_HTML
def view() -> str:
"""View HTML resource with CSP metadata for external dependencies."""
return EMBEDDED_VIEW_HTML
if __name__ == "__main__":
if "--stdio" in sys.argv: