gradio

1
<script lang="ts" context="module">
2
	export { default as BaseUploadButton } from "./shared/UploadButton.svelte";
3
</script>
4

5
<script lang="ts">
6
	import type { Gradio } from "@gradio/utils";
7
	import type { FileData } from "@gradio/client";
8
	import UploadButton from "./shared/UploadButton.svelte";
9

10
	export let elem_id = "";
11
	export let elem_classes: string[] = [];
12
	export let visible = true;
13
	export let label: string | null;
14
	export let value: null | FileData | FileData[];
15
	export let file_count: string;
16
	export let file_types: string[] = [];
17
	export let root: string;
18
	export let size: "sm" | "lg" = "lg";
19
	export let scale: number | null = null;
20
	export let icon: FileData | null = null;
21
	export let min_width: number | undefined = undefined;
22
	export let variant: "primary" | "secondary" | "stop" = "secondary";
23
	export let gradio: Gradio<{
24
		change: never;
25
		upload: never;
26
		click: never;
27
	}>;
28
	export let interactive: boolean;
29

30
	$: disabled = !interactive;
31

32
	async function handle_event(
33
		detail: null | FileData | FileData[],
34
		event: "change" | "upload" | "click"
35
	): Promise<void> {
36
		value = detail;
37
		gradio.dispatch(event);
38
	}
39
</script>
40

41
<UploadButton
42
	{elem_id}
43
	{elem_classes}
44
	{visible}
45
	{file_count}
46
	{file_types}
47
	{size}
48
	{scale}
49
	{icon}
50
	{min_width}
51
	{root}
52
	{value}
53
	{disabled}
54
	{variant}
55
	{label}
56
	on:click={() => gradio.dispatch("click")}
57
	on:change={({ detail }) => handle_event(detail, "change")}
58
	on:upload={({ detail }) => handle_event(detail, "upload")}
59
>
60
	{label ? gradio.i18n(label) : ""}
61
</UploadButton>
62