@gradio/core 0.0.2 → 0.0.4

package/dist/src/lang/zh-TW.json

@@ -0,0 +1,16 @@
+{
+	"common": {
+		"built_with_gradio": "使用Gradio構建",
+		"clear": "清除",
+		"or": "或",
+		"submit": "提交"
+	},
+	"upload_text": {
+		"click_to_upload": "點擊上傳",
+		"drop_audio": "拖放音訊至此處",
+		"drop_csv": "拖放CSV至此處",
+		"drop_file": "拖放檔案至此處",
+		"drop_image": "拖放圖片至此處",
+		"drop_video": "拖放影片至此處"
+	}
+}

package/dist/src/s-blocks.d.ts

@@ -0,0 +1 @@
+export { default as default } from "./Blocks.svelte";

package/dist/src/s-blocks.js

@@ -0,0 +1 @@
+export { default as default } from "./Blocks.svelte";

package/dist/src/s-login.d.ts

@@ -0,0 +1 @@
+export { default as default } from "./Login.svelte";

package/dist/src/s-login.js

@@ -0,0 +1 @@
+export { default as default } from "./Login.svelte";

package/dist/src/stores.d.ts

@@ -0,0 +1,30 @@
+import { type Writable } from "svelte/store";
+export interface LoadingStatus {
+    eta: number | null;
+    status: "pending" | "error" | "complete" | "generating";
+    queue: boolean;
+    queue_position: number | null;
+    queue_size?: number;
+    fn_index: number;
+    message?: string | null;
+    scroll_to_output?: boolean;
+    show_progress?: "full" | "minimal" | "hidden";
+    progress?: {
+        progress: number | null;
+        index: number | null;
+        length: number | null;
+        unit: string | null;
+        desc: string | null;
+    }[];
+}
+export type LoadingStatusCollection = Record<number, LoadingStatus>;
+interface LoadingStatusStore {
+    update: (status: LoadingStatus) => void;
+    subscribe: Writable<LoadingStatusCollection>["subscribe"];
+    register: (index: number, inputs: number[], outputs: number[]) => void;
+    get_status_for_fn: (i: number) => LoadingStatus["status"];
+    get_inputs_to_update: () => Map<number, string>;
+}
+export declare function create_loading_status_store(): LoadingStatusStore;
+export type LoadingStatusType = ReturnType<typeof create_loading_status_store>;
+export {};

package/dist/src/stores.js

@@ -0,0 +1,93 @@
+import { writable, get } from "svelte/store";
+export function create_loading_status_store() {
+    const store = writable({});
+    const fn_inputs = {};
+    const fn_outputs = {};
+    const pending_outputs = new Map();
+    const pending_inputs = new Map();
+    const inputs_to_update = new Map();
+    const fn_status = {};
+    function update({ fn_index, status, queue = true, size, position = null, eta = null, message = null, progress }) {
+        const outputs = fn_outputs[fn_index];
+        const inputs = fn_inputs[fn_index];
+        const last_status = fn_status[fn_index];
+        const outputs_to_update = outputs.map((id) => {
+            let new_status;
+            const pending_count = pending_outputs.get(id) || 0;
+            // from (pending -> error) | complete - decrement pending count
+            if (last_status === "pending" && status !== "pending") {
+                let new_count = pending_count - 1;
+                pending_outputs.set(id, new_count < 0 ? 0 : new_count);
+                new_status = new_count > 0 ? "pending" : status;
+                // from pending -> pending - do nothing
+            }
+            else if (last_status === "pending" && status === "pending") {
+                new_status = "pending";
+                // (error | complete) -> pending - - increment pending count
+            }
+            else if (last_status !== "pending" && status === "pending") {
+                new_status = "pending";
+                pending_outputs.set(id, pending_count + 1);
+            }
+            else {
+                new_status = status;
+            }
+            return {
+                id,
+                queue_position: position,
+                queue_size: size,
+                eta: eta,
+                status: new_status,
+                message: message,
+                progress: progress
+            };
+        });
+        inputs.forEach((id) => {
+            const pending_count = pending_inputs.get(id) || 0;
+            // from (pending -> error) | complete - decrement pending count
+            if (last_status === "pending" && status !== "pending") {
+                let new_count = pending_count - 1;
+                pending_inputs.set(id, new_count < 0 ? 0 : new_count);
+                inputs_to_update.set(id, status);
+            }
+            else if (last_status !== "pending" && status === "pending") {
+                pending_inputs.set(id, pending_count + 1);
+                inputs_to_update.set(id, status);
+            }
+            else {
+                inputs_to_update.delete(id);
+            }
+        });
+        store.update((outputs) => {
+            outputs_to_update.forEach(({ id, queue_position, queue_size, eta, status, message, progress }) => {
+                outputs[id] = {
+                    queue: queue,
+                    queue_size: queue_size,
+                    queue_position: queue_position,
+                    eta: eta,
+                    message: message,
+                    progress,
+                    status,
+                    fn_index
+                };
+            });
+            return outputs;
+        });
+        fn_status[fn_index] = status;
+    }
+    function register(index, inputs, outputs) {
+        fn_inputs[index] = inputs;
+        fn_outputs[index] = outputs;
+    }
+    return {
+        update,
+        register,
+        subscribe: store.subscribe,
+        get_status_for_fn(i) {
+            return fn_status[i];
+        },
+        get_inputs_to_update() {
+            return inputs_to_update;
+        }
+    };
+}

