@gradio/core 0.27.0 → 0.27.2

package/dist/src/api_docs/EndpointDetail.svelte.d.ts

@@ -1,13 +1,16 @@
 import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
-        api_name?: (string | null) | undefined;
-        description?: (string | null) | undefined;
+        api_name?: string | null;
+        description?: string | null;
+        analytics: Record<string, any>;
     };
     events: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type EndpointDetailProps = typeof __propDef.props;
 export type EndpointDetailEvents = typeof __propDef.events;

package/dist/src/api_docs/InputPayload.svelte.d.ts

@@ -15,6 +15,8 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type InputPayloadProps = typeof __propDef.props;
 export type InputPayloadEvents = typeof __propDef.events;

package/dist/src/api_docs/InstallSnippet.svelte.d.ts

@@ -7,6 +7,8 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type InstallSnippetProps = typeof __propDef.props;
 export type InstallSnippetEvents = typeof __propDef.events;

package/dist/src/api_docs/MCPSnippet.svelte

@@ -1,5 +1,7 @@
 <script>import { Block } from "@gradio/atoms";
 import CopyButton from "./CopyButton.svelte";
+import { Tool, Prompt, Resource } from "@gradio/icons";
+import { format_latency, get_color_from_success_rate } from "./utils";
 export let mcp_server_active;
 export let mcp_server_url;
 export let mcp_server_url_streamable;
@@ -10,6 +12,7 @@ export let mcp_json_sse;
 export let mcp_json_stdio;
 export let file_data_present;
 export let mcp_docs;
