@gradio/upload 0.5.7 → 0.6.0
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.
- package/CHANGELOG.md +17 -1
- package/package.json +3 -3
- package/src/Upload.svelte +1 -3
- package/src/UploadProgress.svelte +13 -7
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @gradio/upload
|
|
2
2
|
|
|
3
|
+
## 0.6.0
|
|
4
|
+
|
|
5
|
+
### Features
|
|
6
|
+
|
|
7
|
+
- [#6965](https://github.com/gradio-app/gradio/pull/6965) [`5d00dd3`](https://github.com/gradio-app/gradio/commit/5d00dd37ca14bbfef2ceac550b29dbe05ba8cab0) - Make <UploadProgress /> Wasm-compatible. Thanks [@whitphx](https://github.com/whitphx)!
|
|
8
|
+
|
|
9
|
+
### Fixes
|
|
10
|
+
|
|
11
|
+
- [#6969](https://github.com/gradio-app/gradio/pull/6969) [`793bf8f`](https://github.com/gradio-app/gradio/commit/793bf8f7b1943f265c5d016c1a0c682ee549232a) - Display pending file in `<Upload />` while waiting for upload request. Thanks [@hannahblair](https://github.com/hannahblair)!
|
|
12
|
+
|
|
13
|
+
## 0.5.8
|
|
14
|
+
|
|
15
|
+
### Features
|
|
16
|
+
|
|
17
|
+
- [#6931](https://github.com/gradio-app/gradio/pull/6931) [`6c863af`](https://github.com/gradio-app/gradio/commit/6c863af92fa9ceb5c638857eb22cc5ddb718d549) - Fix functional tests. Thanks [@aliabid94](https://github.com/aliabid94)!
|
|
18
|
+
|
|
3
19
|
## 0.5.7
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
@@ -289,4 +305,4 @@ From the backend, streamed outputs are served from the `/stream/` endpoint inste
|
|
|
289
305
|
### Patch Changes
|
|
290
306
|
|
|
291
307
|
- Updated dependencies []:
|
|
292
|
-
- @gradio/atoms@0.0.2
|
|
308
|
+
- @gradio/atoms@0.0.2
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gradio/upload",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.0",
|
|
4
4
|
"description": "Gradio UI packages",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "src/index.ts",
|
|
@@ -8,8 +8,8 @@
|
|
|
8
8
|
"license": "ISC",
|
|
9
9
|
"dependencies": {
|
|
10
10
|
"@gradio/atoms": "^0.4.1",
|
|
11
|
-
"@gradio/
|
|
12
|
-
"@gradio/
|
|
11
|
+
"@gradio/upload": "^0.6.0",
|
|
12
|
+
"@gradio/client": "^0.10.0",
|
|
13
13
|
"@gradio/utils": "^0.2.0",
|
|
14
14
|
"@gradio/icons": "^0.3.2"
|
|
15
15
|
},
|
package/src/Upload.svelte
CHANGED
|
@@ -48,14 +48,12 @@
|
|
|
48
48
|
for (let i = 0; i < items.length; i++) {
|
|
49
49
|
const type = items[i].types.find((t) => t.startsWith("image/"));
|
|
50
50
|
if (type) {
|
|
51
|
-
dispatch("load", null);
|
|
52
51
|
items[i].getType(type).then(async (blob) => {
|
|
53
52
|
const file = new File(
|
|
54
53
|
[blob],
|
|
55
54
|
`clipboard.${type.replace("image/", "")}`
|
|
56
55
|
);
|
|
57
|
-
|
|
58
|
-
dispatch("load", f?.[0]);
|
|
56
|
+
await load_files([file]);
|
|
59
57
|
});
|
|
60
58
|
break;
|
|
61
59
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
2
|
import { FileData } from "@gradio/client";
|
|
3
|
-
import { onMount, createEventDispatcher } from "svelte";
|
|
3
|
+
import { onMount, createEventDispatcher, getContext } from "svelte";
|
|
4
4
|
|
|
5
5
|
type FileDataWithProgress = FileData & { progress: number };
|
|
6
6
|
|
|
@@ -11,6 +11,7 @@
|
|
|
11
11
|
let event_source: EventSource;
|
|
12
12
|
let progress = false;
|
|
13
13
|
let current_file_upload: FileDataWithProgress;
|
|
14
|
+
let file_to_display: FileDataWithProgress;
|
|
14
15
|
|
|
15
16
|
let files_with_progress: FileDataWithProgress[] = files.map((file) => {
|
|
16
17
|
return {
|
|
@@ -35,9 +36,12 @@
|
|
|
35
36
|
return (file.progress * 100) / (file.size || 0) || 0;
|
|
36
37
|
}
|
|
37
38
|
|
|
39
|
+
const EventSource_factory = getContext<(url: URL) => EventSource>(
|
|
40
|
+
"EventSource_factory"
|
|
41
|
+
);
|
|
38
42
|
onMount(() => {
|
|
39
|
-
event_source =
|
|
40
|
-
`${root}/upload_progress?upload_id=${upload_id}`
|
|
43
|
+
event_source = EventSource_factory(
|
|
44
|
+
new URL(`${root}/upload_progress?upload_id=${upload_id}`)
|
|
41
45
|
);
|
|
42
46
|
// Event listener for progress updates
|
|
43
47
|
event_source.onmessage = async function (event) {
|
|
@@ -68,6 +72,8 @@
|
|
|
68
72
|
}
|
|
69
73
|
|
|
70
74
|
$: calculateTotalProgress(files_with_progress);
|
|
75
|
+
|
|
76
|
+
$: file_to_display = current_file_upload || files_with_progress[0];
|
|
71
77
|
</script>
|
|
72
78
|
|
|
73
79
|
<div class="wrap" class:progress>
|
|
@@ -76,19 +82,19 @@
|
|
|
76
82
|
{files_with_progress.length > 1 ? "files" : "file"}...</span
|
|
77
83
|
>
|
|
78
84
|
|
|
79
|
-
{#if
|
|
85
|
+
{#if file_to_display}
|
|
80
86
|
<div class="file">
|
|
81
87
|
<span>
|
|
82
88
|
<div class="progress-bar">
|
|
83
89
|
<progress
|
|
84
90
|
style="visibility:hidden;height:0;width:0;"
|
|
85
|
-
value={getProgress(
|
|
86
|
-
max="100">{getProgress(
|
|
91
|
+
value={getProgress(file_to_display)}
|
|
92
|
+
max="100">{getProgress(file_to_display)}</progress
|
|
87
93
|
>
|
|
88
94
|
</div>
|
|
89
95
|
</span>
|
|
90
96
|
<span class="file-name">
|
|
91
|
-
{
|
|
97
|
+
{file_to_display.orig_name}
|
|
92
98
|
</span>
|
|
93
99
|
</div>
|
|
94
100
|
{/if}
|