From 264d9cae448fd07bf5f718d188e5528936796fa0 Mon Sep 17 00:00:00 2001 From: Ken Jo Date: Sat, 11 Jul 2026 21:03:43 +0900 Subject: [PATCH] fix: add explicit .js extensions to relative imports so declarations resolve under NodeNext/Node16 The emitted .d.ts copy relative specifiers verbatim, and the extensionless form (e.g. `from "./events"`) doesn't resolve under Node16/NodeNext, hiding inherited members such as `addEventListener` (TS2339). Appending `.js` matches the existing SDK-import style and works with both bundler-mode type-checking and Bun.build. Types-only; runtime is unaffected. Fixes #704 --- src/app-bridge.test.ts | 6 +++--- src/app-bridge.ts | 12 ++++++------ src/app.ts | 20 ++++++++++---------- src/message-transport.test.ts | 2 +- src/message-transport.ts | 2 +- src/react/index.tsx | 8 ++++---- src/react/useApp.tsx | 4 ++-- src/react/useAutoResize.ts | 2 +- src/react/useDocumentTheme.ts | 4 ++-- src/react/useHostStyles.ts | 6 +++--- src/server/index.test.ts | 2 +- src/styles.ts | 2 +- 12 files changed, 35 insertions(+), 35 deletions(-) diff --git a/src/app-bridge.test.ts b/src/app-bridge.test.ts index e538f265f..397e12f90 100644 --- a/src/app-bridge.test.ts +++ b/src/app-bridge.test.ts @@ -3,8 +3,8 @@ import { Client, InMemoryTransport } from "@modelcontextprotocol/client"; import { Server, type ServerCapabilities } from "@modelcontextprotocol/server"; import { z } from "zod/v4"; -import { App } from "./app"; -import { LATEST_PROTOCOL_VERSION } from "./types"; +import { App } from "./app.js"; +import { LATEST_PROTOCOL_VERSION } from "./types.js"; import { AppBridge, buildAllowAttribute, @@ -13,7 +13,7 @@ import { isToolVisibilityAppOnly, McpUiOpenLinkResultSchema, type McpUiHostCapabilities, -} from "./app-bridge"; +} from "./app-bridge.js"; /** Wait for pending microtasks to complete */ const flush = () => new Promise((resolve) => setTimeout(resolve, 0)); diff --git a/src/app-bridge.ts b/src/app-bridge.ts index 59ea5863b..8e4867731 100644 --- a/src/app-bridge.ts +++ b/src/app-bridge.ts @@ -34,7 +34,7 @@ import { EmptyResultSchema, LoggingMessageNotificationSchema, } from "@modelcontextprotocol/core"; -import { EventDispatcher } from "./events"; +import { EventDispatcher } from "./events.js"; import type { ZodLiteral, ZodObject, ZodType } from "zod/v4"; type MethodSchema = ZodObject<{ @@ -87,11 +87,11 @@ import { McpUiRequestDisplayModeResultSchema, McpUiResourcePermissions, McpUiToolMeta, -} from "./types"; -export * from "./types"; -export { RESOURCE_URI_META_KEY, RESOURCE_MIME_TYPE } from "./constants"; -import { RESOURCE_URI_META_KEY } from "./constants"; -export { PostMessageTransport } from "./message-transport"; +} from "./types.js"; +export * from "./types.js"; +export { RESOURCE_URI_META_KEY, RESOURCE_MIME_TYPE } from "./constants.js"; +import { RESOURCE_URI_META_KEY } from "./constants.js"; +export { PostMessageTransport } from "./message-transport.js"; /** * Extract UI resource URI from tool metadata. diff --git a/src/app.ts b/src/app.ts index 34ef284a0..3fe84d682 100644 --- a/src/app.ts +++ b/src/app.ts @@ -22,10 +22,10 @@ import { type Transport, } from "@modelcontextprotocol/client"; import { EmptyResultSchema } from "@modelcontextprotocol/core"; -export { RESOURCE_MIME_TYPE, RESOURCE_URI_META_KEY } from "./constants"; -import { EventDispatcher } from "./events"; -export { EventDispatcher } from "./events"; -import { PostMessageTransport } from "./message-transport"; +export { RESOURCE_MIME_TYPE, RESOURCE_URI_META_KEY } from "./constants.js"; +import { EventDispatcher } from "./events.js"; +export { EventDispatcher } from "./events.js"; +import { PostMessageTransport } from "./message-transport.js"; import { LATEST_PROTOCOL_VERSION, McpUiAppCapabilities, @@ -59,12 +59,12 @@ import { McpUiToolResultNotificationSchema, McpUiRequestDisplayModeRequest, McpUiRequestDisplayModeResultSchema, -} from "./types"; +} from "./types.js"; import { StandardSchemaV1, standardSchemaToJsonSchema, validateStandardSchema, -} from "./standard-schema"; +} from "./standard-schema.js"; import { z, type ZodLiteral, type ZodObject, type ZodType } from "zod/v4"; type MethodSchema = ZodObject<{ @@ -92,16 +92,16 @@ function mergeAppCapabilities( export type { StandardSchemaV1, StandardSchemaWithJSON, -} from "./standard-schema"; +} from "./standard-schema.js"; -export { PostMessageTransport } from "./message-transport"; -export * from "./types"; +export { PostMessageTransport } from "./message-transport.js"; +export * from "./types.js"; export { applyHostStyleVariables, applyHostFonts, getDocumentTheme, applyDocumentTheme, -} from "./styles"; +} from "./styles.js"; /** * Metadata key for associating a UI resource URI with a tool. diff --git a/src/message-transport.test.ts b/src/message-transport.test.ts index 2a115f3f9..e2518cce4 100644 --- a/src/message-transport.test.ts +++ b/src/message-transport.test.ts @@ -1,7 +1,7 @@ import { describe, it, expect, beforeEach, afterEach, mock } from "bun:test"; import type { JSONRPCMessage } from "@modelcontextprotocol/client"; -import { PostMessageTransport } from "./message-transport"; +import { PostMessageTransport } from "./message-transport.js"; /** * Minimal `window` stub for bun's DOM-less test environment. diff --git a/src/message-transport.ts b/src/message-transport.ts index 94835401f..afc85e935 100644 --- a/src/message-transport.ts +++ b/src/message-transport.ts @@ -5,7 +5,7 @@ import type { Transport, TransportSendOptions, } from "@modelcontextprotocol/client"; -import { TOOL_INPUT_PARTIAL_METHOD } from "./spec.types"; +import { TOOL_INPUT_PARTIAL_METHOD } from "./spec.types.js"; /** * JSON-RPC transport using `window.postMessage` for iframe↔parent communication. diff --git a/src/react/index.tsx b/src/react/index.tsx index e76e197a8..9693fb116 100644 --- a/src/react/index.tsx +++ b/src/react/index.tsx @@ -31,7 +31,7 @@ * } * ``` */ -export * from "./useApp"; -export * from "./useAutoResize"; -export * from "./useDocumentTheme"; -export * from "./useHostStyles"; +export * from "./useApp.js"; +export * from "./useAutoResize.js"; +export * from "./useDocumentTheme.js"; +export * from "./useHostStyles.js"; diff --git a/src/react/useApp.tsx b/src/react/useApp.tsx index 0e64a74d6..a8e1a099e 100644 --- a/src/react/useApp.tsx +++ b/src/react/useApp.tsx @@ -5,8 +5,8 @@ import { AppOptions, McpUiAppCapabilities, PostMessageTransport, -} from "../app"; -export * from "../app"; +} from "../app.js"; +export * from "../app.js"; /** * Options for configuring the {@link useApp `useApp`} hook. diff --git a/src/react/useAutoResize.ts b/src/react/useAutoResize.ts index 78217d6b4..66af07e96 100644 --- a/src/react/useAutoResize.ts +++ b/src/react/useAutoResize.ts @@ -1,5 +1,5 @@ import { useEffect, RefObject } from "react"; -import { App } from "../app"; +import { App } from "../app.js"; /** * React hook that automatically reports UI size changes to the host. diff --git a/src/react/useDocumentTheme.ts b/src/react/useDocumentTheme.ts index 2fdfcc2f1..3dc851e67 100644 --- a/src/react/useDocumentTheme.ts +++ b/src/react/useDocumentTheme.ts @@ -1,6 +1,6 @@ import { useEffect, useState } from "react"; -import { getDocumentTheme } from "../styles"; -import { McpUiTheme } from "../types"; +import { getDocumentTheme } from "../styles.js"; +import { McpUiTheme } from "../types.js"; /** * React hook that provides the current document theme reactively. diff --git a/src/react/useHostStyles.ts b/src/react/useHostStyles.ts index e380efae9..d8376a0c8 100644 --- a/src/react/useHostStyles.ts +++ b/src/react/useHostStyles.ts @@ -1,11 +1,11 @@ import { useEffect, useRef } from "react"; -import { App } from "../app"; +import { App } from "../app.js"; import { applyDocumentTheme, applyHostFonts, applyHostStyleVariables, -} from "../styles"; -import { McpUiHostContext } from "../types"; +} from "../styles.js"; +import { McpUiHostContext } from "../types.js"; /** * React hook that applies host style variables and theme as CSS custom properties. diff --git a/src/server/index.test.ts b/src/server/index.test.ts index 5de341f9e..389cde138 100644 --- a/src/server/index.test.ts +++ b/src/server/index.test.ts @@ -6,7 +6,7 @@ import { RESOURCE_MIME_TYPE, getUiCapability, EXTENSION_ID, -} from "./index"; +} from "./index.js"; import type { McpServer } from "@modelcontextprotocol/server"; describe("registerAppTool", () => { diff --git a/src/styles.ts b/src/styles.ts index ad900e29e..895073b8d 100644 --- a/src/styles.ts +++ b/src/styles.ts @@ -1,4 +1,4 @@ -import { McpUiStyles, McpUiTheme } from "./types"; +import { McpUiStyles, McpUiTheme } from "./types.js"; /** * Get the current document theme from the root HTML element.