@gradio/dataset 0.5.7 → 0.5.9

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 +24 -0
  2. package/Dataset.svelte +41 -11
  3. package/dist/Dataset.svelte +41 -11
  4. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,29 @@
1
1
  # @gradio/dataset
2
2
 
3
+ ## 0.5.9
4
+
5
+ ### Fixes
6
+
7
+ - [#13291](https://github.com/gradio-app/gradio/pull/13291) [`77fca72`](https://github.com/gradio-app/gradio/commit/77fca72b8eba2bcda19c31bba285af2642a4cc9d) - Dataset: fix gallery view using wrong component metadata index and fix broken pagination after Svelte 5 migration. Thanks @ParamChordiya!
8
+
9
+ ### Dependency updates
10
+
11
+ - @gradio/atoms@0.24.0
12
+ - @gradio/upload@0.17.9
13
+ - @gradio/textbox@0.13.9
14
+
15
+ ## 0.5.8
16
+
17
+ ### Features
18
+
19
+ - [#13231](https://github.com/gradio-app/gradio/pull/13231) [`89f7a09`](https://github.com/gradio-app/gradio/commit/89f7a096ceb947c97ac5dce9f8b8d62e1361ad7b) - Layout tests. Thanks @pngwn!
20
+
21
+ ### Dependency updates
22
+
23
+ - @gradio/atoms@0.23.1
24
+ - @gradio/client@2.2.0
25
+ - @gradio/textbox@0.13.8
26
+
3
27
  ## 0.5.7
4
28
 
5
29
  ### Dependency updates
package/Dataset.svelte CHANGED
@@ -61,9 +61,10 @@
61
61
 
62
62
  // page resets to 0 whenever effective_samples changes,
63
63
  // but can still be overwritten by user clicks
64
- let page = $derived.by(() => {
64
+ let page = $state(0);
65
+ $effect(() => {
65
66
  effective_samples;
66
- return 0;
67
+ page = 0;
67
68
  });
68
69
 
69
70
  let paginate = $derived(effective_samples.length > samples_per_page);
@@ -110,7 +111,7 @@
110
111
  value: any;
111
112
  component: LoadingComponent;
112
113
  runtime: false | typeof import("svelte");
113
- }[][] = [];
114
+ }[][] = $state([]);
114
115
 
115
116
  async function get_component_meta(
116
117
  selected_samples_json: string
@@ -145,10 +146,10 @@
145
146
  let selected_samples_json = $derived(JSON.stringify(selected_samples || []));
146
147
  </script>
147
148
 
148
- {#await get_component_meta(selected_samples_json) then _}
149
+ {#await get_component_meta(selected_samples_json)}
149
150
  {#if gallery}
150
151
  <div class="gallery">
151
- {#each selected_samples as sample_row, i}
152
+ {#each selected_samples as sample_row, i (i)}
152
153
  {#if sample_row[0] != null}
153
154
  <button
154
155
  class="gallery-item"
@@ -166,8 +167,37 @@
166
167
  selected={current_hover === i}
167
168
  type="gallery"
168
169
  />
169
- {:else if component_meta.length}
170
- {#await Promise.all( [component_meta[0][0].component, component_meta[0][0].runtime] ) then [component, runtime]}
170
+ {:else}
171
+ {sample_row[0]}
172
+ {/if}
173
+ </button>
174
+ {/if}
175
+ {/each}
176
+ </div>
177
+ {/if}
178
+ {:then _}
179
+ {#if gallery}
180
+ <div class="gallery">
181
+ {#each selected_samples as sample_row, i (i)}
182
+ {#if sample_row[0] != null}
183
+ <button
184
+ class="gallery-item"
185
+ onclick={() => {
186
+ value = i + page * samples_per_page;
187
+ onclick({ index: value, value: sample_row });
188
+ onselect({ index: value, value: sample_row });
189
+ }}
190
+ onmouseenter={() => handle_mouseenter(i)}
191
+ onmouseleave={() => handle_mouseleave()}
192
+ >
193
+ {#if sample_labels}
194
+ <BaseExample
195
+ value={sample_row[0]}
196
+ selected={current_hover === i}
197
+ type="gallery"
198
+ />
199
+ {:else if component_meta.length && component_meta[i]}
200
+ {#await Promise.all( [component_meta[i][0].component, component_meta[i][0].runtime] ) then [component, runtime]}
171
201
  {#key sample_row[0]}
172
202
  <MountExample
173
203
  {component}
@@ -192,7 +222,7 @@
192
222
  <table tabindex="0" role="grid">
193
223
  <thead>
194
224
  <tr class="tr-head">
195
- {#each headers as header}
225
+ {#each headers as header (header)}
196
226
  <th>
197
227
  {header}
198
228
  </th>
@@ -200,7 +230,7 @@
200
230
  </tr>
201
231
  </thead>
202
232
  <tbody>
203
- {#each component_meta as sample_row, i}
233
+ {#each component_meta as sample_row, i (i)}
204
234
  <tr
205
235
  class="tr-body"
206
236
  onclick={() => {
@@ -214,7 +244,7 @@
214
244
  onmouseenter={() => handle_mouseenter(i)}
215
245
  onmouseleave={() => handle_mouseleave()}
216
246
  >
217
- {#each sample_row as { value, component, runtime }, j}
247
+ {#each sample_row as { value, component, runtime }, j (j)}
218
248
  {@const component_name = components[j]}
219
249
 
220
250
  {#if component_name !== undefined}
@@ -249,7 +279,7 @@
249
279
  {#if paginate}
250
280
  <div class="paginate">
251
281
  Pages:
252
- {#each visible_pages as visible_page}
282
+ {#each visible_pages as visible_page (visible_page)}
253
283
  {#if visible_page === -1}
254
284
  <div>...</div>
255
285
  {:else}
package/dist/Dataset.svelte CHANGED
@@ -61,9 +61,10 @@
61
61
 
62
62
  // page resets to 0 whenever effective_samples changes,
63
63
  // but can still be overwritten by user clicks
64
- let page = $derived.by(() => {
64
+ let page = $state(0);
65
+ $effect(() => {
65
66
  effective_samples;
66
- return 0;
67
+ page = 0;
67
68
  });
68
69
 
69
70
  let paginate = $derived(effective_samples.length > samples_per_page);
@@ -110,7 +111,7 @@
110
111
  value: any;
111
112
  component: LoadingComponent;
112
113
  runtime: false | typeof import("svelte");
113
- }[][] = [];
114
+ }[][] = $state([]);
114
115
 
115
116
  async function get_component_meta(
116
117
  selected_samples_json: string
@@ -145,10 +146,10 @@
145
146
  let selected_samples_json = $derived(JSON.stringify(selected_samples || []));
146
147
  </script>
147
148
 
148
- {#await get_component_meta(selected_samples_json) then _}
149
+ {#await get_component_meta(selected_samples_json)}
149
150
  {#if gallery}
150
151
  <div class="gallery">
151
- {#each selected_samples as sample_row, i}
152
+ {#each selected_samples as sample_row, i (i)}
152
153
  {#if sample_row[0] != null}
153
154
  <button
154
155
  class="gallery-item"
@@ -166,8 +167,37 @@
166
167
  selected={current_hover === i}
167
168
  type="gallery"
168
169
  />
169
- {:else if component_meta.length}
170
- {#await Promise.all( [component_meta[0][0].component, component_meta[0][0].runtime] ) then [component, runtime]}
170
+ {:else}
171
+ {sample_row[0]}
172
+ {/if}
173
+ </button>
174
+ {/if}
175
+ {/each}
176
+ </div>
177
+ {/if}
178
+ {:then _}
179
+ {#if gallery}
180
+ <div class="gallery">
181
+ {#each selected_samples as sample_row, i (i)}
182
+ {#if sample_row[0] != null}
183
+ <button
184
+ class="gallery-item"
185
+ onclick={() => {
186
+ value = i + page * samples_per_page;
187
+ onclick({ index: value, value: sample_row });
188
+ onselect({ index: value, value: sample_row });
189
+ }}
190
+ onmouseenter={() => handle_mouseenter(i)}
191
+ onmouseleave={() => handle_mouseleave()}
192
+ >
193
+ {#if sample_labels}
194
+ <BaseExample
195
+ value={sample_row[0]}
196
+ selected={current_hover === i}
197
+ type="gallery"
198
+ />
199
+ {:else if component_meta.length && component_meta[i]}
200
+ {#await Promise.all( [component_meta[i][0].component, component_meta[i][0].runtime] ) then [component, runtime]}
171
201
  {#key sample_row[0]}
172
202
  <MountExample
173
203
  {component}
@@ -192,7 +222,7 @@
192
222
  <table tabindex="0" role="grid">
193
223
  <thead>
194
224
  <tr class="tr-head">
195
- {#each headers as header}
225
+ {#each headers as header (header)}
196
226
  <th>
197
227
  {header}
198
228
  </th>
@@ -200,7 +230,7 @@
200
230
  </tr>
201
231
  </thead>
202
232
  <tbody>
203
- {#each component_meta as sample_row, i}
233
+ {#each component_meta as sample_row, i (i)}
204
234
  <tr
205
235
  class="tr-body"
206
236
  onclick={() => {
@@ -214,7 +244,7 @@
214
244
  onmouseenter={() => handle_mouseenter(i)}
215
245
  onmouseleave={() => handle_mouseleave()}
216
246
  >
217
- {#each sample_row as { value, component, runtime }, j}
247
+ {#each sample_row as { value, component, runtime }, j (j)}
218
248
  {@const component_name = components[j]}
219
249
 
220
250
  {#if component_name !== undefined}
@@ -249,7 +279,7 @@
249
279
  {#if paginate}
250
280
  <div class="paginate">
251
281
  Pages:
252
- {#each visible_pages as visible_page}
282
+ {#each visible_pages as visible_page (visible_page)}
253
283
  {#if visible_page === -1}
254
284
  <div>...</div>
255
285
  {:else}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gradio/dataset",
3
- "version": "0.5.7",
3
+ "version": "0.5.9",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
@@ -16,11 +16,11 @@
16
16
  "./package.json": "./package.json"
17
17
  },
18
18
  "dependencies": {
19
+ "@gradio/atoms": "^0.24.0",
19
20
  "@gradio/utils": "^0.12.2",
20
- "@gradio/client": "^2.1.0",
21
- "@gradio/upload": "^0.17.8",
22
- "@gradio/textbox": "^0.13.7",
23
- "@gradio/atoms": "^0.23.0"
21
+ "@gradio/client": "^2.2.0",
22
+ "@gradio/textbox": "^0.13.9",
23
+ "@gradio/upload": "^0.17.9"
24
24
  },
25
25
  "devDependencies": {
26
26
  "@gradio/preview": "^0.16.2"