@gradio/upload 0.9.0 → 0.10.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/CHANGELOG.md +33 -0
  2. package/package.json +7 -7
  3. package/src/Upload.svelte +7 -8
  4. package/src/UploadProgress.svelte +13 -16
package/CHANGELOG.md CHANGED
@@ -1,5 +1,38 @@
1
1
  # @gradio/upload
2
2
 
3
+ ## 0.10.1
4
+
5
+ ### Fixes
6
+
7
+ - [#8252](https://github.com/gradio-app/gradio/pull/8252) [`22df61a`](https://github.com/gradio-app/gradio/commit/22df61a26adf8023f6dd49c051979990e8d3879a) - Client node fix. Thanks @pngwn!
8
+
9
+ ### Dependency updates
10
+
11
+ - @gradio/atoms@0.7.3
12
+ - @gradio/client@0.19.0
13
+ - @gradio/icons@0.4.1
14
+ - @gradio/upload@0.10.1
15
+
16
+ ## 0.10.0
17
+
18
+ ### Features
19
+
20
+ - [#8121](https://github.com/gradio-app/gradio/pull/8121) [`f5b710c`](https://github.com/gradio-app/gradio/commit/f5b710c919b0ce604ea955f0d5f4faa91095ca4a) - chore(deps): update dependency eslint to v9. Thanks @renovate!
21
+ - [#8209](https://github.com/gradio-app/gradio/pull/8209) [`b9afe93`](https://github.com/gradio-app/gradio/commit/b9afe93915401df5bd6737c89395c2477acfa585) - Rename `eventSource_Factory` and `fetch_implementation`. Thanks @hannahblair!
22
+
23
+ ### Fixes
24
+
25
+ - [#8179](https://github.com/gradio-app/gradio/pull/8179) [`6a218b4`](https://github.com/gradio-app/gradio/commit/6a218b4148095aaa0c58d8c20973ba01c8764fc2) - rework upload to be a class method + pass client into each component. Thanks @pngwn!
26
+ - [#8118](https://github.com/gradio-app/gradio/pull/8118) [`7aca673`](https://github.com/gradio-app/gradio/commit/7aca673b38a087533524b2fd8dd3a03e0e4bacfe) - Add eventsource polyfill for Node.js and browser environments. Thanks @hannahblair!
27
+
28
+ ### Dependency updates
29
+
30
+ - @gradio/atoms@0.7.2
31
+ - @gradio/client@0.18.0
32
+ - @gradio/upload@0.10.0
33
+ - @gradio/utils@0.4.1
34
+ - @gradio/wasm@0.10.1
35
+
3
36
  ## 0.9.0
4
37
 
5
38
  ### Highlights
package/package.json CHANGED
@@ -1,18 +1,18 @@
1
1
  {
2
2
  "name": "@gradio/upload",
3
- "version": "0.9.0",
3
+ "version": "0.10.1",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "main": "src/index.ts",
7
7
  "author": "",
8
8
  "license": "ISC",
9
9
  "dependencies": {
10
- "@gradio/atoms": "^0.7.1",
11
- "@gradio/icons": "^0.4.0",
12
- "@gradio/upload": "^0.9.0",
13
- "@gradio/client": "^0.17.0",
14
- "@gradio/utils": "^0.4.0",
15
- "@gradio/wasm": "^0.10.0"
10
+ "@gradio/client": "^0.19.0",
11
+ "@gradio/upload": "^0.10.1",
12
+ "@gradio/icons": "^0.4.1",
13
+ "@gradio/utils": "^0.4.1",
14
+ "@gradio/wasm": "^0.10.1",
15
+ "@gradio/atoms": "^0.7.3"
16
16
  },
17
17
  "main_changeset": true,
18
18
  "exports": {
package/src/Upload.svelte CHANGED
@@ -1,7 +1,7 @@
1
1
  <script lang="ts">
2
2
  import { createEventDispatcher, tick, getContext } from "svelte";
3
3
  import type { FileData } from "@gradio/client";
4
- import { upload_files, upload, prepare_files } from "@gradio/client";
4
+ import { prepare_files, type Client } from "@gradio/client";
5
5
  import { _ } from "svelte-i18n";
6
6
  import UploadProgress from "./UploadProgress.svelte";
7
7
 
@@ -19,14 +19,13 @@
19
19
  export let hidden_upload: HTMLInputElement | null = null;
20
20
  export let show_progress = true;
21
21
  export let max_file_size: number | null = null;
22
+ export let upload: Client["upload"];
23
+ export let stream_handler: Client["stream"];
22
24
 
23
25
  let upload_id: string;
24
26
  let file_data: FileData[];
25
27
  let accept_file_types: string | null;
26
28
 
27
- // Needed for wasm support
28
- const upload_fn = getContext<typeof upload_files>("upload_files");
29
-
30
29
  const dispatch = createEventDispatcher();
31
30
  const validFileTypes = ["image", "video", "audio", "text", "file"];
32
31
  const processFileType = (type: string): string => {
@@ -89,8 +88,7 @@
89
88
  file_data,
90
89
  root,
91
90
  upload_id,
92
- max_file_size ?? Infinity,
93
- upload_fn
91
+ max_file_size ?? Infinity
94
92
  );
95
93
  dispatch("load", file_count === "single" ? _file_data?.[0] : _file_data);
96
94
  uploading = false;
@@ -109,7 +107,8 @@
109
107
  return;
110
108
  }
111
109
  let _files: File[] = files.map(
112
- (f) => new File([f], f.name, { type: f.type })
110
+ (f) =>
111
+ new File([f], f instanceof File ? f.name : "file", { type: f.type })
113
112
  );
114
113
  file_data = await prepare_files(_files);
115
114
  return await handle_upload(file_data);
@@ -201,7 +200,7 @@
201
200
  </button>
202
201
  {:else if uploading && show_progress}
203
202
  {#if !hidden}
204
- <UploadProgress {root} {upload_id} files={file_data} />
203
+ <UploadProgress {root} {upload_id} files={file_data} {stream_handler} />
205
204
  {/if}
206
205
  {:else}
207
206
  <button
package/src/UploadProgress.svelte CHANGED
@@ -1,19 +1,15 @@
1
1
  <script lang="ts">
2
- import { FileData } from "@gradio/client";
3
- import {
4
- onMount,
5
- createEventDispatcher,
6
- getContext,
7
- onDestroy
8
- } from "svelte";
2
+ import { FileData, type Client } from "@gradio/client";
3
+ import { onMount, createEventDispatcher, onDestroy } from "svelte";
9
4
 
10
5
  type FileDataWithProgress = FileData & { progress: number };
11
6
 
12
7
  export let upload_id: string;
13
8
  export let root: string;
14
9
  export let files: FileData[];
10
+ export let stream_handler: Client["stream"];
15
11
 
16
- let event_source: EventSource;
12
+ let stream: Awaited<ReturnType<Client["stream"]>>;
17
13
  let progress = false;
18
14
  let current_file_upload: FileDataWithProgress;
19
15
  let file_to_display: FileDataWithProgress;
@@ -41,19 +37,20 @@
41
37
  return (file.progress * 100) / (file.size || 0) || 0;
42
38
  }
43
39
 
44
- const EventSource_factory = getContext<(url: URL) => EventSource>(
45
- "EventSource_factory"
46
- );
47
- onMount(() => {
48
- event_source = EventSource_factory(
40
+ onMount(async () => {
41
+ stream = await stream_handler(
49
42
  new URL(`${root}/upload_progress?upload_id=${upload_id}`)
50
43
  );
44
+
45
+ if (stream == null) {
46
+ throw new Error("Event source is not defined");
47
+ }
51
48
  // Event listener for progress updates
52
- event_source.onmessage = async function (event) {
49
+ stream.onmessage = async function (event) {
53
50
  const _data = JSON.parse(event.data);
54
51
  if (!progress) progress = true;
55
52
  if (_data.msg === "done") {
56
- event_source.close();
53
+ stream?.close();
57
54
  dispatch("done");
58
55
  } else {
59
56
  current_file_upload = _data;
@@ -62,7 +59,7 @@
62
59
  };
63
60
  });
64
61
  onDestroy(() => {
65
- if (event_source != null || event_source != undefined) event_source.close();
62
+ if (stream != null || stream != undefined) stream.close();
66
63
  });
67
64
 
68
65
  function calculateTotalProgress(files: FileData[]): number {