@gradio/core 0.8.0 → 0.9.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 (9) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/src/Blocks.svelte +19 -5
  3. package/dist/src/Embed.svelte +74 -30
  4. package/dist/src/Embed.svelte.d.ts +3 -0
  5. package/dist/src/lang/en.json +10 -3
  6. package/package.json +26 -26
  7. package/src/Blocks.svelte +22 -6
  8. package/src/Embed.svelte +74 -30
  9. package/src/lang/en.json +10 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # @gradio/core
2
2
 
3
+ ## 0.9.0
4
+
5
+ ### Features
6
+
7
+ - [#10433](https://github.com/gradio-app/gradio/pull/10433) [`2e8dc74`](https://github.com/gradio-app/gradio/commit/2e8dc74f751be02f7217f78d241806b42fcdca04) - Allow building multipage Gradio apps. Thanks @aliabid94!
8
+ - [#10478](https://github.com/gradio-app/gradio/pull/10478) [`afb96c6`](https://github.com/gradio-app/gradio/commit/afb96c64451e5a282bfee89445d831d1c87f9746) - Improve dataframe's upload accessibility. Thanks @hannahblair!
9
+
10
+ ### Dependency updates
11
+
12
+ - @gradio/client@1.11.0
13
+ - @gradio/upload@0.15.0
14
+ - @gradio/button@0.4.5
15
+ - @gradio/paramviewer@0.7.0
16
+ - @gradio/code@0.10.16
17
+ - @gradio/image@0.21.0
18
+ - @gradio/gallery@0.15.5
19
+ - @gradio/file@0.12.5
20
+ - @gradio/video@0.14.0
21
+
3
22
  ## 0.8.0
4
23
 
5
24
  ### Features
package/dist/src/Blocks.svelte CHANGED
@@ -52,6 +52,12 @@ $:
52
52
  $: {
53
53
  ready = !!$_layout;
54
54
  }
55
+ let old_dependencies = dependencies;
56
+ $:
57
+ if (dependencies !== old_dependencies && render_complete) {
58
+ handle_load_triggers();
59
+ old_dependencies = dependencies;
60
+ }
55
61
  async function run() {
56
62
  await create_layout({
57
63
  components,
@@ -275,6 +281,8 @@ async function trigger_api_call(dep_index, trigger_id = null, event_data = null)
275
281
  );
276
282
  } catch (e) {
277
283
  const fn_index = 0;
284
+ if (!app.stream_status.open)
285
+ return;
278
286
  messages = [
279
287
  new_message("Error", String(e), fn_index, "error"),
280
288
  ...messages
@@ -470,11 +478,7 @@ async function handle_mount() {
470
478
  if (is_external_url(_link) && _target !== "_blank")
471
479
  a[i].setAttribute("target", "_blank");
472
480
  }
473
- dependencies.forEach((dep) => {
474
- if (dep.targets.some((dep2) => dep2[1] === "load")) {
475
- wait_then_trigger_api_call(dep.id);
476
- }
477
- });
481
+ handle_load_triggers();
478
482
  if (!target || render_complete)
479
483
  return;
480
484
  target.addEventListener("prop_change", (e) => {
@@ -522,6 +526,13 @@ async function handle_mount() {
522
526
  });
523
527
  render_complete = true;
524
528
  }
529
+ const handle_load_triggers = () => {
530
+ dependencies.forEach((dep) => {
531
+ if (dep.targets.some((dep2) => dep2[1] === "load")) {
532
+ wait_then_trigger_api_call(dep.id);
533
+ }
534
+ });
535
+ };
525
536
  $:
526
537
  set_status($loading_status);
527
538
  function update_status(id, status, data) {
@@ -537,6 +548,9 @@ function update_status(id, status, data) {
537
548
  function set_status(statuses) {
538
549
  let updates = [];
539
550
  Object.entries(statuses).forEach(([id, loading_status2]) => {
551
+ if (!app.stream_status.open && loading_status2.status === "error") {
552
+ return;
553
+ }
540
554
  let dependency = dependencies.find(
541
555
  (dep) => dep.id == loading_status2.fn_index
542
556
  );
package/dist/src/Embed.svelte CHANGED
@@ -9,11 +9,13 @@ export let space;
9
9
  export let display;
10
10
  export let info;
11
11
  export let loaded;
12
+ export let pages = [];
13
+ export let current_page = "";
14
+ export let root;
12
15
  </script>
13
16
 
14
17
  <div
15
18
  bind:this={wrapper}
16
- class:app={!display && !is_embed}
17
19
  class:fill_width
18
20
  class:embed-container={display}
19
21
  class:with-info={info}
@@ -22,32 +24,73 @@ export let loaded;
22
24
  style:flex-grow={!display ? "1" : "auto"}
23
25
  data-iframe-height
24
26
  >
25
- <div class="main">
26
- <slot />
27
- </div>
28
- {#if display && space && info}
29
- <div class="info">
30
- <span>
31
- <a href="https://huggingface.co/spaces/{space}" class="title">{space}</a
32
- >
33
- </span>
34
- <span>
35
- {$_("common.built_with")}
36
- <a class="gradio" href="https://gradio.app">Gradio</a>.
37
- </span>
38
- <span>
39
- {$_("common.hosted_on")}
40
- <a class="hf" href="https://huggingface.co/spaces"
41
- ><span class="space-logo">
42
- <img src={space_logo} alt="Hugging Face Space" />
43
- </span> Spaces</a
44
- >
45
- </span>
27
+ {#if pages.length > 1}
28
+ <div class="nav-holder">
29
+ <nav class="fillable" class:fill_width>
30
+ {#each pages as [route, label], i}
31
+ <a
32
+ href="{root}/{route}"
33
+ class:active={route === current_page}
34
+ data-sveltekit-reload
35
+ >{label}
36
+ </a>
37
+ {/each}
38
+ </nav>
46
39
  </div>
47
40
  {/if}
41
+ <main class="fillable" class:app={!display && !is_embed}>
42
+ <slot />
43
+ <div>
44
+ {#if display && space && info}
45
+ <div class="info">
46
+ <span>
47
+ <a href="https://huggingface.co/spaces/{space}" class="title"
48
+ >{space}</a
49
+ >
50
+ </span>
51
+ <span>
52
+ {$_("common.built_with")}
53
+ <a class="gradio" href="https://gradio.app">Gradio</a>.
54
+ </span>
55
+ <span>
56
+ {$_("common.hosted_on")}
57
+ <a class="hf" href="https://huggingface.co/spaces"
58
+ ><span class="space-logo">
59
+ <img src={space_logo} alt="Hugging Face Space" />
60
+ </span> Spaces</a
61
+ >
62
+ </span>
63
+ </div>
64
+ {/if}
65
+ </div>
66
+ </main>
48
67
  </div>
49
68
 
50
69
  <style>
70
+ .nav-holder {
71
+ padding: var(--size-2) 0;
72
+ border-bottom: solid 1px var(--border-color-primary);
73
+ }
74
+ nav {
75
+ display: flex;
76
+ flex-wrap: wrap;
77
+ gap: var(--size-2);
78
+ justify-content: flex-end;
79
+ margin: 0 auto;
80
+ padding: 0 var(--size-8);
81
+ }
82
+ nav a {
83
+ padding: var(--size-1) var(--size-2);
84
+ border-radius: var(--block-radius);
85
+ border-width: var(--block-border-width);
86
+ border-color: transparent;
87
+ color: var(--body-text-color-subdued);
88
+ }
89
+ nav a.active {
90
+ color: var(--body-text-color);
91
+ border-color: var(--block-border-color);
92
+ background-color: var(--block-background-fill);
93
+ }
51
94
  .gradio-container {
52
95
  display: flex;
53
96
  position: relative;
@@ -68,11 +111,12 @@ export let loaded;
68
111
  padding-bottom: var(--size-7);
69
112
  }
70
113
 
71
- .embed-container > .main {
114
+ .embed-container > main {
72
115
  padding: var(--size-4);
73
116
  }
74
117
 
75
- .app > .main {
118
+ main {
119
+ margin: 0 auto;
76
120
  display: flex;
77
121
  flex-grow: 1;
78
122
  flex-direction: column;
@@ -87,27 +131,27 @@ export let loaded;
87
131
  }
88
132
 
89
133
  @media (--screen-sm) {
90
- .app:not(.fill_width) {
134
+ .fillable:not(.fill_width) {
91
135
  max-width: 640px;
92
136
  }
93
137
  }
94
138
  @media (--screen-md) {
95
- .app:not(.fill_width) {
139
+ .fillable:not(.fill_width) {
96
140
  max-width: 768px;
97
141
  }
98
142
  }
99
143
  @media (--screen-lg) {
100
- .app:not(.fill_width) {
144
+ .fillable:not(.fill_width) {
101
145
  max-width: 1024px;
102
146
  }
103
147
  }
104
148
  @media (--screen-xl) {
105
- .app:not(.fill_width) {
149
+ .fillable:not(.fill_width) {
106
150
  max-width: 1280px;
107
151
  }
108
152
  }
109
153
  @media (--screen-xxl) {
110
- .app:not(.fill_width) {
154
+ .fillable:not(.fill_width) {
111
155
  max-width: 1536px;
112
156
  }
113
157
  }
@@ -189,7 +233,7 @@ export let loaded;
189
233
  height: 12px;
190
234
  }
191
235
 
192
- a:hover {
236
+ main a:hover {
193
237
  text-decoration: underline;
194
238
  }
195
239
  </style>
package/dist/src/Embed.svelte.d.ts CHANGED
@@ -10,6 +10,9 @@ declare const __propDef: {
10
10
  display: boolean;
11
11
  info: boolean;
12
12
  loaded: boolean;
13
+ pages?: [string, string][] | undefined;
14
+ current_page?: string | undefined;
15
+ root: string;
13
16
  };
14
17
  events: {
15
18
  [evt: string]: CustomEvent<any>;
package/dist/src/lang/en.json CHANGED
@@ -1,7 +1,8 @@
1
1
  {
2
2
  "_name": "English",
3
3
  "3D_model": {
4
- "3d_model": "3D Model"
4
+ "3d_model": "3D Model",
5
+ "drop_to_upload": "Drop a 3D model (.obj, .glb, .stl, .gltf, .splat, or .ply) file here to upload"
5
6
  },
6
7
  "annotated_image": {
7
8
  "annotated_image": "Annotated Image"
@@ -9,6 +10,7 @@
9
10
  "audio": {
10
11
  "allow_recording_access": "Please allow access to the microphone for recording.",
11
12
  "audio": "Audio",
13
+ "drop_to_upload": "Drop an audio file here to upload",
12
14
  "record_from_microphone": "Record from microphone",
13
15
  "stop_recording": "Stop recording",
14
16
  "no_device_support": "Media devices could not be accessed. Check that you are running on a secure origin (https) or localhost (or you have passed a valid SSL certificate to ssl_verify), and you have allowed browser access to your device.",
@@ -67,7 +69,8 @@
67
69
  "delete_row": "Delete row",
68
70
  "delete_column": "Delete column",
69
71
  "add_column_left": "Add column to the left",
70
- "add_column_right": "Add column to the right"
72
+ "add_column_right": "Add column to the right",
73
+ "drop_to_upload": "Drop CSV or TSV files here to import data into dataframe"
71
74
  },
72
75
  "dropdown": {
73
76
  "dropdown": "Dropdown"
@@ -96,7 +99,8 @@
96
99
  "remove_image": "Remove Image",
97
100
  "select_brush_color": "Select brush color",
98
101
  "start_drawing": "Start drawing",
99
- "use_brush": "Use brush"
102
+ "use_brush": "Use brush",
103
+ "drop_to_upload": "Drop an image file here to upload"
100
104
  },
101
105
  "label": {
102
106
  "label": "Label"
@@ -129,5 +133,8 @@
129
133
  "drop_video": "Drop Video Here",
130
134
  "drop_gallery": "Drop Media Here",
131
135
  "paste_clipboard": "Paste from Clipboard"
136
+ },
137
+ "video": {
138
+ "drop_to_upload": "Drop a video file here to upload"
132
139
  }
133
140
  }
package/package.json CHANGED
@@ -1,66 +1,66 @@
1
1
  {
2
2
  "name": "@gradio/core",
3
- "version": "0.8.0",
3
+ "version": "0.9.0",
4
4
  "type": "module",
5
5
  "devDependencies": {
6
6
  "@gradio/accordion": "^0.5.6",
7
7
  "@gradio/atoms": "^0.13.1",
8
- "@gradio/annotatedimage": "^0.9.5",
9
- "@gradio/button": "^0.4.4",
10
- "@gradio/audio": "^0.16.0",
8
+ "@gradio/annotatedimage": "^0.9.6",
9
+ "@gradio/button": "^0.4.5",
10
+ "@gradio/chatbot": "^0.22.4",
11
11
  "@gradio/box": "^0.2.10",
12
- "@gradio/chatbot": "^0.22.3",
13
12
  "@gradio/checkbox": "^0.4.12",
13
+ "@gradio/audio": "^0.17.0",
14
14
  "@gradio/checkboxgroup": "^0.6.12",
15
- "@gradio/client": "^1.10.0",
16
- "@gradio/code": "^0.10.15",
15
+ "@gradio/client": "^1.11.0",
17
16
  "@gradio/colorpicker": "^0.4.12",
18
17
  "@gradio/column": "^0.2.0",
19
- "@gradio/dataset": "^0.4.4",
20
- "@gradio/dataframe": "^0.14.0",
18
+ "@gradio/code": "^0.10.16",
19
+ "@gradio/dataframe": "^0.15.0",
20
+ "@gradio/dataset": "^0.4.5",
21
21
  "@gradio/datetime": "^0.3.4",
22
- "@gradio/downloadbutton": "^0.3.4",
22
+ "@gradio/downloadbutton": "^0.3.5",
23
23
  "@gradio/dropdown": "^0.9.10",
24
24
  "@gradio/fallback": "^0.4.12",
25
- "@gradio/fileexplorer": "^0.5.15",
26
25
  "@gradio/form": "^0.2.10",
27
- "@gradio/file": "^0.12.4",
28
- "@gradio/gallery": "^0.15.4",
26
+ "@gradio/file": "^0.12.5",
27
+ "@gradio/fileexplorer": "^0.5.16",
28
+ "@gradio/gallery": "^0.15.5",
29
29
  "@gradio/group": "^0.2.0",
30
- "@gradio/highlightedtext": "^0.8.12",
31
30
  "@gradio/html": "^0.6.3",
32
- "@gradio/image": "^0.20.4",
31
+ "@gradio/highlightedtext": "^0.8.12",
33
32
  "@gradio/icons": "^0.10.0",
34
- "@gradio/imageeditor": "^0.12.6",
33
+ "@gradio/image": "^0.21.0",
34
+ "@gradio/imageeditor": "^0.12.7",
35
35
  "@gradio/json": "^0.5.12",
36
36
  "@gradio/label": "^0.5.4",
37
37
  "@gradio/browserstate": "^0.3.0",
38
- "@gradio/model3d": "^0.13.15",
39
- "@gradio/multimodaltextbox": "^0.9.5",
40
38
  "@gradio/markdown": "^0.13.2",
39
+ "@gradio/model3d": "^0.14.0",
40
+ "@gradio/multimodaltextbox": "^0.9.6",
41
41
  "@gradio/nativeplot": "^0.5.6",
42
42
  "@gradio/number": "^0.5.12",
43
- "@gradio/paramviewer": "^0.6.4",
43
+ "@gradio/paramviewer": "^0.7.0",
44
44
  "@gradio/plot": "^0.9.7",
45
45
  "@gradio/row": "^0.2.1",
46
- "@gradio/sidebar": "^0.1.0",
47
46
  "@gradio/radio": "^0.6.12",
47
+ "@gradio/sidebar": "^0.1.1",
48
48
  "@gradio/simpledropdown": "^0.3.12",
49
49
  "@gradio/simpletextbox": "^0.3.12",
50
- "@gradio/simpleimage": "^0.8.15",
50
+ "@gradio/simpleimage": "^0.8.16",
51
51
  "@gradio/slider": "^0.6.0",
52
- "@gradio/state": "^0.1.2",
53
52
  "@gradio/statustracker": "^0.10.2",
53
+ "@gradio/state": "^0.1.2",
54
54
  "@gradio/tabitem": "^0.4.1",
55
55
  "@gradio/tabs": "^0.4.1",
56
56
  "@gradio/textbox": "^0.10.2",
57
57
  "@gradio/theme": "^0.3.0",
58
58
  "@gradio/timer": "^0.4.3",
59
- "@gradio/upload": "^0.14.8",
60
- "@gradio/uploadbutton": "^0.8.4",
59
+ "@gradio/upload": "^0.15.0",
60
+ "@gradio/uploadbutton": "^0.8.5",
61
61
  "@gradio/utils": "^0.10.0",
62
- "@gradio/video": "^0.13.4",
63
- "@gradio/wasm": "^0.17.2"
62
+ "@gradio/wasm": "^0.17.2",
63
+ "@gradio/video": "^0.14.0"
64
64
  },
65
65
  "msw": {
66
66
  "workerDirectory": "public"
package/src/Blocks.svelte CHANGED
@@ -51,6 +51,7 @@
51
51
  export let max_file_size: number | undefined = undefined;
52
52
  export let initial_layout: ComponentMeta | undefined = undefined;
53
53
  export let css: string | null | undefined = null;
54
+
54
55
  let {
55
56
  layout: _layout,
56
57
  targets,
@@ -71,6 +72,13 @@
71
72
  ready = !!$_layout;
72
73
  }
73
74
 
75
+ let old_dependencies = dependencies;
76
+ $: if (dependencies !== old_dependencies && render_complete) {
77
+ // re-run load triggers in SSR mode when page changes
78
+ handle_load_triggers();
79
+ old_dependencies = dependencies;
80
+ }
81
+
74
82
  async function run(): Promise<void> {
75
83
  await create_layout({
76
84
  components,
@@ -364,6 +372,7 @@
364
372
  );
365
373
  } catch (e) {
366
374
  const fn_index = 0; // Mock value for fn_index
375
+ if (!app.stream_status.open) return; // when a user navigates away in multipage app.
367
376
  messages = [
368
377
  new_message("Error", String(e), fn_index, "error"),
369
378
  ...messages
@@ -607,12 +616,7 @@
607
616
  a[i].setAttribute("target", "_blank");
608
617
  }
609
618
 
610
- // handle load triggers
611
- dependencies.forEach((dep) => {
612
- if (dep.targets.some((dep) => dep[1] === "load")) {
613
- wait_then_trigger_api_call(dep.id);
614
- }
615
- });
619
+ handle_load_triggers();
616
620
 
617
621
  if (!target || render_complete) return;
618
622
 
@@ -665,6 +669,14 @@
665
669
  render_complete = true;
666
670
  }
667
671
 
672
+ const handle_load_triggers = (): void => {
673
+ dependencies.forEach((dep) => {
674
+ if (dep.targets.some((dep) => dep[1] === "load")) {
675
+ wait_then_trigger_api_call(dep.id);
676
+ }
677
+ });
678
+ };
679
+
668
680
  $: set_status($loading_status);
669
681
 
670
682
  function update_status(
@@ -689,6 +701,10 @@
689
701
  value: LoadingStatus;
690
702
  }[] = [];
691
703
  Object.entries(statuses).forEach(([id, loading_status]) => {
704
+ if (!app.stream_status.open && loading_status.status === "error") {
705
+ // when a user navigates away in multipage app.
706
+ return;
707
+ }
692
708
  let dependency = dependencies.find(
693
709
  (dep) => dep.id == loading_status.fn_index
694
710
  );
package/src/Embed.svelte CHANGED
@@ -11,11 +11,13 @@
11
11
  export let display: boolean;
12
12
  export let info: boolean;
13
13
  export let loaded: boolean;
14
+ export let pages: [string, string][] = [];
15
+ export let current_page = "";
16
+ export let root: string;
14
17
  </script>
15
18
 
16
19
  <div
17
20
  bind:this={wrapper}
18
- class:app={!display && !is_embed}
19
21
  class:fill_width
20
22
  class:embed-container={display}
21
23
  class:with-info={info}
@@ -24,32 +26,73 @@
24
26
  style:flex-grow={!display ? "1" : "auto"}
25
27
  data-iframe-height
26
28
  >
27
- <div class="main">
28
- <slot />
29
- </div>
30
- {#if display && space && info}
31
- <div class="info">
32
- <span>
33
- <a href="https://huggingface.co/spaces/{space}" class="title">{space}</a
34
- >
35
- </span>
36
- <span>
37
- {$_("common.built_with")}
38
- <a class="gradio" href="https://gradio.app">Gradio</a>.
39
- </span>
40
- <span>
41
- {$_("common.hosted_on")}
42
- <a class="hf" href="https://huggingface.co/spaces"
43
- ><span class="space-logo">
44
- <img src={space_logo} alt="Hugging Face Space" />
45
- </span> Spaces</a
46
- >
47
- </span>
29
+ {#if pages.length > 1}
30
+ <div class="nav-holder">
31
+ <nav class="fillable" class:fill_width>
32
+ {#each pages as [route, label], i}
33
+ <a
34
+ href="{root}/{route}"
35
+ class:active={route === current_page}
36
+ data-sveltekit-reload
37
+ >{label}
38
+ </a>
39
+ {/each}
40
+ </nav>
48
41
  </div>
49
42
  {/if}
43
+ <main class="fillable" class:app={!display && !is_embed}>
44
+ <slot />
45
+ <div>
46
+ {#if display && space && info}
47
+ <div class="info">
48
+ <span>
49
+ <a href="https://huggingface.co/spaces/{space}" class="title"
50
+ >{space}</a
51
+ >
52
+ </span>
53
+ <span>
54
+ {$_("common.built_with")}
55
+ <a class="gradio" href="https://gradio.app">Gradio</a>.
56
+ </span>
57
+ <span>
58
+ {$_("common.hosted_on")}
59
+ <a class="hf" href="https://huggingface.co/spaces"
60
+ ><span class="space-logo">
61
+ <img src={space_logo} alt="Hugging Face Space" />
62
+ </span> Spaces</a
63
+ >
64
+ </span>
65
+ </div>
66
+ {/if}
67
+ </div>
68
+ </main>
50
69
  </div>
51
70
 
52
71
  <style>
72
+ .nav-holder {
73
+ padding: var(--size-2) 0;
74
+ border-bottom: solid 1px var(--border-color-primary);
75
+ }
76
+ nav {
77
+ display: flex;
78
+ flex-wrap: wrap;
79
+ gap: var(--size-2);
80
+ justify-content: flex-end;
81
+ margin: 0 auto;
82
+ padding: 0 var(--size-8);
83
+ }
84
+ nav a {
85
+ padding: var(--size-1) var(--size-2);
86
+ border-radius: var(--block-radius);
87
+ border-width: var(--block-border-width);
88
+ border-color: transparent;
89
+ color: var(--body-text-color-subdued);
90
+ }
91
+ nav a.active {
92
+ color: var(--body-text-color);
93
+ border-color: var(--block-border-color);
94
+ background-color: var(--block-background-fill);
95
+ }
53
96
  .gradio-container {
54
97
  display: flex;
55
98
  position: relative;
@@ -70,11 +113,12 @@
70
113
  padding-bottom: var(--size-7);
71
114
  }
72
115
 
73
- .embed-container > .main {
116
+ .embed-container > main {
74
117
  padding: var(--size-4);
75
118
  }
76
119
 
77
- .app > .main {
120
+ main {
121
+ margin: 0 auto;
78
122
  display: flex;
79
123
  flex-grow: 1;
80
124
  flex-direction: column;
@@ -89,27 +133,27 @@
89
133
  }
90
134
 
91
135
  @media (--screen-sm) {
92
- .app:not(.fill_width) {
136
+ .fillable:not(.fill_width) {
93
137
  max-width: 640px;
94
138
  }
95
139
  }
96
140
  @media (--screen-md) {
97
- .app:not(.fill_width) {
141
+ .fillable:not(.fill_width) {
98
142
  max-width: 768px;
99
143
  }
100
144
  }
101
145
  @media (--screen-lg) {
102
- .app:not(.fill_width) {
146
+ .fillable:not(.fill_width) {
103
147
  max-width: 1024px;
104
148
  }
105
149
  }
106
150
  @media (--screen-xl) {
107
- .app:not(.fill_width) {
151
+ .fillable:not(.fill_width) {
108
152
  max-width: 1280px;
109
153
  }
110
154
  }
111
155
  @media (--screen-xxl) {
112
- .app:not(.fill_width) {
156
+ .fillable:not(.fill_width) {
113
157
  max-width: 1536px;
114
158
  }
115
159
  }
@@ -191,7 +235,7 @@
191
235
  height: 12px;
192
236
  }
193
237
 
194
- a:hover {
238
+ main a:hover {
195
239
  text-decoration: underline;
196
240
  }
197
241
  </style>
package/src/lang/en.json CHANGED
@@ -1,7 +1,8 @@
1
1
  {
2
2
  "_name": "English",
3
3
  "3D_model": {
4
- "3d_model": "3D Model"
4
+ "3d_model": "3D Model",
5
+ "drop_to_upload": "Drop a 3D model (.obj, .glb, .stl, .gltf, .splat, or .ply) file here to upload"
5
6
  },
6
7
  "annotated_image": {
7
8
  "annotated_image": "Annotated Image"
@@ -9,6 +10,7 @@
9
10
  "audio": {
10
11
  "allow_recording_access": "Please allow access to the microphone for recording.",
11
12
  "audio": "Audio",
13
+ "drop_to_upload": "Drop an audio file here to upload",
12
14
  "record_from_microphone": "Record from microphone",
13
15
  "stop_recording": "Stop recording",
14
16
  "no_device_support": "Media devices could not be accessed. Check that you are running on a secure origin (https) or localhost (or you have passed a valid SSL certificate to ssl_verify), and you have allowed browser access to your device.",
@@ -67,7 +69,8 @@
67
69
  "delete_row": "Delete row",
68
70
  "delete_column": "Delete column",
69
71
  "add_column_left": "Add column to the left",
70
- "add_column_right": "Add column to the right"
72
+ "add_column_right": "Add column to the right",
73
+ "drop_to_upload": "Drop CSV or TSV files here to import data into dataframe"
71
74
  },
72
75
  "dropdown": {
73
76
  "dropdown": "Dropdown"
@@ -96,7 +99,8 @@
96
99
  "remove_image": "Remove Image",
97
100
  "select_brush_color": "Select brush color",
98
101
  "start_drawing": "Start drawing",
99
- "use_brush": "Use brush"
102
+ "use_brush": "Use brush",
103
+ "drop_to_upload": "Drop an image file here to upload"
100
104
  },
101
105
  "label": {
102
106
  "label": "Label"
@@ -129,5 +133,8 @@
129
133
  "drop_video": "Drop Video Here",
130
134
  "drop_gallery": "Drop Media Here",
131
135
  "paste_clipboard": "Paste from Clipboard"
136
+ },
137
+ "video": {
138
+ "drop_to_upload": "Drop a video file here to upload"
132
139
  }
133
140
  }