@gradio/annotatedimage 0.9.18 → 0.9.20

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 (4) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/Index.svelte +8 -5
  3. package/dist/Index.svelte +8 -5
  4. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,26 @@
1
1
  # @gradio/annotatedimage
2
2
 
3
+ ## 0.9.20
4
+
5
+ ### Dependency updates
6
+
7
+ - @gradio/statustracker@0.10.12
8
+ - @gradio/client@1.15.1
9
+ - @gradio/upload@0.16.6
10
+
11
+ ## 0.9.19
12
+
13
+ ### Features
14
+
15
+ - [#11177](https://github.com/gradio-app/gradio/pull/11177) [`3068196`](https://github.com/gradio-app/gradio/commit/3068196d47234fd1c1634f33b9ddfc089f5cbbe0) - Improved, smoother fullscreen mode for components. Thanks @aliabid94!
16
+
17
+ ### Dependency updates
18
+
19
+ - @gradio/statustracker@0.10.11
20
+ - @gradio/atoms@0.16.1
21
+ - @gradio/client@1.15.0
22
+ - @gradio/upload@0.16.5
23
+
3
24
  ## 0.9.18
4
25
 
5
26
  ### Dependency updates
package/Index.svelte CHANGED
@@ -48,7 +48,7 @@
48
48
  export let show_fullscreen_button = true;
49
49
 
50
50
  let image_container: HTMLElement;
51
- let is_full_screen = false;
51
+ let fullscreen = false;
52
52
 
53
53
  // `value` can be updated before the Promises from `resolve_wasm_src` are resolved.
54
54
  // In such a case, the resolved values for the old `value` have to be discarded,
@@ -134,6 +134,7 @@
134
134
  {container}
135
135
  {scale}
136
136
  {min_width}
137
+ bind:fullscreen
137
138
  >
138
139
  <StatusTracker
139
140
  autoscroll={gradio.autoscroll}
@@ -154,15 +155,17 @@
154
155
  <IconButtonWrapper>
155
156
  {#if show_fullscreen_button}
156
157
  <FullscreenButton
157
- container={image_container}
158
- on:fullscreenchange={(e) => (is_full_screen = e.detail)}
158
+ {fullscreen}
159
+ on:fullscreen={({ detail }) => {
160
+ fullscreen = detail;
161
+ }}
159
162
  />
160
163
  {/if}
161
164
  </IconButtonWrapper>
162
165
 
163
166
  <img
164
167
  class="base-image"
165
- class:fit-height={height && !is_full_screen}
168
+ class:fit-height={height && !fullscreen}
166
169
  src={_value ? _value.image.url : null}
167
170
  alt="the base file that is annotated"
168
171
  />
@@ -170,7 +173,7 @@
170
173
  <img
171
174
  alt="segmentation mask identifying {label} within the uploaded file"
172
175
  class="mask fit-height"
173
- class:fit-height={!is_full_screen}
176
+ class:fit-height={!fullscreen}
174
177
  class:active={active == ann.label}
175
178
  class:inactive={active != ann.label && active != null}
176
179
  src={ann.image.url}
package/dist/Index.svelte CHANGED
@@ -30,7 +30,7 @@ let active = null;
30
30
  export let loading_status;
31
31
  export let show_fullscreen_button = true;
32
32
  let image_container;
33
- let is_full_screen = false;
33
+ let fullscreen = false;
34
34
  let latest_promise = null;
35
35
  $: {
36
36
  if (value !== old_value) {
@@ -105,6 +105,7 @@ function handle_click(i, value2) {
105
105
  {container}
106
106
  {scale}
107
107
  {min_width}
108
+ bind:fullscreen
108
109
  >
109
110
  <StatusTracker
110
111
  autoscroll={gradio.autoscroll}
@@ -125,15 +126,17 @@ function handle_click(i, value2) {
125
126
  <IconButtonWrapper>
126
127
  {#if show_fullscreen_button}
127
128
  <FullscreenButton
128
- container={image_container}
129
- on:fullscreenchange={(e) => (is_full_screen = e.detail)}
129
+ {fullscreen}
130
+ on:fullscreen={({ detail }) => {
131
+ fullscreen = detail;
132
+ }}
130
133
  />
131
134
  {/if}
132
135
  </IconButtonWrapper>
133
136
 
134
137
  <img
135
138
  class="base-image"
136
- class:fit-height={height && !is_full_screen}
139
+ class:fit-height={height && !fullscreen}
137
140
  src={_value ? _value.image.url : null}
138
141
  alt="the base file that is annotated"
139
142
  />
@@ -141,7 +144,7 @@ function handle_click(i, value2) {
141
144
  <img
142
145
  alt="segmentation mask identifying {label} within the uploaded file"
143
146
  class="mask fit-height"
144
- class:fit-height={!is_full_screen}
147
+ class:fit-height={!fullscreen}
145
148
  class:active={active == ann.label}
146
149
  class:inactive={active != ann.label && active != null}
147
150
  src={ann.image.url}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gradio/annotatedimage",
3
- "version": "0.9.18",
3
+ "version": "0.9.20",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
@@ -22,12 +22,12 @@
22
22
  "svelte": "^4.0.0"
23
23
  },
24
24
  "dependencies": {
25
- "@gradio/atoms": "^0.16.0",
26
- "@gradio/statustracker": "^0.10.10",
27
25
  "@gradio/icons": "^0.12.0",
28
- "@gradio/client": "^1.14.2",
26
+ "@gradio/atoms": "^0.16.1",
27
+ "@gradio/statustracker": "^0.10.12",
28
+ "@gradio/upload": "^0.16.6",
29
+ "@gradio/client": "^1.15.1",
29
30
  "@gradio/utils": "^0.10.2",
30
- "@gradio/upload": "^0.16.4",
31
31
  "@gradio/wasm": "^0.18.1"
32
32
  },
33
33
  "repository": {