package/dist/src/types.d.ts

@@ -0,0 +1,95 @@
+import type { ComponentType } from "svelte";
+import type { SvelteComponent } from "svelte";
+/** The props that are always present on a component */
+interface SharedProps {
+    elem_id?: string;
+    elem_classes?: string[];
+    components?: string[];
+    server_fns?: string[];
+    interactive: boolean;
+    [key: string]: unknown;
+}
+/** The metadata for a component
+ * The non optional fields are what are received from the backend
+ * The optional fields are what are added by the frontend
+ */
+export interface ComponentMeta {
+    type: string;
+    id: number;
+    has_modes: boolean;
+    props: SharedProps;
+    instance: SvelteComponent;
+    component: ComponentType<SvelteComponent>;
+    documentation?: Documentation;
+    children?: ComponentMeta[];
+    parent?: ComponentMeta;
+    value?: any;
+    component_class_id: string;
+    key: string | number | null;
+    rendered_in?: number;
+}
+/** Dictates whether a dependency is continous and/or a generator */
+export interface DependencyTypes {
+    generator: boolean;
+    cancel: boolean;
+}
+/** An event payload that is sent with an API request */
+export interface Payload {
+    fn_index: number;
+    data: unknown[];
+    event_data?: unknown | null;
+    trigger_id?: number | null;
+}
+/** A dependency as received from the backend */
+export interface Dependency {
+    id: number;
+    targets: [number, string][];
+    inputs: number[];
+    outputs: number[];
+    backend_fn: boolean;
+    js: string | null;
+    scroll_to_output: boolean;
+    show_progress: "full" | "minimal" | "hidden";
+    frontend_fn: ((...args: unknown[]) => Promise<unknown[]>) | null;
+    status?: string;
+    queue: boolean | null;
+    api_name: string | null;
+    cancels: number[];
+    types: DependencyTypes;
+    collects_event_data: boolean;
+    pending_request?: boolean;
+    trigger_after?: number;
+    trigger_only_on_success?: boolean;
+    trigger_mode: "once" | "multiple" | "always_last";
+    final_event: Payload | null;
+    show_api: boolean;
+    rendered_in: number | null;
+}
+interface TypeDescription {
+    input_payload?: string;
+    response_object?: string;
+    payload?: string;
+}
+export interface Documentation {
+    type?: TypeDescription;
+    description?: TypeDescription;
+    example_data?: string;
+}
+/** A layout node as recived from the backend */
+export interface LayoutNode {
+    id: number;
+    children: LayoutNode[];
+}
+/** The system theme mode */
+export type ThemeMode = "system" | "light" | "dark";
+/** the target map is an object mapping the target id to a series of events (another object), those events are a mapping of the event name to the function id's they trigger */
+export type TargetMap = Record<number, Record<string, number[]>>;
+/** A component that has been loaded via dynamic import */
+export type LoadedComponent = {
+    default: ComponentMeta["component"];
+};
+/**A component that is loading */
+export type LoadingComponent = Promise<{
+    default: ComponentMeta["component"];
+}>;
+export {};

package/dist/src/types.js

@@ -0,0 +1 @@
+export {};

package/dist/src/vite-env-override.d.ts

@@ -0,0 +1,20 @@
+// See https://vitejs.dev/guide/features.html#client-types
+
+declare module "*.whl" {
+	const content: string;
+	export default content;
+}
+
+// virtual module component type definition
+declare module "virtual:component-loader" {
+	interface Args {
+		api_url: string;
+		name: string;
+		id?: string;
+		variant: "component" | "example" | "base";
+	}
+	export function load_component(args: Args): {
+		name: ComponentMeta["type"];
+		component: LoadedComponent;
+	};
+}

package/package.json

