@gradio/core 0.29.2 → 1.0.0-dev.3

package/dist/src/Blocks.svelte.d.ts

@@ -1,49 +1,34 @@
-import { SvelteComponent } from "svelte";
 import { Client } from "@gradio/client";
-import type { ComponentMeta, Dependency, LayoutNode } from "./types";
+import type { ComponentMeta, Dependency as IDependency, LayoutNode } from "./types";
 import type { ThemeMode } from "./types";
-import type { ToastMessage } from "@gradio/statustracker";
-declare const __propDef: {
-    props: {
-        root: string;
-        components: ComponentMeta[];
-        layout: LayoutNode;
-        dependencies: Dependency[];
-        title?: string;
-        target: HTMLElement;
-        autoscroll: boolean;
-        show_api?: boolean;
-        show_footer?: boolean;
-        control_page_title?: boolean;
-        app_mode: boolean;
-        theme_mode: ThemeMode;
-        app: Awaited<ReturnType<typeof Client.connect>>;
-        space_id: string | null;
-        version: string;
-        js: string | null;
-        fill_height?: boolean;
-        ready: boolean;
-        username: string | null;
-        api_prefix?: string;
-        max_file_size?: number | undefined;
-        initial_layout?: ComponentMeta | undefined;
-        css?: string | null | undefined;
-        vibe_mode?: boolean;
-        search_params: URLSearchParams;
-        render_complete?: boolean;
-        add_new_message?: (title: string, message: string, type: ToastMessage["type"]) => void;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-    exports?: {} | undefined;
-    bindings?: string | undefined;
+type $$ComponentProps = {
+    root: string;
+    components: ComponentMeta[];
+    layout: LayoutNode;
+    dependencies: IDependency[];
+    title: string;
+    target: HTMLElement;
+    autoscroll: boolean;
+    footer_links: string[];
+    control_page_title: boolean;
+    app_mode: boolean;
+    theme_mode: ThemeMode;
+    app: Awaited<ReturnType<typeof Client.connect>>;
+    space_id: string | null;
+    version: string;
+    js: string | null;
+    fill_height: boolean;
+    username: string | null;
+    api_prefix: string;
+    max_file_size: number | undefined;
+    initial_layout: ComponentMeta | undefined;
+    css: string | null | undefined;
+    vibe_mode: boolean;
+    search_params: URLSearchParams;
+    render_complete: boolean;
+    ready: boolean;
+    reload_count: number;
 };
-export type BlocksProps = typeof __propDef.props;
-export type BlocksEvents = typeof __propDef.events;
-export type BlocksSlots = typeof __propDef.slots;
-export default class Blocks extends SvelteComponent<BlocksProps, BlocksEvents, BlocksSlots> {
-    get add_new_message(): (title: string, message: string, type: ToastMessage["type"]) => void;
-}
-export {};
+declare const Blocks: import("svelte").Component<$$ComponentProps, {}, "ready" | "reload_count">;
+type Blocks = ReturnType<typeof Blocks>;
+export default Blocks;

package/dist/src/Embed.svelte

@@ -1,58 +1,85 @@
-<script>import { getContext, onMount } from "svelte";
-import space_logo from "./images/spaces.svg";
-import { _ } from "svelte-i18n";
-import { navbar_config } from "./navbar_store";
-export let wrapper;
-export let version;
-export let initial_height;
-export let fill_width;
-export let is_embed;
-export let space;
-export let display;
-export let info;
-export let loaded;
-export let pages = [];
-export let current_page = "";
-export let root;
-export let components = [];
-let navbar_component = components.find((c) => c.type === "navbar");
-let navbar = navbar_component ? {
-  visible: navbar_component.props.visible,
-  main_page_name: navbar_component.props.main_page_name,
-  value: navbar_component.props.value
-} : null;
-if (navbar) {
-  navbar_config.set(navbar);
-}
-$: if ($navbar_config) {
-  navbar = {
-    visible: $navbar_config.visible ?? true,
-    main_page_name: $navbar_config.main_page_name ?? "Home",
-    value: $navbar_config.value ?? null
-  };
-}
-$: show_navbar = pages.length > 1 && (navbar === null || navbar.visible !== false);
-$: effective_pages = (() => {
-  let visible_pages = pages.filter(([route, label, show], index) => {
-    if (index === 0 && route === "") {
-      return navbar?.main_page_name !== false;
-    }
-    return show !== false;
-  });
-  let base_pages = navbar && navbar.main_page_name !== false && navbar.main_page_name !== "Home" ? visible_pages.map(
-    ([route, label, show], index) => index === 0 && route === "" && label === "Home" ? [route, navbar.main_page_name] : [route, label]
-  ) : visible_pages.map(
-    ([route, label]) => [route, label]
-  );
-  if (navbar?.value && navbar.value.length > 0) {
-    const existing_routes = new Set(base_pages.map(([route]) => route));
-    const additional_pages = navbar.value.map(
-      ([page_name, page_path]) => [page_path, page_name]
-    ).filter(([route]) => !existing_routes.has(route));
-    return [...base_pages, ...additional_pages];
-  }
-  return base_pages;
-})();
+<script lang="ts">
+	import { getContext, onMount } from "svelte";
+	import space_logo from "./images/spaces.svg";
+	import { _ } from "svelte-i18n";
+	import { navbar_config } from "./navbar_store";
+
+	export let wrapper: HTMLDivElement;
+	export let version: string;
+	export let initial_height: string;
+	export let fill_width: boolean;
+	export let is_embed: boolean;
+
+	export let space: string | null;
+	export let display: boolean;
+	export let info: boolean;
+	export let loaded: boolean;
+	export let pages: [string, string, boolean][] = [];
+	export let current_page = "";
+	export let root: string;
+	export let components: any[] = [];
+
+	let navbar_component = components.find((c) => c.type === "navbar");
+	let navbar: {
+		visible: boolean;
+		main_page_name: string | false;
+		value: [string, string][] | null;
+	} | null = navbar_component
+		? {
+				visible: navbar_component.props.visible,
+				main_page_name: navbar_component.props.main_page_name,
+				value: navbar_component.props.value
+			}
+		: null;
+
+	if (navbar) {
+		navbar_config.set(navbar);
+	}
+
+	$: if ($navbar_config) {
+		navbar = {
+			visible: $navbar_config.visible ?? true,
+			main_page_name: $navbar_config.main_page_name ?? "Home",
+			value: $navbar_config.value ?? null
+		};
+	}
+
+	$: show_navbar =
+		pages.length > 1 && (navbar === null || navbar.visible !== false);
+
+	$: effective_pages = (() => {
+		let visible_pages = pages.filter(([route, label, show], index) => {
+			if (index === 0 && route === "") {
+				return navbar?.main_page_name !== false;
+			}
+			return show !== false;
+		});
+
+		let base_pages =
+			navbar &&
+			navbar.main_page_name !== false &&
+			navbar.main_page_name !== "Home"
+				? visible_pages.map(([route, label, show], index) =>
+						index === 0 && route === "" && label === "Home"
+							? ([route, navbar!.main_page_name] as [string, string])
+							: ([route, label] as [string, string])
+					)
+				: visible_pages.map(
+						([route, label]) => [route, label] as [string, string]
+					);
+
+		if (navbar?.value && navbar.value.length > 0) {
+			const existing_routes = new Set(base_pages.map(([route]) => route));
+			const additional_pages = navbar.value
+				.map(
+					([page_name, page_path]) => [page_path, page_name] as [string, string]
+				)
+				.filter(([route]) => !existing_routes.has(route));
+			return [...base_pages, ...additional_pages];
+		}
+
+		return base_pages;
+	})();
 </script>
 
 <div

package/dist/src/Embed.svelte.d.ts

@@ -1,32 +1,41 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        wrapper: HTMLDivElement;
-        version: string;
-        initial_height: string;
-        fill_width: boolean;
-        is_embed: boolean;
-        space: string | null;
-        display: boolean;
-        info: boolean;
-        loaded: boolean;
-        pages?: [string, string, boolean][];
-        current_page?: string;
-        root: string;
-        components?: any[];
+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: {
-        default: {};
-    };
-    exports?: {} | undefined;
-    bindings?: string | undefined;
-};
-export type EmbedProps = typeof __propDef.props;
-export type EmbedEvents = typeof __propDef.events;
-export type EmbedSlots = typeof __propDef.slots;
-export default class Embed extends SvelteComponent<EmbedProps, EmbedEvents, EmbedSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+declare const Embed: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    wrapper: HTMLDivElement;
+    version: string;
+    initial_height: string;
+    fill_width: boolean;
+    is_embed: boolean;
+    space: string | null;
+    display: boolean;
+    info: boolean;
+    loaded: boolean;
+    pages?: [string, string, boolean][];
+    current_page?: string;
+    root: string;
+    components?: any[];
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type Embed = InstanceType<typeof Embed>;
+export default Embed;

package/dist/src/Login.svelte

@@ -1,32 +1,36 @@
-<script>import Form from "@gradio/form";
-import { BaseTextbox as Textbox } from "@gradio/textbox";
-import { BaseButton } from "@gradio/button";
-import Column from "@gradio/column";
-import { Block } from "@gradio/atoms";
-import { _ } from "svelte-i18n";
-export let root;
-export let auth_message;
-export let app_mode;
-export let space_id;
-let username = "";
-let password = "";
-let incorrect_credentials = false;
-const submit = async () => {
-  const formData = new FormData();
-  formData.append("username", username);
-  formData.append("password", password);
-  let response = await fetch(root + "/login", {
-    method: "POST",
-    body: formData
-  });
-  if (response.status === 400) {
-    incorrect_credentials = true;
-    username = "";
-    password = "";
-  } else if (response.status == 200) {
-    location.reload();
-  }
-};
+<script lang="ts">
+	import Form from "@gradio/form";
+	import { BaseTextbox as Textbox } from "@gradio/textbox";
+	import { BaseButton } from "@gradio/button";
+	import Column from "@gradio/column";
+	import { Block } from "@gradio/atoms";
+	import { _ } from "svelte-i18n";
+	export let root: string;
+	export let auth_message: string | null;
+	export let app_mode: boolean;
+	export let space_id: string | null;
+
+	let username = "";
+	let password = "";
+	let incorrect_credentials = false;
+
+	const submit = async (): Promise<void> => {
+		const formData = new FormData();
+		formData.append("username", username);
+		formData.append("password", password);
+
+		let response = await fetch(root + "/login", {
+			method: "POST",
+			body: formData
+		});
+		if (response.status === 400) {
+			incorrect_credentials = true;
+			username = "";
+			password = "";
+		} else if (response.status == 200) {
+			location.reload();
+		}
+	};
 </script>
 
 <div class="wrap" class:min-h-screen={app_mode}>

package/dist/src/Login.svelte.d.ts

@@ -1,21 +1,23 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        root: string;
-        auth_message: string | null;
-        app_mode: boolean;
-        space_id: string | null;
+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 LoginProps = typeof __propDef.props;
-export type LoginEvents = typeof __propDef.events;
-export type LoginSlots = typeof __propDef.slots;
-export default class Login extends SvelteComponent<LoginProps, LoginEvents, LoginSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const Login: $$__sveltets_2_IsomorphicComponent<{
+    root: string;
+    auth_message: string | null;
+    app_mode: boolean;
+    space_id: string | null;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type Login = InstanceType<typeof Login>;
+export default Login;

package/dist/src/MountComponents.svelte

@@ -1,28 +1,22 @@
-<script>import { onMount, createEventDispatcher } from "svelte";
-import Render from "./Render.svelte";
-export let rootNode;
-export let root;
-export let target;
-export let theme_mode;
-export let version;
-export let autoscroll;
-export let max_file_size = null;
-export let client;
-const dispatch = createEventDispatcher();
-onMount(() => {
-  dispatch("mount");
-});
+<script lang="ts">
+	import Self from "./MountComponents.svelte";
+	let { node } = $props();
+
+	let component = $derived(await node.component);
 </script>
 
-{#if rootNode}
-	<Render
-		node={rootNode}
-		{root}
-		{target}
-		{theme_mode}
-		{version}
-		{autoscroll}
-		{max_file_size}
-		{client}
-	/>
+{#if node && component}
+	{#if node.props.shared_props.visible}
+		<svelte:component
+			this={component.default}
+			shared_props={node.props.shared_props}
+			props={node.props.props}
+		>
+			{#if node.children && node.children.length}
+				{#each node.children as _node}
+					<Self node={_node} />
+				{/each}
+			{/if}
+		</svelte:component>
+	{/if}
 {/if}

package/dist/src/MountComponents.svelte.d.ts

@@ -1,28 +1,5 @@
-import { SvelteComponent } from "svelte";
-import type { Client } from "@gradio/client";
-declare const __propDef: {
-    props: {
-        rootNode: any;
-        root: any;
-        target: any;
-        theme_mode: any;
-        version: any;
-        autoscroll: boolean;
-        max_file_size?: number | null;
-        client: Client;
-    };
-    events: {
-        mount?: CustomEvent<undefined> | undefined;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-    exports?: {} | undefined;
-    bindings?: string | undefined;
-};
-export type MountComponentsProps = typeof __propDef.props;
-export type MountComponentsEvents = typeof __propDef.events;
-export type MountComponentsSlots = typeof __propDef.slots;
-export default class MountComponents extends SvelteComponent<MountComponentsProps, MountComponentsEvents, MountComponentsSlots> {
-}
-export {};
+declare const MountComponents: import("svelte").Component<{
+    node: any;
+}, {}, "">;
+type MountComponents = ReturnType<typeof MountComponents>;
+export default MountComponents;

package/dist/src/{init.d.ts → _init.d.ts}

@@ -7,6 +7,8 @@ export interface UpdateTransaction {
     value: any;
     prop: string;
 }
+type set_data_type = (data: Record<string, unknown>) => void;
+type get_data_type = () => Promise<Record<string, unknown>>;
 /**
  * Create a store with the layout and a map of targets
  * @returns A store with the layout and a map of targets
@@ -16,13 +18,12 @@ export declare function create_components({ initial_layout }?: {
 }): {
     layout: Writable<ComponentMeta>;
     targets: Writable<TargetMap>;
-    update_value: (updates: UpdateTransaction[]) => void;
-    get_data: (id: number) => any | Promise<any>;
+    get_data: (id: number) => Promise<unknown> | void;
+    set_data: (id: number, data: Record<string, unknown>) => void;
     modify_stream: (id: number, state: "open" | "waiting" | "closed") => void;
     get_stream_state: (id: number) => "open" | "waiting" | "closed" | "not_set";
     set_time_limit: (id: number, time_limit: number | undefined) => void;
     loading_status: ReturnType<typeof create_loading_status_store>;
-    scheduled_updates: Writable<boolean>;
     create_layout: (args: {
         app: client_return;
         components: ComponentMeta[];
@@ -40,7 +41,7 @@ export declare function create_components({ initial_layout }?: {
         root: string;
         dependencies: Dependency[];
     }) => void;
-    value_change: (cb: (id: number, value: any) => void) => void;
+    register_component: (id: number, set: set_data_type, get: get_data_type) => void;
 };
 /** An async version of 'new Function' */
 export declare const AsyncFunction: new (...args: string[]) => (...args: any[]) => Promise<any>;