@gradio/imageslider 0.5.0 → 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.
Files changed (8) hide show
  1. package/CHANGELOG.md +31 -0
  2. package/ImageSlider.test.ts +17 -0
  3. package/dist/shared/SliderPreview.svelte +11 -2
  4. package/dist/shared/SliderPreview.svelte.d.ts +1 -1
  5. package/dist/types.d.ts +1 -1
  6. package/package.json +6 -6
  7. package/shared/SliderPreview.svelte +11 -2
  8. package/types.ts +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,36 @@
1
1
  # @gradio/imageslider
2
2
 
3
+ ## 0.6.0
4
+
5
+ ### Features
6
+
7
+ - [#13526](https://github.com/gradio-app/gradio/pull/13526) [`53cb4ca`](https://github.com/gradio-app/gradio/commit/53cb4cae1ec3521e9170d12867253516413ba37a) - Run `pnpm lint` and `pnpm ts:check` on CI. Thanks @abidlabs!
8
+
9
+ ### Fixes
10
+
11
+ - [#13533](https://github.com/gradio-app/gradio/pull/13533) [`e5ec1ca`](https://github.com/gradio-app/gradio/commit/e5ec1ca66c45e7e3a057b75ac2b8b86660b2827b) - Fix fullscreen button not working in ImageSlider, interactive Image, native plots, and AnnotatedImage. Thanks @hysts!
12
+
13
+ ### Dependency updates
14
+
15
+ - @gradio/atoms@0.25.0
16
+ - @gradio/statustracker@0.15.0
17
+ - @gradio/utils@0.13.0
18
+ - @gradio/client@2.3.0
19
+ - @gradio/upload@0.18.0
20
+
21
+ ## 0.5.0
22
+
23
+ ### Dependency updates
24
+
25
+ - @gradio/client@2.2.2
26
+
27
+ ## 0.5.0
28
+
29
+ ### Dependency updates
30
+
31
+ - @gradio/client@2.2.1
32
+ - @gradio/upload@0.17.10
33
+
3
34
  ## 0.5.0
4
35
 
5
36
  ### Features
package/ImageSlider.test.ts CHANGED
@@ -345,6 +345,23 @@ describe("Props: buttons", () => {
345
345
  expect(getByLabelText("Fullscreen")).toBeVisible();
346
346
  });
347
347
 
348
+ test("clicking the fullscreen button toggles fullscreen mode", async () => {
349
+ const { getByLabelText } = await render(ImageSlider, {
350
+ ...preview_props,
351
+ buttons: ["fullscreen"]
352
+ });
353
+
354
+ await fireEvent.click(getByLabelText("Fullscreen"));
355
+ await waitFor(() => {
356
+ expect(getByLabelText("Exit fullscreen mode")).toBeVisible();
357
+ });
358
+
359
+ await fireEvent.click(getByLabelText("Exit fullscreen mode"));
360
+ await waitFor(() => {
361
+ expect(getByLabelText("Fullscreen")).toBeVisible();
362
+ });
363
+ });
364
+
348
365
  test("interactive: true with both images shows Remove Image button", async () => {
349
366
  const { getByLabelText } = await render(ImageSlider, {
350
367
  ...default_props,
package/dist/shared/SliderPreview.svelte CHANGED
@@ -34,7 +34,10 @@
34
34
  export let el_width = 0;
35
35
  export let max_height: number;
36
36
  export let interactive = true;
37
- const dispatch = createEventDispatcher<{ clear: void }>();
37
+ const dispatch = createEventDispatcher<{
38
+ clear: void;
39
+ fullscreen: boolean;
40
+ }>();
38
41
 
39
42
  let img: HTMLImageElement;
40
43
  let slider_wrap: HTMLDivElement;
@@ -144,7 +147,13 @@
144
147
  onclick={() => zoomable_image?.reset_zoom()}
145
148
  />
146
149
  {#if show_fullscreen_button}
147
- <FullscreenButton {fullscreen} on:fullscreen />
150
+ <FullscreenButton
151
+ {fullscreen}
152
+ onclick={(is_fullscreen) => {
153
+ fullscreen = is_fullscreen;
154
+ dispatch("fullscreen", is_fullscreen);
155
+ }}
156
+ />
148
157
  {/if}
149
158
 
150
159
  {#if show_download_button}
package/dist/shared/SliderPreview.svelte.d.ts CHANGED
@@ -32,8 +32,8 @@ declare const SliderPreview: $$__sveltets_2_IsomorphicComponent<{
32
32
  max_height: number;
33
33
  interactive?: boolean;
34
34
  }, {
35
- fullscreen: any;
36
35
  clear: CustomEvent<void>;
36
+ fullscreen: CustomEvent<boolean>;
37
37
  } & {
38
38
  [evt: string]: CustomEvent<any>;
39
39
  }, {}, {}, string>;
package/dist/types.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { SelectData, ValueData, ShareData, CustomButton } from "@gradio/utils";
2
- import type { LoadingStatus } from "@gradio/statustracker";
2
+ import type { ILoadingStatus as LoadingStatus } from "@gradio/statustracker";
3
3
  import type { FileData } from "@gradio/client";
4
4
  export interface ImageSliderEvents {
5
5
  input: never;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gradio/imageslider",
3
- "version": "0.5.0",
3
+ "version": "0.6.0",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
@@ -11,12 +11,12 @@
11
11
  "@types/d3-selection": "^3.0.11",
12
12
  "d3-drag": "^3.0.0",
13
13
  "d3-selection": "^3.0.0",
14
- "@gradio/atoms": "^0.24.0",
15
- "@gradio/client": "^2.2.0",
14
+ "@gradio/atoms": "^0.25.0",
15
+ "@gradio/client": "^2.3.0",
16
16
  "@gradio/icons": "^0.15.1",
17
- "@gradio/statustracker": "^0.14.1",
18
- "@gradio/upload": "^0.17.9",
19
- "@gradio/utils": "^0.12.2"
17
+ "@gradio/statustracker": "^0.15.0",
18
+ "@gradio/utils": "^0.13.0",
19
+ "@gradio/upload": "^0.18.0"
20
20
  },
21
21
  "exports": {
22
22
  ".": {
package/shared/SliderPreview.svelte CHANGED
@@ -34,7 +34,10 @@
34
34
  export let el_width = 0;
35
35
  export let max_height: number;
36
36
  export let interactive = true;
37
- const dispatch = createEventDispatcher<{ clear: void }>();
37
+ const dispatch = createEventDispatcher<{
38
+ clear: void;
39
+ fullscreen: boolean;
40
+ }>();
38
41
 
39
42
  let img: HTMLImageElement;
40
43
  let slider_wrap: HTMLDivElement;
@@ -144,7 +147,13 @@
144
147
  onclick={() => zoomable_image?.reset_zoom()}
145
148
  />
146
149
  {#if show_fullscreen_button}
147
- <FullscreenButton {fullscreen} on:fullscreen />
150
+ <FullscreenButton
151
+ {fullscreen}
152
+ onclick={(is_fullscreen) => {
153
+ fullscreen = is_fullscreen;
154
+ dispatch("fullscreen", is_fullscreen);
155
+ }}
156
+ />
148
157
  {/if}
149
158
 
150
159
  {#if show_download_button}
package/types.ts CHANGED
@@ -4,7 +4,7 @@ import type {
4
4
  ShareData,
5
5
  CustomButton
6
6
  } from "@gradio/utils";
7
- import type { LoadingStatus } from "@gradio/statustracker";
7
+ import type { ILoadingStatus as LoadingStatus } from "@gradio/statustracker";
8
8
  import type { FileData } from "@gradio/client";
9
9
 
10
10
  export interface ImageSliderEvents {