@@ -1,64 +1,64 @@
 {
   "name": "@gradio/core",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "type": "module",
   "devDependencies": {
-    "@gradio/accordion": "^0.3.22",
-    "@gradio/annotatedimage": "^0.7.1",
-    "@gradio/atoms": "^0.8.0",
-    "@gradio/audio": "^0.13.3",
-    "@gradio/box": "^0.1.24",
-    "@gradio/button": "^0.2.50",
-    "@gradio/chatbot": "^0.13.0",
-    "@gradio/checkbox": "^0.3.12",
-    "@gradio/client": "^1.5.1",
-    "@gradio/checkboxgroup": "^0.5.12",
-    "@gradio/code": "^0.9.0",
-    "@gradio/colorpicker": "^0.3.12",
-    "@gradio/column": "^0.1.3",
-    "@gradio/dataframe": "^0.10.0",
-    "@gradio/dataset": "^0.2.4",
-    "@gradio/datetime": "^0.1.3",
-    "@gradio/downloadbutton": "^0.1.27",
-    "@gradio/dropdown": "^0.7.12",
-    "@gradio/fallback": "^0.3.12",
-    "@gradio/file": "^0.9.3",
-    "@gradio/fileexplorer": "^0.4.18",
-    "@gradio/form": "^0.1.24",
-    "@gradio/group": "^0.1.2",
-    "@gradio/gallery": "^0.12.1",
-    "@gradio/highlightedtext": "^0.7.6",
-    "@gradio/icons": "^0.7.1",
-    "@gradio/image": "^0.15.0",
-    "@gradio/imageeditor": "^0.10.0",
-    "@gradio/html": "^0.3.5",
-    "@gradio/json": "^0.4.0",
-    "@gradio/label": "^0.3.12",
-    "@gradio/markdown": "^0.9.3",
-    "@gradio/model3d": "^0.12.1",
-    "@gradio/multimodaltextbox": "^0.5.6",
-    "@gradio/nativeplot": "^0.3.1",
-    "@gradio/plot": "^0.6.4",
-    "@gradio/paramviewer": "^0.4.21",
-    "@gradio/number": "^0.4.12",
-    "@gradio/radio": "^0.5.12",
-    "@gradio/row": "^0.1.4",
-    "@gradio/simpledropdown": "^0.2.12",
-    "@gradio/simpleimage": "^0.7.0",
-    "@gradio/simpletextbox": "^0.2.12",
-    "@gradio/slider": "^0.4.12",
-    "@gradio/statustracker": "^0.7.5",
-    "@gradio/state": "^0.1.1",
-    "@gradio/tabitem": "^0.2.14",
-    "@gradio/tabs": "^0.2.13",
-    "@gradio/textbox": "^0.6.11",
-    "@gradio/theme": "^0.2.4",
-    "@gradio/timer": "^0.3.2",
-    "@gradio/upload": "^0.12.3",
-    "@gradio/uploadbutton": "^0.6.18",
-    "@gradio/utils": "^0.6.0",
-    "@gradio/wasm": "^0.13.0",
-    "@gradio/video": "^0.10.3"
+    "@gradio/annotatedimage": "^0.7.2",
+    "@gradio/accordion": "^0.3.23",
+    "@gradio/atoms": "^0.8.1",
+    "@gradio/box": "^0.1.25",
+    "@gradio/button": "^0.2.51",
+    "@gradio/audio": "^0.13.5",
+    "@gradio/checkbox": "^0.3.13",
+    "@gradio/chatbot": "^0.13.1",
+    "@gradio/checkboxgroup": "^0.5.13",
+    "@gradio/client": "^1.5.2",
+    "@gradio/code": "^0.9.1",
+    "@gradio/colorpicker": "^0.3.13",
+    "@gradio/column": "^0.1.4",
+    "@gradio/dataset": "^0.2.5",
+    "@gradio/dataframe": "^0.10.1",
+    "@gradio/downloadbutton": "^0.1.28",
+    "@gradio/datetime": "^0.1.4",
+    "@gradio/dropdown": "^0.7.13",
+    "@gradio/fallback": "^0.3.13",
+    "@gradio/file": "^0.9.4",
+    "@gradio/fileexplorer": "^0.4.19",
+    "@gradio/form": "^0.1.25",
+    "@gradio/gallery": "^0.12.2",
+    "@gradio/group": "^0.1.3",
+    "@gradio/highlightedtext": "^0.7.7",
+    "@gradio/html": "^0.3.6",
+    "@gradio/icons": "^0.7.2",
+    "@gradio/image": "^0.15.1",
+    "@gradio/imageeditor": "^0.10.1",
+    "@gradio/json": "^0.5.0",
+    "@gradio/label": "^0.3.13",
+    "@gradio/markdown": "^0.9.4",
+    "@gradio/model3d": "^0.12.2",
+    "@gradio/nativeplot": "^0.3.2",
+    "@gradio/number": "^0.4.13",
+    "@gradio/multimodaltextbox": "^0.5.7",
+    "@gradio/paramviewer": "^0.4.22",
+    "@gradio/radio": "^0.5.13",
+    "@gradio/plot": "^0.6.5",
+    "@gradio/row": "^0.1.5",
+    "@gradio/simpledropdown": "^0.2.13",
+    "@gradio/simpleimage": "^0.7.1",
+    "@gradio/simpletextbox": "^0.2.13",
+    "@gradio/slider": "^0.4.13",
+    "@gradio/state": "^0.1.2",
+    "@gradio/statustracker": "^0.7.6",
+    "@gradio/tabitem": "^0.2.15",
+    "@gradio/tabs": "^0.2.14",
+    "@gradio/theme": "^0.2.5",
+    "@gradio/textbox": "^0.7.0",
+    "@gradio/timer": "^0.3.3",
+    "@gradio/upload": "^0.12.4",
+    "@gradio/uploadbutton": "^0.6.19",
+    "@gradio/utils": "^0.6.1",
+    "@gradio/video": "^0.10.4",
+    "@gradio/wasm": "^0.13.1"
   },
   "msw": {
     "workerDirectory": "public"
@@ -66,13 +66,24 @@
   "main_changeset": true,
   "exports": {
     "./blocks": {
-      "svelte": "./src/Blocks.svelte"
+      "gradio": "./src/Blocks.svelte",
+      "svelte": "./dist/src/Blocks.svelte",
+      "types": "./dist/src/Blocks.svelte.d.ts"
     },
     "./login": {
-      "svelte": "./src/Login.svelte"
+      "gradio": "./src/Login.svelte",
+      "svelte": "./dist/src/Login.svelte",
+      "types": "./dist/src/Login.svelte.d.ts"
     },
     "./package.json": "./package.json",
-    ".": "./index.ts"
+    ".": {
+      "gradio": "./index.ts",
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "peerDependencies": {
+    "svelte": "^4.0.0"
   },
   "main": "./index.ts",
   "repository": {

package/src/Blocks.svelte

@@ -238,7 +238,7 @@
 				.then((v: unknown[]) => {
 					if (dep.backend_fn) {
 						payload.data = v;
-						make_prediction(payload);
+						trigger_prediction(dep, payload);
 					} else {
 						handle_update(v, dep_index);
 					}
@@ -253,16 +253,20 @@
 			);
 		} else {
 			if (dep.backend_fn) {
-				if (dep.trigger_mode === "once") {
-					if (!dep.pending_request) make_prediction(payload);
-				} else if (dep.trigger_mode === "multiple") {
+				trigger_prediction(dep, payload);
+			}
+		}
+
+		function trigger_prediction(dep: Dependency, payload: Payload): void {
+			if (dep.trigger_mode === "once") {
+				if (!dep.pending_request) make_prediction(payload);
+			} else if (dep.trigger_mode === "multiple") {
+				make_prediction(payload);
+			} else if (dep.trigger_mode === "always_last") {
+				if (!dep.pending_request) {
 					make_prediction(payload);
-				} else if (dep.trigger_mode === "always_last") {
-					if (!dep.pending_request) {
-						make_prediction(payload);
-					} else {
-						dep.final_event = payload;
-					}
+				} else {
+					dep.final_event = payload;
 				}
 			}
 		}

package/src/Render.svelte

@@ -4,6 +4,7 @@
 	import type { ComponentMeta, ThemeMode } from "./types";
 	import type { Client } from "@gradio/client";
 	import RenderComponent from "./RenderComponent.svelte";
+	import { load_component } from "virtual:component-loader";
 
 	export let root: string;
 
@@ -66,7 +67,8 @@
 		autoscroll,
 		max_file_size,
 		formatter,
-		client
+		client,
+		load_component
 	);
 </script>
 

package/src/api_docs/ApiDocs.svelte

@@ -7,7 +7,7 @@
 	import type { Payload } from "../types";
 
 	import ApiBanner from "./ApiBanner.svelte";
-	import Button from "../../../button/shared/Button.svelte";
+	import { BaseButton as Button } from "@gradio/button";
 	import ParametersSnippet from "./ParametersSnippet.svelte";
 	import InstallSnippet from "./InstallSnippet.svelte";
 	import CodeSnippet from "./CodeSnippet.svelte";

package/src/api_docs/ApiRecorder.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import type { Payload, Dependency } from "../types";
-	import Button from "../../../button/shared/Button.svelte";
+	import { BaseButton as Button } from "@gradio/button";
 
 	export let api_calls: Payload[] = [];
 	export let dependencies: Dependency[];