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:
parent
9e42ee05a3
commit
4fc71656a3
2 changed files with 381 additions and 393 deletions
|
|
@ -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.
|
||||
|
||||

|
||||
|
||||
|
|
@ -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
|
||||
|
||||
|
|
|
|||
|
|
@ -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:
|
||||
|
|
|
|||
Loading…
Reference in a new issue