@gradio/gallery 0.15.33 → 0.15.35-dev.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 (8) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/Gallery.stories.svelte +11 -2
  3. package/Index.svelte +4 -6
  4. package/dist/Index.svelte +4 -6
  5. package/dist/Index.svelte.d.ts +1 -3
  6. package/dist/shared/Gallery.svelte +2 -2
  7. package/package.json +8 -8
  8. package/shared/Gallery.svelte +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,35 @@
1
1
  # @gradio/gallery
2
2
 
3
+ ## 0.15.35-dev.0
4
+
5
+ ### Dependency updates
6
+
7
+ - @gradio/upload@0.17.2-dev.0
8
+ - @gradio/client@2.0.0-dev.0
9
+ - @gradio/image@0.23.2-dev.0
10
+ - @gradio/file@0.13.1-dev.0
11
+ - @gradio/video@0.17.0-dev.0
12
+
13
+ ## 0.15.34
14
+
15
+ ### Dependency updates
16
+
17
+ - @gradio/client@1.19.1
18
+
19
+ ## 0.15.34
20
+
21
+ ### Dependency updates
22
+
23
+ - @gradio/image@0.23.1
24
+ - @gradio/upload@0.17.1
25
+ - @gradio/atoms@0.18.1
26
+
27
+ ## 0.15.34
28
+
29
+ ### Fixes
30
+
31
+ - [#11938](https://github.com/gradio-app/gradio/pull/11938) [`beddde5`](https://github.com/gradio-app/gradio/commit/beddde5d432904d6384b7285acdbf1fd78469af7) - Fix bug where Gallery scrollbar would not show up. Thanks @freddyaboulton!
32
+
3
33
  ## 0.15.33
4
34
 
5
35
  ### Fixes
package/Gallery.stories.svelte CHANGED
@@ -34,7 +34,7 @@
34
34
  defaultValue: 2
35
35
  },
36
36
  height: {
37
- options: ["auto", 500, 600],
37
+ options: ["auto", 200, 500, 600],
38
38
  description: "The height of the grid",
39
39
  control: { type: "select" },
40
40
  defaultValue: "auto"
@@ -258,7 +258,16 @@
258
258
  height: 400
259
259
  }}
260
260
  />
261
-
261
+ <Story
262
+ name="Gallery with overflow of images and short height"
263
+ args={{
264
+ label: "My Cheetah Gallery",
265
+ show_label: true,
266
+ rows: 2,
267
+ columns: 2,
268
+ height: 200
269
+ }}
270
+ />
262
271
  <Story
263
272
  name="Gallery with download button"
