@mcp-use/client 2.3.2 → 2.3.3-canary.0

package/dist/index-browser.js

@@ -128,7 +128,7 @@ var Logger = class {
 var logger = Logger.get();
 
 // src/utils/version.ts
-var VERSION = "2.3.2";
+var VERSION = "2.3.3-canary.0";
 function getPackageVersion() {
   return VERSION;
 }

package/dist/index.js

@@ -1559,7 +1559,7 @@ init_connector_telemetry();
 init_logging();
 
 // src/utils/version.ts
-var VERSION = "2.3.2";
+var VERSION = "2.3.3-canary.0";
 function getPackageVersion() {
   return VERSION;
 }

package/dist/react/index.js

@@ -1880,7 +1880,7 @@ var HttpConnector = class extends BaseConnector {
 };
 
 // src/utils/version.ts
-var VERSION = "2.3.2";
+var VERSION = "2.3.3-canary.0";
 function getPackageVersion() {
   return VERSION;
 }
@@ -7843,7 +7843,7 @@ import React2, {
   useCallback as useCallback6,
   useEffect as useEffect5,
   useMemo as useMemo3,
-  useRef as useRef4,
+  useRef as useRef5,
   useState as useState4
 } from "react";
 
@@ -8493,7 +8493,7 @@ function buildSandboxProxyBlobHtml(search) {
 }
 
 // src/react/view/use-display-mode.ts
-import { useCallback as useCallback5, useEffect as useEffect4 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect4, useRef as useRef4 } from "react";
 var SHELL_BASE = "w-full h-full min-h-0 bg-background flex flex-col [&:fullscreen]:h-full [&:fullscreen]:w-full [&:fullscreen]:bg-background";
 var WIDGET_FULLSCREEN_OVERLAY_CLASSES = `fixed inset-0 z-[200] ${SHELL_BASE}`;
 var WIDGET_PIP_SHELL_CLASSES = [
@@ -8505,33 +8505,51 @@ var WIDGET_PIP_SHELL_CLASSES = [
 ].join(" ");
 var WIDGET_FULLSCREEN_DOCUMENT_ATTR = "data-mcp-widget-fullscreen";
 var WIDGET_DISPLAY_MODE_ATTR = "data-mcp-widget-display-mode";
+var activeWidgetDisplayModes = /* @__PURE__ */ new Map();
+function syncDocumentDisplayModeAttributes() {
+  if (typeof document === "undefined") return;
+  let hasFullscreen = false;
+  let hasPip = false;
+  for (const mode of activeWidgetDisplayModes.values()) {
+    if (mode === "fullscreen") {
+      hasFullscreen = true;
+      break;
+    }
+    if (mode === "pip") {
+      hasPip = true;
+    }
+  }
+  if (hasFullscreen) {
+    document.documentElement.setAttribute(
+      WIDGET_DISPLAY_MODE_ATTR,
+      "fullscreen"
+    );
+    document.documentElement.setAttribute(WIDGET_FULLSCREEN_DOCUMENT_ATTR, "");
+  } else if (hasPip) {
+    document.documentElement.setAttribute(WIDGET_DISPLAY_MODE_ATTR, "pip");
+    document.documentElement.removeAttribute(WIDGET_FULLSCREEN_DOCUMENT_ATTR);
+  } else {
+    document.documentElement.removeAttribute(WIDGET_DISPLAY_MODE_ATTR);
+    document.documentElement.removeAttribute(WIDGET_FULLSCREEN_DOCUMENT_ATTR);
+  }
+}
 function useWidgetDisplayModeDocumentChrome(displayMode) {
+  const widgetIdRef = useRef4(null);
+  if (widgetIdRef.current === null) {
+    widgetIdRef.current = /* @__PURE__ */ Symbol("mcp-widget-display-mode");
+  }
   useEffect4(() => {
-    if (typeof document === "undefined") return;
+    const id = widgetIdRef.current;
     if (displayMode === "pip" || displayMode === "fullscreen") {
-      document.documentElement.setAttribute(
-        WIDGET_DISPLAY_MODE_ATTR,
-        displayMode
-      );
-      if (displayMode === "fullscreen") {
-        document.documentElement.setAttribute(
-          WIDGET_FULLSCREEN_DOCUMENT_ATTR,
-          ""
-        );
-      } else {
-        document.documentElement.removeAttribute(
-          WIDGET_FULLSCREEN_DOCUMENT_ATTR
-        );
-      }
-      return () => {
-        document.documentElement.removeAttribute(WIDGET_DISPLAY_MODE_ATTR);
-        document.documentElement.removeAttribute(
-          WIDGET_FULLSCREEN_DOCUMENT_ATTR
-        );
-      };
+      activeWidgetDisplayModes.set(id, displayMode);
+    } else {
+      activeWidgetDisplayModes.delete(id);
     }
-    document.documentElement.removeAttribute(WIDGET_DISPLAY_MODE_ATTR);
-    document.documentElement.removeAttribute(WIDGET_FULLSCREEN_DOCUMENT_ATTR);
+    syncDocumentDisplayModeAttributes();
+    return () => {
+      activeWidgetDisplayModes.delete(id);
+      syncDocumentDisplayModeAttributes();
+    };
   }, [displayMode]);
 }
 function useViewDisplayModeControls({
@@ -8734,13 +8752,13 @@ function ViewRendererBase({
   invoking,
   invoked
 }) {
-  const iframeRef = useRef4(null);
-  const bridgeRef = useRef4(null);
-  const containerRef = useRef4(null);
-  const pendingBlobRevocationsRef = useRef4(
+  const iframeRef = useRef5(null);
+  const bridgeRef = useRef5(null);
+  const containerRef = useRef5(null);
+  const pendingBlobRevocationsRef = useRef5(
     /* @__PURE__ */ new Map()
   );
-  const connectionRef = useRef4(
+  const connectionRef = useRef5(
     source.kind === "live" ? source.connection : null
   );
   const [resolved, setResolved] = useState4(null);
@@ -8788,45 +8806,45 @@ function ViewRendererBase({
     if (hostContext.displayMode === displayMode) return hostContext;
     return { ...hostContext, displayMode };
   }, [hostContext, displayMode]);
-  const hostContextRef = useRef4(effectiveHostContext);
+  const hostContextRef = useRef5(effectiveHostContext);
   hostContextRef.current = effectiveHostContext;
-  const onMessageRef = useRef4(onMessage);
+  const onMessageRef = useRef5(onMessage);
   onMessageRef.current = onMessage;
-  const onSamplingRequestRef = useRef4(onSamplingRequest);
+  const onSamplingRequestRef = useRef5(onSamplingRequest);
   onSamplingRequestRef.current = onSamplingRequest;
-  const onDownloadFileRef = useRef4(onDownloadFile);
+  const onDownloadFileRef = useRef5(onDownloadFile);
   onDownloadFileRef.current = onDownloadFile;
-  const onAppToolsChangedRef = useRef4(onAppToolsChanged);
+  const onAppToolsChangedRef = useRef5(onAppToolsChanged);
   onAppToolsChangedRef.current = onAppToolsChanged;
-  const toolInputRef = useRef4(toolInput);
+  const toolInputRef = useRef5(toolInput);
   toolInputRef.current = toolInput;
-  const partialToolInputRef = useRef4(partialToolInput);
+  const partialToolInputRef = useRef5(partialToolInput);
   partialToolInputRef.current = partialToolInput;
-  const toolOutputRef = useRef4(toolOutput);
+  const toolOutputRef = useRef5(toolOutput);
   toolOutputRef.current = toolOutput;
-  const customPropsRef = useRef4(customProps);
+  const customPropsRef = useRef5(customProps);
   customPropsRef.current = customProps;
-  const onResourceResolvedRef = useRef4(onResourceResolved);
+  const onResourceResolvedRef = useRef5(onResourceResolved);
   onResourceResolvedRef.current = onResourceResolved;
-  const onModelContextUpdateRef = useRef4(onModelContextUpdate);
+  const onModelContextUpdateRef = useRef5(onModelContextUpdate);
   onModelContextUpdateRef.current = onModelContextUpdate;
-  const onLogRef = useRef4(onLog);
+  const onLogRef = useRef5(onLog);
   onLogRef.current = onLog;
-  const onErrorRef = useRef4(onError);
+  const onErrorRef = useRef5(onError);
   onErrorRef.current = onError;
-  const onCspViolationRef = useRef4(onCspViolation);
+  const onCspViolationRef = useRef5(onCspViolation);
   onCspViolationRef.current = onCspViolation;
-  const onReadyRef = useRef4(onReady);
+  const onReadyRef = useRef5(onReady);
   onReadyRef.current = onReady;
-  const onLifecycleChangeRef = useRef4(onLifecycleChange);
+  const onLifecycleChangeRef = useRef5(onLifecycleChange);
   onLifecycleChangeRef.current = onLifecycleChange;
-  const onInlineHeightChangeRef = useRef4(onInlineHeightChange);
+  const onInlineHeightChangeRef = useRef5(onInlineHeightChange);
   onInlineHeightChangeRef.current = onInlineHeightChange;
-  const sandboxUrlRef = useRef4(sandboxUrl);
+  const sandboxUrlRef = useRef5(sandboxUrl);
   sandboxUrlRef.current = sandboxUrl;
-  const cspModeRef = useRef4(cspMode);
+  const cspModeRef = useRef5(cspMode);
   cspModeRef.current = cspMode;
-  const mockOpenAiFileApisRef = useRef4(mockOpenAiFileApis);
+  const mockOpenAiFileApisRef = useRef5(mockOpenAiFileApis);
   mockOpenAiFileApisRef.current = mockOpenAiFileApis;
   const resolveSandboxUrl = useCallback6((next) => {
     const custom = sandboxUrlRef.current;
@@ -8857,9 +8875,9 @@ function ViewRendererBase({
     displayMode,
     setDisplayMode
   });
-  const handleDisplayModeChangeRef = useRef4(handleDisplayModeChange);
+  const handleDisplayModeChangeRef = useRef5(handleDisplayModeChange);
   handleDisplayModeChangeRef.current = handleDisplayModeChange;
-  const displayModeRef = useRef4(displayMode);
+  const displayModeRef = useRef5(displayMode);
   displayModeRef.current = displayMode;
   const liveResourceUri = source.kind === "live" ? source.resourceUri : void 0;
   const preloadedHtml = source.kind === "preloaded" ? source.html : void 0;
@@ -9311,7 +9329,7 @@ function ViewRendererBase({
     if (!bridge || initCount === 0 || !cancelled) return;
     void bridge.sendToolCancelled({ reason: "Cancelled by user" });
   }, [cancelled, initCount]);
-  const readyFiredRef = useRef4(false);
+  const readyFiredRef = useRef5(false);
   useEffect5(() => {
     if (readyFiredRef.current || initCount === 0) return;
     readyFiredRef.current = true;