mcp-use 1.10.5 → 1.11.0-canary.10

package/dist/{chunk-UD5FSFEZ.js → chunk-NXFHUS7A.js}

@@ -1,13 +1,13 @@
 import {
   BrowserMCPClient
-} from "./chunk-C7WHRUWQ.js";
+} from "./chunk-GUB5GQDD.js";
 import {
   BrowserOAuthClientProvider,
   sanitizeUrl
 } from "./chunk-J75I2C26.js";
 import {
   Tel
-} from "./chunk-IY632ZQS.js";
+} from "./chunk-3GB7G5X7.js";
 import {
   __name
 } from "./chunk-3GQAWCBQ.js";
@@ -101,6 +101,11 @@ function useMcp(options) {
       if (clientRef.current) {
         try {
           const serverName = "inspector-server";
+          const session = clientRef.current.getSession(serverName);
+          if (session && session._healthCheckCleanup) {
+            session._healthCheckCleanup();
+            session._healthCheckCleanup = null;
+          }
           await clientRef.current.closeSession(serverName);
         } catch (err) {
           if (!quiet) addLog("warn", "Error closing session:", err);
@@ -240,9 +245,25 @@ function useMcp(options) {
           serverName,
           false
         );
-        if (onNotification) {
-          session.on("notification", onNotification);
-        }
+        session.on("notification", (notification) => {
+          onNotification?.(notification);
+          if (notification.method === "notifications/tools/list_changed") {
+            addLog("info", "Tools list changed, auto-refreshing...");
+            refreshTools().catch(
+              (err) => addLog("warn", "Auto-refresh tools failed:", err)
+            );
+          } else if (notification.method === "notifications/resources/list_changed") {
+            addLog("info", "Resources list changed, auto-refreshing...");
+            refreshResources().catch(
+              (err) => addLog("warn", "Auto-refresh resources failed:", err)
+            );
+          } else if (notification.method === "notifications/prompts/list_changed") {
+            addLog("info", "Prompts list changed, auto-refreshing...");
+            refreshPrompts().catch(
+              (err) => addLog("warn", "Auto-refresh prompts failed:", err)
+            );
+          }
+        });
         await session.initialize();
         addLog("info", "\u2705 Successfully connected to MCP server");
         addLog("info", "Server info:", session.connector.serverInfo);
@@ -258,6 +279,63 @@ function useMcp(options) {
         );
         setState("ready");
         successfulTransportRef.current = transportTypeParam;
+        const setupConnectionMonitoring = /* @__PURE__ */ __name(() => {
+          let healthCheckInterval = null;
+          let lastSuccessfulCheck = Date.now();
+          const HEALTH_CHECK_INTERVAL = 1e4;
+          const HEALTH_CHECK_TIMEOUT = 3e4;
+          const checkConnectionHealth = /* @__PURE__ */ __name(async () => {
+            if (!isMountedRef.current || stateRef.current !== "ready") {
+              if (healthCheckInterval) {
+                clearInterval(healthCheckInterval);
+                healthCheckInterval = null;
+              }
+              return;
+            }
+            try {
+              await session.connector.listTools();
+              lastSuccessfulCheck = Date.now();
+            } catch (err) {
+              const timeSinceLastSuccess = Date.now() - lastSuccessfulCheck;
+              if (timeSinceLastSuccess > HEALTH_CHECK_TIMEOUT) {
+                addLog(
+                  "warn",
+                  `Connection appears to be broken (no response for ${Math.round(timeSinceLastSuccess / 1e3)}s), attempting to reconnect...`
+                );
+                if (healthCheckInterval) {
+                  clearInterval(healthCheckInterval);
+                  healthCheckInterval = null;
+                }
+                if (autoReconnectRef.current && isMountedRef.current) {
+                  setState("discovering");
+                  addLog("info", "Auto-reconnecting to MCP server...");
+                  setTimeout(
+                    () => {
+                      if (isMountedRef.current && stateRef.current === "discovering") {
+                        connect();
+                      }
+                    },
+                    typeof autoReconnectRef.current === "number" ? autoReconnectRef.current : DEFAULT_RECONNECT_DELAY
+                  );
+                }
+              }
+            }
+          }, "checkConnectionHealth");
+          healthCheckInterval = setInterval(
+            checkConnectionHealth,
+            HEALTH_CHECK_INTERVAL
+          );
+          return () => {
+            if (healthCheckInterval) {
+              clearInterval(healthCheckInterval);
+              healthCheckInterval = null;
+            }
+          };
+        }, "setupConnectionMonitoring");
+        if (autoReconnect) {
+          const cleanup = setupConnectionMonitoring();
+          session._healthCheckCleanup = cleanup;
+        }
         Tel.getInstance().trackUseMcpConnection({
           url,
           transportType: transportTypeParam,
@@ -609,6 +687,70 @@ function useMcp(options) {
       throw err;
     }
   }, [state]);
+  const refreshTools = useCallback(async () => {
+    if (stateRef.current !== "ready" || !clientRef.current) {
+      addLog("debug", "Cannot refresh tools - client not ready");
+      return;
+    }
+    addLog("debug", "Refreshing tools list");
+    try {
+      const serverName = "inspector-server";
+      const session = clientRef.current.getSession(serverName);
+      if (!session) {
+        addLog("warn", "No active session found for tools refresh");
+        return;
+      }
+      const toolsResult = await session.connector.listTools();
+      setTools(toolsResult || []);
+      addLog("info", "Tools list refreshed successfully");
+    } catch (err) {
+      addLog("warn", "Failed to refresh tools:", err);
+    }
+  }, [addLog]);
+  const refreshResources = useCallback(async () => {
+    if (stateRef.current !== "ready" || !clientRef.current) {
+      addLog("debug", "Cannot refresh resources - client not ready");
+      return;
+    }
+    addLog("debug", "Refreshing resources list");
+    try {
+      const serverName = "inspector-server";
+      const session = clientRef.current.getSession(serverName);
+      if (!session) {
+        addLog("warn", "No active session found for resources refresh");
+        return;
+      }
+      const resourcesResult = await session.connector.listAllResources();
+      setResources(resourcesResult.resources || []);
+      addLog("info", "Resources list refreshed successfully");
+    } catch (err) {
+      addLog("warn", "Failed to refresh resources:", err);
+    }
+  }, [addLog]);
+  const refreshPrompts = useCallback(async () => {
+    if (stateRef.current !== "ready" || !clientRef.current) {
+      addLog("debug", "Cannot refresh prompts - client not ready");
+      return;
+    }
+    addLog("debug", "Refreshing prompts list");
+    try {
+      const serverName = "inspector-server";
+      const session = clientRef.current.getSession(serverName);
+      if (!session) {
+        addLog("warn", "No active session found for prompts refresh");
+        return;
+      }
+      const promptsResult = await session.connector.listPrompts();
+      setPrompts(promptsResult.prompts || []);
+      addLog("info", "Prompts list refreshed successfully");
+    } catch (err) {
+      addLog("warn", "Failed to refresh prompts:", err);
+    }
+  }, [addLog]);
+  const refreshAll = useCallback(async () => {
+    addLog("info", "Refreshing all lists (tools, resources, prompts)");
+    await Promise.all([refreshTools(), refreshResources(), refreshPrompts()]);
+  }, [refreshTools, refreshResources, refreshPrompts, addLog]);
   const getPrompt = useCallback(
     async (name, args) => {
       if (stateRef.current !== "ready" || !clientRef.current) {
@@ -760,6 +902,10 @@ function useMcp(options) {
     listResources,
     listPrompts,
     getPrompt,
+    refreshTools,
+    refreshResources,
+    refreshPrompts,
+    refreshAll,
     retry,
     disconnect,
     authenticate,
@@ -907,6 +1053,15 @@ function useWidget(defaultProps) {
   const toolInput = provider === "openai" ? useOpenAiGlobal("toolInput") : urlParams.toolInput;
   const toolOutput = provider === "openai" ? useOpenAiGlobal("toolOutput") : urlParams.toolOutput;
   const toolResponseMetadata = useOpenAiGlobal("toolResponseMetadata");
+  const widgetProps = useMemo(() => {
+    if (toolResponseMetadata && typeof toolResponseMetadata === "object") {
+      const metaProps = toolResponseMetadata["mcp-use/props"];
+      if (metaProps) {
+        return metaProps;
+      }
+    }
+    return defaultProps || {};
+  }, [toolResponseMetadata, defaultProps]);
   const widgetState = useOpenAiGlobal("widgetState");
   const theme = useOpenAiGlobal("theme");
   const displayMode = useOpenAiGlobal("displayMode");
@@ -971,9 +1126,13 @@ function useWidget(defaultProps) {
     },
     [widgetState, localWidgetState]
   );
+  const isPending = useMemo(() => {
+    return provider === "openai" && toolResponseMetadata === null;
+  }, [provider, toolResponseMetadata]);
   return {
     // Props and state (with defaults)
-    props: toolInput || defaultProps || {},
+    props: widgetProps,
+    toolInput: toolInput || {},
     output: toolOutput ?? null,
     metadata: toolResponseMetadata ?? null,
     state: localWidgetState,
@@ -995,7 +1154,8 @@ function useWidget(defaultProps) {
     openExternal,
     requestDisplayMode,
     // Availability
-    isAvailable: isOpenAiAvailable
+    isAvailable: isOpenAiAvailable,
+    isPending
   };
 }
 __name(useWidget, "useWidget");
@@ -1098,7 +1258,7 @@ function WidgetControls({
   );
   const isFullscreen = displayMode === "fullscreen" && isAvailable;
   const isPip = displayMode === "pip" && isAvailable;
-  const isDevMode = typeof window !== "undefined" && window.location.pathname.includes("/inspector/api/dev-widget/");
+  const isInInspector = typeof window !== "undefined" && window.location.pathname.includes("/inspector/api/");
   useEffect4(() => {
     const timeoutId = setTimeout(() => {
       if (typeof window !== "undefined" && window.openai) {
@@ -1430,7 +1590,7 @@ function WidgetControls({
         className: getPositionClasses().join(" "),
         style: getPositionOffsetStyles()
       },
-      !isDevMode && /* @__PURE__ */ React4.createElement(React4.Fragment, null, !isFullscreen && !isPip && /* @__PURE__ */ React4.createElement(React4.Fragment, null, (viewControls === true || viewControls === "fullscreen") && /* @__PURE__ */ React4.createElement(IconButton, { onClick: handleFullscreen, label: "Fullscreen" }, /* @__PURE__ */ React4.createElement("path", { d: "M15 3h6v6" }), /* @__PURE__ */ React4.createElement("path", { d: "m21 3-7 7" }), /* @__PURE__ */ React4.createElement("path", { d: "m3 21 7-7" }), /* @__PURE__ */ React4.createElement("path", { d: "M9 21H3v-6" })), (viewControls === true || viewControls === "pip") && /* @__PURE__ */ React4.createElement(IconButton, { onClick: handlePip, label: "Picture in Picture" }, /* @__PURE__ */ React4.createElement("path", { d: "M21 9V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v10c0 1.1.9 2 2 2h4" }), /* @__PURE__ */ React4.createElement("rect", { width: "10", height: "7", x: "12", y: "13", rx: "2" }))), enableDebugger && /* @__PURE__ */ React4.createElement(IconButton, { onClick: handleToggleOverlay, label: "Debug Info" }, /* @__PURE__ */ React4.createElement("path", { d: "M12 20v-9" }), /* @__PURE__ */ React4.createElement("path", { d: "M14 7a4 4 0 0 1 4 4v3a6 6 0 0 1-12 0v-3a4 4 0 0 1 4-4z" }), /* @__PURE__ */ React4.createElement("path", { d: "M14.12 3.88 16 2" }), /* @__PURE__ */ React4.createElement("path", { d: "M21 21a4 4 0 0 0-3.81-4" }), /* @__PURE__ */ React4.createElement("path", { d: "M21 5a4 4 0 0 1-3.55 3.97" }), /* @__PURE__ */ React4.createElement("path", { d: "M22 13h-4" }), /* @__PURE__ */ React4.createElement("path", { d: "M3 21a4 4 0 0 1 3.81-4" }), /* @__PURE__ */ React4.createElement("path", { d: "M3 5a4 4 0 0 0 3.55 3.97" }), /* @__PURE__ */ React4.createElement("path", { d: "M6 13H2" }), /* @__PURE__ */ React4.createElement("path", { d: "m8 2 1.88 1.88" }), /* @__PURE__ */ React4.createElement("path", { d: "M9 7.13V6a3 3 0 1 1 6 0v1.13" })))
+      !isInInspector && /* @__PURE__ */ React4.createElement(React4.Fragment, null, !isFullscreen && !isPip && /* @__PURE__ */ React4.createElement(React4.Fragment, null, (viewControls === true || viewControls === "fullscreen") && /* @__PURE__ */ React4.createElement(IconButton, { onClick: handleFullscreen, label: "Fullscreen" }, /* @__PURE__ */ React4.createElement("path", { d: "M15 3h6v6" }), /* @__PURE__ */ React4.createElement("path", { d: "m21 3-7 7" }), /* @__PURE__ */ React4.createElement("path", { d: "m3 21 7-7" }), /* @__PURE__ */ React4.createElement("path", { d: "M9 21H3v-6" })), (viewControls === true || viewControls === "pip") && /* @__PURE__ */ React4.createElement(IconButton, { onClick: handlePip, label: "Picture in Picture" }, /* @__PURE__ */ React4.createElement("path", { d: "M21 9V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v10c0 1.1.9 2 2 2h4" }), /* @__PURE__ */ React4.createElement("rect", { width: "10", height: "7", x: "12", y: "13", rx: "2" }))), enableDebugger && /* @__PURE__ */ React4.createElement(IconButton, { onClick: handleToggleOverlay, label: "Debug Info" }, /* @__PURE__ */ React4.createElement("path", { d: "M12 20v-9" }), /* @__PURE__ */ React4.createElement("path", { d: "M14 7a4 4 0 0 1 4 4v3a6 6 0 0 1-12 0v-3a4 4 0 0 1 4-4z" }), /* @__PURE__ */ React4.createElement("path", { d: "M14.12 3.88 16 2" }), /* @__PURE__ */ React4.createElement("path", { d: "M21 21a4 4 0 0 0-3.81-4" }), /* @__PURE__ */ React4.createElement("path", { d: "M21 5a4 4 0 0 1-3.55 3.97" }), /* @__PURE__ */ React4.createElement("path", { d: "M22 13h-4" }), /* @__PURE__ */ React4.createElement("path", { d: "M3 21a4 4 0 0 1 3.81-4" }), /* @__PURE__ */ React4.createElement("path", { d: "M3 5a4 4 0 0 0 3.55 3.97" }), /* @__PURE__ */ React4.createElement("path", { d: "M6 13H2" }), /* @__PURE__ */ React4.createElement("path", { d: "m8 2 1.88 1.88" }), /* @__PURE__ */ React4.createElement("path", { d: "M9 7.13V6a3 3 0 1 1 6 0v1.13" })))
     ),
     children
   ), isOverlayOpen && enableDebugger && /* @__PURE__ */ React4.createElement(
@@ -1588,7 +1748,7 @@ function McpUseProvider({
     let mounted = true;
     (async () => {
       try {
-        const routerModule = await import("react-router-dom");
+        const routerModule = await import("react-router");
         if (mounted) {
           setBrowserRouter(() => routerModule.BrowserRouter);
           setIsRouterLoading(false);
@@ -1597,7 +1757,7 @@ function McpUseProvider({
         if (mounted) {
           setRouterError(
             new Error(
-              "\u274C react-router-dom not installed!\n\nTo use MCP widgets with McpUseProvider, you need to install:\n\n  npm install react-router-dom\n  # or\n  pnpm add react-router-dom\n\nThis dependency is automatically included in projects created with 'create-mcp-use-app'."
+              "\u274C react-router not installed!\n\nTo use MCP widgets with McpUseProvider, you need to install:\n\n  npm install react-router\n  # or\n  pnpm add react-router\n\nThis dependency is automatically included in projects created with 'create-mcp-use-app'."
             )
           );
           setIsRouterLoading(false);

package/dist/chunk-ULFNVP5Z.js

@@ -0,0 +1,12 @@
+import {
+  CODE_MODE_AGENT_PROMPT
+} from "./chunk-CBJTHTR4.js";
+
+// src/client/prompts.ts
+var PROMPTS = {
+  CODE_MODE: CODE_MODE_AGENT_PROMPT
+};
+
+export {
+  PROMPTS
+};

package/dist/chunk-UWWLWLS2.js

@@ -0,0 +1,62 @@
+import {
+  __name
+} from "./chunk-3GQAWCBQ.js";
+
+// src/server/utils/jsonrpc-helpers.ts
+function createNotification(method, params) {
+  return {
+    jsonrpc: "2.0",
+    method,
+    ...params && { params }
+  };
+}
+__name(createNotification, "createNotification");
+function createRequest(id, method, params) {
+  return {
+    jsonrpc: "2.0",
+    id,
+    method,
+    ...params && { params }
+  };
+}
+__name(createRequest, "createRequest");
+
+// src/server/sessions/notifications.ts
+async function sendNotificationToAll(sessions, method, params) {
+  const notification = createNotification(method, params);
+  for (const [sessionId, session] of sessions.entries()) {
+    try {
+      await session.transport.send(notification);
+    } catch (error) {
+      console.warn(
+        `[MCP] Failed to send notification to session ${sessionId}:`,
+        error
+      );
+    }
+  }
+}
+__name(sendNotificationToAll, "sendNotificationToAll");
+async function sendNotificationToSession(sessions, sessionId, method, params) {
+  const session = sessions.get(sessionId);
+  if (!session) {
+    return false;
+  }
+  const notification = createNotification(method, params);
+  try {
+    await session.transport.send(notification);
+    return true;
+  } catch (error) {
+    console.warn(
+      `[MCP] Failed to send notification to session ${sessionId}:`,
+      error
+    );
+    return false;
+  }
+}
+__name(sendNotificationToSession, "sendNotificationToSession");
+
+export {
+  createRequest,
+  sendNotificationToAll,
+  sendNotificationToSession
+};