mcp-use 1.0.4 → 1.0.6

package/dist/src/server/index.cjs

@@ -31,7 +31,12 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/server/index.ts
 var server_exports = {};
 __export(server_exports, {
-  createMCPServer: () => createMCPServer
+  buildWidgetUrl: () => buildWidgetUrl,
+  createExternalUrlResource: () => createExternalUrlResource,
+  createMCPServer: () => createMCPServer,
+  createRawHtmlResource: () => createRawHtmlResource,
+  createRemoteDomResource: () => createRemoteDomResource,
+  createUIResourceFromDefinition: () => createUIResourceFromDefinition
 });
 module.exports = __toCommonJS(server_exports);
 
@@ -72,6 +77,71 @@ function requestLogger(req, res, next) {
 }
 __name(requestLogger, "requestLogger");
 
+// src/server/adapters/mcp-ui-adapter.ts
+var import_server = require("@mcp-ui/server");
+function buildWidgetUrl(widget, props, config) {
+  const url = new URL(
+    `/mcp-use/widgets/${widget}`,
+    `${config.baseUrl}:${config.port}`
+  );
+  if (props) {
+    Object.entries(props).forEach(([key, value]) => {
+      if (value !== void 0 && value !== null) {
+        const stringValue = typeof value === "object" ? JSON.stringify(value) : String(value);
+        url.searchParams.set(key, stringValue);
+      }
+    });
+  }
+  return url.toString();
+}
+__name(buildWidgetUrl, "buildWidgetUrl");
+function createExternalUrlResource(uri, iframeUrl, encoding = "text") {
+  return (0, import_server.createUIResource)({
+    uri,
+    content: { type: "externalUrl", iframeUrl },
+    encoding
+  });
+}
+__name(createExternalUrlResource, "createExternalUrlResource");
+function createRawHtmlResource(uri, htmlString, encoding = "text") {
+  return (0, import_server.createUIResource)({
+    uri,
+    content: { type: "rawHtml", htmlString },
+    encoding
+  });
+}
+__name(createRawHtmlResource, "createRawHtmlResource");
+function createRemoteDomResource(uri, script, framework = "react", encoding = "text") {
+  return (0, import_server.createUIResource)({
+    uri,
+    content: { type: "remoteDom", script, framework },
+    encoding
+  });
+}
+__name(createRemoteDomResource, "createRemoteDomResource");
+function createUIResourceFromDefinition(definition, params, config) {
+  const uri = `ui://widget/${definition.name}`;
+  const encoding = definition.encoding || "text";
+  switch (definition.type) {
+    case "externalUrl": {
+      const widgetUrl = buildWidgetUrl(definition.widget, params, config);
+      return createExternalUrlResource(uri, widgetUrl, encoding);
+    }
+    case "rawHtml": {
+      return createRawHtmlResource(uri, definition.htmlContent, encoding);
+    }
+    case "remoteDom": {
+      const framework = definition.framework || "react";
+      return createRemoteDomResource(uri, definition.script, framework, encoding);
+    }
+    default: {
+      const _exhaustive = definition;
+      throw new Error(`Unknown UI resource type: ${_exhaustive.type}`);
+    }
+  }
+}
+__name(createUIResourceFromDefinition, "createUIResourceFromDefinition");
+
 // src/server/mcp-server.ts
 var McpServer = class {
   static {
@@ -104,7 +174,7 @@ var McpServer = class {
     this.app.use((req, res, next) => {
       res.header("Access-Control-Allow-Origin", "*");
       res.header("Access-Control-Allow-Methods", "GET, POST, DELETE, OPTIONS");
-      res.header("Access-Control-Allow-Headers", "Content-Type");
+      res.header("Access-Control-Allow-Headers", "Content-Type, Accept, Authorization, mcp-protocol-version, mcp-session-id, X-Proxy-Token, X-Target-URL");
       next();
     });
     this.app.use(requestLogger);
@@ -335,12 +405,196 @@ var McpServer = class {
     );
     return this;
   }
+  /**
+   * Register a UI widget as both a tool and a resource
+   *
+   * Creates a unified interface for MCP-UI compatible widgets that can be accessed
+   * either as tools (with parameters) or as resources (static access). The tool
+   * allows dynamic parameter passing while the resource provides discoverable access.
+   *
+   * @param definition - Configuration for the UI widget
+   * @param definition.name - Unique identifier for the resource
+   * @param definition.widget - Widget name (matches directory in dist/resources/mcp-use/widgets)
+   * @param definition.title - Human-readable title for the widget
+   * @param definition.description - Description of the widget's functionality
+   * @param definition.props - Widget properties configuration with types and defaults
+   * @param definition.size - Preferred iframe size [width, height] (e.g., ['800px', '600px'])
+   * @param definition.annotations - Resource annotations for discovery
+   * @returns The server instance for method chaining
+   *
+   * @example
+   * ```typescript
+   * server.uiResource({
+   *   name: 'kanban-board',
+   *   widget: 'kanban-board',
+   *   title: 'Kanban Board',
+   *   description: 'Interactive task management board',
+   *   props: {
+   *     initialTasks: {
+   *       type: 'array',
+   *       description: 'Initial tasks to display',
+   *       required: false
+   *     },
+   *     theme: {
+   *       type: 'string',
+   *       default: 'light'
+   *     }
+   *   },
+   *   size: ['900px', '600px']
+   * })
+   * ```
+   */
+  uiResource(definition) {
+    const toolName = definition.type === "externalUrl" ? `ui_${definition.widget}` : `ui_${definition.name}`;
+    const displayName = definition.title || definition.name;
+    let resourceUri;
+    let mimeType;
+    switch (definition.type) {
+      case "externalUrl":
+        resourceUri = `ui://widget/${definition.widget}`;
+        mimeType = "text/uri-list";
+        break;
+      case "rawHtml":
+        resourceUri = `ui://widget/${definition.name}`;
+        mimeType = "text/html";
+        break;
+      case "remoteDom":
+        resourceUri = `ui://widget/${definition.name}`;
+        mimeType = "application/vnd.mcp-ui.remote-dom+javascript";
+        break;
+      default:
+        throw new Error(`Unsupported UI resource type. Must be one of: externalUrl, rawHtml, remoteDom`);
+    }
+    this.resource({
+      name: definition.name,
+      uri: resourceUri,
+      title: definition.title,
+      description: definition.description,
+      mimeType,
+      annotations: definition.annotations,
+      fn: /* @__PURE__ */ __name(async () => {
+        const params = definition.type === "externalUrl" ? this.applyDefaultProps(definition.props) : {};
+        const uiResource = this.createWidgetUIResource(definition, params);
+        return {
+          contents: [uiResource.resource]
+        };
+      }, "fn")
+    });
+    this.tool({
+      name: toolName,
+      description: definition.description || `Display ${displayName}`,
+      inputs: this.convertPropsToInputs(definition.props),
+      fn: /* @__PURE__ */ __name(async (params) => {
+        const uiResource = this.createWidgetUIResource(definition, params);
+        return {
+          content: [
+            {
+              type: "text",
+              text: `Displaying ${displayName}`,
+              description: `Show MCP-UI widget for ${displayName}`
+            },
+            uiResource
+          ]
+        };
+      }, "fn")
+    });
+    return this;
+  }
+  /**
+   * Create a UIResource object for a widget with the given parameters
+   *
+   * This method is shared between tool and resource handlers to avoid duplication.
+   * It creates a consistent UIResource structure that can be rendered by MCP-UI
+   * compatible clients.
+   *
+   * @private
+   * @param definition - UIResource definition
+   * @param params - Parameters to pass to the widget via URL
+   * @returns UIResource object compatible with MCP-UI
+   */
+  createWidgetUIResource(definition, params) {
+    const urlConfig = {
+      baseUrl: "http://localhost",
+      port: this.serverPort || 3001
+    };
+    return createUIResourceFromDefinition(definition, params, urlConfig);
+  }
+  /**
+   * Build a complete URL for a widget including query parameters
+   *
+   * Constructs the full URL to access a widget's iframe, encoding any provided
+   * parameters as query string parameters. Complex objects are JSON-stringified
+   * for transmission.
+   *
+   * @private
+   * @param widget - Widget name/identifier
+   * @param params - Parameters to encode in the URL
+   * @returns Complete URL with encoded parameters
+   */
+  buildWidgetUrl(widget, params) {
+    const baseUrl = `http://localhost:${this.serverPort}/mcp-use/widgets/${widget}`;
+    if (Object.keys(params).length === 0) {
+      return baseUrl;
+    }
+    const queryParams = new URLSearchParams();
+    for (const [key, value] of Object.entries(params)) {
+      if (value !== void 0 && value !== null) {
+        if (typeof value === "object") {
+          queryParams.append(key, JSON.stringify(value));
+        } else {
+          queryParams.append(key, String(value));
+        }
+      }
+    }
+    return `${baseUrl}?${queryParams.toString()}`;
+  }
+  /**
+   * Convert widget props definition to tool input schema
+   *
+   * Transforms the widget props configuration into the format expected by
+   * the tool registration system, mapping types and handling defaults.
+   *
+   * @private
+   * @param props - Widget props configuration
+   * @returns Array of InputDefinition objects for tool registration
+   */
+  convertPropsToInputs(props) {
+    if (!props) return [];
+    return Object.entries(props).map(([name, prop]) => ({
+      name,
+      type: prop.type,
+      description: prop.description,
+      required: prop.required,
+      default: prop.default
+    }));
+  }
+  /**
+   * Apply default values to widget props
+   *
+   * Extracts default values from the props configuration to use when
+   * the resource is accessed without parameters.
+   *
+   * @private
+   * @param props - Widget props configuration
+   * @returns Object with default values for each prop
+   */
+  applyDefaultProps(props) {
+    if (!props) return {};
+    const defaults = {};
+    for (const [key, prop] of Object.entries(props)) {
+      if (prop.default !== void 0) {
+        defaults[key] = prop.default;
+      }
+    }
+    return defaults;
+  }
   /**
    * Mount MCP server endpoints at /mcp
    * 
    * Sets up the HTTP transport layer for the MCP server, creating endpoints for
    * Server-Sent Events (SSE) streaming, POST message handling, and DELETE session cleanup.
-   * Uses stateless mode for session management, making it suitable for stateless deployments.
+   * Each request gets its own transport instance to prevent state conflicts between
+   * concurrent client connections.
    * 
    * This method is called automatically when the server starts listening and ensures
    * that MCP clients can communicate with the server over HTTP.
@@ -357,20 +611,39 @@ var McpServer = class {
   async mountMcp() {
     if (this.mcpMounted) return;
     const { StreamableHTTPServerTransport } = await import("@modelcontextprotocol/sdk/server/streamableHttp.js");
-    const httpTransport = new StreamableHTTPServerTransport({
-      sessionIdGenerator: void 0
-      // Stateless mode
-    });
-    await this.server.connect(httpTransport);
     const endpoint = "/mcp";
-    this.app.get(endpoint, async (req, res) => {
-      await httpTransport.handleRequest(req, res);
-    });
     this.app.post(endpoint, import_express.default.json(), async (req, res) => {
-      await httpTransport.handleRequest(req, res, req.body);
+      const transport = new StreamableHTTPServerTransport({
+        sessionIdGenerator: void 0,
+        enableJsonResponse: true
+      });
+      res.on("close", () => {
+        transport.close();
+      });
+      await this.server.connect(transport);
+      await transport.handleRequest(req, res, req.body);
+    });
+    this.app.get(endpoint, async (req, res) => {
+      const transport = new StreamableHTTPServerTransport({
+        sessionIdGenerator: void 0,
+        enableJsonResponse: true
+      });
+      res.on("close", () => {
+        transport.close();
+      });
+      await this.server.connect(transport);
+      await transport.handleRequest(req, res);
     });
     this.app.delete(endpoint, async (req, res) => {
-      await httpTransport.handleRequest(req, res);
+      const transport = new StreamableHTTPServerTransport({
+        sessionIdGenerator: void 0,
+        enableJsonResponse: true
+      });
+      res.on("close", () => {
+        transport.close();
+      });
+      await this.server.connect(transport);
+      await transport.handleRequest(req, res);
     });
     this.mcpMounted = true;
     console.log(`[MCP] Server mounted at ${endpoint}`);
@@ -673,5 +946,10 @@ function createMCPServer(name, config = {}) {
 __name(createMCPServer, "createMCPServer");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  createMCPServer
+  buildWidgetUrl,
+  createExternalUrlResource,
+  createMCPServer,
+  createRawHtmlResource,
+  createRemoteDomResource,
+  createUIResourceFromDefinition
 });

package/dist/src/server/index.d.ts

@@ -1,3 +1,5 @@
-export { createMCPServer } from './mcp-server.js';
-export type { InputDefinition, PromptDefinition, PromptHandler, ResourceDefinition, ResourceHandler, ServerConfig, ToolDefinition, ToolHandler, } from './types.js';
+export { createMCPServer, type McpServerInstance } from './mcp-server.js';
+export * from './types/index.js';
+export { buildWidgetUrl, createExternalUrlResource, createRawHtmlResource, createRemoteDomResource, createUIResourceFromDefinition, type UrlConfig } from './adapters/mcp-ui-adapter.js';
+export type { InputDefinition, PromptDefinition, PromptHandler, ResourceDefinition, ResourceHandler, ServerConfig, ToolDefinition, ToolHandler, UIResourceDefinition, ExternalUrlUIResource, RawHtmlUIResource, RemoteDomUIResource, WidgetProps, WidgetConfig, WidgetManifest, DiscoverWidgetsOptions, } from './types/index.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/src/server/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/server/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EAChB,MAAM,iBAAiB,CAAA;AACxB,YAAY,EACV,eAAe,EACf,gBAAgB,EAChB,aAAa,EACb,kBAAkB,EAClB,eAAe,EACf,YAAY,EACZ,cAAc,EACd,WAAW,GACZ,MAAM,YAAY,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/server/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,KAAK,iBAAiB,EACvB,MAAM,iBAAiB,CAAA;AAExB,cAAc,kBAAkB,CAAA;AAGhC,OAAO,EACL,cAAc,EACd,yBAAyB,EACzB,qBAAqB,EACrB,uBAAuB,EACvB,8BAA8B,EAC9B,KAAK,SAAS,EACf,MAAM,8BAA8B,CAAA;AAErC,YAAY,EACV,eAAe,EACf,gBAAgB,EAChB,aAAa,EACb,kBAAkB,EAClB,eAAe,EACf,YAAY,EACZ,cAAc,EACd,WAAW,EAEX,oBAAoB,EACpB,qBAAqB,EACrB,iBAAiB,EACjB,mBAAmB,EACnB,WAAW,EACX,YAAY,EACZ,cAAc,EACd,sBAAsB,GACvB,MAAM,kBAAkB,CAAA"}