@gradio/image 0.19.0 → 0.20.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 (6) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/shared/ImageUploader.svelte +13 -2
  3. package/dist/shared/Webcam.svelte +8 -2
  4. package/package.json +8 -8
  5. package/shared/ImageUploader.svelte +13 -3
  6. package/shared/Webcam.svelte +8 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,25 @@
1
1
  # @gradio/image
2
2
 
3
+ ## 0.20.0
4
+
5
+ ### Features
6
+
7
+ - [#10192](https://github.com/gradio-app/gradio/pull/10192) [`4fc7fb7`](https://github.com/gradio-app/gradio/commit/4fc7fb777c42af537e4af612423fa44029657d41) - Ensure components can be remounted with their previous data. Thanks @pngwn!
8
+
9
+ ### Fixes
10
+
11
+ - [#10269](https://github.com/gradio-app/gradio/pull/10269) [`890eaa3`](https://github.com/gradio-app/gradio/commit/890eaa3a9e53dab5bcb16c5d017ae0470109b8fb) - Allow displaying SVG images securely in `gr.Image` and `gr.Gallery` components. Thanks @abidlabs!
12
+
13
+ ### Dependency updates
14
+
15
+ - @gradio/atoms@0.13.0
16
+ - @gradio/utils@0.10.0
17
+ - @gradio/upload@0.14.4
18
+ - @gradio/client@1.9.0
19
+ - @gradio/icons@0.9.0
20
+ - @gradio/statustracker@0.10.0
21
+ - @gradio/wasm@0.16.0
22
+
3
23
  ## 0.19.0
4
24
 
5
25
  ### Features
package/dist/shared/ImageUploader.svelte CHANGED
@@ -31,9 +31,20 @@ let upload_input;
31
31
  export let uploading = false;
32
32
  export let active_source = null;
33
33
  export let webcam_constraints = void 0;
34
- function handle_upload({ detail }) {
34
+ async function handle_upload({
35
+ detail
36
+ }) {
35
37
  if (!streaming) {
36
- value = detail;
38
+ if (detail.path?.toLowerCase().endsWith(".svg") && detail.url) {
39
+ const response = await fetch(detail.url);
40
+ const svgContent = await response.text();
41
+ value = {
42
+ ...detail,
43
+ url: `data:image/svg+xml,${encodeURIComponent(svgContent)}`
44
+ };
45
+ } else {
46
+ value = detail;
47
+ }
37
48
  dispatch("upload");
38
49
  }
39
50
  }
package/dist/shared/Webcam.svelte CHANGED
@@ -1,4 +1,4 @@
1
- <script>import { createEventDispatcher, onMount } from "svelte";
1
+ <script>import { createEventDispatcher, onDestroy, onMount } from "svelte";
2
2
  import {
3
3
  Camera,
4
4
  Circle,
@@ -152,7 +152,7 @@ function take_recording() {
152
152
  }
153
153
  };
154
154
  ReaderObj.readAsDataURL(video_blob);
155
- } else {
155
+ } else if (typeof MediaRecorder !== "undefined") {
156
156
  dispatch("start_recording");
157
157
  recorded_blobs = [];
158
158
  let validMimeTypes = ["video/webm", "video/mp4"];
@@ -216,6 +216,12 @@ function handle_click_outside(event) {
216
216
  event.stopPropagation();
217
217
  options_open = false;
218
218
  }
219
+ onDestroy(() => {
220
+ if (typeof window === "undefined")
221
+ return;
222
+ record_video_or_photo();
223
+ stream?.getTracks().forEach((track) => track.stop());
224
+ });
219
225
  </script>
220
226
 
221
227
  <div class="wrap">
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gradio/image",
3
- "version": "0.19.0",
3
+ "version": "0.20.0",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
@@ -10,13 +10,13 @@
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.12.0",
14
- "@gradio/client": "^1.8.0",
15
- "@gradio/icons": "^0.8.1",
16
- "@gradio/statustracker": "^0.9.7",
17
- "@gradio/upload": "^0.14.3",
18
- "@gradio/utils": "^0.9.0",
19
- "@gradio/wasm": "^0.15.0"
13
+ "@gradio/atoms": "^0.13.0",
14
+ "@gradio/client": "^1.9.0",
15
+ "@gradio/statustracker": "^0.10.0",
16
+ "@gradio/icons": "^0.9.0",
17
+ "@gradio/utils": "^0.10.0",
18
+ "@gradio/wasm": "^0.16.0",
19
+ "@gradio/upload": "^0.14.4"
20
20
  },
21
21
  "devDependencies": {
22
22
  "@gradio/preview": "^0.13.0"
package/shared/ImageUploader.svelte CHANGED
@@ -45,10 +45,20 @@
45
45
 
46
46
  export let webcam_constraints: { [key: string]: any } | undefined = undefined;
47
47
 
48
- function handle_upload({ detail }: CustomEvent<FileData>): void {
49
- // only trigger streaming event if streaming
48
+ async function handle_upload({
49
+ detail
50
+ }: CustomEvent<FileData>): Promise<void> {
50
51
  if (!streaming) {
51
- value = detail;
52
+ if (detail.path?.toLowerCase().endsWith(".svg") && detail.url) {
53
+ const response = await fetch(detail.url);
54
+ const svgContent = await response.text();
55
+ value = {
56
+ ...detail,
57
+ url: `data:image/svg+xml,${encodeURIComponent(svgContent)}`
58
+ };
59
+ } else {
60
+ value = detail;
61
+ }
52
62
  dispatch("upload");
53
63
  }
54
64
  }
package/shared/Webcam.svelte CHANGED
@@ -1,5 +1,5 @@
1
1
  <script lang="ts">
2
- import { createEventDispatcher, onMount } from "svelte";
2
+ import { createEventDispatcher, onDestroy, onMount } from "svelte";
3
3
  import {
4
4
  Camera,
5
5
  Circle,
@@ -198,7 +198,7 @@
198
198
  }
199
199
  };
200
200
  ReaderObj.readAsDataURL(video_blob);
201
- } else {
201
+ } else if (typeof MediaRecorder !== "undefined") {
202
202
  dispatch("start_recording");
203
203
  recorded_blobs = [];
204
204
  let validMimeTypes = ["video/webm", "video/mp4"];
@@ -273,6 +273,12 @@
273
273
  event.stopPropagation();
274
274
  options_open = false;
275
275
  }
276
+
277
+ onDestroy(() => {
278
+ if (typeof window === "undefined") return;
279
+ record_video_or_photo();
280
+ stream?.getTracks().forEach((track) => track.stop());
281
+ });
276
282
  </script>
277
283
 
278
284
  <div class="wrap">