Fix build errors in examples (#180)

jonathanhefner · claude · web-flow · commit 4ff22d009709 · 2025-12-18T11:17:23.000Z
* Update `package.json` * Add TypeScript type checking to example build scripts Add `tsc --noEmit &&` before `vite build` in all example `package.json` files to catch type errors during builds. Previously, type errors in `server.ts` files were not detected because Vite/Bun transpile without type checking. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * Make `_meta` optional in `McpUiAppResourceConfig` The `_meta` and `ui` properties were required, causing TypeScript errors when calling `registerAppResource()` without providing metadata. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * Fix Zod type compatibility in `registerAppTool()` Use `ZodRawShapeCompat | AnySchema` from SDK's `zod-compat` module instead of raw `ZodRawShape` to resolve type errors when examples pass `ZodObject` schemas to `registerAppTool()`. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * Remove unused imports in example apps - `basic-server-react`: Remove unused `McpUiResourceTeardownResult` - `customer-segmentation-server`: Remove unused `PostMessageTransport` 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * Fix CI git install test for fork PRs Use `github.event.pull_request.head.repo.full_name` to correctly reference the fork repository when testing git installs from PRs. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -144,7 +144,7 @@ jobs:
           mkdir test-project
           cd test-project
           npm init -y
-          # Install from the PR branch
-          npm install "git+https://github.com/${{ github.repository }}#${{ github.head_ref || github.ref_name }}"
+          # Install from the PR branch (use head repo for fork PRs)
+          npm install "git+https://github.com/${{ github.event.pull_request.head.repo.full_name || github.repository }}#${{ github.head_ref || github.ref_name }}"
           # Verify the package is usable (ESM import)
           node --input-type=module -e "import { App } from '@modelcontextprotocol/ext-apps'; console.log('Import successful:', typeof App)"
diff --git a/examples/basic-host/package.json b/examples/basic-host/package.json
@@ -4,7 +4,7 @@
   "version": "1.0.0",
   "type": "module",
   "scripts": {
-    "build": "concurrently \"cross-env INPUT=index.html vite build\" \"cross-env INPUT=sandbox.html vite build\"",
+    "build": "tsc --noEmit && concurrently \"cross-env INPUT=index.html vite build\" \"cross-env INPUT=sandbox.html vite build\"",
     "watch": "concurrently \"cross-env INPUT=index.html vite build --watch\" \"cross-env INPUT=sandbox.html vite build --watch\"",
     "serve": "bun serve.ts",
     "start": "cross-env NODE_ENV=development npm run build && npm run serve",
diff --git a/examples/basic-server-react/package.json b/examples/basic-server-react/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "cross-env INPUT=mcp-app.html vite build",
+    "build": "tsc --noEmit && cross-env INPUT=mcp-app.html vite build",
     "watch": "cross-env INPUT=mcp-app.html vite build --watch",
     "serve": "bun server.ts",
     "start": "cross-env NODE_ENV=development npm run build && npm run serve",
diff --git a/examples/basic-server-react/src/mcp-app.tsx b/examples/basic-server-react/src/mcp-app.tsx
@@ -1,7 +1,7 @@
 /**
  * @file App that demonstrates a few features using MCP Apps SDK + React.
  */
-import type { App, McpUiResourceTeardownResult } from "@modelcontextprotocol/ext-apps";
+import type { App } from "@modelcontextprotocol/ext-apps";
 import { useApp } from "@modelcontextprotocol/ext-apps/react";
 import type { CallToolResult } from "@modelcontextprotocol/sdk/types.js";
 import { StrictMode, useCallback, useEffect, useState } from "react";
diff --git a/examples/basic-server-vanillajs/package.json b/examples/basic-server-vanillajs/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "cross-env INPUT=mcp-app.html vite build",
+    "build": "tsc --noEmit && cross-env INPUT=mcp-app.html vite build",
     "watch": "cross-env INPUT=mcp-app.html vite build --watch",
     "serve": "bun server.ts",
     "start": "cross-env NODE_ENV=development npm run build && npm run serve",
diff --git a/examples/budget-allocator-server/package.json b/examples/budget-allocator-server/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "cross-env INPUT=mcp-app.html vite build",
+    "build": "tsc --noEmit && cross-env INPUT=mcp-app.html vite build",
     "watch": "cross-env INPUT=mcp-app.html vite build --watch",
     "serve:http": "bun server.ts",
     "serve:stdio": "bun server.ts --stdio",
diff --git a/examples/cohort-heatmap-server/package.json b/examples/cohort-heatmap-server/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "cross-env INPUT=mcp-app.html vite build",
+    "build": "tsc --noEmit && cross-env INPUT=mcp-app.html vite build",
     "watch": "cross-env INPUT=mcp-app.html vite build --watch",
     "serve:http": "bun server.ts",
     "serve:stdio": "bun server.ts --stdio",
diff --git a/examples/customer-segmentation-server/package.json b/examples/customer-segmentation-server/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "cross-env INPUT=mcp-app.html vite build",
+    "build": "tsc --noEmit && cross-env INPUT=mcp-app.html vite build",
     "watch": "cross-env INPUT=mcp-app.html vite build --watch",
     "serve:http": "bun server.ts",
     "serve:stdio": "bun server.ts --stdio",
diff --git a/examples/customer-segmentation-server/src/mcp-app.ts b/examples/customer-segmentation-server/src/mcp-app.ts
@@ -3,7 +3,6 @@
  */
 import {
   App,
-  PostMessageTransport,
   applyHostStyleVariables,
   applyHostFonts,
   applyDocumentTheme,
diff --git a/examples/scenario-modeler-server/package.json b/examples/scenario-modeler-server/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "cross-env INPUT=mcp-app.html vite build",
+    "build": "tsc --noEmit && cross-env INPUT=mcp-app.html vite build",
     "watch": "cross-env INPUT=mcp-app.html vite build --watch",
     "serve:http": "bun server.ts",
     "serve:stdio": "bun server.ts --stdio",
diff --git a/examples/system-monitor-server/package.json b/examples/system-monitor-server/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "cross-env INPUT=mcp-app.html vite build",
+    "build": "tsc --noEmit && cross-env INPUT=mcp-app.html vite build",
     "watch": "cross-env INPUT=mcp-app.html vite build --watch",
     "serve:http": "bun server.ts",
     "serve:stdio": "bun server.ts --stdio",
diff --git a/examples/threejs-server/package.json b/examples/threejs-server/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "cross-env INPUT=mcp-app.html vite build",
+    "build": "tsc --noEmit && cross-env INPUT=mcp-app.html vite build",
     "watch": "cross-env INPUT=mcp-app.html vite build --watch",
     "serve:http": "bun server.ts",
     "serve:stdio": "bun server.ts --stdio",
diff --git a/examples/wiki-explorer-server/package.json b/examples/wiki-explorer-server/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "cross-env INPUT=mcp-app.html vite build",
+    "build": "tsc --noEmit && cross-env INPUT=mcp-app.html vite build",
     "watch": "cross-env INPUT=mcp-app.html vite build --watch",
     "serve:http": "bun server.ts",
     "serve:stdio": "bun server.ts --stdio",
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/server/index.ts b/src/server/index.ts
@@ -16,8 +16,11 @@ import type {
   ToolCallback,
   ReadResourceCallback,
 } from "@modelcontextprotocol/sdk/server/mcp.js";
+import type {
+  AnySchema,
+  ZodRawShapeCompat,
+} from "@modelcontextprotocol/sdk/server/zod-compat.js";
 import type { ToolAnnotations } from "@modelcontextprotocol/sdk/types.js";
-import type { ZodRawShape } from "zod";
 
 // Re-exports for convenience
 export { RESOURCE_URI_META_KEY, RESOURCE_MIME_TYPE };
@@ -29,7 +32,7 @@ export type { ResourceMetadata, ToolCallback, ReadResourceCallback };
 export interface ToolConfig {
   title?: string;
   description?: string;
-  inputSchema?: ZodRawShape;
+  inputSchema?: ZodRawShapeCompat | AnySchema;
   annotations?: ToolAnnotations;
   _meta?: Record<string, unknown>;
 }
@@ -62,8 +65,8 @@ export interface McpUiAppToolConfig extends ToolConfig {
  * MCP App Resource configuration for `registerAppResource`.
  */
 export interface McpUiAppResourceConfig extends ResourceMetadata {
-  _meta: {
-    ui: McpUiResourceMeta;
+  _meta?: {
+    ui?: McpUiResourceMeta;
     [key: string]: unknown;
   };
 }
@@ -96,11 +99,15 @@ export interface McpUiAppResourceConfig extends ResourceMetadata {
  * });
  * ```
  */
-export function registerAppTool(
+export function registerAppTool<
+  TInputSchema extends ZodRawShapeCompat | AnySchema | undefined = undefined,
+>(
   server: Pick<McpServer, "registerTool">,
   name: string,
-  config: McpUiAppToolConfig,
-  handler: ToolCallback<ZodRawShape>,
+  config: Omit<McpUiAppToolConfig, "inputSchema"> & {
+    inputSchema?: TInputSchema;
+  },
+  handler: ToolCallback<TInputSchema>,
 ): void {
   // Normalize metadata for backward compatibility:
   // - If _meta.ui.resourceUri is set, also set the legacy flat key
