@gradio/gallery 0.6.0 → 0.7.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 +24 -3
  2. package/Gallery.stories.svelte +70 -61
  3. package/Gallery.test.ts +12 -6
  4. package/Index.svelte +0 -3
  5. package/package.json +8 -9
  6. package/shared/Gallery.svelte +2 -4
package/CHANGELOG.md CHANGED
@@ -1,22 +1,43 @@
1
1
  # @gradio/gallery
2
2
 
3
+ ## 0.7.0
4
+
5
+ ### Features
6
+
7
+ - [#7183](https://github.com/gradio-app/gradio/pull/7183) [`49d9c48`](https://github.com/gradio-app/gradio/commit/49d9c48537aa706bf72628e3640389470138bdc6) - [WIP] Refactor file normalization to be in the backend and remove it from the frontend of each component. Thanks [@abidlabs](https://github.com/abidlabs)!
8
+ - [#7369](https://github.com/gradio-app/gradio/pull/7369) [`7b10d97`](https://github.com/gradio-app/gradio/commit/7b10d97b0f928fde6a71a94460fb8ca784e7a31d) - Remove the `@gradio/wasm` dependency from `@gradio/gallery` that is not used. Thanks [@whitphx](https://github.com/whitphx)!
9
+
10
+ ## 0.6.1
11
+
12
+ ### Patch Changes
13
+
14
+ - Updated dependencies [[`572e360`](https://github.com/gradio-app/gradio/commit/572e360fff4a03c335b86e1a7517a44cb6af2bcd), [`733ca26`](https://github.com/gradio-app/gradio/commit/733ca266bb1ba9049ed7309b8f0614199682e173), [`68a54a7`](https://github.com/gradio-app/gradio/commit/68a54a7a310d8d7072fdae930bf1cfdf12c45a7f), [`2e6672c`](https://github.com/gradio-app/gradio/commit/2e6672c815e39fd6af78353e66661100b9102cd4), [`fdd1521`](https://github.com/gradio-app/gradio/commit/fdd15213c24b9cbc58bbc1b6beb4af7c18f48557), [`200e251`](https://github.com/gradio-app/gradio/commit/200e2518e4d449aa82819a8d119e912bd1d95c15), [`c3e61e4`](https://github.com/gradio-app/gradio/commit/c3e61e4f70696a71aede67b65d28447eb67daf16), [`cae05c0`](https://github.com/gradio-app/gradio/commit/cae05c05ecde56c4d92c6b5ed8d13353505cbd14), [`05d8a3c`](https://github.com/gradio-app/gradio/commit/05d8a3c8030b733bd47250f5db6f89f230f9a707), [`8dd6f4b`](https://github.com/gradio-app/gradio/commit/8dd6f4bc1901792f05cd59e86df7b1dbab692739)]:
15
+ - @gradio/upload@0.7.1
16
+ - @gradio/image@0.8.0
17
+ - @gradio/client@0.11.0
18
+ - @gradio/utils@0.2.2
19
+ - @gradio/file@0.4.9
20
+ - @gradio/wasm@0.6.0
21
+ - @gradio/atoms@0.5.1
22
+ - @gradio/statustracker@0.4.5
23
+
3
24
  ## 0.6.0
4
25
 
5
26
  ### Features
6
27
 
7
- - [#7148](https://github.com/gradio-app/gradio/pull/7148) [`c60ad4d`](https://github.com/gradio-app/gradio/commit/c60ad4d34ab5b56a89bf6796822977e51e7a4a32) - Use Gallery as input component. Thanks [@freddyaboulton](https://github.com/freddyaboulton)!
28
+ - [#7148](https://github.com/gradio-app/gradio/pull/7148) [`c60ad4d`](https://github.com/gradio-app/gradio/commit/c60ad4d34ab5b56a89bf6796822977e51e7a4a32) - Use Gallery as input component. Thanks [@freddyaboulton](https://github.com/freddyaboulton)!
8
29
 
9
30
  ## 0.5.0
10
31
 
11
32
  ### Features
12
33
 
13
- - [#7024](https://github.com/gradio-app/gradio/pull/7024) [`f2d69fc`](https://github.com/gradio-app/gradio/commit/f2d69fc7d0c1c3457112e702b53e38a0255fc1b7) - Fix gallery thumbnail design regression. Thanks [@hannahblair](https://github.com/hannahblair)!
34
+ - [#7024](https://github.com/gradio-app/gradio/pull/7024) [`f2d69fc`](https://github.com/gradio-app/gradio/commit/f2d69fc7d0c1c3457112e702b53e38a0255fc1b7) - Fix gallery thumbnail design regression. Thanks [@hannahblair](https://github.com/hannahblair)!
14
35
 
15
36
  ## 0.4.17
16
37
 
17
38
  ### Fixes
18
39
 
19
- - [#6967](https://github.com/gradio-app/gradio/pull/6967) [`5e00162`](https://github.com/gradio-app/gradio/commit/5e0016267f1d683e2daab82ee4a33d2f09513a34) - Make <Gallery /> Wasm-compatible. Thanks [@whitphx](https://github.com/whitphx)!
40
+ - [#6967](https://github.com/gradio-app/gradio/pull/6967) [`5e00162`](https://github.com/gradio-app/gradio/commit/5e0016267f1d683e2daab82ee4a33d2f09513a34) - Make <Gallery /> Wasm-compatible. Thanks [@whitphx](https://github.com/whitphx)!
20
41
 
21
42
  ## 0.4.16
22
43
 
package/Gallery.stories.svelte CHANGED
@@ -1,68 +1,77 @@
1
- <script>
2
- import { Meta, Template, Story } from "@storybook/addon-svelte-csf";
1
+ <script context="module">
2
+ import { Template, Story } from "@storybook/addon-svelte-csf";
3
3
  import Gallery from "./Index.svelte";
4
- </script>
4
+ import { allModes } from "../storybook/modes";
5
5
 
6
- <Meta
7
- title="Components/Gallery"
8
- component={Gallery}
9
- argTypes={{
10
- label: {
11
- control: "text",
12
- description: "The gallery label",
13
- name: "label",
14
- value: "Gradio Button"
15
- },
16
- show_label: {
17
- options: [true, false],
18
- description: "Whether to show the label",
19
- control: { type: "boolean" },
20
- defaultValue: true
21
- },
22
- columns: {
23
- options: [1, 2, 3, 4],
24
- description: "The number of columns to show in grid",
25
- control: { type: "select" },
26
- defaultValue: 2
27
- },
28
- rows: {
29
- options: [1, 2, 3, 4],
30
- description: "The number of rows to show in grid",
31
- control: { type: "select" },
32
- defaultValue: 2
33
- },
34
- height: {
35
- options: ["auto", 500, 600],
36
- description: "The height of the grid",
37
- control: { type: "select" },
38
- defaultValue: "auto"
39
- },
40
- preview: {
41
- options: [true, false],
42
- description: "Whether to start the gallery in preview mode",
43
- control: { type: "boolean" },
44
- defaultValue: true
45
- },
46
- allow_preview: {
47
- options: [true, false],
48
- description: "Whether to allow a preview mode in the gallery",
49
- control: { type: "boolean" },
50
- defaultValue: true
51
- },
52
- object_fit: {
53
- options: ["contain", "cover", "fill", "none", "scale-down"],
54
- description: "How to display each indivial image in the grid",
55
- control: { type: "select" },
56
- defaultValue: "contain"
6
+ export const meta = {
7
+ title: "Components/Gallery",
8
+ component: Gallery,
9
+ argTypes: {
10
+ label: {
11
+ control: "text",
12
+ description: "The gallery label",
13
+ name: "label",
14
+ value: "Gradio Button"
15
+ },
16
+ show_label: {
17
+ options: [true, false],
18
+ description: "Whether to show the label",
19
+ control: { type: "boolean" },
20
+ defaultValue: true
21
+ },
22
+ columns: {
23
+ options: [1, 2, 3, 4],
24
+ description: "The number of columns to show in grid",
25
+ control: { type: "select" },
26
+ defaultValue: 2
27
+ },
28
+ rows: {
29
+ options: [1, 2, 3, 4],
30
+ description: "The number of rows to show in grid",
31
+ control: { type: "select" },
32
+ defaultValue: 2
33
+ },
34
+ height: {
35
+ options: ["auto", 500, 600],
36
+ description: "The height of the grid",
37
+ control: { type: "select" },
38
+ defaultValue: "auto"
39
+ },
40
+ preview: {
41
+ options: [true, false],
42
+ description: "Whether to start the gallery in preview mode",
43
+ control: { type: "boolean" },
44
+ defaultValue: true
45
+ },
46
+ allow_preview: {
47
+ options: [true, false],
48
+ description: "Whether to allow a preview mode in the gallery",
49
+ control: { type: "boolean" },
50
+ defaultValue: true
51
+ },
52
+ object_fit: {
53
+ options: ["contain", "cover", "fill", "none", "scale-down"],
54
+ description: "How to display each indivial image in the grid",
55
+ control: { type: "select" },
56
+ defaultValue: "contain"
57
+ },
58
+ show_share_button: {
59
+ options: [true, false],
60
+ description: "Whether to show the share button in the gallery",
61
+ control: { type: "boolean" },
62
+ defaultValue: false
63
+ }
57
64
  },
58
- show_share_button: {
59
- options: [true, false],
60
- description: "Whether to show the share button in the gallery",
61
- control: { type: "boolean" },
62
- defaultValue: false
65
+ parameters: {
66
+ chromatic: {
67
+ modes: {
68
+ desktop: allModes["desktop"],
69
+ mobile: allModes["mobile"]
70
+ }
71
+ }
63
72
  }
64
- }}
65
- />
73
+ };
74
+ </script>
66
75
 
67
76
  <Template let:args>
68
77
  <Gallery
package/Gallery.test.ts CHANGED
@@ -35,8 +35,10 @@ describe("Gallery", () => {
35
35
  value: [
36
36
  {
37
37
  image: {
38
- path: "https://raw.githubusercontent.com/gradio-app/gradio/main/gradio/demo/video_component/files/a.mp4"
39
- }
38
+ path: "https://raw.githubusercontent.com/gradio-app/gradio/main/gradio/demo/video_component/files/a.mp4",
39
+ url: "https://raw.githubusercontent.com/gradio-app/gradio/main/gradio/demo/video_component/files/a.mp4"
40
+ },
41
+ caption: null
40
42
  }
41
43
  ]
42
44
  });
@@ -58,8 +60,10 @@ describe("Gallery", () => {
58
60
  value: [
59
61
  {
60
62
  image: {
61
- path: "https://raw.githubusercontent.com/gradio-app/gradio/main/gradio/demo/video_component/files/a.mp4"
62
- }
63
+ path: "https://raw.githubusercontent.com/gradio-app/gradio/main/gradio/demo/video_component/files/a.mp4",
64
+ url: "https://raw.githubusercontent.com/gradio-app/gradio/main/gradio/demo/video_component/files/a.mp4"
65
+ },
66
+ caption: null
63
67
  }
64
68
  ]
65
69
  });
@@ -69,8 +73,10 @@ describe("Gallery", () => {
69
73
  value: [
70
74
  {
71
75
  image: {
72
- path: "https://raw.githubusercontent.com/gradio-app/gradio/main/gradio/demo/video_component/files/a.mp4"
73
- }
76
+ path: "https://raw.githubusercontent.com/gradio-app/gradio/main/gradio/demo/video_component/files/a.mp4",
77
+ url: "https://raw.githubusercontent.com/gradio-app/gradio/main/gradio/demo/video_component/files/a.mp4"
78
+ },
79
+ caption: null
74
80
  }
75
81
  ]
76
82
  });
package/Index.svelte CHANGED
@@ -16,7 +16,6 @@
16
16
  export let show_label: boolean;
17
17
  export let label: string;
18
18
  export let root: string;
19
- export let proxy_url: null | string;
20
19
  export let elem_id = "";
21
20
  export let elem_classes: string[] = [];
22
21
  export let visible = true;
@@ -91,8 +90,6 @@
91
90
  on:error={(e) => gradio.dispatch("error", e.detail)}
92
91
  {label}
93
92
  {show_label}
94
- {root}
95
- {proxy_url}
96
93
  {columns}
97
94
  {rows}
98
95
  {height}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gradio/gallery",
3
- "version": "0.6.0",
3
+ "version": "0.7.0",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
@@ -8,15 +8,14 @@
8
8
  "private": false,
9
9
  "dependencies": {
10
10
  "dequal": "^2.0.2",
11
- "@gradio/atoms": "^0.5.0",
11
+ "@gradio/atoms": "^0.5.1",
12
+ "@gradio/client": "^0.12.0",
12
13
  "@gradio/icons": "^0.3.2",
13
- "@gradio/image": "^0.7.1",
14
- "@gradio/upload": "^0.7.0",
15
- "@gradio/utils": "^0.2.1",
16
- "@gradio/client": "^0.10.1",
17
- "@gradio/wasm": "^0.5.1",
18
- "@gradio/statustracker": "^0.4.4",
19
- "@gradio/file": "^0.4.8"
14
+ "@gradio/image": "^0.9.0",
15
+ "@gradio/statustracker": "^0.4.5",
16
+ "@gradio/upload": "^0.7.2",
17
+ "@gradio/utils": "^0.2.2",
18
+ "@gradio/file": "^0.5.0"
20
19
  },
21
20
  "main": "./Index.svelte",
22
21
  "main_changeset": true,
package/shared/Gallery.svelte CHANGED
@@ -8,7 +8,7 @@
8
8
  import { tick } from "svelte";
9
9
 
10
10
  import { Download, Image as ImageIcon } from "@gradio/icons";
11
- import { normalise_file, type FileData } from "@gradio/client";
11
+ import { FileData } from "@gradio/client";
12
12
  import { format_gallery_for_sharing } from "./utils";
13
13
  import { IconButton } from "@gradio/atoms";
14
14
  import type { I18nFormatter } from "@gradio/utils";
@@ -18,8 +18,6 @@
18
18
 
19
19
  export let show_label = true;
20
20
  export let label: string;
21
- export let root = "";
22
- export let proxy_url: null | string = null;
23
21
  export let value: GalleryData | null = null;
24
22
  export let columns: number | number[] | undefined = [2];
25
23
  export let rows: number | number[] | undefined = undefined;
@@ -49,7 +47,7 @@
49
47
  value == null
50
48
  ? null
51
49
  : value.map((data) => ({
52
- image: normalise_file(data.image, root, proxy_url) as FileData,
50
+ image: data.image as FileData,
53
51
  caption: data.caption
54
52
  }));
55
53