+export let analytics;
 let current_transport = "streamable_http";
 let include_file_upload = true;
 const transports = [
@@ -17,16 +20,14 @@ const transports = [
   ["sse", "SSE"],
   ["stdio", "STDIO"]
 ];
-const tool_type_emojis = {
-  tool: "\u{1F527}",
-  resource: "\u{1F4D5}",
-  prompt: "\u{1F4AC}"
+const tool_type_icons = {
+  tool: Tool,
+  resource: Resource,
+  prompt: Prompt
 };
-$:
-  display_url = current_transport === "sse" ? mcp_server_url : mcp_server_url_streamable;
+$: display_url = current_transport === "sse" ? mcp_server_url : mcp_server_url_streamable;
 function update_config_with_file_upload(base_config, include_upload) {
-  if (!base_config)
-    return null;
+  if (!base_config) return null;
   const config = JSON.parse(JSON.stringify(base_config));
   if (include_upload && file_data_present) {
     const upload_file_mcp_server = {
@@ -46,30 +47,27 @@ function update_config_with_file_upload(base_config, include_upload) {
   }
   return config;
 }
-$:
-  mcp_json_streamable_http = update_config_with_file_upload(
-    mcp_json_sse ? {
-      ...mcp_json_sse,
-      mcpServers: {
-        ...mcp_json_sse.mcpServers,
-        gradio: {
-          ...mcp_json_sse.mcpServers.gradio,
-          url: mcp_server_url_streamable
-        }
+$: mcp_json_streamable_http = update_config_with_file_upload(
+  mcp_json_sse ? {
+    ...mcp_json_sse,
+    mcpServers: {
+      ...mcp_json_sse.mcpServers,
+      gradio: {
+        ...mcp_json_sse.mcpServers.gradio,
+        url: mcp_server_url_streamable
       }
-    } : null,
-    include_file_upload
-  );
-$:
-  mcp_json_sse_updated = update_config_with_file_upload(
-    mcp_json_sse,
-    include_file_upload
-  );
-$:
-  mcp_json_stdio_updated = update_config_with_file_upload(
-    mcp_json_stdio,
-    include_file_upload
-  );
+    }
+  } : null,
+  include_file_upload
+);
+$: mcp_json_sse_updated = update_config_with_file_upload(
+  mcp_json_sse,
+  include_file_upload
+);
+$: mcp_json_stdio_updated = update_config_with_file_upload(
+  mcp_json_stdio,
+  include_file_upload
+);
 </script>
 
 {#if mcp_server_active}
@@ -109,11 +107,15 @@ $:
 	{/if}
 
 	<div class="tool-selection">
-		<strong
-			>{all_tools.length > 0 ? all_tools.length : tools.length} Available MCP Tools
-			({tool_type_emojis.tool}), Resources ({tool_type_emojis.resource}), and
-			Prompts ({tool_type_emojis.prompt})</strong
-		>
+		<strong>
+			{all_tools.length > 0 ? all_tools.length : tools.length} Available MCP Tools
+			(<span style="display: inline-block; vertical-align: sub;"><Tool /></span
+			>), Resources (<span style="display: inline-block; vertical-align: sub;"
+				><Resource /></span
+			>), and Prompts (<span style="display: inline-block; vertical-align: sub;"
+				><Prompt /></span
+			>)
+		</strong>
 		{#if all_tools.length > 0}
 			<div class="tool-selection-controls">
 				<button
@@ -137,6 +139,9 @@ $:
 	</div>
 	<div class="mcp-tools">
 		{#each all_tools.length > 0 ? all_tools : tools as tool}
+			{@const success_rate =
+				analytics[tool.meta.endpoint_name]?.success_rate || 0}
+			{@const color = get_color_from_success_rate(success_rate)}
 			<div class="tool-item">
 				<div class="tool-header-wrapper">
 					{#if all_tools.length > 0}
@@ -163,17 +168,53 @@ $:
 						class="tool-header"
 						on:click={() => (tool.expanded = !tool.expanded)}
 					>
-						<span
-							><span class="tool-name"
-								>{tool_type_emojis[tool.meta.mcp_type]} {tool.name}</span
+						<span style="display: inline-block">
+							<span
+								style="display: inline-block; padding-right: 6px; vertical-align: sub"
 							>
+								{#if tool_type_icons[tool.meta.mcp_type]}
+									{@const Icon = tool_type_icons[tool.meta.mcp_type]}
+									<Icon />
+								{/if}
+							</span>
+							<span class="tool-name">{tool.name}</span>
 							&nbsp;
-							<span class="tool-description"
-								>{tool.description
+							<span class="tool-description">
+								{tool.description
 									? tool.description
-									: "⚠︎ No description provided in function docstring"}</span
-							></span
-						>
+									: "⚠︎ No description provided in function docstring"}
+							</span>
+							{#if analytics[tool.meta.endpoint_name]}
+								<span
+									class="tool-analytics"
+									style="color: var(--body-text-color-subdued); margin-left: 1em;"
+								>
+									Total requests: {analytics[tool.meta.endpoint_name]
+										.total_requests}
+									<span style={color}
+										>({Math.round(success_rate * 100)}% successful)</span
+									>
+									&nbsp;|&nbsp; p50/p90/p99:
+									{format_latency(
+										analytics[tool.meta.endpoint_name].process_time_percentiles[
+											"50th"
+										]
+									)}
+									/
+									{format_latency(
+										analytics[tool.meta.endpoint_name].process_time_percentiles[
+											"90th"
+										]
+									)}
+									/
+									{format_latency(
+										analytics[tool.meta.endpoint_name].process_time_percentiles[
+											"99th"
+										]
+									)}
+								</span>
+							{/if}
+						</span>
 						<span class="tool-arrow">{tool.expanded ? "▼" : "▶"}</span>
 					</button>
 				</div>
@@ -297,6 +338,10 @@ $:
 {/if}
 
 <style>
+	.tool-analytics {
+		font-size: 0.95em;
+		color: var(--body-text-color-subdued);
+	}
 	.transport-selection {
 		margin-bottom: var(--size-4);
 	}

package/dist/src/api_docs/MCPSnippet.svelte.d.ts

@@ -18,6 +18,7 @@ declare const __propDef: {
             meta: {
                 mcp_type: "tool" | "resource" | "prompt";
                 file_data_present: boolean;
+                endpoint_name: string;
             };
         }[];
         all_tools?: {
@@ -34,18 +35,22 @@ declare const __propDef: {
             meta: {
                 mcp_type: "tool" | "resource" | "prompt";
                 file_data_present: boolean;
+                endpoint_name: string;
             };
-        }[] | undefined;
-        selected_tools?: Set<string> | undefined;
+        }[];
+        selected_tools?: Set<string>;
         mcp_json_sse: any;
         mcp_json_stdio: any;
         file_data_present: boolean;
         mcp_docs: string;
+        analytics: Record<string, any>;
     };
     events: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type McpSnippetProps = typeof __propDef.props;
 export type McpSnippetEvents = typeof __propDef.events;

package/dist/src/api_docs/NoApi.svelte.d.ts

@@ -9,6 +9,8 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type NoApiProps = typeof __propDef.props;
 export type NoApiEvents = typeof __propDef.events;

package/dist/src/api_docs/ParametersSnippet.svelte.d.ts

@@ -10,6 +10,8 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type ParametersSnippetProps = typeof __propDef.props;
 export type ParametersSnippetEvents = typeof __propDef.events;

package/dist/src/api_docs/RecordingSnippet.svelte.d.ts

@@ -5,15 +5,17 @@ declare const __propDef: {
         dependencies: Dependency[];
         short_root: string;
         root: string;
-        api_prefix?: string | undefined;
+        api_prefix?: string;
         current_language: "python" | "javascript" | "bash" | "mcp";
         username: string | null;
-        api_calls?: Payload[] | undefined;
+        api_calls?: Payload[];
     };
     events: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type RecordingSnippetProps = typeof __propDef.props;
 export type RecordingSnippetEvents = typeof __propDef.events;

package/dist/src/api_docs/ResponseSnippet.svelte.d.ts

@@ -10,6 +10,8 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type ResponseSnippetProps = typeof __propDef.props;
 export type ResponseSnippetEvents = typeof __propDef.events;

package/dist/src/api_docs/Settings.svelte.d.ts

@@ -4,8 +4,8 @@ declare const __propDef: {
         root: string;
         space_id: string | null;
         pwa_enabled: boolean | undefined;
-        allow_zoom?: boolean | undefined;
-        allow_video_trim?: boolean | undefined;
+        allow_zoom?: boolean;
+        allow_video_trim?: boolean;
     };
     events: {
         close: CustomEvent<any>;
@@ -14,6 +14,8 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type SettingsProps = typeof __propDef.props;
 export type SettingsEvents = typeof __propDef.events;

package/dist/src/api_docs/SettingsBanner.svelte.d.ts

@@ -9,6 +9,8 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type SettingsBannerProps = typeof __propDef.props;
 export type SettingsBannerEvents = typeof __propDef.events;

package/dist/src/api_docs/TryButton.svelte.d.ts

@@ -8,6 +8,8 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type TryButtonProps = typeof __propDef.props;
 export type TryButtonEvents = typeof __propDef.events;

package/dist/src/api_docs/img/clear.svelte.d.ts

@@ -19,5 +19,7 @@ declare const __propDef: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: undefined;
+    bindings?: undefined;
 };
 export {};

package/dist/src/api_docs/utils.d.ts

@@ -1,2 +1,4 @@
 export declare function represent_value(value: string, type: string | undefined, lang?: "js" | "py" | "bash" | null): string | null | number | boolean | Record<string, unknown>;
 export declare function is_potentially_nested_file_data(obj: any): boolean;
+export declare function format_latency(val: number): string;
+export declare function get_color_from_success_rate(success_rate: number): string;

package/dist/src/api_docs/utils.js

@@ -133,3 +133,17 @@ function stringify_except_file_function(obj) {
     const regexNone = /"UNQUOTEDNone"/g;
     return jsonString.replace(regexNone, "None");
 }
+export function format_latency(val) {
+    if (val < 1)
+        return `${Math.round(val * 1000)} ms`;
+    return `${val.toFixed(2)} s`;
+}
+export function get_color_from_success_rate(success_rate) {
+    if (success_rate > 0.9) {
+        return "color: green;";
+    }
+    else if (success_rate > 0.1) {
+        return "color: orange;";
+    }
+    return "color: red;";
+}

package/dist/src/stories/I18nMultiLanguageTestComponent.svelte.d.ts

@@ -1,12 +1,12 @@
 import { SvelteComponent } from "svelte";
 declare const __propDef: {
-    props: {
-        [x: string]: never;
-    };
+    props: Record<string, never>;
     events: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type I18nMultiLanguageTestComponentProps = typeof __propDef.props;
 export type I18nMultiLanguageTestComponentEvents = typeof __propDef.events;

package/dist/src/stories/I18nTestSetup.svelte

@@ -2,8 +2,7 @@
 import { init, _ } from "svelte-i18n";
 export let active = true;
 onMount(async () => {
-  if (!active)
-    return;
+  if (!active) return;
   await init({
     fallbackLocale: "en",
     initialLocale: "en"

package/dist/src/stories/I18nTestSetup.svelte.d.ts

@@ -1,12 +1,14 @@
 import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
-        active?: boolean | undefined;
+        active?: boolean;
     };
     events: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
 };
 export type I18nTestSetupProps = typeof __propDef.props;
 export type I18nTestSetupEvents = typeof __propDef.events;

package/package.json

@@ -1,69 +1,69 @@
 {
   "name": "@gradio/core",
-  "version": "0.27.0",
+  "version": "0.27.2",
   "type": "module",
   "devDependencies": {
-    "@gradio/annotatedimage": "^0.9.29",
     "@gradio/accordion": "^0.5.22",
-    "@gradio/audio": "^0.17.25",
-    "@gradio/atoms": "^0.16.5",
-    "@gradio/browserstate": "^0.3.2",
-    "@gradio/chatbot": "^0.26.22",
-    "@gradio/checkbox": "^0.4.28",
+    "@gradio/annotatedimage": "^0.9.29",
+    "@gradio/audio": "^0.17.26",
     "@gradio/box": "^0.2.23",
+    "@gradio/browserstate": "^0.3.2",
+    "@gradio/atoms": "^0.16.5",
     "@gradio/button": "^0.5.11",
+    "@gradio/checkbox": "^0.4.28",
+    "@gradio/chatbot": "^0.26.23",
     "@gradio/checkboxgroup": "^0.6.27",
-    "@gradio/client": "^1.17.1",
     "@gradio/code": "^0.14.15",
+    "@gradio/client": "^1.17.1",
     "@gradio/colorpicker": "^0.4.27",
     "@gradio/column": "^0.2.1",
-    "@gradio/dataframe": "^0.18.8",
-    "@gradio/dropdown": "^0.10.2",
+    "@gradio/dataframe": "^0.19.1",
     "@gradio/dataset": "^0.4.32",
+    "@gradio/dropdown": "^0.10.2",
+    "@gradio/fallback": "^0.4.27",
     "@gradio/datetime": "^0.3.20",
     "@gradio/downloadbutton": "^0.4.11",
-    "@gradio/fallback": "^0.4.27",
-    "@gradio/file": "^0.12.28",
     "@gradio/fileexplorer": "^0.5.39",
+    "@gradio/file": "^0.12.28",
     "@gradio/form": "^0.2.23",
     "@gradio/group": "^0.2.0",
-    "@gradio/gallery": "^0.15.31",
+    "@gradio/html": "^0.7.0",
+    "@gradio/icons": "^0.13.1",
     "@gradio/highlightedtext": "^0.9.10",
-    "@gradio/html": "^0.6.19",
-    "@gradio/icons": "^0.13.0",
-    "@gradio/image": "^0.22.17",
+    "@gradio/gallery": "^0.15.31",
     "@gradio/imageeditor": "^0.16.5",
-    "@gradio/json": "^0.5.29",
+    "@gradio/image": "^0.22.17",
     "@gradio/imageslider": "^0.2.13",
+    "@gradio/json": "^0.5.29",
     "@gradio/label": "^0.5.19",
-    "@gradio/markdown": "^0.13.20",
     "@gradio/model3d": "^0.14.25",
-    "@gradio/multimodaltextbox": "^0.10.17",
+    "@gradio/markdown": "^0.13.20",
     "@gradio/number": "^0.6.4",
-    "@gradio/nativeplot": "^0.7.4",
+    "@gradio/multimodaltextbox": "^0.10.17",
     "@gradio/paramviewer": "^0.7.15",
+    "@gradio/nativeplot": "^0.7.4",
     "@gradio/plot": "^0.9.22",
-    "@gradio/radio": "^0.7.10",
     "@gradio/row": "^0.2.1",
     "@gradio/sidebar": "^0.1.20",
-    "@gradio/simpleimage": "^0.8.39",
-    "@gradio/simpletextbox": "^0.3.28",
+    "@gradio/radio": "^0.7.10",
     "@gradio/simpledropdown": "^0.3.27",
-    "@gradio/sketchbox": "^0.6.15",
-    "@gradio/slider": "^0.6.16",
+    "@gradio/simpletextbox": "^0.3.28",
     "@gradio/state": "^0.1.2",
+    "@gradio/sketchbox": "^0.6.15",
+    "@gradio/simpleimage": "^0.8.39",
+    "@gradio/statustracker": "^0.10.18",
     "@gradio/tabitem": "^0.5.0",
-    "@gradio/tabs": "^0.4.5",
+    "@gradio/slider": "^0.6.16",
     "@gradio/textbox": "^0.10.20",
+    "@gradio/tabs": "^0.4.5",
     "@gradio/theme": "^0.4.0",
-    "@gradio/timer": "^0.4.5",
-    "@gradio/statustracker": "^0.10.17",
-    "@gradio/upload": "^0.16.15",
     "@gradio/uploadbutton": "^0.9.11",
+    "@gradio/upload": "^0.16.16",
+    "@gradio/timer": "^0.4.5",
     "@gradio/utils": "^0.10.2",
-    "@gradio/video": "^0.15.0",
     "@gradio/vibeeditor": "^0.2.2",
-    "@gradio/wasm": "^0.18.1"
+    "@gradio/wasm": "^0.18.1",
+    "@gradio/video": "^0.15.0"
   },
   "msw": {
     "workerDirectory": "public"

package/src/api_docs/ApiDocs.svelte

@@ -99,6 +99,7 @@
 	};
 
 	let js_info: Record<string, any>;
+	let analytics: Record<string, any>;
 
 	get_info().then((data) => {
 		info = data;
@@ -108,6 +109,18 @@
 		js_info = js_api_info;
 	});
 
+	async function get_summary(): Promise<{
+		functions: any;
+	}> {
+		let response = await fetch(root.replace(/\/$/, "") + "/monitoring/summary");
+		let data = await response.json();
+		return data;
+	}
+
+	get_summary().then((summary) => {
+		analytics = summary.functions;
+	});
+
 	const dispatch = createEventDispatcher();
 
 	$: selected_tools_array = Array.from(selected_tools);
@@ -148,6 +161,7 @@
 		meta: {
 			mcp_type: "tool" | "resource" | "prompt";
 			file_data_present: boolean;
+			endpoint_name: string;
 		};
 	}
 
@@ -192,7 +206,8 @@
 				description: tool.description || "",
 				parameters: tool.inputSchema?.properties || {},
 				meta: tool.meta,
-				expanded: false
+				expanded: false,
+				endpoint_name: tool.endpoint_name
 			}));
 			selected_tools = new Set(tools.map((tool) => tool.name));
 			headers = schema.map((tool: any) => tool.meta?.headers || []).flat();
@@ -260,6 +275,9 @@
 	}
 
 	onMount(() => {
+		const controller = new AbortController();
+		const signal = controller.signal;
+
 		document.body.style.overflow = "hidden";
 		if ("parentIFrame" in window) {
 			window.parentIFrame?.scrollTo(0, 0);
@@ -271,7 +289,7 @@
 		}
 
 		// Check MCP server status and fetch tools if active
-		fetch(mcp_server_url)
+		fetch(mcp_server_url, { signal: signal })
 			.then((response) => {
 				mcp_server_active = response.ok;
 				if (mcp_server_active) {
@@ -284,6 +302,7 @@
 						current_language = "python";
 					}
 				}
+				controller.abort();
 			})
 			.catch(() => {
 				mcp_server_active = false;
@@ -295,7 +314,7 @@
 	});
 </script>
 
-{#if info}
+{#if info && analytics}
 	{#if api_count}
 		<div class="banner-wrap">
 			<ApiBanner
@@ -385,6 +404,7 @@
 								{mcp_json_stdio}
 								{file_data_present}
 								{mcp_docs}
+								{analytics}
 							/>
 						{:else}
 							1. Confirm that you have cURL installed on your system.
@@ -461,6 +481,7 @@
 									api_description={info.named_endpoints[
 										"/" + dependency.api_name
 									].description}
+									{analytics}
 								/>
 
 								<ParametersSnippet