@gradio/core 0.28.0 → 0.29.1
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.
- package/CHANGELOG.md +61 -0
- package/dist/src/Blocks.svelte +16 -9
- package/dist/src/Embed.svelte +27 -35
- package/dist/src/Embed.svelte.d.ts +1 -2
- package/dist/src/Render.svelte +10 -5
- package/dist/src/RenderComponent.svelte.d.ts +1 -1
- package/dist/src/api_docs/CodeSnippet.svelte +10 -10
- package/dist/src/i18n.js +23 -4
- package/dist/src/init.js +32 -49
- package/dist/src/lang/ar.json +22 -14
- package/dist/src/types.d.ts +1 -0
- package/package.json +55 -56
- package/src/Blocks.svelte +18 -9
- package/src/Embed.svelte +28 -37
- package/src/Render.svelte +15 -7
- package/src/RenderComponent.svelte +1 -1
- package/src/api_docs/CodeSnippet.svelte +10 -10
- package/src/i18n.ts +27 -6
- package/src/init.ts +45 -59
- package/src/lang/ar.json +22 -14
- package/src/types.ts +1 -0
- package/dist/src/stories/I18nMultiLanguageTest.stories.d.ts +0 -11
- package/public/static/img/Bunny.obj +0 -7474
- package/public/static/img/Duck.glb +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,66 @@
|
|
|
1
1
|
# @gradio/core
|
|
2
2
|
|
|
3
|
+
## 0.29.1
|
|
4
|
+
|
|
5
|
+
### Fixes
|
|
6
|
+
|
|
7
|
+
- [#11992](https://github.com/gradio-app/gradio/pull/11992) [`1ae2a57`](https://github.com/gradio-app/gradio/commit/1ae2a57a253c56cd8f3d3e5d795688fec80cab2c) - fix iframe sizing on spaces for apps runing in SPA mode. Thanks @pngwn!
|
|
8
|
+
- [#11993](https://github.com/gradio-app/gradio/pull/11993) [`0dc0be8`](https://github.com/gradio-app/gradio/commit/0dc0be8ff1526d43ba7b01ccc7d8173f92c5eed2) - Trigger Change Event if component is in inactive tab. Thanks @freddyaboulton!
|
|
9
|
+
|
|
10
|
+
### Dependency updates
|
|
11
|
+
|
|
12
|
+
- @gradio/client@1.19.1
|
|
13
|
+
|
|
14
|
+
## 0.29.0
|
|
15
|
+
|
|
16
|
+
### Dependency updates
|
|
17
|
+
|
|
18
|
+
- @gradio/image@0.23.1
|
|
19
|
+
- @gradio/upload@0.17.1
|
|
20
|
+
- @gradio/atoms@0.18.1
|
|
21
|
+
|
|
22
|
+
## 0.29.0
|
|
23
|
+
|
|
24
|
+
### Dependency updates
|
|
25
|
+
|
|
26
|
+
- @gradio/paramviewer@0.8.1
|
|
27
|
+
|
|
28
|
+
## 0.29.0
|
|
29
|
+
|
|
30
|
+
### Features
|
|
31
|
+
|
|
32
|
+
- [#11894](https://github.com/gradio-app/gradio/pull/11894) [`cf10724`](https://github.com/gradio-app/gradio/commit/cf107246c104f3d8be1adf7a4c3d85558a0a5497) - Remove additional indentation in python API docs. Thanks @freddyaboulton!
|
|
33
|
+
- [#11858](https://github.com/gradio-app/gradio/pull/11858) [`3f8ea13`](https://github.com/gradio-app/gradio/commit/3f8ea13a8ca92abf0ad34392e403a449fda3c6c2) - remove lite. Thanks @pngwn!
|
|
34
|
+
- [#11902](https://github.com/gradio-app/gradio/pull/11902) [`6d39644`](https://github.com/gradio-app/gradio/commit/6d39644ee1000b04728eb4909cee405e7ee3b5b2) - Add navbar visibility controls and customization options. Thanks @abidlabs!
|
|
35
|
+
|
|
36
|
+
### Fixes
|
|
37
|
+
|
|
38
|
+
- [#11919](https://github.com/gradio-app/gradio/pull/11919) [`3b15f63`](https://github.com/gradio-app/gradio/commit/3b15f6370bc143c0acd91225574250bccf0a8877) - ensure spaces iframe resizes when images load. Thanks @pngwn!
|
|
39
|
+
- [#11784](https://github.com/gradio-app/gradio/pull/11784) [`d9dd3f5`](https://github.com/gradio-app/gradio/commit/d9dd3f54b7fb34cf7118e549d39fc63937ca3489) - Add "hidden" option to component's `visible` kwarg to render but visually hide the component. Thanks @pngwn!
|
|
40
|
+
- [#11866](https://github.com/gradio-app/gradio/pull/11866) [`02df670`](https://github.com/gradio-app/gradio/commit/02df670eccf365c253f38b682a3000fe316eef22) - Fix i18n when accept-language header contains multiple values. Thanks @freddyaboulton!
|
|
41
|
+
- [#11903](https://github.com/gradio-app/gradio/pull/11903) [`895d884`](https://github.com/gradio-app/gradio/commit/895d884a7345894f95df5f131d6517e935fd275a) - enhanced_the_arabic_translation. Thanks @makhlwf!
|
|
42
|
+
|
|
43
|
+
### Dependency updates
|
|
44
|
+
|
|
45
|
+
- @gradio/paramviewer@0.8.0
|
|
46
|
+
- @gradio/code@0.15.0
|
|
47
|
+
- @gradio/statustracker@0.11.1
|
|
48
|
+
- @gradio/tabitem@0.6.1
|
|
49
|
+
- @gradio/tabs@0.5.1
|
|
50
|
+
- @gradio/atoms@0.18.0
|
|
51
|
+
- @gradio/checkbox@0.4.30
|
|
52
|
+
- @gradio/client@1.19.0
|
|
53
|
+
- @gradio/upload@0.17.0
|
|
54
|
+
- @gradio/button@0.5.13
|
|
55
|
+
- @gradio/textbox@0.11.1
|
|
56
|
+
- @gradio/gallery@0.15.33
|
|
57
|
+
- @gradio/plot@0.9.24
|
|
58
|
+
- @gradio/image@0.23.0
|
|
59
|
+
- @gradio/column@0.2.2
|
|
60
|
+
- @gradio/dropdown@0.10.4
|
|
61
|
+
- @gradio/file@0.13.0
|
|
62
|
+
- @gradio/video@0.16.0
|
|
63
|
+
|
|
3
64
|
## 0.28.0
|
|
4
65
|
|
|
5
66
|
### Features
|
package/dist/src/Blocks.svelte
CHANGED
|
@@ -683,7 +683,11 @@ async function handle_mount() {
|
|
|
683
683
|
const { id, prop, value } = e.detail;
|
|
684
684
|
if (prop === "value") {
|
|
685
685
|
update_value([
|
|
686
|
-
{
|
|
686
|
+
{
|
|
687
|
+
id,
|
|
688
|
+
prop: "loading_status",
|
|
689
|
+
value: { validation_error: void 0 }
|
|
690
|
+
}
|
|
687
691
|
]);
|
|
688
692
|
}
|
|
689
693
|
update_value([{ id, prop, value }]);
|
|
@@ -832,29 +836,32 @@ function screen_recording() {
|
|
|
832
836
|
}
|
|
833
837
|
let footer_height = 0;
|
|
834
838
|
let root_container;
|
|
835
|
-
$: root_node = $_layout && get_root_node(root_container);
|
|
836
839
|
function get_root_node(container) {
|
|
837
840
|
if (!container) return null;
|
|
838
841
|
return container.children[container.children.length - 1];
|
|
839
842
|
}
|
|
843
|
+
function handle_resize() {
|
|
844
|
+
if ("parentIFrame" in window) {
|
|
845
|
+
const box = root_container.children[0].getBoundingClientRect();
|
|
846
|
+
if (!box) return;
|
|
847
|
+
window.parentIFrame?.size(box.bottom + footer_height + 32);
|
|
848
|
+
}
|
|
849
|
+
}
|
|
840
850
|
onMount(() => {
|
|
841
851
|
if ("parentIFrame" in window) {
|
|
842
852
|
window.parentIFrame?.autoResize(false);
|
|
843
853
|
}
|
|
844
|
-
const mut = new MutationObserver(
|
|
845
|
-
|
|
846
|
-
const box = root_node?.getBoundingClientRect();
|
|
847
|
-
if (!box) return;
|
|
848
|
-
window.parentIFrame?.size(box.bottom + footer_height + 32);
|
|
849
|
-
}
|
|
850
|
-
});
|
|
854
|
+
const mut = new MutationObserver(handle_resize);
|
|
855
|
+
const res = new ResizeObserver(handle_resize);
|
|
851
856
|
mut.observe(root_container, {
|
|
852
857
|
childList: true,
|
|
853
858
|
subtree: true,
|
|
854
859
|
attributes: true
|
|
855
860
|
});
|
|
861
|
+
res.observe(root_container);
|
|
856
862
|
return () => {
|
|
857
863
|
mut.disconnect();
|
|
864
|
+
res.disconnect();
|
|
858
865
|
};
|
|
859
866
|
});
|
|
860
867
|
</script>
|
package/dist/src/Embed.svelte
CHANGED
|
@@ -7,7 +7,6 @@ export let version;
|
|
|
7
7
|
export let initial_height;
|
|
8
8
|
export let fill_width;
|
|
9
9
|
export let is_embed;
|
|
10
|
-
export let is_lite;
|
|
11
10
|
export let space;
|
|
12
11
|
export let display;
|
|
13
12
|
export let info;
|
|
@@ -16,7 +15,6 @@ export let pages = [];
|
|
|
16
15
|
export let current_page = "";
|
|
17
16
|
export let root;
|
|
18
17
|
export let components = [];
|
|
19
|
-
const set_page = getContext("set_lite_page");
|
|
20
18
|
let navbar_component = components.find((c) => c.type === "navbar");
|
|
21
19
|
let navbar = navbar_component ? {
|
|
22
20
|
visible: navbar_component.props.visible,
|
|
@@ -35,9 +33,17 @@ $: if ($navbar_config) {
|
|
|
35
33
|
}
|
|
36
34
|
$: show_navbar = pages.length > 1 && (navbar === null || navbar.visible !== false);
|
|
37
35
|
$: effective_pages = (() => {
|
|
38
|
-
let
|
|
39
|
-
(
|
|
40
|
-
|
|
36
|
+
let visible_pages = pages.filter(([route, label, show], index) => {
|
|
37
|
+
if (index === 0 && route === "") {
|
|
38
|
+
return navbar?.main_page_name !== false;
|
|
39
|
+
}
|
|
40
|
+
return show !== false;
|
|
41
|
+
});
|
|
42
|
+
let base_pages = navbar && navbar.main_page_name !== false && navbar.main_page_name !== "Home" ? visible_pages.map(
|
|
43
|
+
([route, label, show], index) => index === 0 && route === "" && label === "Home" ? [route, navbar.main_page_name] : [route, label]
|
|
44
|
+
) : visible_pages.map(
|
|
45
|
+
([route, label]) => [route, label]
|
|
46
|
+
);
|
|
41
47
|
if (navbar?.value && navbar.value.length > 0) {
|
|
42
48
|
const existing_routes = new Set(base_pages.map(([route]) => route));
|
|
43
49
|
const additional_pages = navbar.value.map(
|
|
@@ -63,32 +69,20 @@ $: effective_pages = (() => {
|
|
|
63
69
|
<div class="nav-holder">
|
|
64
70
|
<nav class="fillable" class:fill_width>
|
|
65
71
|
{#each effective_pages as [route, label], i}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
class:active={route === current_page}
|
|
81
|
-
data-sveltekit-reload
|
|
82
|
-
target={route.startsWith("http://") ||
|
|
83
|
-
route.startsWith("https://")
|
|
84
|
-
? "_blank"
|
|
85
|
-
: "_self"}
|
|
86
|
-
rel={route.startsWith("http://") || route.startsWith("https://")
|
|
87
|
-
? "noopener noreferrer"
|
|
88
|
-
: ""}
|
|
89
|
-
>{label}
|
|
90
|
-
</a>
|
|
91
|
-
{/if}
|
|
72
|
+
<a
|
|
73
|
+
href={route.startsWith("http://") || route.startsWith("https://")
|
|
74
|
+
? route
|
|
75
|
+
: `${root}/${route}`}
|
|
76
|
+
class:active={route === current_page}
|
|
77
|
+
data-sveltekit-reload
|
|
78
|
+
target={route.startsWith("http://") || route.startsWith("https://")
|
|
79
|
+
? "_blank"
|
|
80
|
+
: "_self"}
|
|
81
|
+
rel={route.startsWith("http://") || route.startsWith("https://")
|
|
82
|
+
? "noopener noreferrer"
|
|
83
|
+
: ""}
|
|
84
|
+
>{label}
|
|
85
|
+
</a>
|
|
92
86
|
{/each}
|
|
93
87
|
</nav>
|
|
94
88
|
</div>
|
|
@@ -134,16 +128,14 @@ $: effective_pages = (() => {
|
|
|
134
128
|
margin: 0 auto;
|
|
135
129
|
padding: 0 var(--size-8);
|
|
136
130
|
}
|
|
137
|
-
nav a
|
|
138
|
-
button {
|
|
131
|
+
nav a {
|
|
139
132
|
padding: var(--size-1) var(--size-2);
|
|
140
133
|
border-radius: var(--block-radius);
|
|
141
134
|
border-width: var(--block-border-width);
|
|
142
135
|
border-color: transparent;
|
|
143
136
|
color: var(--body-text-color-subdued);
|
|
144
137
|
}
|
|
145
|
-
nav a.active
|
|
146
|
-
button.active {
|
|
138
|
+
nav a.active {
|
|
147
139
|
color: var(--body-text-color);
|
|
148
140
|
border-color: var(--block-border-color);
|
|
149
141
|
background-color: var(--block-background-fill);
|
|
@@ -6,12 +6,11 @@ declare const __propDef: {
|
|
|
6
6
|
initial_height: string;
|
|
7
7
|
fill_width: boolean;
|
|
8
8
|
is_embed: boolean;
|
|
9
|
-
is_lite: boolean;
|
|
10
9
|
space: string | null;
|
|
11
10
|
display: boolean;
|
|
12
11
|
info: boolean;
|
|
13
12
|
loaded: boolean;
|
|
14
|
-
pages?: [string, string][];
|
|
13
|
+
pages?: [string, string, boolean][];
|
|
15
14
|
current_page?: string;
|
|
16
15
|
root: string;
|
|
17
16
|
components?: any[];
|
package/dist/src/Render.svelte
CHANGED
|
@@ -39,10 +39,14 @@ $: {
|
|
|
39
39
|
setContext("BLOCK_KEY", parent);
|
|
40
40
|
$: {
|
|
41
41
|
if (node && node.type === "form") {
|
|
42
|
-
|
|
43
|
-
(c) =>
|
|
44
|
-
)
|
|
45
|
-
|
|
42
|
+
const allChildrenInvisible = node.children?.every(
|
|
43
|
+
(c) => c.props.visible === false || c.props.visible === "hidden"
|
|
44
|
+
);
|
|
45
|
+
if (allChildrenInvisible) {
|
|
46
|
+
const hasHiddenChild = node.children?.some(
|
|
47
|
+
(c) => c.props.visible === "hidden"
|
|
48
|
+
);
|
|
49
|
+
node.props.visible = hasHiddenChild ? "hidden" : false;
|
|
46
50
|
} else {
|
|
47
51
|
node.props.visible = true;
|
|
48
52
|
}
|
|
@@ -76,7 +80,8 @@ $: node.props.gradio = new Gradio(
|
|
|
76
80
|
{...node.props}
|
|
77
81
|
{theme_mode}
|
|
78
82
|
{root}
|
|
79
|
-
visible={typeof node.props.visible === "boolean"
|
|
83
|
+
visible={typeof node.props.visible === "boolean" ||
|
|
84
|
+
node.props.visible === "hidden"
|
|
80
85
|
? node.props.visible
|
|
81
86
|
: true}
|
|
82
87
|
>
|
|
@@ -43,13 +43,13 @@ $: normalised_root = root.replace(/\/$/, "");
|
|
|
43
43
|
class="highlight">import</span
|
|
44
44
|
> Client{#if has_file_path}, handle_file{/if}
|
|
45
45
|
|
|
46
|
-
|
|
46
|
+
client = Client(<span class="token string">"{space_id || root}"</span
|
|
47
47
|
>{#if username !== null}, auth=("{username}", **password**){/if})
|
|
48
|
-
|
|
48
|
+
result = client.<span class="highlight">predict</span
|
|
49
49
|
>(<!--
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
50
|
+
-->{#each endpoint_parameters as { python_type, example_input, parameter_name, parameter_has_default, parameter_default }, i}<!--
|
|
51
|
+
-->
|
|
52
|
+
{parameter_name
|
|
53
53
|
? parameter_name + "="
|
|
54
54
|
: ""}<span
|
|
55
55
|
>{represent_value(
|
|
@@ -59,11 +59,11 @@ $: normalised_root = root.replace(/\/$/, "");
|
|
|
59
59
|
)}</span
|
|
60
60
|
>,{/each}<!--
|
|
61
61
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
62
|
+
-->
|
|
63
|
+
api_name=<span class="api-name">"/{dependency.api_name}"</span><!--
|
|
64
|
+
-->
|
|
65
|
+
)
|
|
66
|
+
<span class="highlight">print</span>(result)</pre>
|
|
67
67
|
</div>
|
|
68
68
|
</code>
|
|
69
69
|
</Block>
|
package/dist/src/i18n.js
CHANGED
|
@@ -108,6 +108,18 @@ export const language_choices = Object.entries(processed_langs).map(([code]) =>
|
|
|
108
108
|
export let all_common_keys = new Set();
|
|
109
109
|
let i18n_initialized = false;
|
|
110
110
|
let previous_translations;
|
|
111
|
+
function get_lang_from_preferred_locale(header) {
|
|
112
|
+
const options = header
|
|
113
|
+
.split(",")
|
|
114
|
+
.map((value) => value.includes(";") ? value.split(";").slice(0, 2) : [value, 1]);
|
|
115
|
+
options.sort((a, b) => parseFloat(b[1]) - parseFloat(a[1]));
|
|
116
|
+
for (const [lang, _] of options) {
|
|
117
|
+
if (available_locales.includes(lang)) {
|
|
118
|
+
return lang;
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
return null;
|
|
122
|
+
}
|
|
111
123
|
export async function setupi18n(custom_translations, preferred_locale) {
|
|
112
124
|
const should_reinitialize = i18n_initialized && custom_translations !== previous_translations;
|
|
113
125
|
if (i18n_initialized && !should_reinitialize) {
|
|
@@ -118,10 +130,17 @@ export async function setupi18n(custom_translations, preferred_locale) {
|
|
|
118
130
|
processed_langs,
|
|
119
131
|
custom_translations: custom_translations ?? {}
|
|
120
132
|
});
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
133
|
+
let initial_locale = null;
|
|
134
|
+
const browser_locale = getLocaleFromNavigator();
|
|
135
|
+
if (preferred_locale) {
|
|
136
|
+
initial_locale = get_lang_from_preferred_locale(preferred_locale);
|
|
137
|
+
}
|
|
138
|
+
else {
|
|
139
|
+
initial_locale =
|
|
140
|
+
browser_locale && available_locales.includes(browser_locale)
|
|
141
|
+
? browser_locale
|
|
142
|
+
: null;
|
|
143
|
+
}
|
|
125
144
|
if (!initial_locale) {
|
|
126
145
|
const normalized_locale = browser_locale?.split("-")[0];
|
|
127
146
|
initial_locale =
|
package/dist/src/init.js
CHANGED
|
@@ -33,7 +33,6 @@ export function create_components({ initial_layout = undefined } = {
|
|
|
33
33
|
function value_change(cb) {
|
|
34
34
|
value_change_cb = cb;
|
|
35
35
|
}
|
|
36
|
-
// Store current layout and root for dynamic visibility recalculation
|
|
37
36
|
let current_layout;
|
|
38
37
|
let current_root;
|
|
39
38
|
function set_event_specific_args(dependencies) {
|
|
@@ -49,14 +48,11 @@ export function create_components({ initial_layout = undefined } = {
|
|
|
49
48
|
});
|
|
50
49
|
}
|
|
51
50
|
async function create_layout({ app: _app, components, layout, dependencies, root, options }) {
|
|
52
|
-
// make sure the state is settled before proceeding
|
|
53
51
|
flush();
|
|
54
52
|
app = _app;
|
|
55
53
|
if (instance_map) {
|
|
56
|
-
// re-render in reload mode
|
|
57
54
|
components.forEach((c) => {
|
|
58
55
|
if (c.props.value == null && c.key) {
|
|
59
|
-
// If the component has a key, we preserve its value by finding a matching instance with the same key
|
|
60
56
|
const matching_instance = Object.values(instance_map).find((instance) => instance.key === c.key);
|
|
61
57
|
if (matching_instance) {
|
|
62
58
|
c.props.value = matching_instance.props.value;
|
|
@@ -71,13 +67,16 @@ export function create_components({ initial_layout = undefined } = {
|
|
|
71
67
|
constructor_map = new Map();
|
|
72
68
|
_component_map = new Map();
|
|
73
69
|
instance_map = {};
|
|
74
|
-
// Store current layout and root for dynamic visibility recalculation
|
|
75
70
|
current_layout = layout;
|
|
76
71
|
current_root = root;
|
|
77
72
|
_rootNode = {
|
|
78
73
|
id: layout.id,
|
|
79
74
|
type: "column",
|
|
80
|
-
props: {
|
|
75
|
+
props: {
|
|
76
|
+
interactive: false,
|
|
77
|
+
scale: options.fill_height ? 1 : null,
|
|
78
|
+
visible: true
|
|
79
|
+
},
|
|
81
80
|
has_modes: false,
|
|
82
81
|
instance: null,
|
|
83
82
|
component: null,
|
|
@@ -223,7 +222,10 @@ export function create_components({ initial_layout = undefined } = {
|
|
|
223
222
|
instance.props.initial_tabs = child_tab_items?.map((child) => ({
|
|
224
223
|
label: child.props.label.includes(i18n_marker) ? "" : child.props.label,
|
|
225
224
|
id: child.props.id,
|
|
226
|
-
visible: typeof child.props.visible === "boolean"
|
|
225
|
+
visible: typeof child.props.visible === "boolean" ||
|
|
226
|
+
child.props.visible === "hidden"
|
|
227
|
+
? child.props.visible
|
|
228
|
+
: true,
|
|
227
229
|
interactive: child.props.interactive,
|
|
228
230
|
order: child.props.order
|
|
229
231
|
}));
|
|
@@ -248,7 +250,6 @@ export function create_components({ initial_layout = undefined } = {
|
|
|
248
250
|
const components_to_load = components.filter((c) => newly_visible_ids.has(c.id));
|
|
249
251
|
for (const component of components_to_load) {
|
|
250
252
|
const constructor_key = component.component_class_id || component.type;
|
|
251
|
-
// Only load if not already loaded
|
|
252
253
|
if (!constructor_map.has(constructor_key)) {
|
|
253
254
|
const { component: loadable_component, example_components } = get_component(component.type, component.component_class_id, current_root, components);
|
|
254
255
|
constructor_map.set(constructor_key, loadable_component);
|
|
@@ -257,7 +258,6 @@ export function create_components({ initial_layout = undefined } = {
|
|
|
257
258
|
constructor_map.set(name, example_component);
|
|
258
259
|
}
|
|
259
260
|
}
|
|
260
|
-
// Load the component if it doesn't exist yet
|
|
261
261
|
if (!component.component) {
|
|
262
262
|
component.component = (await loadable_component)?.default;
|
|
263
263
|
}
|
|
@@ -279,10 +279,8 @@ export function create_components({ initial_layout = undefined } = {
|
|
|
279
279
|
const instance = instance_map?.[update.id];
|
|
280
280
|
if (!instance)
|
|
281
281
|
return false;
|
|
282
|
-
// Check for visibility property changes
|
|
283
282
|
if (update.prop === "visible")
|
|
284
283
|
return true;
|
|
285
|
-
// Check for selected tab changes in tabs components
|
|
286
284
|
if (update.prop === "selected" && instance.type === "tabs")
|
|
287
285
|
return true;
|
|
288
286
|
return false;
|
|
@@ -294,7 +292,6 @@ export function create_components({ initial_layout = undefined } = {
|
|
|
294
292
|
const all_components = _component_map
|
|
295
293
|
? [..._component_map.values()]
|
|
296
294
|
: _components;
|
|
297
|
-
// Capture current visibility state before applying updates
|
|
298
295
|
if (had_visibility_changes && current_layout) {
|
|
299
296
|
previous_visible_ids = determine_visible_components(current_layout, all_components);
|
|
300
297
|
}
|
|
@@ -331,20 +328,16 @@ export function create_components({ initial_layout = undefined } = {
|
|
|
331
328
|
}
|
|
332
329
|
return layout;
|
|
333
330
|
});
|
|
334
|
-
// After applying updates, check if we need to load new components
|
|
335
331
|
if (had_visibility_changes && current_layout && previous_visible_ids) {
|
|
336
332
|
raf(async () => {
|
|
337
333
|
const new_visible_ids = determine_visible_components(current_layout, all_components);
|
|
338
334
|
const newly_visible_ids = new Set();
|
|
339
|
-
// Find components that are now visible but weren't before
|
|
340
335
|
for (const id of new_visible_ids) {
|
|
341
336
|
if (!previous_visible_ids.has(id)) {
|
|
342
337
|
newly_visible_ids.add(id);
|
|
343
338
|
}
|
|
344
339
|
}
|
|
345
|
-
// Load the newly visible components
|
|
346
340
|
await load_newly_visible_components(newly_visible_ids, all_components);
|
|
347
|
-
// Trigger a layout update to render the newly loaded components
|
|
348
341
|
if (newly_visible_ids.size > 0) {
|
|
349
342
|
layout_store.update((layout) => layout);
|
|
350
343
|
}
|
|
@@ -603,12 +596,10 @@ function is_tab_item_visible(component, component_visible, parent_tabs_context)
|
|
|
603
596
|
* @returns The selected tab ID
|
|
604
597
|
*/
|
|
605
598
|
function get_selected_tab_id(component, layout, components) {
|
|
606
|
-
// Check if selected prop is a string or number
|
|
607
599
|
const selected = component.props.selected;
|
|
608
600
|
if (typeof selected === "string" || typeof selected === "number") {
|
|
609
601
|
return selected;
|
|
610
602
|
}
|
|
611
|
-
// If no tab is explicitly selected, find the first visible and interactive tab
|
|
612
603
|
if (layout.children) {
|
|
613
604
|
for (const child of layout.children) {
|
|
614
605
|
const child_component = components.find((c) => c.id === child.id);
|
|
@@ -652,44 +643,32 @@ function determine_visible_components(layout, components, parent_visible = true,
|
|
|
652
643
|
if (!component) {
|
|
653
644
|
return visible_components;
|
|
654
645
|
}
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
// Handle tab_item special case
|
|
661
|
-
if (component.type === "tabitem") {
|
|
662
|
-
if (is_tab_item_visible(component, component_visible, parent_tabs_context)) {
|
|
663
|
-
visible_components.add(component.id);
|
|
664
|
-
// Process children if this tab item is visible
|
|
665
|
-
const child_visible = process_children_visibility(layout, components, parent_tabs_context);
|
|
666
|
-
child_visible.forEach((id) => visible_components.add(id));
|
|
667
|
-
}
|
|
668
|
-
// If tab item is not visible, none of its children should be loaded
|
|
646
|
+
const component_visible = component.props.visible !== false &&
|
|
647
|
+
component.props.visible !== "hidden" &&
|
|
648
|
+
parent_visible;
|
|
649
|
+
const should_load = component.props.visible === "hidden" || component_visible;
|
|
650
|
+
if (!should_load) {
|
|
669
651
|
return visible_components;
|
|
670
652
|
}
|
|
671
|
-
// Handle tabs component
|
|
672
653
|
if (component.type === "tabs") {
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
654
|
+
const selected_tab_id = get_selected_tab_id(component, layout, components);
|
|
655
|
+
const tabs_context = { selected_tab_id };
|
|
656
|
+
visible_components.add(layout.id);
|
|
657
|
+
const child_visible = process_children_visibility(layout, components, tabs_context);
|
|
658
|
+
child_visible.forEach((id) => visible_components.add(id));
|
|
659
|
+
}
|
|
660
|
+
else if (component.type === "tabitem") {
|
|
661
|
+
if (is_tab_item_visible(component, component_visible, parent_tabs_context)) {
|
|
662
|
+
visible_components.add(layout.id);
|
|
663
|
+
const child_visible = process_children_visibility(layout, components, parent_tabs_context);
|
|
681
664
|
child_visible.forEach((id) => visible_components.add(id));
|
|
682
665
|
}
|
|
683
|
-
return visible_components;
|
|
684
666
|
}
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
visible_components.add(component.id);
|
|
688
|
-
// Process children if this component is visible
|
|
667
|
+
else {
|
|
668
|
+
visible_components.add(layout.id);
|
|
689
669
|
const child_visible = process_children_visibility(layout, components, parent_tabs_context);
|
|
690
670
|
child_visible.forEach((id) => visible_components.add(id));
|
|
691
671
|
}
|
|
692
|
-
// If component is not visible, don't process children
|
|
693
672
|
return visible_components;
|
|
694
673
|
}
|
|
695
674
|
/**
|
|
@@ -701,9 +680,7 @@ function determine_visible_components(layout, components, parent_visible = true,
|
|
|
701
680
|
*/
|
|
702
681
|
export function preload_visible_components(components, layout, root) {
|
|
703
682
|
let constructor_map = new Map();
|
|
704
|
-
// Determine which components should be visible
|
|
705
683
|
const visible_component_ids = determine_visible_components(layout, components);
|
|
706
|
-
// Only preload visible components
|
|
707
684
|
components.forEach((c) => {
|
|
708
685
|
if (visible_component_ids.has(c.id)) {
|
|
709
686
|
const { component, example_components } = get_component(c.type, c.component_class_id, root, components);
|
|
@@ -737,11 +714,17 @@ export function preload_all_components(components, root) {
|
|
|
737
714
|
return constructor_map;
|
|
738
715
|
}
|
|
739
716
|
function is_visible(component) {
|
|
717
|
+
if (component.props.visible === "hidden") {
|
|
718
|
+
return true;
|
|
719
|
+
}
|
|
740
720
|
if (typeof component.props.visible === "boolean" &&
|
|
741
721
|
component.props.visible === false) {
|
|
742
722
|
return false;
|
|
743
723
|
}
|
|
744
724
|
else if (component.parent) {
|
|
725
|
+
if (component.parent.type === "tabitem") {
|
|
726
|
+
return is_tab_item_visible(component.parent, is_visible(component.parent));
|
|
727
|
+
}
|
|
745
728
|
return is_visible(component.parent);
|
|
746
729
|
}
|
|
747
730
|
return true;
|
package/dist/src/lang/ar.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"_name": "العربية",
|
|
3
3
|
"3D_model": {
|
|
4
4
|
"3d_model": "نموذج ثلاثي الأبعاد",
|
|
5
|
-
"drop_to_upload": "اسقط ملف نموذج 3D (.obj، .glb، .stl، .gltf، .splat، أو .ply) هنا للتحميل"
|
|
5
|
+
"drop_to_upload": "اسقط ملف نموذج ثلاثي الأبعاد 3D (.obj، .glb، .stl، .gltf، .splat، أو .ply) هنا للتحميل"
|
|
6
6
|
},
|
|
7
7
|
"annotated_image": {
|
|
8
8
|
"annotated_image": "صورة مشروحة"
|
|
@@ -23,10 +23,10 @@
|
|
|
23
23
|
"drop_to_upload": "اسقط ملف صوت هنا للتحميل"
|
|
24
24
|
},
|
|
25
25
|
"blocks": {
|
|
26
|
-
"connection_can_break": "على الهاتف المحمول، يمكن أن ينقطع الاتصال إذا تم تغيير التبويب أو دخل الجهاز في وضع السكون، مما يؤدي إلى فقدان موقعك في قائمة الانتظار.",
|
|
27
|
-
"long_requests_queue": "هناك قائمة انتظار طويلة من الطلبات المعلقة. قم
|
|
28
|
-
"lost_connection": "
|
|
29
|
-
"waiting_for_inputs": "
|
|
26
|
+
"connection_can_break": "على الهاتف المحمول، يمكن أن ينقطع الاتصال إذا تم تغيير التبويب لهذه الصفحةة أو دخل الجهاز في وضع السكون، مما يؤدي إلى فقدان موقعك في قائمة الانتظار.",
|
|
27
|
+
"long_requests_queue": "هناك قائمة انتظار طويلة من الطلبات المعلقة. قم بنسخ هذه المساحة للتخطي.",
|
|
28
|
+
"lost_connection": "تم فقدان الاتصال بسبب مغادرة الصفحة. جارٍ إعادة الانضمام إلى قائمة الانتظار...",
|
|
29
|
+
"waiting_for_inputs": "إنتظر انتهاء رفع الملف(ات)، يرجى إعادة المحاولة."
|
|
30
30
|
},
|
|
31
31
|
"checkbox": {
|
|
32
32
|
"checkbox": "خانة اختيار",
|
|
@@ -40,9 +40,9 @@
|
|
|
40
40
|
},
|
|
41
41
|
"common": {
|
|
42
42
|
"built_with": "بُني باستخدام",
|
|
43
|
-
"built_with_gradio": "
|
|
43
|
+
"built_with_gradio": "بني بإستخدام Gradio",
|
|
44
44
|
"clear": "أمسح",
|
|
45
|
-
"download": "
|
|
45
|
+
"download": "تنزيل",
|
|
46
46
|
"edit": "تعديل",
|
|
47
47
|
"empty": "فارغ",
|
|
48
48
|
"error": "خطأ",
|
|
@@ -58,7 +58,12 @@
|
|
|
58
58
|
"no_devices": "لم يتم العثور على أجهزة",
|
|
59
59
|
"language": "اللغة",
|
|
60
60
|
"display_theme": "مظهر العرض",
|
|
61
|
-
"pwa": "تطبيق ويب تقدمي"
|
|
61
|
+
"pwa": "تطبيق ويب تقدمي",
|
|
62
|
+
"record": "تسجيل",
|
|
63
|
+
"stop_recording": "إيقاف التسجيل",
|
|
64
|
+
"screen_studio": "شاشة الأستوديو",
|
|
65
|
+
"share_gradio_tab": "مشاركة تبويبة صفحة Gradio",
|
|
66
|
+
"run": "تشغيل"
|
|
62
67
|
},
|
|
63
68
|
"dataframe": {
|
|
64
69
|
"incorrect_format": "تنسيق غير صحيح، يتم دعم ملفات CSV و TSV فقط",
|
|
@@ -73,8 +78,10 @@
|
|
|
73
78
|
"sort_column": "فرز العمود",
|
|
74
79
|
"sort_ascending": "فرز تصاعدي",
|
|
75
80
|
"sort_descending": "فرز تنازلي",
|
|
76
|
-
"drop_to_upload": "اسقط ملفات CSV أو TSV هنا لاستيراد البيانات إلى
|
|
77
|
-
"clear_sort": "مسح الترتيب"
|
|
81
|
+
"drop_to_upload": "اسقط ملفات CSV أو TSV هنا لاستيراد البيانات إلى الإطر الجدولية",
|
|
82
|
+
"clear_sort": "مسح الترتيب",
|
|
83
|
+
"filter": "مرشح",
|
|
84
|
+
"clear_filter": "مسح المرشحات"
|
|
78
85
|
},
|
|
79
86
|
"dropdown": {
|
|
80
87
|
"dropdown": "قائمة منسدلة"
|
|
@@ -82,18 +89,19 @@
|
|
|
82
89
|
"errors": {
|
|
83
90
|
"build_error": "هناك خطأ في البناء",
|
|
84
91
|
"config_error": "هناك خطأ في التكوين",
|
|
85
|
-
"contact_page_author": "يرجى
|
|
92
|
+
"contact_page_author": "يرجى التواصل مع مبرمج الصفحة",
|
|
86
93
|
"no_app_file": "لا يوجد ملف تطبيق",
|
|
87
|
-
"runtime_error": "هناك خطأ
|
|
94
|
+
"runtime_error": "هناك خطأ أثناء التشغيل",
|
|
88
95
|
"space_not_working": "المساحة لا تعمل لأن {0}",
|
|
89
96
|
"space_paused": "المساحة متوقفة مؤقتًا",
|
|
90
|
-
"use_via_api": "
|
|
97
|
+
"use_via_api": "إستخدام عبر API",
|
|
98
|
+
"use_via_api_or_mcp": "إستخدام عبر واجهة برمجة التطبيقات API أو خادم MCP"
|
|
91
99
|
},
|
|
92
100
|
"file": {
|
|
93
101
|
"uploading": "جاري الرفع..."
|
|
94
102
|
},
|
|
95
103
|
"highlighted_text": {
|
|
96
|
-
"highlighted_text": "نص
|
|
104
|
+
"highlighted_text": "نص محدد"
|
|
97
105
|
},
|
|
98
106
|
"image": {
|
|
99
107
|
"allow_webcam_access": "يرجى السماح بالوصول إلى كاميرا الويب للتسجيل.",
|