@gradio/image 0.9.12 → 0.11.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.
Files changed (5) hide show
  1. package/CHANGELOG.md +63 -0
  2. package/Index.svelte +5 -0
  3. package/package.json +10 -7
  4. package/shared/ImageUploader.svelte +14 -5
  5. package/shared/Webcam.svelte +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,68 @@
1
1
  # @gradio/image
2
2
 
3
+ ## 0.11.0
4
+
5
+ ### Features
6
+
7
+ - [#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!
8
+ - [#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!
9
+
10
+ ### Fixes
11
+
12
+ - [#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!
13
+
14
+ ### Dependency updates
15
+
16
+ - @gradio/atoms@0.7.2
17
+ - @gradio/client@0.18.0
18
+ - @gradio/upload@0.10.0
19
+ - @gradio/utils@0.4.1
20
+ - @gradio/wasm@0.10.1
21
+ - @gradio/statustracker@0.5.1
22
+
23
+ ## 0.10.0
24
+
25
+ ### Highlights
26
+
27
+ #### Setting File Upload Limits ([#7909](https://github.com/gradio-app/gradio/pull/7909) [`2afca65`](https://github.com/gradio-app/gradio/commit/2afca6541912b37dc84f447c7ad4af21607d7c72))
28
+
29
+ We have added a `max_file_size` size parameter to `launch()` that limits to size of files uploaded to the server. This limit applies to each individual file. This parameter can be specified as a string or an integer (corresponding to the size in bytes).
30
+
31
+ The following code snippet sets a max file size of 5 megabytes.
32
+
33
+ ```python
34
+ import gradio as gr
35
+
36
+ demo = gr.Interface(lambda x: x, "image", "image")
37
+
38
+ demo.launch(max_file_size="5mb")
39
+ # or
40
+ demo.launch(max_file_size=5 * gr.FileSize.MB)
41
+ ```
42
+
43
+ ![max_file_size_upload](https://github.com/gradio-app/gradio/assets/41651716/7547330c-a082-4901-a291-3f150a197e45)
44
+
45
+
46
+ #### Error states can now be cleared
47
+
48
+ When a component encounters an error, the error state shown in the UI can now be cleared by clicking on the `x` icon in the top right of the component. This applies to all types of errors, whether it's raised in the UI or the server.
49
+
50
+ ![error_modal_calculator](https://github.com/gradio-app/gradio/assets/41651716/16cb071c-accd-45a6-9c18-0dea27d4bd98)
51
+
52
+ Thanks @freddyaboulton!
53
+
54
+ ### Fixes
55
+
56
+ - [#8066](https://github.com/gradio-app/gradio/pull/8066) [`624f9b9`](https://github.com/gradio-app/gradio/commit/624f9b9477f74a581a6c14119234f9efdfcda398) - make gradio dev tools a local dependency rather than bundling. Thanks @pngwn!
57
+
58
+ ### Dependency updates
59
+
60
+ - @gradio/atoms@0.7.1
61
+ - @gradio/client@0.17.0
62
+ - @gradio/statustracker@0.5.0
63
+ - @gradio/upload@0.9.0
64
+ - @gradio/utils@0.4.0
65
+
3
66
  ## 0.9.12
4
67
 
5
68
  ### Dependency updates
package/Index.svelte CHANGED
@@ -60,6 +60,7 @@
60
60
  clear: never;
61
61
  select: SelectData;
62
62
  share: ShareData;
63
+ clear_status: LoadingStatus;
63
64
  }>;
64
65
 
65
66
  $: {
@@ -125,6 +126,7 @@
125
126
  autoscroll={gradio.autoscroll}
126
127
  i18n={gradio.i18n}
127
128
  {...loading_status}
129
+ on:clear_status={() => gradio.dispatch("clear_status", loading_status)}
128
130
  />
129
131
 
130
132
  <ImageUploader
@@ -152,7 +154,10 @@
152
154
  {pending}
153
155
  {streaming}
154
156
  {mirror_webcam}
157
+ max_file_size={gradio.max_file_size}
155
158
  i18n={gradio.i18n}
159
+ upload={gradio.client.upload}
160
+ stream_handler={gradio.client.stream_factory}
156
161
  >
157
162
  {#if active_source === "upload" || !active_source}
158
163
  <UploadText i18n={gradio.i18n} type="image" />
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gradio/image",
3
- "version": "0.9.12",
3
+ "version": "0.11.0",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
@@ -10,13 +10,16 @@
10
10
  "cropperjs": "^1.5.12",
11
11
  "lazy-brush": "^1.0.1",
12
12
  "resize-observer-polyfill": "^1.5.1",
13
- "@gradio/atoms": "^0.7.0",
14
- "@gradio/client": "^0.16.0",
13
+ "@gradio/atoms": "^0.7.2",
14
+ "@gradio/statustracker": "^0.5.1",
15
+ "@gradio/client": "^0.18.0",
16
+ "@gradio/upload": "^0.10.0",
15
17
  "@gradio/icons": "^0.4.0",
16
- "@gradio/statustracker": "^0.4.12",
17
- "@gradio/upload": "^0.8.5",
18
- "@gradio/utils": "^0.3.2",
19
- "@gradio/wasm": "^0.10.0"
18
+ "@gradio/wasm": "^0.10.1",
19
+ "@gradio/utils": "^0.4.1"
20
+ },
21
+ "devDependencies": {
22
+ "@gradio/preview": "^0.9.0"
20
23
  },
21
24
  "main_changeset": true,
22
25
  "main": "./Index.svelte",
package/shared/ImageUploader.svelte CHANGED
@@ -7,7 +7,7 @@
7
7
  import Webcam from "./Webcam.svelte";
8
8
 
9
9
  import { Upload } from "@gradio/upload";
10
- import type { FileData } from "@gradio/client";
10
+ import type { FileData, Client } from "@gradio/client";
11
11
  import ClearImage from "./ClearImage.svelte";
12
12
  import { SelectSource } from "@gradio/atoms";
13
13
  import Image from "./Image.svelte";
@@ -25,8 +25,11 @@
25
25
  export let selectable = false;
26
26
  export let root: string;
27
27
  export let i18n: I18nFormatter;
28
+ export let max_file_size: number | null = null;
29
+ export let upload: Client["upload"];
30
+ export let stream_handler: Client["stream_factory"];
28
31
 
29
- let upload: Upload;
32
+ let upload_input: Upload;
30
33
  let uploading = false;
31
34
  export let active_source: source_type = null;
32
35
 
@@ -43,7 +46,9 @@
43
46
 
44
47
  async function handle_save(img_blob: Blob | any): Promise<void> {
45
48
  pending = true;
46
- const f = await upload.load_files([new File([img_blob], `webcam.png`)]);
49
+ const f = await upload_input.load_files([
50
+ new File([img_blob], `webcam.png`)
51
+ ]);
47
52
 
48
53
  value = f?.[0] || null;
49
54
 
@@ -85,7 +90,7 @@
85
90
  ): Promise<void> {
86
91
  switch (source) {
87
92
  case "clipboard":
88
- upload.paste_clipboard();
93
+ upload_input.paste_clipboard();
89
94
  break;
90
95
  default:
91
96
  break;
@@ -107,14 +112,17 @@
107
112
  <div class="upload-container">
108
113
  <Upload
109
114
  hidden={value !== null || active_source === "webcam"}
110
- bind:this={upload}
115
+ bind:this={upload_input}
111
116
  bind:uploading
112
117
  bind:dragging
113
118
  filetype={active_source === "clipboard" ? "clipboard" : "image/*"}
114
119
  on:load={handle_upload}
115
120
  on:error
116
121
  {root}
122
+ {max_file_size}
117
123
  disable_click={!sources.includes("upload")}
124
+ {upload}
125
+ {stream_handler}
118
126
  >
119
127
  {#if value === null}
120
128
  <slot />
@@ -133,6 +141,7 @@
133
141
  mode="image"
134
142
  include_audio={false}
135
143
  {i18n}
144
+ {upload}
136
145
  />
137
146
  {:else if value !== null && !streaming}
138
147
  <!-- svelte-ignore a11y-click-events-have-key-events-->
package/shared/Webcam.svelte CHANGED
@@ -2,8 +2,7 @@
2
2
  import { createEventDispatcher, onMount } from "svelte";
3
3
  import { Camera, Circle, Square, DropdownArrow } from "@gradio/icons";
4
4
  import type { I18nFormatter } from "@gradio/utils";
5
- import type { FileData } from "@gradio/client";
6
- import { prepare_files, upload } from "@gradio/client";
5
+ import { type FileData, type Client, prepare_files } from "@gradio/client";
7
6
  import WebcamPermissions from "./WebcamPermissions.svelte";
8
7
  import { fade } from "svelte/transition";
9
8
  import {
@@ -25,6 +24,7 @@
25
24
  export let mirror_webcam: boolean;
26
25
  export let include_audio: boolean;
27
26
  export let i18n: I18nFormatter;
27
+ export let upload: Client["upload"];
28
28
 
29
29
  const dispatch = createEventDispatcher<{
30
30
  stream: undefined;
@@ -70,7 +70,7 @@
70
70
 
71
71
  selected_device = used_devices
72
72
  ? devices.find((device) => device.deviceId === used_devices) ||
73
- available_video_devices[0]
73
+ available_video_devices[0]
74
74
  : available_video_devices[0];
75
75
  });
76
76