@modelcontextprotocol/inspector 0.16.2 → 0.16.3

package/README.md

@@ -234,6 +234,78 @@ Example server configuration file:
 }
 ```
 
+#### Transport Types in Config Files
+
+The inspector automatically detects the transport type from your config file. You can specify different transport types:
+
+**STDIO (default):**
+
+```json
+{
+  "mcpServers": {
+    "my-stdio-server": {
+      "type": "stdio",
+      "command": "npx",
+      "args": ["@modelcontextprotocol/server-everything"]
+    }
+  }
+}
+```
+
+**SSE (Server-Sent Events):**
+
+```json
+{
+  "mcpServers": {
+    "my-sse-server": {
+      "type": "sse",
+      "url": "http://localhost:3000/sse"
+    }
+  }
+}
+```
+
+**Streamable HTTP:**
+
+```json
+{
+  "mcpServers": {
+    "my-http-server": {
+      "type": "streamable-http",
+      "url": "http://localhost:3000/mcp"
+    }
+  }
+}
+```
+
+#### Default Server Selection
+
+You can launch the inspector without specifying a server name if your config has:
+
+1. **A single server** - automatically selected:
+
+```bash
+# Automatically uses "my-server" if it's the only one
+npx @modelcontextprotocol/inspector --config mcp.json
+```
+
+2. **A server named "default-server"** - automatically selected:
+
+```json
+{
+  "mcpServers": {
+    "default-server": {
+      "command": "npx",
+      "args": ["@modelcontextprotocol/server-everything"]
+    },
+    "other-server": {
+      "command": "node",
+      "args": ["other.js"]
+    }
+  }
+}
+```
+
 > **Tip:** You can easily generate this configuration format using the **Server Entry** and **Servers File** buttons in the Inspector UI, as described in the Servers File Export section above.
 
 You can also set the initial `transport` type, `serverUrl`, `serverCommand`, and `serverArgs` via query params, for example:

package/cli/build/cli.js

@@ -38,6 +38,14 @@ async function runWebClient(args) {
     for (const [key, value] of Object.entries(args.envArgs)) {
         startArgs.push("-e", `${key}=${value}`);
     }
+    // Pass transport type if specified
+    if (args.transport) {
+        startArgs.push("--transport", args.transport);
+    }
+    // Pass server URL if specified
+    if (args.serverUrl) {
+        startArgs.push("--server-url", args.serverUrl);
+    }
     // Pass command and args (using -- to separate them)
     if (args.command) {
         startArgs.push("--", args.command, ...args.args);
@@ -63,7 +71,17 @@ async function runCli(args) {
         abort.abort();
     });
     try {
-        await spawnPromise("node", [cliPath, args.command, ...args.args], {
+        // Build CLI arguments
+        const cliArgs = [cliPath];
+        // Add transport flag if specified
+        if (args.transport && args.transport !== "stdio") {
+            // Convert streamable-http back to http for CLI mode
+            const cliTransport = args.transport === "streamable-http" ? "http" : args.transport;
+            cliArgs.push("--transport", cliTransport);
+        }
+        // Add command and remaining args
+        cliArgs.push(args.command, ...args.args);
+        await spawnPromise("node", cliArgs, {
             env: { ...process.env, ...args.envArgs },
             signal: abort.signal,
             echoOutput: true,
@@ -124,38 +142,88 @@ function parseArgs() {
         .option("-e <env>", "environment variables in KEY=VALUE format", parseKeyValuePair, {})
         .option("--config <path>", "config file path")
         .option("--server <n>", "server name from config file")
-        .option("--cli", "enable CLI mode");
+        .option("--cli", "enable CLI mode")
+        .option("--transport <type>", "transport type (stdio, sse, http)")
+        .option("--server-url <url>", "server URL for SSE/HTTP transport");
     // Parse only the arguments before --
     program.parse(preArgs);
     const options = program.opts();
     const remainingArgs = program.args;
     // Add back any arguments that came after --
     const finalArgs = [...remainingArgs, ...postArgs];
-    // Validate that config and server are provided together
-    if ((options.config && !options.server) ||
-        (!options.config && options.server)) {
-        throw new Error("Both --config and --server must be provided together. If you specify one, you must specify the other.");
+    // Validate config and server options
+    if (!options.config && options.server) {
+        throw new Error("--server requires --config to be specified");
+    }
+    // If config is provided without server, try to auto-select
+    if (options.config && !options.server) {
+        const configContent = fs.readFileSync(path.isAbsolute(options.config)
+            ? options.config
+            : path.resolve(process.cwd(), options.config), "utf8");
+        const parsedConfig = JSON.parse(configContent);
+        const servers = Object.keys(parsedConfig.mcpServers || {});
+        if (servers.length === 1) {
+            // Use the only server if there's just one
+            options.server = servers[0];
+        }
+        else if (servers.length === 0) {
+            throw new Error("No servers found in config file");
+        }
+        else {
+            // Multiple servers, require explicit selection
+            throw new Error(`Multiple servers found in config file. Please specify one with --server.\nAvailable servers: ${servers.join(", ")}`);
+        }
     }
     // If config file is specified, load and use the options from the file. We must merge the args
     // from the command line and the file together, or we will miss the method options (--method,
     // etc.)
     if (options.config && options.server) {
         const config = loadConfigFile(options.config, options.server);
-        return {
-            command: config.command,
-            args: [...(config.args || []), ...finalArgs],
-            envArgs: { ...(config.env || {}), ...(options.e || {}) },
-            cli: options.cli || false,
-        };
+        if (config.type === "stdio") {
+            return {
+                command: config.command,
+                args: [...(config.args || []), ...finalArgs],
+                envArgs: { ...(config.env || {}), ...(options.e || {}) },
+                cli: options.cli || false,
+                transport: "stdio",
+            };
+        }
+        else if (config.type === "sse" || config.type === "streamable-http") {
+            return {
+                command: config.url,
+                args: finalArgs,
+                envArgs: options.e || {},
+                cli: options.cli || false,
+                transport: config.type,
+                serverUrl: config.url,
+            };
+        }
+        else {
+            // Backwards compatibility: if no type field, assume stdio
+            return {
+                command: config.command || "",
+                args: [...(config.args || []), ...finalArgs],
+                envArgs: { ...(config.env || {}), ...(options.e || {}) },
+                cli: options.cli || false,
+                transport: "stdio",
+            };
+        }
     }
     // Otherwise use command line arguments
     const command = finalArgs[0] || "";
     const args = finalArgs.slice(1);
+    // Map "http" shorthand to "streamable-http"
+    let transport = options.transport;
+    if (transport === "http") {
+        transport = "streamable-http";
+    }
     return {
         command,
         args,
         envArgs: options.e || {},
         cli: options.cli || false,
+        transport: transport,
+        serverUrl: options.serverUrl,
     };
 }
 async function main() {

package/cli/build/client/connection.js

@@ -8,6 +8,11 @@ export const validLogLevels = [
 export async function connect(client, transport) {
     try {
         await client.connect(transport);
+        if (client.getServerCapabilities()?.logging) {
+            // default logging level is undefined in the spec, but the user of the
+            // inspector most likely wants debug.
+            await client.setLoggingLevel("debug");
+        }
     }
     catch (error) {
         throw new Error(`Failed to connect to MCP server: ${error instanceof Error ? error.message : String(error)}`);

package/client/bin/start.js

@@ -28,8 +28,15 @@ function getClientUrl(port, authDisabled, sessionToken, serverPort) {
 }
 
 async function startDevServer(serverOptions) {
-  const { SERVER_PORT, CLIENT_PORT, sessionToken, envVars, abort } =
-    serverOptions;
+  const {
+    SERVER_PORT,
+    CLIENT_PORT,
+    sessionToken,
+    envVars,
+    abort,
+    transport,
+    serverUrl,
+  } = serverOptions;
   const serverCommand = "npx";
   const serverArgs = ["tsx", "watch", "--clear-screen=false", "src/index.ts"];
   const isWindows = process.platform === "win32";
@@ -42,6 +49,8 @@ async function startDevServer(serverOptions) {
       CLIENT_PORT,
       MCP_PROXY_AUTH_TOKEN: sessionToken,
       MCP_ENV_VARS: JSON.stringify(envVars),
+      ...(transport ? { MCP_TRANSPORT: transport } : {}),
+      ...(serverUrl ? { MCP_SERVER_URL: serverUrl } : {}),
     },
     signal: abort.signal,
     echoOutput: true,
@@ -78,6 +87,8 @@ async function startProdServer(serverOptions) {
     abort,
     command,
     mcpServerArgs,
+    transport,
+    serverUrl,
   } = serverOptions;
   const inspectorServerPath = resolve(
     __dirname,
@@ -91,10 +102,12 @@ async function startProdServer(serverOptions) {
     "node",
     [
       inspectorServerPath,
-      ...(command ? [`--command`, command] : []),
+      ...(command ? [`--command=${command}`] : []),
       ...(mcpServerArgs && mcpServerArgs.length > 0
-        ? [`--args`, mcpServerArgs.join(" ")]
+        ? [`--args=${mcpServerArgs.join(" ")}`]
         : []),
+      ...(transport ? [`--transport=${transport}`] : []),
+      ...(serverUrl ? [`--server-url=${serverUrl}`] : []),
     ],
     {
       env: {
@@ -208,6 +221,8 @@ async function main() {
   let command = null;
   let parsingFlags = true;
   let isDev = false;
+  let transport = null;
+  let serverUrl = null;
 
   for (let i = 0; i < args.length; i++) {
     const arg = args[i];
@@ -222,6 +237,16 @@ async function main() {
       continue;
     }
 
+    if (parsingFlags && arg === "--transport" && i + 1 < args.length) {
+      transport = args[++i];
+      continue;
+    }
+
+    if (parsingFlags && arg === "--server-url" && i + 1 < args.length) {
+      serverUrl = args[++i];
+      continue;
+    }
+
     if (parsingFlags && arg === "-e" && i + 1 < args.length) {
       const envVar = args[++i];
       const equalsIndex = envVar.indexOf("=");
@@ -273,6 +298,8 @@ async function main() {
       abort,
       command,
       mcpServerArgs,
+      transport,
+      serverUrl,
     };
 
     const result = isDev

package/client/dist/assets/{OAuthCallback-CC1cu0Zx.js → OAuthCallback-DCwiUoWl.js}

@@ -1,4 +1,4 @@
-import { u as useToast, r as reactExports, j as jsxRuntimeExports, S as SESSION_KEYS, I as InspectorOAuthClientProvider, a as auth } from "./index-DLtnCiTW.js";
+import { u as useToast, r as reactExports, j as jsxRuntimeExports, S as SESSION_KEYS, I as InspectorOAuthClientProvider, a as auth } from "./index-CHDvjhl9.js";
 import { p as parseOAuthCallbackParams, g as generateOAuthErrorDescription } from "./oauthUtils-DTcoXpSP.js";
 const OAuthCallback = ({ onConnect }) => {
   const { toast } = useToast();

package/client/dist/assets/{OAuthDebugCallback-_4BLxVDe.js → OAuthDebugCallback-BNuktUej.js}

@@ -1,4 +1,4 @@
-import { r as reactExports, S as SESSION_KEYS, j as jsxRuntimeExports } from "./index-DLtnCiTW.js";
+import { r as reactExports, S as SESSION_KEYS, j as jsxRuntimeExports } from "./index-CHDvjhl9.js";
 import { p as parseOAuthCallbackParams, g as generateOAuthErrorDescription } from "./oauthUtils-DTcoXpSP.js";
 const OAuthDebugCallback = ({ onConnect }) => {
   reactExports.useEffect(() => {

package/client/dist/assets/{index-BtsSr_hT.css → index-BWZfLo5E.css}

@@ -56,8 +56,6 @@ pre[class*="language-"] {
 	-moz-tab-size: 4;
 	-o-tab-size: 4;
 	tab-size: 4;
-
-	-webkit-hyphens: none;
 	hyphens: none;
 }
 
@@ -1631,9 +1629,7 @@ video {
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
 .transition {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
   transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }

package/client/dist/assets/{index-DLtnCiTW.js → index-CHDvjhl9.js}

@@ -1,4 +1,4 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/OAuthCallback-CC1cu0Zx.js","assets/oauthUtils-DTcoXpSP.js","assets/OAuthDebugCallback-_4BLxVDe.js"])))=>i.map(i=>d[i]);
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/OAuthCallback-DCwiUoWl.js","assets/oauthUtils-DTcoXpSP.js","assets/OAuthDebugCallback-BNuktUej.js"])))=>i.map(i=>d[i]);
 function _mergeNamespaces(n, m2) {
   for (var i = 0; i < m2.length; i++) {
     const e = m2[i];
@@ -16403,10 +16403,10 @@ class DebugInspectorOAuthClientProvider extends InspectorOAuthClientProvider {
     );
   }
 }
-let crypto;
-crypto = globalThis.crypto;
+let crypto$1;
+crypto$1 = globalThis.crypto;
 async function getRandomValues(size2) {
-  return (await crypto).getRandomValues(new Uint8Array(size2));
+  return (await crypto$1).getRandomValues(new Uint8Array(size2));
 }
 async function random(size2) {
   const mask = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789-._~";
@@ -16422,7 +16422,7 @@ async function generateVerifier(length) {
   return await random(length);
 }
 async function generateChallenge(code_verifier) {
-  const buffer = await (await crypto).subtle.digest("SHA-256", new TextEncoder().encode(code_verifier));
+  const buffer = await (await crypto$1).subtle.digest("SHA-256", new TextEncoder().encode(code_verifier));
   return btoa(String.fromCharCode(...new Uint8Array(buffer))).replace(/\//g, "_").replace(/\+/g, "-").replace(/=/g, "");
 }
 async function pkceChallenge(length) {
@@ -16866,7 +16866,7 @@ async function discoverAuthorizationServerMetadata(authorizationServerUrl, { fet
   for (const { url: endpointUrl, type: type2 } of urlsToTry) {
     const response = await fetchWithCorsRetry(endpointUrl, headers, fetchFn);
     if (!response) {
-      throw new Error(`CORS error trying to load ${type2 === "oauth" ? "OAuth" : "OpenID provider"} metadata from ${endpointUrl}`);
+      continue;
     }
     if (!response.ok) {
       if (response.status >= 400 && response.status < 500) {
@@ -17095,6 +17095,12 @@ const oauthTransitions = {
       if (metadata.scopes_supported) {
         scope = metadata.scopes_supported.join(" ");
       }
+      const array = new Uint8Array(32);
+      crypto.getRandomValues(array);
+      const state = Array.from(
+        array,
+        (byte) => byte.toString(16).padStart(2, "0")
+      ).join("");
       const { authorizationUrl, codeVerifier } = await startAuthorization(
         context.serverUrl,
         {
@@ -17102,6 +17108,7 @@ const oauthTransitions = {
           clientInformation,
           redirectUrl: context.provider.redirectUrl,
           scope,
+          state,
           resource: context.state.resource ?? void 0
         }
       );
@@ -23404,10 +23411,11 @@ class Protocol {
     Promise.resolve().then(() => handler(notification)).catch((error) => this._onerror(new Error(`Uncaught error in notification handler: ${error}`)));
   }
   _onrequest(request, extra) {
-    var _a, _b, _c, _d;
+    var _a, _b;
     const handler = (_a = this._requestHandlers.get(request.method)) !== null && _a !== void 0 ? _a : this.fallbackRequestHandler;
+    const capturedTransport = this._transport;
     if (handler === void 0) {
-      (_b = this._transport) === null || _b === void 0 ? void 0 : _b.send({
+      capturedTransport === null || capturedTransport === void 0 ? void 0 : capturedTransport.send({
         jsonrpc: "2.0",
         id: request.id,
         error: {
@@ -23421,8 +23429,8 @@ class Protocol {
     this._requestHandlerAbortControllers.set(request.id, abortController);
     const fullExtra = {
       signal: abortController.signal,
-      sessionId: (_c = this._transport) === null || _c === void 0 ? void 0 : _c.sessionId,
-      _meta: (_d = request.params) === null || _d === void 0 ? void 0 : _d._meta,
+      sessionId: capturedTransport === null || capturedTransport === void 0 ? void 0 : capturedTransport.sessionId,
+      _meta: (_b = request.params) === null || _b === void 0 ? void 0 : _b._meta,
       sendNotification: (notification) => this.notification(notification, { relatedRequestId: request.id }),
       sendRequest: (r2, resultSchema, options) => this.request(r2, resultSchema, { ...options, relatedRequestId: request.id }),
       authInfo: extra === null || extra === void 0 ? void 0 : extra.authInfo,
@@ -23430,26 +23438,25 @@ class Protocol {
       requestInfo: extra === null || extra === void 0 ? void 0 : extra.requestInfo
     };
     Promise.resolve().then(() => handler(request, fullExtra)).then((result) => {
-      var _a2;
       if (abortController.signal.aborted) {
         return;
       }
-      return (_a2 = this._transport) === null || _a2 === void 0 ? void 0 : _a2.send({
+      return capturedTransport === null || capturedTransport === void 0 ? void 0 : capturedTransport.send({
         result,
         jsonrpc: "2.0",
         id: request.id
       });
     }, (error) => {
-      var _a2, _b2;
+      var _a2;
       if (abortController.signal.aborted) {
         return;
       }
-      return (_a2 = this._transport) === null || _a2 === void 0 ? void 0 : _a2.send({
+      return capturedTransport === null || capturedTransport === void 0 ? void 0 : capturedTransport.send({
         jsonrpc: "2.0",
         id: request.id,
         error: {
           code: Number.isSafeInteger(error["code"]) ? error["code"] : ErrorCode.InternalError,
-          message: (_b2 = error.message) !== null && _b2 !== void 0 ? _b2 : "Internal error"
+          message: (_a2 = error.message) !== null && _a2 !== void 0 ? _a2 : "Internal error"
         }
       });
     }).catch((error) => this._onerror(new Error(`Failed to send response: ${error}`))).finally(() => {
@@ -24779,7 +24786,7 @@ const StdErrNotificationSchema = NotificationSchema.extend({
 ClientNotificationSchema.or(
   StdErrNotificationSchema
 ).or(ServerNotificationSchema).or(NotificationSchema);
-const version$1 = "0.16.2";
+const version$1 = "0.16.3";
 const packageJson = {
   version: version$1
 };
@@ -24914,7 +24921,8 @@ function useConnection({
   onStdErrNotification,
   onPendingRequest,
   onElicitationRequest,
-  getRoots
+  getRoots,
+  defaultLoggingLevel
 }) {
   const [connectionStatus, setConnectionStatus] = reactExports.useState("disconnected");
   const { toast: toast2 } = useToast();
@@ -24992,7 +25000,7 @@ function useConnection({
       throw e;
     }
   };
-  const handleCompletion = async (ref2, argName, value, signal) => {
+  const handleCompletion = async (ref2, argName, value, context, signal) => {
     if (!mcpClient || !completionsSupported) {
       return [];
     }
@@ -25006,6 +25014,11 @@ function useConnection({
         ref: ref2
       }
     };
+    if (context) {
+      request["params"]["context"] = {
+        arguments: context
+      };
+    }
     try {
       const response = await makeRequest(request, CompleteResultSchema, {
         signal,
@@ -25268,6 +25281,9 @@ function useConnection({
           return { roots: getRoots() };
         });
       }
+      if ((capabilities == null ? void 0 : capabilities.logging) && defaultLoggingLevel) {
+        await client2.setLoggingLevel(defaultLoggingLevel);
+      }
       if (onElicitationRequest) {
         client2.setRequestHandler(ElicitRequestSchema, async (request) => {
           return new Promise((resolve) => {
@@ -29552,7 +29568,7 @@ const flip$2 = function(options) {
           const ignoreCrossAxisOverflow = checkCrossAxis === "alignment" ? initialSideAxis !== getSideAxis(nextPlacement) : false;
           if (!ignoreCrossAxisOverflow || // We leave the current main axis only if every placement on that axis
           // overflows the main axis.
-          overflowsData.every((d) => d.overflows[0] > 0 && getSideAxis(d.placement) === initialSideAxis)) {
+          overflowsData.every((d) => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) {
             return {
               data: {
                 index: nextIndex,
@@ -31767,7 +31783,7 @@ function useCompletionState(handleCompletion, completionsSupported = true, debou
   }, [cleanup]);
   const requestCompletions = reactExports.useMemo(() => {
     return debounce(
-      async (ref2, argName, value) => {
+      async (ref2, argName, value, context) => {
         if (!completionsSupported) {
           return;
         }
@@ -31779,10 +31795,14 @@ function useCompletionState(handleCompletion, completionsSupported = true, debou
           loading: { ...prev.loading, [argName]: true }
         }));
         try {
+          if (context !== void 0) {
+            delete context[argName];
+          }
           const values = await handleCompletion(
             ref2,
             argName,
             value,
+            context,
             abortController.signal
           );
           if (!abortController.signal.aborted) {
@@ -31793,6 +31813,7 @@ function useCompletionState(handleCompletion, completionsSupported = true, debou
             }));
           }
         } catch {
+          console.error("completion failed");
           if (!abortController.signal.aborted) {
             setState((prev) => ({
               ...prev,
@@ -31848,7 +31869,8 @@ const PromptsTab = ({
           name: selectedPrompt.name
         },
         argName,
-        value
+        value,
+        promptArgs
       );
     }
   };
@@ -32174,7 +32196,8 @@ const ResourcesTab = ({
           uri: selectedTemplate.uriTemplate
         },
         key,
-        value
+        value,
+        templateValues
       );
     }
   };
@@ -36263,7 +36286,7 @@ const useTheme = () => {
     [theme, setThemeWithSideEffect]
   );
 };
-const version = "0.16.2";
+const version = "0.16.3";
 var [createTooltipContext, createTooltipScope] = createContextScope("Tooltip", [
   createPopperScope
 ]);
@@ -37917,6 +37940,10 @@ const ToolResults = ({
           )
         ] })
       ] }),
+      structuredResult._meta && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mb-4", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("h5", { className: "font-semibold mb-2 text-sm", children: "Meta:" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "bg-gray-50 dark:bg-gray-900 p-3 rounded-lg", children: /* @__PURE__ */ jsxRuntimeExports.jsx(JsonView, { data: structuredResult._meta }) })
+      ] }),
       !structuredResult.structuredContent && validationResult && !validationResult.isValid && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-red-100 dark:bg-red-900 text-red-800 dark:text-red-200 p-2 rounded text-sm", children: [
         "✗ Validation Error: ",
         validationResult.error
@@ -37980,6 +38007,7 @@ const ToolResults = ({
   }
   return null;
 };
+const hasMeta = (tool) => typeof tool._meta !== "undefined";
 const ToolsTab = ({
   tools,
   listTools,
@@ -37995,6 +38023,7 @@ const ToolsTab = ({
   const [params, setParams] = reactExports.useState({});
   const [isToolRunning, setIsToolRunning] = reactExports.useState(false);
   const [isOutputSchemaExpanded, setIsOutputSchemaExpanded] = reactExports.useState(false);
+  const [isMetaExpanded, setIsMetaExpanded] = reactExports.useState(false);
   reactExports.useEffect(() => {
     const params2 = Object.entries(
       (selectedTool == null ? void 0 : selectedTool.inputSchema.properties) ?? []
@@ -38166,6 +38195,34 @@ const ToolsTab = ({
             }
           )
         ] }),
+        selectedTool && hasMeta(selectedTool) && selectedTool._meta && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-gray-50 dark:bg-gray-900 p-3 rounded-lg", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between mb-2", children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("h4", { className: "text-sm font-semibold", children: "Meta:" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Button,
+              {
+                size: "sm",
+                variant: "ghost",
+                onClick: () => setIsMetaExpanded(!isMetaExpanded),
+                className: "h-6 px-2",
+                children: isMetaExpanded ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronUp, { className: "h-3 w-3 mr-1" }),
+                  "Collapse"
+                ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: "h-3 w-3 mr-1" }),
+                  "Expand"
+                ] })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "div",
+            {
+              className: `transition-all ${isMetaExpanded ? "" : "max-h-[8rem] overflow-y-auto"}`,
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx(JsonView, { data: selectedTool._meta })
+            }
+          )
+        ] }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           Button,
           {
@@ -38471,7 +38528,8 @@ const App = () => {
       setActiveTab("elicitations");
       window.location.hash = "elicitations";
     },
-    getRoots: () => rootsRef.current
+    getRoots: () => rootsRef.current,
+    defaultLoggingLevel: logLevel
   });
   reactExports.useEffect(() => {
     if (serverCapabilities) {
@@ -38624,6 +38682,14 @@ const App = () => {
       if (data2.defaultArgs) {
         setArgs(data2.defaultArgs);
       }
+      if (data2.defaultTransport) {
+        setTransportType(
+          data2.defaultTransport
+        );
+      }
+      if (data2.defaultServerUrl) {
+        setSseUrl(data2.defaultServerUrl);
+      }
     }).catch(
       (error) => console.error("Error fetching default environment:", error)
     );
@@ -38632,10 +38698,17 @@ const App = () => {
     rootsRef.current = roots;
   }, [roots]);
   reactExports.useEffect(() => {
-    if (!window.location.hash) {
-      window.location.hash = "resources";
+    if (mcpClient && !window.location.hash) {
+      const defaultTab = (serverCapabilities == null ? void 0 : serverCapabilities.resources) ? "resources" : (serverCapabilities == null ? void 0 : serverCapabilities.prompts) ? "prompts" : (serverCapabilities == null ? void 0 : serverCapabilities.tools) ? "tools" : "ping";
+      window.location.hash = defaultTab;
+    } else if (!mcpClient && window.location.hash) {
+      window.history.replaceState(
+        null,
+        "",
+        window.location.pathname + window.location.search
+      );
     }
-  }, []);
+  }, [mcpClient, serverCapabilities]);
   reactExports.useEffect(() => {
     const handleHashChange = () => {
       const hash = window.location.hash.slice(1);
@@ -38879,13 +38952,13 @@ const App = () => {
   ) });
   if (window.location.pathname === "/oauth/callback") {
     const OAuthCallback = React.lazy(
-      () => __vitePreload(() => import("./OAuthCallback-CC1cu0Zx.js"), true ? __vite__mapDeps([0,1]) : void 0)
+      () => __vitePreload(() => import("./OAuthCallback-DCwiUoWl.js"), true ? __vite__mapDeps([0,1]) : void 0)
     );
     return /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "Loading..." }), children: /* @__PURE__ */ jsxRuntimeExports.jsx(OAuthCallback, { onConnect: onOAuthConnect }) });
   }
   if (window.location.pathname === "/oauth/callback/debug") {
     const OAuthDebugCallback = React.lazy(
-      () => __vitePreload(() => import("./OAuthDebugCallback-_4BLxVDe.js"), true ? __vite__mapDeps([2,1]) : void 0)
+      () => __vitePreload(() => import("./OAuthDebugCallback-BNuktUej.js"), true ? __vite__mapDeps([2,1]) : void 0)
     );
     return /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "Loading..." }), children: /* @__PURE__ */ jsxRuntimeExports.jsx(OAuthDebugCallback, { onConnect: onOAuthDebugConnect }) });
   }

package/client/dist/index.html

@@ -5,8 +5,8 @@
     <link rel="icon" type="image/svg+xml" href="/mcp.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>MCP Inspector</title>
-    <script type="module" crossorigin src="/assets/index-DLtnCiTW.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-BtsSr_hT.css">
+    <script type="module" crossorigin src="/assets/index-CHDvjhl9.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-BWZfLo5E.css">
   </head>
   <body>
     <div id="root" class="w-full"></div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@modelcontextprotocol/inspector",
-  "version": "0.16.2",
+  "version": "0.16.3",
   "description": "Model Context Protocol inspector",
   "license": "MIT",
   "author": "Anthropic, PBC (https://anthropic.com)",
@@ -47,24 +47,24 @@
     "check-version": "node scripts/check-version-consistency.js"
   },
   "dependencies": {
-    "@modelcontextprotocol/inspector-cli": "^0.16.2",
-    "@modelcontextprotocol/inspector-client": "^0.16.2",
-    "@modelcontextprotocol/inspector-server": "^0.16.2",
+    "@modelcontextprotocol/inspector-cli": "^0.16.3",
+    "@modelcontextprotocol/inspector-client": "^0.16.3",
+    "@modelcontextprotocol/inspector-server": "^0.16.3",
     "@modelcontextprotocol/sdk": "^1.17.0",
-    "concurrently": "^9.0.1",
-    "open": "^10.1.0",
-    "shell-quote": "^1.8.2",
+    "concurrently": "^9.2.0",
+    "open": "^10.2.0",
+    "shell-quote": "^1.8.3",
     "spawn-rx": "^5.1.2",
     "ts-node": "^10.9.2",
-    "zod": "^3.23.8"
+    "zod": "^3.25.76"
   },
   "devDependencies": {
-    "@playwright/test": "^1.52.0",
+    "@playwright/test": "^1.54.1",
     "@types/jest": "^29.5.14",
-    "@types/node": "^22.7.5",
+    "@types/node": "^22.17.0",
     "@types/shell-quote": "^1.7.5",
     "jest-fixed-jsdom": "^0.0.9",
-    "prettier": "3.3.3",
+    "prettier": "^3.6.2",
     "rimraf": "^6.0.1",
     "typescript": "^5.4.2"
   },

package/server/build/index.js

@@ -28,6 +28,8 @@ const { values } = parseArgs({
         env: { type: "string", default: "" },
         args: { type: "string", default: "" },
         command: { type: "string", default: "" },
+        transport: { type: "string", default: "" },
+        "server-url": { type: "string", default: "" },
     },
 });
 // Function to get HTTP headers.
@@ -399,6 +401,8 @@ app.get("/config", originValidationMiddleware, authMiddleware, (req, res) => {
             defaultEnvironment,
             defaultCommand: values.command,
             defaultArgs: values.args,
+            defaultTransport: values.transport,
+            defaultServerUrl: values["server-url"],
         });
     }
     catch (error) {