Extract getUiCapability example to type-checked examples file
Move the inline example from the `getUiCapability()` JSDoc to `index.examples.ts` for type checking, following the pattern used by other examples in the codebase. The example now uses the correct MCP SDK API: - `server.server.oninitialized` callback for post-initialization hook - `server.server.getClientCapabilities()` to retrieve capabilities Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
6905aa8edc
commit
52cc193e1b
2 changed files with 61 additions and 12 deletions
|
|
@ -17,6 +17,7 @@ import { z } from "zod";
|
|||
import {
|
||||
registerAppTool,
|
||||
registerAppResource,
|
||||
getUiCapability,
|
||||
RESOURCE_MIME_TYPE,
|
||||
} from "./index.js";
|
||||
|
||||
|
|
@ -196,3 +197,41 @@ function registerAppResource_withCsp(
|
|||
);
|
||||
//#endregion registerAppResource_withCsp
|
||||
}
|
||||
|
||||
/**
|
||||
* Example: Check for MCP Apps support in server initialization.
|
||||
*/
|
||||
function getUiCapability_checkSupport(
|
||||
server: McpServer,
|
||||
weatherHandler: ToolCallback,
|
||||
textWeatherHandler: ToolCallback,
|
||||
) {
|
||||
//#region getUiCapability_checkSupport
|
||||
server.server.oninitialized = () => {
|
||||
const clientCapabilities = server.server.getClientCapabilities();
|
||||
const uiCap = getUiCapability(clientCapabilities);
|
||||
|
||||
if (uiCap?.mimeTypes?.includes(RESOURCE_MIME_TYPE)) {
|
||||
// App-enhanced tool
|
||||
registerAppTool(
|
||||
server,
|
||||
"weather",
|
||||
{
|
||||
description: "Get weather information with interactive dashboard",
|
||||
_meta: { ui: { resourceUri: "ui://weather/dashboard" } },
|
||||
},
|
||||
weatherHandler,
|
||||
);
|
||||
} else {
|
||||
// Text-only fallback
|
||||
server.registerTool(
|
||||
"weather",
|
||||
{
|
||||
description: "Get weather information",
|
||||
},
|
||||
textWeatherHandler,
|
||||
);
|
||||
}
|
||||
};
|
||||
//#endregion getUiCapability_checkSupport
|
||||
}
|
||||
|
|
|
|||
|
|
@ -340,21 +340,31 @@ export const EXTENSION_ID = "io.modelcontextprotocol/ui";
|
|||
* @returns The MCP Apps capability settings, or `undefined` if not supported
|
||||
*
|
||||
* @example Check for MCP Apps support in server initialization
|
||||
* ```typescript
|
||||
* import { getUiCapability, RESOURCE_MIME_TYPE, registerAppTool } from "@modelcontextprotocol/ext-apps/server";
|
||||
*
|
||||
* server.oninitialized = ({ clientCapabilities }) => {
|
||||
* ```ts source="./index.examples.ts#getUiCapability_checkSupport"
|
||||
* server.server.oninitialized = () => {
|
||||
* const clientCapabilities = server.server.getClientCapabilities();
|
||||
* const uiCap = getUiCapability(clientCapabilities);
|
||||
*
|
||||
* if (uiCap?.mimeTypes?.includes(RESOURCE_MIME_TYPE)) {
|
||||
* registerAppTool(server, "weather", {
|
||||
* description: "Get weather with interactive dashboard",
|
||||
* _meta: { ui: { resourceUri: "ui://weather/dashboard" } },
|
||||
* }, weatherHandler);
|
||||
* // App-enhanced tool
|
||||
* registerAppTool(
|
||||
* server,
|
||||
* "weather",
|
||||
* {
|
||||
* description: "Get weather information with interactive dashboard",
|
||||
* _meta: { ui: { resourceUri: "ui://weather/dashboard" } },
|
||||
* },
|
||||
* weatherHandler,
|
||||
* );
|
||||
* } else {
|
||||
* // Register text-only fallback
|
||||
* server.registerTool("weather", {
|
||||
* description: "Get weather as text",
|
||||
* }, textWeatherHandler);
|
||||
* // Text-only fallback
|
||||
* server.registerTool(
|
||||
* "weather",
|
||||
* {
|
||||
* description: "Get weather information",
|
||||
* },
|
||||
* textWeatherHandler,
|
||||
* );
|
||||
* }
|
||||
* };
|
||||
* ```
|
||||
|
|
|
|||
Loading…
Reference in a new issue