@mcp-b/react-components 0.14.2 → 0.16.1

package/dist/utils/mcp-server-catalog.d.ts

@@ -1,7 +1,6 @@
-import { MCPServer } from "agents";
+import { MCPServer, MCPServersState } from "agents";
 
 //#region src/utils/mcp-server-catalog.d.ts
-type McpServerPickerStatus = MCPServer["state"] | "needs-auth";
 interface McpServerCardIcon {
   src: string;
 }
@@ -9,7 +8,7 @@ interface McpServerSetupLink {
   label: string;
   url: string;
 }
-type McpServerSetupAuthFieldName = "bearerToken" | "clientId" | "clientSecret" | "redirectUrl" | "scope";
+type McpServerSetupAuthFieldName = "bearerToken" | "clientId" | "clientSecret" | "redirectUrl";
 interface McpServerSetupAuthField {
   name: McpServerSetupAuthFieldName;
   label: string;
@@ -28,16 +27,41 @@ interface McpServerManualSetup {
   links: readonly McpServerSetupLink[];
 }
 interface McpServerCard {
+  /**
+   * Stable MCP registration ID owned by the host.
+   *
+   * Pass the normalized ID to Agents in the options argument to
+   * `addMcpServer(name, url, { id })`. Hosts that omit a stable ID must use this
+   * value as the upstream registration name so the generated entry can still
+   * be matched without guessing by URL alone.
+   */
   id: string;
   name: string;
   url: string;
   description?: string;
   category?: string;
   icon?: string | McpServerCardIcon;
-  status?: McpServerPickerStatus;
-  statusLabel?: string;
   manualSetup?: McpServerManualSetup;
 }
+/**
+ * Read the complete state emitted by the pinned Agents runtime.
+ *
+ * Agents 0.17.4 can return `not-connected` from `getMcpServers()` even though
+ * that value is missing from its exported `MCPServer["state"]` declaration.
+ * Keep the unavoidable compatibility assertion at this one SDK boundary.
+ */
+declare function getMcpServerRuntimeState(server: MCPServer): MCPServer["state"] | "not-connected";
+/**
+ * Match a host-owned stable registration identity to an upstream Agents entry.
+ *
+ * `normalizeServerId` deliberately stays in the host. Importing it from the
+ * optional `agents` runtime also loads Worker-only `cloudflare:` modules (and
+ * the `agents/mcp/client` subpath loads the full MCP client). This browser UI
+ * therefore compares the already-normalized ID supplied by the host, then uses
+ * Agents' registration `(name, canonical URL)` identity only to recognize a
+ * legacy/generated ID.
+ */
+declare function getMcpServerEntry(server: McpServerCard, mcp: MCPServersState | undefined): [serverId: string, server: MCPServer] | undefined;
 declare const MCP_SERVER_SETUP_AUTH: {
   readonly bearer: {
     readonly type: "bearer";
@@ -63,10 +87,6 @@ declare const MCP_SERVER_SETUP_AUTH: {
       readonly label: "Redirect URL";
       readonly inputType: "url";
       readonly placeholder: "Registered OAuth callback URL";
-    }, {
-      readonly name: "scope";
-      readonly label: "Scope";
-      readonly placeholder: "Space-separated scopes";
     }];
   };
   readonly manualOAuthClientSecret: {
@@ -88,10 +108,6 @@ declare const MCP_SERVER_SETUP_AUTH: {
       readonly label: "Redirect URL";
       readonly inputType: "url";
       readonly placeholder: "Registered OAuth callback URL";
-    }, {
-      readonly name: "scope";
-      readonly label: "Scope";
-      readonly placeholder: "Space-separated scopes";
     }];
   };
   readonly none: {
@@ -101,7 +117,7 @@ declare const MCP_SERVER_SETUP_AUTH: {
   };
 };
 declare const CUSTOM_MCP_SERVER_CARD: {
-  readonly id: "localMcp";
+  readonly id: "localmcp";
   readonly name: "Custom MCP";
   readonly url: "";
   readonly description: "Connect any Streamable HTTP MCP server";
@@ -377,10 +393,6 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
     readonly description: "Create an Asana MCP app, configure its redirect URL and workspace distribution, then connect with the app client ID and secret.";
@@ -405,24 +417,26 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
   readonly manualSetup: {
     readonly auth: {
       readonly type: "manual_oauth_client";
-      readonly label: "OAuth client ID";
+      readonly label: "OAuth client ID + secret";
       readonly fields: readonly [{
         readonly name: "clientId";
         readonly label: "OAuth client ID";
         readonly placeholder: "Client ID";
         readonly required: true;
+      }, {
+        readonly name: "clientSecret";
+        readonly label: "OAuth client secret";
+        readonly inputType: "password";
+        readonly placeholder: "Client secret";
+        readonly required: true;
       }, {
         readonly name: "redirectUrl";
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
-    readonly description: "Enable Gmail and Gmail MCP APIs, configure OAuth consent, add Gmail read/compose scopes, and create a web OAuth client.";
+    readonly description: "Enable Gmail and Gmail MCP APIs, configure OAuth consent, and create a web OAuth client.";
     readonly links: readonly [{
       readonly label: "Setup guide";
       readonly url: "https://developers.google.com/workspace/gmail/api/guides/configure-mcp-server";
@@ -447,24 +461,26 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
   readonly manualSetup: {
     readonly auth: {
       readonly type: "manual_oauth_client";
-      readonly label: "OAuth client ID";
+      readonly label: "OAuth client ID + secret";
       readonly fields: readonly [{
         readonly name: "clientId";
         readonly label: "OAuth client ID";
         readonly placeholder: "Client ID";
         readonly required: true;
+      }, {
+        readonly name: "clientSecret";
+        readonly label: "OAuth client secret";
+        readonly inputType: "password";
+        readonly placeholder: "Client secret";
+        readonly required: true;
       }, {
         readonly name: "redirectUrl";
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
-    readonly description: "Enable Calendar and Calendar MCP APIs, configure OAuth consent, add calendar read/freebusy scopes, and create a web OAuth client.";
+    readonly description: "Enable Calendar and Calendar MCP APIs, configure OAuth consent, and create a web OAuth client.";
     readonly links: readonly [{
       readonly label: "Setup guide";
       readonly url: "https://developers.google.com/workspace/calendar/api/guides/configure-mcp-server";
@@ -489,24 +505,26 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
   readonly manualSetup: {
     readonly auth: {
       readonly type: "manual_oauth_client";
-      readonly label: "OAuth client ID";
+      readonly label: "OAuth client ID + secret";
       readonly fields: readonly [{
         readonly name: "clientId";
         readonly label: "OAuth client ID";
         readonly placeholder: "Client ID";
         readonly required: true;
+      }, {
+        readonly name: "clientSecret";
+        readonly label: "OAuth client secret";
+        readonly inputType: "password";
+        readonly placeholder: "Client secret";
+        readonly required: true;
       }, {
         readonly name: "redirectUrl";
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
-    readonly description: "Enable Chat and Chat MCP APIs, configure a Chat app, add Chat read/send scopes, and create a web OAuth client.";
+    readonly description: "Enable Chat and Chat MCP APIs, configure a Chat app, and create a web OAuth client.";
     readonly links: readonly [{
       readonly label: "Setup guide";
       readonly url: "https://developers.google.com/workspace/chat/api/guides/configure-mcp-server";
@@ -531,24 +549,26 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
   readonly manualSetup: {
     readonly auth: {
       readonly type: "manual_oauth_client";
-      readonly label: "OAuth client ID";
+      readonly label: "OAuth client ID + secret";
       readonly fields: readonly [{
         readonly name: "clientId";
         readonly label: "OAuth client ID";
         readonly placeholder: "Client ID";
         readonly required: true;
+      }, {
+        readonly name: "clientSecret";
+        readonly label: "OAuth client secret";
+        readonly inputType: "password";
+        readonly placeholder: "Client secret";
+        readonly required: true;
       }, {
         readonly name: "redirectUrl";
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
-    readonly description: "Enable Drive and Drive MCP APIs, configure OAuth consent, add Drive read/file scopes, and create a web OAuth client.";
+    readonly description: "Enable Drive and Drive MCP APIs, configure OAuth consent, and create a web OAuth client.";
     readonly links: readonly [{
       readonly label: "Setup guide";
       readonly url: "https://developers.google.com/workspace/drive/api/guides/configure-mcp-server";
@@ -573,24 +593,26 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
   readonly manualSetup: {
     readonly auth: {
       readonly type: "manual_oauth_client";
-      readonly label: "OAuth client ID";
+      readonly label: "OAuth client ID + secret";
       readonly fields: readonly [{
         readonly name: "clientId";
         readonly label: "OAuth client ID";
         readonly placeholder: "Client ID";
         readonly required: true;
+      }, {
+        readonly name: "clientSecret";
+        readonly label: "OAuth client secret";
+        readonly inputType: "password";
+        readonly placeholder: "Client secret";
+        readonly required: true;
       }, {
         readonly name: "redirectUrl";
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
-    readonly description: "Enable People API, configure OAuth consent, add contacts/profile/directory scopes, and create a web OAuth client.";
+    readonly description: "Enable People API, configure OAuth consent, and create a web OAuth client.";
     readonly links: readonly [{
       readonly label: "Setup guide";
       readonly url: "https://developers.google.com/people/v1/configure-mcp-server";
@@ -615,24 +637,26 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
   readonly manualSetup: {
     readonly auth: {
       readonly type: "manual_oauth_client";
-      readonly label: "OAuth client ID";
+      readonly label: "OAuth client ID + secret";
       readonly fields: readonly [{
         readonly name: "clientId";
         readonly label: "OAuth client ID";
         readonly placeholder: "Client ID";
         readonly required: true;
+      }, {
+        readonly name: "clientSecret";
+        readonly label: "OAuth client secret";
+        readonly inputType: "password";
+        readonly placeholder: "Client secret";
+        readonly required: true;
       }, {
         readonly name: "redirectUrl";
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
-    readonly description: "Enable the Workspace MCP service plus Gmail, Drive, Calendar, and Chat APIs, then configure OAuth consent and readonly search scopes.";
+    readonly description: "Enable the Workspace MCP service plus Gmail, Drive, Calendar, and Chat APIs, then configure OAuth consent and create a web OAuth client.";
     readonly links: readonly [{
       readonly label: "Setup guide";
       readonly url: "https://developers.google.com/workspace/guides/universal-search-mcp";
@@ -730,10 +754,6 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
     readonly description: "Create a HubSpot MCP Auth App, configure the redirect URL, and connect with OAuth credentials from a PKCE-capable client.";
@@ -766,10 +786,6 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
     readonly description: "Provision the preview tenant resource, register the client, grant delegated MCP permissions, and connect with Microsoft Entra OAuth.";
@@ -821,13 +837,9 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
-    readonly description: "Create a Salesforce External Client App with mcp_api and refresh_token scopes, require PKCE, activate the hosted server, and connect with the consumer key.";
+    readonly description: "Create a Salesforce External Client App, require PKCE, activate the hosted server, and connect with the consumer key.";
     readonly links: readonly [{
       readonly label: "Client connection";
       readonly url: "https://developer.salesforce.com/docs/platform/hosted-mcp-servers/guide/client-connection-overview.html";
@@ -866,13 +878,9 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
-    readonly description: "Create or reuse a Slack app, enable MCP access, add user scopes and redirect URLs, then connect with the app client ID and secret.";
+    readonly description: "Create or reuse a Slack app, enable MCP access, configure redirect URLs, then connect with the app client ID and secret.";
     readonly links: readonly [{
       readonly label: "Slack apps";
       readonly url: "https://api.slack.com/apps";
@@ -911,13 +919,9 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
         readonly label: "Redirect URL";
         readonly inputType: "url";
         readonly placeholder: "Registered OAuth callback URL";
-      }, {
-        readonly name: "scope";
-        readonly label: "Scope";
-        readonly placeholder: "Space-separated scopes";
       }];
     };
-    readonly description: "Create a Zoom Marketplace General app, add the MCP product scopes, configure the client redirect URL, and connect with OAuth credentials.";
+    readonly description: "Create a Zoom Marketplace General app, enable the MCP product, configure the client redirect URL, and connect with OAuth credentials.";
     readonly links: readonly [{
       readonly label: "Setup guide";
       readonly url: "https://developers.zoom.us/docs/mcp/servers/connect-to-zoom-mcp-servers/";
@@ -932,4 +936,4 @@ declare const MANUAL_MCP_SERVER_CARDS: readonly [{
 }];
 declare const DEFAULT_MCP_SERVER_CARDS: readonly McpServerCard[];
 //#endregion
-export { CUSTOM_MCP_SERVER_CARD, DCR_MCP_SERVER_CARDS, DEFAULT_MCP_SERVER_CARDS, MANUAL_MCP_SERVER_CARDS, MCP_SERVER_SETUP_AUTH, McpServerCard, McpServerCardIcon, McpServerManualSetup, McpServerPickerStatus, McpServerSetupAuth, McpServerSetupAuthField, McpServerSetupAuthFieldName, McpServerSetupLink, getMcpServerIconSrc, inferMcpServerFaviconUrl };
+export { CUSTOM_MCP_SERVER_CARD, DCR_MCP_SERVER_CARDS, DEFAULT_MCP_SERVER_CARDS, MANUAL_MCP_SERVER_CARDS, MCP_SERVER_SETUP_AUTH, McpServerCard, McpServerCardIcon, McpServerManualSetup, McpServerSetupAuth, McpServerSetupAuthField, McpServerSetupAuthFieldName, McpServerSetupLink, getMcpServerEntry, getMcpServerIconSrc, getMcpServerRuntimeState, inferMcpServerFaviconUrl };

package/dist/utils/mcp-server-catalog.js

@@ -1,4 +1,40 @@
 //#region src/utils/mcp-server-catalog.ts
+/**
+* Read the complete state emitted by the pinned Agents runtime.
+*
+* Agents 0.17.4 can return `not-connected` from `getMcpServers()` even though
+* that value is missing from its exported `MCPServer["state"]` declaration.
+* Keep the unavoidable compatibility assertion at this one SDK boundary.
+*/
+function getMcpServerRuntimeState(server) {
+	return server.state;
+}
+/**
+* Match a host-owned stable registration identity to an upstream Agents entry.
+*
+* `normalizeServerId` deliberately stays in the host. Importing it from the
+* optional `agents` runtime also loads Worker-only `cloudflare:` modules (and
+* the `agents/mcp/client` subpath loads the full MCP client). This browser UI
+* therefore compares the already-normalized ID supplied by the host, then uses
+* Agents' registration `(name, canonical URL)` identity only to recognize a
+* legacy/generated ID.
+*/
+function getMcpServerEntry(server, mcp) {
+	if (!mcp || !server.url) return void 0;
+	const serverUrl = normalizeMcpServerUrl(server.url);
+	if (!serverUrl) return void 0;
+	const entryById = mcp.servers[server.id];
+	if (entryById) return normalizeMcpServerUrl(entryById.server_url) === serverUrl ? [server.id, entryById] : void 0;
+	const entriesByRegistration = Object.entries(mcp.servers).filter(([, entry]) => entry.name === server.id && normalizeMcpServerUrl(entry.server_url) === serverUrl);
+	return entriesByRegistration.length === 1 ? entriesByRegistration[0] : void 0;
+}
+function normalizeMcpServerUrl(url) {
+	try {
+		return new URL(url).href;
+	} catch {
+		return;
+	}
+}
 const DCR_CATEGORY = "Auto";
 const MANUAL_CATEGORY = "Manual";
 const MCP_SERVER_SETUP_AUTH = {
@@ -16,25 +52,17 @@ const MCP_SERVER_SETUP_AUTH = {
 	manualOAuthClient: {
 		type: "manual_oauth_client",
 		label: "OAuth client ID",
-		fields: [
-			{
-				name: "clientId",
-				label: "OAuth client ID",
-				placeholder: "Client ID",
-				required: true
-			},
-			{
-				name: "redirectUrl",
-				label: "Redirect URL",
-				inputType: "url",
-				placeholder: "Registered OAuth callback URL"
-			},
-			{
-				name: "scope",
-				label: "Scope",
-				placeholder: "Space-separated scopes"
-			}
-		]
+		fields: [{
+			name: "clientId",
+			label: "OAuth client ID",
+			placeholder: "Client ID",
+			required: true
+		}, {
+			name: "redirectUrl",
+			label: "Redirect URL",
+			inputType: "url",
+			placeholder: "Registered OAuth callback URL"
+		}]
 	},
 	manualOAuthClientSecret: {
 		type: "manual_oauth_client",
@@ -58,11 +86,6 @@ const MCP_SERVER_SETUP_AUTH = {
 				label: "Redirect URL",
 				inputType: "url",
 				placeholder: "Registered OAuth callback URL"
-			},
-			{
-				name: "scope",
-				label: "Scope",
-				placeholder: "Space-separated scopes"
 			}
 		]
 	},
@@ -73,7 +96,7 @@ const MCP_SERVER_SETUP_AUTH = {
 	}
 };
 const CUSTOM_MCP_SERVER_CARD = {
-	id: "localMcp",
+	id: "localmcp",
 	name: "Custom MCP",
 	url: "",
 	description: "Connect any Streamable HTTP MCP server",
@@ -402,8 +425,8 @@ const MANUAL_MCP_SERVER_CARDS = [
 		category: MANUAL_CATEGORY,
 		icon: "https://cdn.simpleicons.org/gmail/EA4335",
 		manualSetup: {
-			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClient,
-			description: "Enable Gmail and Gmail MCP APIs, configure OAuth consent, add Gmail read/compose scopes, and create a web OAuth client.",
+			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClientSecret,
+			description: "Enable Gmail and Gmail MCP APIs, configure OAuth consent, and create a web OAuth client.",
 			links: [
 				{
 					label: "Setup guide",
@@ -432,8 +455,8 @@ const MANUAL_MCP_SERVER_CARDS = [
 		category: MANUAL_CATEGORY,
 		icon: "https://cdn.simpleicons.org/googlecalendar/4285F4",
 		manualSetup: {
-			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClient,
-			description: "Enable Calendar and Calendar MCP APIs, configure OAuth consent, add calendar read/freebusy scopes, and create a web OAuth client.",
+			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClientSecret,
+			description: "Enable Calendar and Calendar MCP APIs, configure OAuth consent, and create a web OAuth client.",
 			links: [
 				{
 					label: "Setup guide",
@@ -462,8 +485,8 @@ const MANUAL_MCP_SERVER_CARDS = [
 		category: MANUAL_CATEGORY,
 		icon: "https://cdn.simpleicons.org/googlechat/00AC47",
 		manualSetup: {
-			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClient,
-			description: "Enable Chat and Chat MCP APIs, configure a Chat app, add Chat read/send scopes, and create a web OAuth client.",
+			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClientSecret,
+			description: "Enable Chat and Chat MCP APIs, configure a Chat app, and create a web OAuth client.",
 			links: [
 				{
 					label: "Setup guide",
@@ -492,8 +515,8 @@ const MANUAL_MCP_SERVER_CARDS = [
 		category: MANUAL_CATEGORY,
 		icon: "https://cdn.simpleicons.org/googledrive/4285F4",
 		manualSetup: {
-			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClient,
-			description: "Enable Drive and Drive MCP APIs, configure OAuth consent, add Drive read/file scopes, and create a web OAuth client.",
+			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClientSecret,
+			description: "Enable Drive and Drive MCP APIs, configure OAuth consent, and create a web OAuth client.",
 			links: [
 				{
 					label: "Setup guide",
@@ -522,8 +545,8 @@ const MANUAL_MCP_SERVER_CARDS = [
 		category: MANUAL_CATEGORY,
 		icon: "https://cdn.simpleicons.org/google/4285F4",
 		manualSetup: {
-			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClient,
-			description: "Enable People API, configure OAuth consent, add contacts/profile/directory scopes, and create a web OAuth client.",
+			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClientSecret,
+			description: "Enable People API, configure OAuth consent, and create a web OAuth client.",
 			links: [
 				{
 					label: "Setup guide",
@@ -552,8 +575,8 @@ const MANUAL_MCP_SERVER_CARDS = [
 		category: MANUAL_CATEGORY,
 		icon: "https://cdn.simpleicons.org/google/4285F4",
 		manualSetup: {
-			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClient,
-			description: "Enable the Workspace MCP service plus Gmail, Drive, Calendar, and Chat APIs, then configure OAuth consent and readonly search scopes.",
+			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClientSecret,
+			description: "Enable the Workspace MCP service plus Gmail, Drive, Calendar, and Chat APIs, then configure OAuth consent and create a web OAuth client.",
 			links: [
 				{
 					label: "Setup guide",
@@ -675,7 +698,7 @@ const MANUAL_MCP_SERVER_CARDS = [
 		icon: "https://www.salesforce.com/favicon.ico",
 		manualSetup: {
 			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClient,
-			description: "Create a Salesforce External Client App with mcp_api and refresh_token scopes, require PKCE, activate the hosted server, and connect with the consumer key.",
+			description: "Create a Salesforce External Client App, require PKCE, activate the hosted server, and connect with the consumer key.",
 			links: [
 				{
 					label: "Client connection",
@@ -701,7 +724,7 @@ const MANUAL_MCP_SERVER_CARDS = [
 		icon: "https://slack.com/favicon.ico",
 		manualSetup: {
 			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClientSecret,
-			description: "Create or reuse a Slack app, enable MCP access, add user scopes and redirect URLs, then connect with the app client ID and secret.",
+			description: "Create or reuse a Slack app, enable MCP access, configure redirect URLs, then connect with the app client ID and secret.",
 			links: [
 				{
 					label: "Slack apps",
@@ -727,7 +750,7 @@ const MANUAL_MCP_SERVER_CARDS = [
 		icon: "https://cdn.simpleicons.org/zoom/0B5CFF",
 		manualSetup: {
 			auth: MCP_SERVER_SETUP_AUTH.manualOAuthClientSecret,
-			description: "Create a Zoom Marketplace General app, add the MCP product scopes, configure the client redirect URL, and connect with OAuth credentials.",
+			description: "Create a Zoom Marketplace General app, enable the MCP product, configure the client redirect URL, and connect with OAuth credentials.",
 			links: [
 				{
 					label: "Setup guide",
@@ -751,4 +774,4 @@ const DEFAULT_MCP_SERVER_CARDS = [
 	...MANUAL_MCP_SERVER_CARDS
 ];
 //#endregion
-export { CUSTOM_MCP_SERVER_CARD, DCR_MCP_SERVER_CARDS, DEFAULT_MCP_SERVER_CARDS, MANUAL_MCP_SERVER_CARDS, MCP_SERVER_SETUP_AUTH, getMcpServerIconSrc, inferMcpServerFaviconUrl };
+export { CUSTOM_MCP_SERVER_CARD, DCR_MCP_SERVER_CARDS, DEFAULT_MCP_SERVER_CARDS, MANUAL_MCP_SERVER_CARDS, MCP_SERVER_SETUP_AUTH, getMcpServerEntry, getMcpServerIconSrc, getMcpServerRuntimeState, inferMcpServerFaviconUrl };

package/dist/utils/structured-code.d.ts

@@ -1,4 +1,4 @@
-import { A as CodeBlockLanguage } from "../CodeBlock-DUh9WOGo.js";
+import { A as CodeBlockLanguage } from "../CodeBlock-BRajW4QU.js";
 
 //#region src/utils/structured-code.d.ts
 interface StructuredCodeDisplay {

package/dist/utils/theme.d.ts

@@ -0,0 +1,22 @@
+//#region src/utils/theme.d.ts
+declare const THEME_STORAGE_KEY = "mcp-b-theme";
+declare const themePreferences: readonly ["system", "light", "dark"];
+type ThemePreference = (typeof themePreferences)[number];
+type ResolvedTheme = Exclude<ThemePreference, "system">;
+declare function isThemePreference(value: unknown): value is ThemePreference;
+declare function resolveThemePreference(preference: ThemePreference, targetWindow?: Pick<Window, "matchMedia">): ResolvedTheme;
+declare function readThemePreference(storageKey?: string, targetStorage?: Storage): ThemePreference;
+declare function writeThemePreference(preference: ThemePreference, storageKey?: string, targetStorage?: Storage): void;
+/**
+ * Applies an explicit preference without resolving System into an attribute.
+ * Leaving data-theme absent lets CSS respond to operating-system changes by itself.
+ */
+declare function applyThemePreference(preference: ThemePreference, targetDocument?: Document): ResolvedTheme;
+/**
+ * Generates a CSP-compatible inline head script body that restores a saved
+ * preference before styles render. Supply the returned string as text content
+ * of a nonce-bearing script immediately after the color-scheme meta element.
+ */
+declare function getThemeInitializationScript(storageKey?: string): string;
+//#endregion
+export { ResolvedTheme, THEME_STORAGE_KEY, ThemePreference, applyThemePreference, getThemeInitializationScript, isThemePreference, readThemePreference, resolveThemePreference, themePreferences, writeThemePreference };

package/dist/utils/theme.js

@@ -0,0 +1,55 @@
+//#region src/utils/theme.ts
+const THEME_STORAGE_KEY = "mcp-b-theme";
+const themePreferences = [
+	"system",
+	"light",
+	"dark"
+];
+function isThemePreference(value) {
+	return typeof value === "string" && themePreferences.includes(value);
+}
+function resolveThemePreference(preference, targetWindow) {
+	if (preference !== "system") return preference;
+	return (targetWindow ?? (typeof window === "undefined" ? void 0 : window))?.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+function readThemePreference(storageKey = THEME_STORAGE_KEY, targetStorage) {
+	try {
+		const storedPreference = (targetStorage ?? localStorage).getItem(storageKey);
+		return isThemePreference(storedPreference) ? storedPreference : "system";
+	} catch {
+		return "system";
+	}
+}
+function writeThemePreference(preference, storageKey = THEME_STORAGE_KEY, targetStorage) {
+	try {
+		const storage = targetStorage ?? localStorage;
+		if (preference === "system") storage.removeItem(storageKey);
+		else storage.setItem(storageKey, preference);
+	} catch {}
+}
+/**
+* Applies an explicit preference without resolving System into an attribute.
+* Leaving data-theme absent lets CSS respond to operating-system changes by itself.
+*/
+function applyThemePreference(preference, targetDocument = document) {
+	if (preference === "system") delete targetDocument.documentElement.dataset.theme;
+	else targetDocument.documentElement.dataset.theme = preference;
+	let colorSchemeMeta = targetDocument.querySelector("meta[name=\"color-scheme\"]");
+	if (!colorSchemeMeta) {
+		colorSchemeMeta = targetDocument.createElement("meta");
+		colorSchemeMeta.name = "color-scheme";
+		targetDocument.head.prepend(colorSchemeMeta);
+	}
+	colorSchemeMeta.content = preference === "system" ? "light dark" : preference;
+	return resolveThemePreference(preference, targetDocument.defaultView ?? window);
+}
+/**
+* Generates a CSP-compatible inline head script body that restores a saved
+* preference before styles render. Supply the returned string as text content
+* of a nonce-bearing script immediately after the color-scheme meta element.
+*/
+function getThemeInitializationScript(storageKey = THEME_STORAGE_KEY) {
+	return `{try{const k=${JSON.stringify(storageKey).replaceAll("<", "\\u003c")};const v=localStorage.getItem(k);const d=document.documentElement;const m=document.querySelector('meta[name="color-scheme"]');if(v==="light"||v==="dark"){d.dataset.theme=v;if(m)m.content=v}else{delete d.dataset.theme;if(m)m.content="light dark"}}catch{}}`;
+}
+//#endregion
+export { THEME_STORAGE_KEY, applyThemePreference, getThemeInitializationScript, isThemePreference, readThemePreference, resolveThemePreference, themePreferences, writeThemePreference };