@gradio/core 1.0.0-dev.0 → 1.0.0

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

@@ -0,0 +1,37 @@
+import type { Dependency } from "../types";
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const CopyMarkdown: $$__sveltets_2_IsomorphicComponent<{
+    current_language: "python" | "javascript" | "bash" | "mcp";
+    space_id: string | null;
+    root: string;
+    api_count: number;
+    tools: any[];
+    py_docs: string;
+    js_docs: string;
+    bash_docs: string;
+    mcp_docs: string;
+    spaces_docs_suffix: string;
+    mcp_server_active: boolean;
+    mcp_server_url_streamable: string;
+    config_snippets: Record<string, string>;
+    markdown_code_snippets: Record<string, Record<string, string>>;
+    dependencies: Dependency[];
+    info: any;
+    js_info: any;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type CopyMarkdown = InstanceType<typeof CopyMarkdown>;
+export default CopyMarkdown;

package/dist/src/api_docs/EndpointDetail.svelte

@@ -1,28 +1,45 @@
-<script>export let api_name = null;
-export let description = null;
-export let analytics;
-import { format_latency, get_color_from_success_rate } from "./utils";
-const success_rate = api_name ? analytics[api_name]?.success_rate : 0;
-const color = get_color_from_success_rate(success_rate);
+<script lang="ts">
+	import type { Payload } from "../types";
+	export let api_name: string | null = null;
+	export let description: string | null = null;
+	export let analytics: Record<string, any>;
+	export let last_api_call: Payload | null = null;
+	export let dependency_id: number | null = null;
+	import { format_latency, get_color_from_success_rate } from "./utils";
+	import PercentileChart from "./PercentileChart.svelte";
+
+	const success_rate = api_name ? analytics[api_name]?.success_rate : 0;
+	const color = get_color_from_success_rate(success_rate);
+	$: is_most_recently_used = last_api_call?.fn_index === dependency_id;
 </script>
 
 <h3>
 	API name:
 	<span class="post">{"/" + api_name}</span>
-	<span class="desc">{description}</span>
-	{#if analytics && api_name && analytics[api_name]}
-		<span class="analytics">
-			Total requests: {analytics[api_name].total_requests} (<span style={color}
-				>{Math.round(success_rate * 100)}%</span
-			>
-			successful) &nbsp;|&nbsp; p50/p90/p99:
-			{format_latency(analytics[api_name].process_time_percentiles["50th"])}
-			/
-			{format_latency(analytics[api_name].process_time_percentiles["90th"])}
-			/
-			{format_latency(analytics[api_name].process_time_percentiles["99th"])}
-		</span>
-	{/if}
+	<span class="desc">
+		{description}
+		{#if analytics && api_name && analytics[api_name]}
+			{@const endpoint_analytics = analytics[api_name]}
+			{@const p50 = endpoint_analytics.process_time_percentiles["50th"]}
+			{@const p90 = endpoint_analytics.process_time_percentiles["90th"]}
+			{@const p99 = endpoint_analytics.process_time_percentiles["99th"]}
+			<span class="analytics-inline">
+				<span class="analytics-content">
+					<span class="analytics-text-wrapper">
+						{endpoint_analytics.total_requests} requests ({Math.round(
+							success_rate * 100
+						)}% successful, p50: {format_latency(p50)})
+					</span>
+					<div class="analytics-tooltip">
+						<PercentileChart {p50} {p90} {p99} />
+					</div>
+				</span>
+				{#if is_most_recently_used}
+					<span class="most-recently-used">Most recently used</span>
+				{/if}
+			</span>
+		{/if}
+	</span>
 </h3>
 
 <style>
@@ -44,14 +61,55 @@ const color = get_color_from_success_rate(success_rate);
 		font-weight: var(--weight-semibold);
 	}
 
-	.analytics {
+	.analytics-inline {
+		display: inline-flex;
+		align-items: center;
+		gap: var(--size-2);
+		margin-left: var(--size-2);
 		color: var(--body-text-color-subdued);
-		margin-top: var(--size-1);
+	}
+
+	.analytics-content {
+		position: relative;
+		display: inline-block;
+	}
+
+	.analytics-text-wrapper {
+		cursor: help;
+	}
+
+	.analytics-tooltip {
+		position: absolute;
+		bottom: 100%;
+		left: 50%;
+		transform: translateX(-50%);
+		margin-bottom: var(--size-2);
+		opacity: 0;
+		pointer-events: none;
+		transition: opacity 0.2s ease;
+		z-index: 1000;
+	}
+
+	.analytics-content:hover .analytics-tooltip {
+		opacity: 1;
+		pointer-events: auto;
+	}
+
+	.most-recently-used {
+		display: inline-block;
+		color: #fd7b00;
+		background: #fff4e6;
+		border: 1px solid #ffd9b3;
+		border-radius: var(--radius-sm);
+		padding: var(--size-1) var(--size-2);
+		font-size: var(--text-sm);
+		font-weight: var(--weight-medium);
+		white-space: nowrap;
 	}
 
 	.desc {
 		color: var(--body-text-color);
 		font-size: var(--text-lg);
-		margin-top: var(--size-1);
+		margin-left: var(--size-2);
 	}
 </style>

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

@@ -1,20 +1,25 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        api_name?: string | null;
-        description?: string | null;
-        analytics: Record<string, any>;
+import type { Payload } from "../types";
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
     };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-    exports?: {} | undefined;
-    bindings?: string | undefined;
-};
-export type EndpointDetailProps = typeof __propDef.props;
-export type EndpointDetailEvents = typeof __propDef.events;
-export type EndpointDetailSlots = typeof __propDef.slots;
-export default class EndpointDetail extends SvelteComponent<EndpointDetailProps, EndpointDetailEvents, EndpointDetailSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const EndpointDetail: $$__sveltets_2_IsomorphicComponent<{
+    api_name?: string | null;
+    description?: string | null;
+    analytics: Record<string, any>;
+    last_api_call?: Payload | null;
+    dependency_id?: number | null;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type EndpointDetail = InstanceType<typeof EndpointDetail>;
+export default EndpointDetail;

package/dist/src/api_docs/IconArrowUpRight.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+	export let classNames = "";
+</script>
+
+<svg
+	class={classNames || "menu-icon-arrow"}
+	xmlns="http://www.w3.org/2000/svg"
+	width="24"
+	height="24"
+	viewBox="0 0 24 24"
+	fill="none"
+	stroke="currentColor"
+	stroke-width="1.75"
+	stroke-linecap="round"
+	stroke-linejoin="round"
+>
+	<path d="M7 7h10v10"></path>
+	<path d="M7 17 17 7"></path>
+</svg>
+
+<style>
+	.menu-icon-arrow {
+		width: 1rem;
+		height: 1rem;
+		color: rgb(107, 114, 128);
+		flex-shrink: 0;
+	}
+
+	@media (prefers-color-scheme: dark) {
+		.menu-icon-arrow {
+			color: rgb(209, 213, 219);
+		}
+	}
+</style>

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

@@ -0,0 +1,20 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const IconArrowUpRight: $$__sveltets_2_IsomorphicComponent<{
+    classNames?: string;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type IconArrowUpRight = InstanceType<typeof IconArrowUpRight>;
+export default IconArrowUpRight;

package/dist/src/api_docs/IconCaret.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+	export let classNames = "";
+</script>
+
+<svg
+	class={classNames}
+	width="1em"
+	height="1em"
+	viewBox="0 0 12 7"
+	fill="none"
+	xmlns="http://www.w3.org/2000/svg"
+>
+	<path d="M1 1L6 6L11 1" stroke="currentColor" />
+</svg>
+
+<style>
+	.caret-icon {
+		transition: transform 0.2s ease-in-out;
+		color: rgb(156, 163, 175);
+		overflow: visible;
+		width: 0.75rem;
+		height: 0.75rem;
+	}
+
+	@media (max-width: 640px) {
+		.caret-icon {
+			width: 0.625rem;
+			height: 0.625rem;
+		}
+	}
+
+	.rotate-180 {
+		transform: rotate(180deg);
+	}
+
+	.rotate-0 {
+		transform: rotate(0deg);
+	}
+</style>

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

@@ -0,0 +1,20 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const IconCaret: $$__sveltets_2_IsomorphicComponent<{
+    classNames?: string;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type IconCaret = InstanceType<typeof IconCaret>;
+export default IconCaret;

package/dist/src/api_docs/IconHuggingChat.svelte

@@ -0,0 +1,62 @@
+<script lang="ts">
+	export let classNames = "";
+</script>
+
+<svg
+	class={classNames || "icon-size"}
+	width="1em"
+	height="1em"
+	viewBox="5 5 22 22"
+	fill="none"
+	xmlns="http://www.w3.org/2000/svg"
+>
+	<title>HuggingChat</title>
+	<path
+		d="M16.0006 25.9992C13.8266 25.999 11.7118 25.2901 9.97686 23.9799C8.2419 22.6698 6.98127 20.8298 6.38599 18.7388C5.79071 16.6478 5.89323 14.4198 6.678 12.3923C7.46278 10.3648 8.88705 8.64837 10.735 7.50308C12.5829 6.35779 14.7538 5.84606 16.9187 6.04544C19.0837 6.24481 21.1246 7.14442 22.7323 8.60795C24.34 10.0715 25.4268 12.0192 25.8281 14.1559C26.2293 16.2926 25.9232 18.5019 24.9561 20.449C24.7703 20.8042 24.7223 21.2155 24.8211 21.604L25.4211 23.8316C25.4803 24.0518 25.4805 24.2837 25.4216 24.5039C25.3627 24.7242 25.2468 24.925 25.0856 25.0862C24.9244 25.2474 24.7235 25.3633 24.5033 25.4222C24.283 25.4811 24.0512 25.4809 23.831 25.4217L21.6034 24.8217C21.2172 24.7248 20.809 24.7729 20.4558 24.9567C19.0683 25.6467 17.5457 26.0068 16.0006 26.0068V25.9992Z"
+		fill="black"
+		class="block dark:hidden"
+	/>
+	<path
+		d="M9.62598 16.0013C9.62598 15.3799 10.1294 14.8765 10.7508 14.8765C11.3721 14.8765 11.8756 15.3799 11.8756 16.0013C11.8756 17.0953 12.3102 18.1448 13.0838 18.9184C13.8574 19.692 14.9069 20.1266 16.001 20.1267C17.095 20.1267 18.1445 19.692 18.9181 18.9184C19.6918 18.1448 20.1264 17.0953 20.1264 16.0013C20.1264 15.3799 20.6299 14.8765 21.2512 14.8765C21.8725 14.8765 22.3759 15.3799 22.3759 16.0013C22.3759 17.6921 21.7046 19.3137 20.509 20.5093C19.3134 21.7049 17.6918 22.3762 16.001 22.3762C14.3102 22.3762 12.6885 21.7049 11.4929 20.5093C10.2974 19.3137 9.62598 17.6921 9.62598 16.0013Z"
+		fill="white"
+		class="block dark:hidden"
+	/>
+	<path
+		d="M16.0006 25.9992C13.8266 25.999 11.7118 25.2901 9.97686 23.9799C8.2419 22.6698 6.98127 20.8298 6.38599 18.7388C5.79071 16.6478 5.89323 14.4198 6.678 12.3923C7.46278 10.3648 8.88705 8.64837 10.735 7.50308C12.5829 6.35779 14.7538 5.84606 16.9187 6.04544C19.0837 6.24481 21.1246 7.14442 22.7323 8.60795C24.34 10.0715 25.4268 12.0192 25.8281 14.1559C26.2293 16.2926 25.9232 18.5019 24.9561 20.449C24.7703 20.8042 24.7223 21.2155 24.8211 21.604L25.4211 23.8316C25.4803 24.0518 25.4805 24.2837 25.4216 24.5039C25.3627 24.7242 25.2468 24.925 25.0856 25.0862C24.9244 25.2474 24.7235 25.3633 24.5033 25.4222C24.283 25.4811 24.0512 25.4809 23.831 25.4217L21.6034 24.8217C21.2172 24.7248 20.809 24.7729 20.4558 24.9567C19.0683 25.6467 17.5457 26.0068 16.0006 26.0068V25.9992Z"
+		fill="white"
+		class="hidden dark:block"
+	/>
+	<path
+		d="M9.62598 16.0013C9.62598 15.3799 10.1294 14.8765 10.7508 14.8765C11.3721 14.8765 11.8756 15.3799 11.8756 16.0013C11.8756 17.0953 12.3102 18.1448 13.0838 18.9184C13.8574 19.692 14.9069 20.1266 16.001 20.1267C17.095 20.1267 18.1445 19.692 18.9181 18.9184C19.6918 18.1448 20.1264 17.0953 20.1264 16.0013C20.1264 15.3799 20.6299 14.8765 21.2512 14.8765C21.8725 14.8765 22.3759 15.3799 22.3759 16.0013C22.3759 17.6921 21.7046 19.3137 20.509 20.5093C19.3134 21.7049 17.6918 22.3762 16.001 22.3762C14.3102 22.3762 12.6885 21.7049 11.4929 20.5093C10.2974 19.3137 9.62598 17.6921 9.62598 16.0013Z"
+		fill="black"
+		class="hidden dark:block"
+	/>
+</svg>
+
+<style>
+	.icon-size {
+		width: 0.75rem;
+		height: 0.75rem;
+	}
+
+	@media (max-width: 640px) {
+		.icon-size {
+			width: 0.625rem;
+			height: 0.625rem;
+		}
+	}
+
+	.menu-icon {
+		width: 1rem;
+		height: 1rem;
+		flex-shrink: 0;
+	}
+
+	.hidden {
+		display: none;
+	}
+
+	.block {
+		display: block;
+	}
+</style>

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

@@ -0,0 +1,20 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const IconHuggingChat: $$__sveltets_2_IsomorphicComponent<{
+    classNames?: string;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type IconHuggingChat = InstanceType<typeof IconHuggingChat>;
+export default IconHuggingChat;

package/dist/src/api_docs/InputPayload.svelte

@@ -1,14 +1,20 @@
-<script>import { BaseButton } from "@gradio/button";
-import { Block } from "@gradio/atoms";
-export let dependency;
-export let dependency_failures;
-export let dependency_index;
-export let instance_map;
-export let run;
-export let dependency_inputs;
-function format_label(label) {
-  return label ? "'" + label + "'" : "the";
-}
+<script lang="ts">
+	import type { ComponentMeta, Dependency } from "../types";
+	import { BaseButton } from "@gradio/button";
+	import { Block } from "@gradio/atoms";
+
+	export let dependency: Dependency;
+	export let dependency_failures: boolean[][];
+	export let dependency_index: number;
+	export let instance_map: {
+		[id: number]: ComponentMeta;
+	};
+	export let run: (id: number) => Promise<void>;
+	export let dependency_inputs: string[][];
+
+	function format_label(label: unknown): string {
+		return label ? "'" + label + "'" : "the";
+	}
 </script>
 
 <h4>

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

@@ -1,26 +1,28 @@
-import { SvelteComponent } from "svelte";
 import type { ComponentMeta, Dependency } from "../types";
-declare const __propDef: {
-    props: {
-        dependency: Dependency;
-        dependency_failures: boolean[][];
-        dependency_index: number;
-        instance_map: {
-            [id: number]: ComponentMeta;
-        };
-        run: (id: number) => Promise<void>;
-        dependency_inputs: string[][];
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
     };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-    exports?: {} | undefined;
-    bindings?: string | undefined;
-};
-export type InputPayloadProps = typeof __propDef.props;
-export type InputPayloadEvents = typeof __propDef.events;
-export type InputPayloadSlots = typeof __propDef.slots;
-export default class InputPayload extends SvelteComponent<InputPayloadProps, InputPayloadEvents, InputPayloadSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const InputPayload: $$__sveltets_2_IsomorphicComponent<{
+    dependency: Dependency;
+    dependency_failures: boolean[][];
+    dependency_index: number;
+    instance_map: {
+        [id: number]: ComponentMeta;
+    };
+    run: (id: number) => Promise<void>;
+    dependency_inputs: string[][];
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type InputPayload = InstanceType<typeof InputPayload>;
+export default InputPayload;

package/dist/src/api_docs/InstallSnippet.svelte

@@ -1,9 +1,12 @@
-<script>import CopyButton from "./CopyButton.svelte";
-import { Block } from "@gradio/atoms";
-export let current_language;
-let py_install = "pip install gradio_client";
-let js_install = "npm i -D @gradio/client";
-let bash_install = "curl --version";
+<script lang="ts">
+	import CopyButton from "./CopyButton.svelte";
+	import { Block } from "@gradio/atoms";
+
+	export let current_language: "python" | "javascript" | "bash" | "mcp";
+
+	let py_install = "pip install gradio_client";
+	let js_install = "npm i -D @gradio/client";
+	let bash_install = "curl --version";
 </script>
 
 <Block>

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

@@ -1,18 +1,20 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        current_language: "python" | "javascript" | "bash" | "mcp";
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
     };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-    exports?: {} | undefined;
-    bindings?: string | undefined;
-};
-export type InstallSnippetProps = typeof __propDef.props;
-export type InstallSnippetEvents = typeof __propDef.events;
-export type InstallSnippetSlots = typeof __propDef.slots;
-export default class InstallSnippet extends SvelteComponent<InstallSnippetProps, InstallSnippetEvents, InstallSnippetSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const InstallSnippet: $$__sveltets_2_IsomorphicComponent<{
+    current_language: "python" | "javascript" | "bash" | "mcp";
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type InstallSnippet = InstanceType<typeof InstallSnippet>;
+export default InstallSnippet;