264
273
  args={{
package/Index.svelte CHANGED
@@ -36,9 +36,8 @@
36
36
  export let selected_index: number | null = null;
37
37
  export let object_fit: "contain" | "cover" | "fill" | "none" | "scale-down" =
38
38
  "cover";
39
- export let show_share_button = false;
39
+ export let buttons: string[] | null = null;
40
40
  export let interactive: boolean;
41
- export let show_download_button = false;
42
41
  export let gradio: Gradio<{
43
42
  change: typeof value;
44
43
  upload: typeof value;
@@ -51,7 +50,6 @@
51
50
  preview_open: never;
52
51
  preview_close: never;
53
52
  }>;
54
- export let show_fullscreen_button = true;
55
53
  export let fullscreen = false;
56
54
 
57
55
  const dispatch = createEventDispatcher();
@@ -168,11 +166,11 @@
168
166
  {allow_preview}
169
167
  bind:selected_index
170
168
  bind:value
171
- {show_share_button}
172
- {show_download_button}
169
+ show_share_button={buttons?.includes("share") ?? true}
170
+ show_download_button={buttons?.includes("download") ?? true}
173
171
  i18n={gradio.i18n}
174
172
  _fetch={(...args) => gradio.client.fetch(...args)}
175
- {show_fullscreen_button}
173
+ show_fullscreen_button={buttons?.includes("fullscreen") ?? true}
176
174
  {fullscreen}
177
175
  {root}
178
176
  {file_types}
package/dist/Index.svelte CHANGED
@@ -26,11 +26,9 @@ export let preview;
26
26
  export let allow_preview = true;
27
27
  export let selected_index = null;
28
28
  export let object_fit = "cover";
29
- export let show_share_button = false;
29
+ export let buttons = null;
30
30
  export let interactive;
31
- export let show_download_button = false;
32
31
  export let gradio;
33
- export let show_fullscreen_button = true;
34
32
  export let fullscreen = false;
35
33
  const dispatch = createEventDispatcher();
36
34
  $: no_value = value === null ? true : value.length === 0;
@@ -136,11 +134,11 @@ async function process_upload_files(files) {
136
134
  {allow_preview}
137
135
  bind:selected_index
138
136
  bind:value
139
- {show_share_button}
140
- {show_download_button}
137
+ show_share_button={buttons?.includes("share") ?? true}
138
+ show_download_button={buttons?.includes("download") ?? true}
141
139
  i18n={gradio.i18n}
142
140
  _fetch={(...args) => gradio.client.fetch(...args)}
143
- {show_fullscreen_button}
141
+ show_fullscreen_button={buttons?.includes("fullscreen") ?? true}
144
142
  {fullscreen}
145
143
  {root}
146
144
  {file_types}
package/dist/Index.svelte.d.ts CHANGED
@@ -26,9 +26,8 @@ declare const __propDef: {
26
26
  allow_preview?: boolean;
27
27
  selected_index?: number | null;
28
28
  object_fit?: "contain" | "cover" | "fill" | "none" | "scale-down";
29
- show_share_button?: boolean;
29
+ buttons?: string[] | null;
30
30
  interactive: boolean;
31
- show_download_button?: boolean;
32
31
  gradio: Gradio<{
33
32
  change: (GalleryImage | GalleryVideo)[] | null;
34
33
  upload: (GalleryImage | GalleryVideo)[] | null;
@@ -44,7 +43,6 @@ declare const __propDef: {
44
43
  preview_open: never;
45
44
  preview_close: never;
46
45
  }>;
47
- show_fullscreen_button?: boolean;
48
46
  fullscreen?: boolean;
49
47
  };
50
48
  events: {
package/dist/shared/Gallery.svelte CHANGED
@@ -378,6 +378,7 @@ let uploading = false;
378
378
  class:minimal={mode === "minimal"}
379
379
  class:fixed-height={mode !== "minimal" && (!height || height == "auto")}
380
380
  class:hidden={is_full_screen}
381
+ style:height={height !== "auto" ? height + "px" : null}
381
382
  >
382
383
  {#if interactive && selected_index === null}
383
384
  <ModifyUpload {i18n} on:clear={() => (value = [])}>
@@ -401,7 +402,7 @@ let uploading = false;
401
402
  {/if}
402
403
  <div
403
404
  class="grid-container"
404
- style="--grid-cols:{effective_columns}; --grid-rows:{rows}; --object-fit: {object_fit}; height: {height};"
405
+ style="--grid-cols:{effective_columns}; --grid-rows:{rows}; --object-fit: {object_fit};"
405
406
  class:pt-6={show_label}
406
407
  >
407
408
  {#each resolved_value as entry, i}
@@ -639,7 +640,6 @@ let uploading = false;
639
640
  .grid-wrap {
640
641
  position: relative;
641
642
  padding: var(--size-2);
642
- height: var(--size-full);
643
643
  overflow-y: scroll;
644
644
  }
645
645
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gradio/gallery",
3
- "version": "0.15.33",
3
+ "version": "0.15.35-dev.0",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
@@ -8,15 +8,15 @@
8
8
  "private": false,
9
9
  "dependencies": {
10
10
  "dequal": "^2.0.2",
11
- "@gradio/client": "^1.19.0",
12
- "@gradio/atoms": "^0.18.0",
11
+ "@gradio/atoms": "^0.18.1",
12
+ "@gradio/client": "^2.0.0-dev.0",
13
13
  "@gradio/icons": "^0.14.0",
14
- "@gradio/image": "^0.23.0",
15
- "@gradio/upload": "^0.17.0",
16
- "@gradio/utils": "^0.10.2",
14
+ "@gradio/image": "^0.23.2-dev.0",
15
+ "@gradio/upload": "^0.17.2-dev.0",
17
16
  "@gradio/statustracker": "^0.11.1",
18
- "@gradio/video": "^0.16.0",
19
- "@gradio/file": "^0.13.0"
17
+ "@gradio/utils": "^0.10.2",
18
+ "@gradio/video": "^0.17.0-dev.0",
19
+ "@gradio/file": "^0.13.1-dev.0"
20
20
  },
21
21
  "devDependencies": {
22
22
  "@gradio/preview": "^0.14.0"
package/shared/Gallery.svelte CHANGED
@@ -461,6 +461,7 @@
461
461
  class:minimal={mode === "minimal"}
462
462
  class:fixed-height={mode !== "minimal" && (!height || height == "auto")}
463
463
  class:hidden={is_full_screen}
464
+ style:height={height !== "auto" ? height + "px" : null}
464
465
  >
465
466
  {#if interactive && selected_index === null}
466
467
  <ModifyUpload {i18n} on:clear={() => (value = [])}>
@@ -484,7 +485,7 @@
484
485
  {/if}
485
486
  <div
486
487
  class="grid-container"
487
- style="--grid-cols:{effective_columns}; --grid-rows:{rows}; --object-fit: {object_fit}; height: {height};"
488
+ style="--grid-cols:{effective_columns}; --grid-rows:{rows}; --object-fit: {object_fit};"
488
489
  class:pt-6={show_label}
489
490
  >
490
491
  {#each resolved_value as entry, i}
@@ -722,7 +723,6 @@
722
723
  .grid-wrap {
723
724
  position: relative;
724
725
  padding: var(--size-2);
725
- height: var(--size-full);
726
726
  overflow-y: scroll;
727
727
  }
728
728