@gradio/core 0.16.1 → 0.18.0

package/src/i18n.test.ts

@@ -1,7 +1,36 @@
-import { describe, test, assert } from "vitest";
+import {
+	describe,
+	test,
+	expect,
+	assert,
+	vi,
+	beforeEach,
+	afterEach
+} from "vitest";
 import { process_langs } from "./i18n";
 import languagesByAnyCode from "wikidata-lang/indexes/by_any_code";
 import BCP47 from "./lang/BCP47_codes";
+import {
+	translate_if_needed,
+	get_initial_locale,
+	load_translations,
+	changeLocale,
+	is_translation_metadata
+} from "./i18n";
+
+vi.mock("svelte-i18n", () => ({
+	locale: { set: vi.fn() },
+	_: vi.fn((key) => `translated_${key}`),
+	addMessages: vi.fn(),
+	init: vi.fn().mockResolvedValue(undefined)
+}));
+
+vi.mock("svelte/store", () => ({
+	get: vi.fn((store) => store),
+	derived: vi.fn()
+}));
+
+import { locale, init, addMessages } from "svelte-i18n";
 
 describe("i18n", () => {
 	test("languages are loaded correctly", () => {
@@ -24,4 +53,94 @@ describe("i18n", () => {
 			assert.ok(translation.common);
 		});
 	});
+
+	describe("basic functions", () => {
+		test("translate_if_needed handles regular strings", () => {
+			const regularString = "hello world";
+			expect(translate_if_needed(regularString)).toBe(regularString);
+		});
+	});
+
+	describe("locale management", () => {
+		test("get_initial_locale returns browser locale when available", () => {
+			const result = get_initial_locale("fr", ["en", "fr", "de"]);
+			expect(result).toBe("fr");
+		});
+
+		test("get_initial_locale falls back to fallback locale when browser locale not available", () => {
+			const result = get_initial_locale("es", ["en", "fr", "de"]);
+			expect(result).toBe("en");
+		});
+
+		test("get_initial_locale falls back to fallback locale when browser locale is null", () => {
+			const result = get_initial_locale(null, ["en", "fr", "de"]);
+			expect(result).toBe("en");
+		});
+
+		test("get_initial_locale uses custom fallback locale when provided", () => {
+			const result = get_initial_locale("es", ["en", "fr", "de"], "de");
+			expect(result).toBe("de");
+		});
+	});
+
+	describe("i18n setup and initialization", () => {
+		beforeEach(() => {
+			vi.clearAllMocks();
+		});
+
+		afterEach(() => {
+			vi.resetAllMocks();
+		});
+
+		test("load_translations adds messages for each language", () => {
+			const mockAddMessages = addMessages as unknown as ReturnType<
+				typeof vi.fn
+			>;
+
+			const custom_translations = {
+				en: {
+					greeting: "Hello"
+				},
+				fr: {
+					greeting: "Bonjour"
+				}
+			};
+
+			load_translations(custom_translations);
+
+			expect(mockAddMessages).toHaveBeenCalledTimes(2);
+			expect(mockAddMessages).toHaveBeenCalledWith(
+				"en",
+				custom_translations.en
+			);
+			expect(mockAddMessages).toHaveBeenCalledWith(
+				"fr",
+				custom_translations.fr
+			);
+		});
+
+		test("changeLocale sets the locale correctly", () => {
+			const mockSetLocale = locale.set as unknown as ReturnType<typeof vi.fn>;
+
+			changeLocale("fr");
+
+			expect(mockSetLocale).toHaveBeenCalledWith("fr");
+		});
+	});
+
+	describe("translation metadata handling", () => {
+		test("is_translation_metadata identifies valid metadata objects", () => {
+			expect(
+				is_translation_metadata({
+					__type__: "translation_metadata" as const,
+					key: "test.key"
+				})
+			).toBe(true);
+			expect(is_translation_metadata({ key: "test.key" })).toBe(false);
+
+			expect(Boolean(is_translation_metadata(null))).toBe(false);
+			expect(Boolean(is_translation_metadata(undefined))).toBe(false);
+			expect(Boolean(is_translation_metadata("not an object"))).toBe(false);
+		});
+	});
 });

package/src/i18n.ts

@@ -1,31 +1,94 @@
-import {
-	addMessages,
-	init,
-	getLocaleFromNavigator,
-	locale,
-	_
-} from "svelte-i18n";
+import { addMessages, init, getLocaleFromNavigator, locale } from "svelte-i18n";
+import { formatter } from "./gradio_helper";
 
 const langs = import.meta.glob("./lang/*.json", {
 	eager: true
 });
 
-type LangsRecord = Record<
-	string,
-	{
-		[key: string]: any;
+export interface I18nData {
+	__type__: "translation_metadata";
+	key: string;
+}
+
+export interface LangsRecord {
+	[lang: string]: any;
+}
+
+export function is_translation_metadata(obj: any): obj is I18nData {
+	console.log(obj);
+	const result =
+		obj &&
+		typeof obj === "object" &&
+		obj.__type__ === "translation_metadata" &&
+		typeof obj.key === "string";
+
+	return result;
+}
+
+// handles strings with embedded JSON metadata of shape "__i18n__{"key": "some.key"}"
+export function translate_if_needed(value: any): string {
+	if (typeof value !== "string") {
+		return value;
 	}
->;
 
-export function process_langs(): LangsRecord {
-	let _langs: LangsRecord = {};
+	const i18n_marker = "__i18n__";
+	const marker_index = value.indexOf(i18n_marker);
+
+	if (marker_index === -1) {
+		return value;
+	}
+
+	try {
+		const before_marker =
+			marker_index > 0 ? value.substring(0, marker_index) : "";
+
+		const after_marker_index = marker_index + i18n_marker.length;
+		const json_start = value.indexOf("{", after_marker_index);
+		let json_end = -1;
+		let bracket_count = 0;
+
+		for (let i = json_start; i < value.length; i++) {
+			if (value[i] === "{") bracket_count++;
+			if (value[i] === "}") bracket_count--;
+			if (bracket_count === 0) {
+				json_end = i + 1;
+				break;
+			}
+		}
+
+		if (json_end === -1) {
+			console.error("Could not find end of JSON in i18n string");
+			return value;
+		}
+
+		const metadata_json = value.substring(json_start, json_end);
+		const after_json = json_end < value.length ? value.substring(json_end) : "";
+
+		try {
+			const metadata = JSON.parse(metadata_json);
+
+			if (metadata && metadata.key) {
+				const translated = formatter(metadata.key);
+				return before_marker + translated + after_json;
+			}
+		} catch (jsonError) {
+			console.error("Error parsing i18n JSON:", jsonError);
+		}
 
-	for (const lang in langs) {
-		const code = (lang.split("/").pop() as string).split(".").shift() as string;
-		_langs[code] = (langs[lang] as Record<string, any>).default;
+		return value;
+	} catch (e) {
+		console.error("Error processing translation:", e);
+		return value;
 	}
+}
 
-	return _langs;
+export function process_langs(): LangsRecord {
+	return Object.fromEntries(
+		Object.entries(langs).map(([path, module]) => [
+			path.split("/").pop()!.split(".")[0],
+			(module as Record<string, any>).default
+		])
+	);
 }
 
 const processed_langs = process_langs();
@@ -37,17 +100,26 @@ export const language_choices: [string, string][] = Object.entries(
 
 export let all_common_keys: Set<string> = new Set();
 
-for (const lang in processed_langs) {
-	addMessages(lang, processed_langs[lang]);
-}
-
 let i18n_initialized = false;
+let previous_translations: Record<string, Record<string, string>> | undefined;
+
+export async function setupi18n(
+	custom_translations?: Record<string, Record<string, string>>
+): Promise<void> {
+	const should_reinitialize =
+		i18n_initialized && custom_translations !== previous_translations;
 
-export async function setupi18n(): Promise<void> {
-	if (i18n_initialized) {
+	if (i18n_initialized && !should_reinitialize) {
 		return;
 	}
 
+	previous_translations = custom_translations;
+
+	load_translations({
+		...processed_langs,
+		...(custom_translations ?? {})
+	});
+
 	const browser_locale = getLocaleFromNavigator();
 
 	let initial_locale =
@@ -88,3 +160,33 @@ export async function setupi18n(): Promise<void> {
 export function changeLocale(new_locale: string): void {
 	locale.set(new_locale);
 }
+
+export function get_initial_locale(
+	browser_locale: string | null,
+	available_locales: string[],
+	fallback_locale = "en"
+): string {
+	if (!browser_locale) return fallback_locale;
+
+	if (available_locales.includes(browser_locale)) {
+		return browser_locale;
+	}
+
+	return fallback_locale;
+}
+
+export function load_translations(
+	translations: LangsRecord | null | undefined
+): void {
+	if (!translations) {
+		return;
+	}
+
+	try {
+		for (const lang in translations) {
+			addMessages(lang, translations[lang]);
+		}
+	} catch (e) {
+		console.error("Error loading translations:", e);
+	}
+}

package/src/init.ts

@@ -70,7 +70,7 @@ export function create_components(initial_layout: ComponentMeta | undefined): {
 	const layout_store: Writable<ComponentMeta> = writable(initial_layout);
 	let _components: ComponentMeta[] = [];
 	let app: client_return;
-	let keyed_component_values: Record<string | number, any> = {};
+	let keys_per_render_id: Record<number, (string | number)[]> = {};
 	let _rootNode: ComponentMeta;
 
 	function set_event_specific_args(dependencies: Dependency[]): void {
@@ -106,7 +106,6 @@ export function create_components(initial_layout: ComponentMeta | undefined): {
 		// make sure the state is settled before proceeding
 		flush();
 		app = _app;
-		store_keyed_values(_components);
 
 		_components = components;
 		inputs = new Set();
@@ -180,7 +179,23 @@ export function create_components(initial_layout: ComponentMeta | undefined): {
 		root: string;
 		dependencies: Dependency[];
 	}): void {
-		let _constructor_map = preload_all_components(components, root);
+		components.forEach((c) => {
+			for (const prop in c.props) {
+				if (c.props[prop] === null) {
+					c.props[prop] = undefined;
+				}
+			}
+		});
+		let replacement_components: ComponentMeta[] = [];
+		let new_components: ComponentMeta[] = [];
+		components.forEach((c) => {
+			if (c.key == null || !keys_per_render_id[render_id]?.includes(c.key)) {
+				new_components.push(c);
+			} else {
+				replacement_components.push(c);
+			}
+		});
+		let _constructor_map = preload_all_components(new_components, root);
 		_constructor_map.forEach((v, k) => {
 			constructor_map.set(k, v);
 		});
@@ -212,19 +227,36 @@ export function create_components(initial_layout: ComponentMeta | undefined): {
 			}
 		};
 		add_to_current_children(current_element);
-		store_keyed_values(all_current_children);
 
 		Object.entries(instance_map).forEach(([id, component]) => {
 			let _id = Number(id);
 			if (component.rendered_in === render_id) {
-				delete instance_map[_id];
-				if (_component_map.has(_id)) {
-					_component_map.delete(_id);
+				let replacement_component = replacement_components.find(
+					(c) => c.key === component.key
+				);
+				if (component.key != null && replacement_component !== undefined) {
+					const instance = instance_map[component.id];
+					for (const prop in replacement_component.props) {
+						if (
+							!(
+								replacement_component.props.preserved_by_key as
+									| string[]
+									| undefined
+							)?.includes(prop)
+						) {
+							instance.props[prop] = replacement_component.props[prop];
+						}
+					}
+				} else {
+					delete instance_map[_id];
+					if (_component_map.has(_id)) {
+						_component_map.delete(_id);
+					}
 				}
 			}
 		});
 
-		components.forEach((c) => {
+		new_components.forEach((c) => {
 			instance_map[c.id] = c;
 			_component_map.set(c.id, c);
 		});
@@ -241,6 +273,9 @@ export function create_components(initial_layout: ComponentMeta | undefined): {
 			current_element.parent
 		).then(() => {
 			layout_store.set(_rootNode);
+			keys_per_render_id[render_id] = components
+				.map((c) => c.key)
+				.filter((c) => c != null) as (string | number)[];
 		});
 
 		set_event_specific_args(dependencies);
@@ -254,9 +289,11 @@ export function create_components(initial_layout: ComponentMeta | undefined): {
 	): Promise<ComponentMeta> {
 		const instance = instance_map[node.id];
 
-		instance.component = (await constructor_map.get(
-			instance.component_class_id || instance.type
-		))!?.default;
+		if (!instance.component) {
+			instance.component = (await constructor_map.get(
+				instance.component_class_id || instance.type
+			))!?.default;
+		}
 		instance.parent = parent;
 
 		if (instance.type === "dataset") {
@@ -287,13 +324,6 @@ export function create_components(initial_layout: ComponentMeta | undefined): {
 			app
 		);
 
-		if (
-			instance.key != null &&
-			keyed_component_values[instance.key] !== undefined
-		) {
-			instance.props.value = keyed_component_values[instance.key];
-		}
-
 		_component_map.set(instance.id, instance);
 
 		if (node.children) {
@@ -343,14 +373,6 @@ export function create_components(initial_layout: ComponentMeta | undefined): {
 	let update_scheduled = false;
 	let update_scheduled_store = writable(false);
 
-	function store_keyed_values(components: ComponentMeta[]): void {
-		components.forEach((c) => {
-			if (c.key != null) {
-				keyed_component_values[c.key] = c.props.value;
-			}
-		});
-	}
-
 	function flush(): void {
 		layout_store.update((layout) => {
 			for (let i = 0; i < pending_updates.length; i++) {

package/src/lang/en.json

@@ -69,6 +69,10 @@
 		"language": "Language",
 		"display_theme": "Display Theme",
 		"pwa": "Progressive Web App",
+		"record": "Record",
+		"stop_recording": "Stop Recording",
+		"screen_studio": "Screen Studio",
+		"share_gradio_tab": "[Sharing] Gradio Tab",
 		"run": "Run"
 	},
 	"dataframe": {
@@ -98,7 +102,8 @@
 		"runtime_error": "there is a runtime error",
 		"space_not_working": "\"Space isn't working because\" {0}",
 		"space_paused": "the space is paused",
-		"use_via_api": "Use via API"
+		"use_via_api": "Use via API",
+		"use_via_api_or_mcp": "Use via API or MCP"
 	},
 	"file": {
 		"uploading": "Uploading..."

package/src/lang/es.json

@@ -88,7 +88,8 @@
 		"runtime_error": "hay un error de ejecución",
 		"space_not_working": "\"El Space no funciona porque\" {0}",
 		"space_paused": "el space está pausado",
-		"use_via_api": "Usar vía API"
+		"use_via_api": "Usar vía API",
+		"use_via_api_or_mcp": "Usar vía API o MCP"
 	},
 	"file": {
 		"uploading": "Subiendo..."

package/src/lang/fr.json

@@ -89,7 +89,8 @@
 		"runtime_error": "il y a une erreur d'exécution",
 		"space_not_working": "\"Le Space ne fonctionne pas car\" {0}",
 		"space_paused": "le Space est en pause",
-		"use_via_api": "Utiliser via l'API"
+		"use_via_api": "Utiliser via API",
+		"use_via_api_or_mcp": "Utiliser via API ou MCP"
 	},
 	"file": {
 		"uploading": "Téléchargement..."

package/src/lang/ja.json

@@ -87,7 +87,8 @@
 		"runtime_error": "ランタイムエラーがあります",
 		"space_not_working": "\"Spaceが動作していません。理由：\" {0}",
 		"space_paused": "Spaceが一時停止されています",
-		"use_via_api": "APIを介して使用"
+		"use_via_api": "APIを介して使用",
+		"use_via_api_or_mcp": "APIまたはMCP経由で使用"
 	},
 	"file": {
 		"uploading": "アップロード中..."

package/src/lang/ko.json

@@ -87,7 +87,8 @@
 		"runtime_error": "런타임 오류가 있습니다",
 		"space_not_working": "\"Space가 작동하지 않는 이유:\" {0}",
 		"space_paused": "space가 일시 중지되었습니다",
-		"use_via_api": "API를 통해 사용"
+		"use_via_api": "API를 통해 사용",
+		"use_via_api_or_mcp": "API 또는 MCP를 통해 사용"
 	},
 	"file": {
 		"uploading": "업로드 중..."

package/src/lang/lt.json

@@ -97,7 +97,8 @@
 		"runtime_error": "yra vykdymo klaida",
 		"space_not_working": "\"Erdvė neveikia, nes\" {0}",
 		"space_paused": "erdvė yra pristabdyta",
-		"use_via_api": "Naudoti per API"
+		"use_via_api": "Naudoti per API",
+		"use_via_api_or_mcp": "Naudoti per API arba MCP"
 	},
 	"file": {
 		"uploading": "Įkeliama..."

package/src/lang/nb.json

@@ -87,7 +87,8 @@
 		"runtime_error": "Det er en kjøretidsfeil",
 		"space_not_working": "\"Space fungerer ikke fordi\" {0}",
 		"space_paused": "Space er pauset",
-		"use_via_api": "Bruk via API"
+		"use_via_api": "Bruk via API",
+		"use_via_api_or_mcp": "Bruk via API eller MCP"
 	},
 	"file": {
 		"uploading": "Laster opp..."

package/src/lang/nl.json

@@ -97,7 +97,8 @@
 		"runtime_error": "Er is een runtime-fout",
 		"space_not_working": "\"Space werkt niet omdat\" {0}",
 		"space_paused": "De Space is gepauzeerd",
-		"use_via_api": "Gebruik via API"
+		"use_via_api": "Gebruik via API",
+		"use_via_api_or_mcp": "Gebruik via API of MCP"
 	},
 	"file": {
 		"uploading": "Uploaden..."

package/src/lang/pl.json

@@ -87,7 +87,8 @@
 		"runtime_error": "Wystąpił błąd wykonania",
 		"space_not_working": "\"Space nie działa, ponieważ\" {0}",
 		"space_paused": "Space jest wstrzymany",
-		"use_via_api": "Użyj przez API"
+		"use_via_api": "Użyj przez API",
+		"use_via_api_or_mcp": "Użyj przez API lub MCP"
 	},
 	"file": {
 		"uploading": "Przesyłanie..."

package/src/lang/pt-BR.json

@@ -98,6 +98,7 @@
 		"space_not_working": "\"O Space não está funcionando porque\" {0}",
 		"space_paused": "O Space está pausado",
 		"use_via_api": "Usar via API",
+		"use_via_api_or_mcp": "Usar via API ou MCP",
 		"runtime_error": "Houve um erro de execução"
 	},
 	"file": {

package/src/lang/pt.json

@@ -87,7 +87,8 @@
 		"runtime_error": "Há um erro de execução",
 		"space_not_working": "\"O Space não está a funcionar porque\" {0}",
 		"space_paused": "O Space está em pausa",
-		"use_via_api": "Utilizar via API"
+		"use_via_api": "Usar via API",
+		"use_via_api_or_mcp": "Usar via API ou MCP"
 	},
 	"file": {
 		"uploading": "A carregar..."

package/src/lang/ro.json

@@ -87,7 +87,8 @@
 		"runtime_error": "Există o eroare de execuție",
 		"space_not_working": "\"Space-ul nu funcționează deoarece\" {0}",
 		"space_paused": "Space-ul este în pauză",
-		"use_via_api": "Utilizați prin API"
+		"use_via_api": "Utilizați prin API",
+		"use_via_api_or_mcp": "Utilizați prin API sau MCP"
 	},
 	"file": {
 		"uploading": "Se încarcă..."

package/src/lang/ru.json

@@ -87,7 +87,8 @@
 		"runtime_error": "Произошла ошибка выполнения",
 		"space_not_working": "\"Space не работает, потому что\" {0}",
 		"space_paused": "Space приостановлен",
-		"use_via_api": "Использовать через API"
+		"use_via_api": "Использовать через API",
+		"use_via_api_or_mcp": "Использовать через API или MCP"
 	},
 	"file": {
 		"uploading": "Загрузка..."

package/src/lang/sv.json

@@ -87,7 +87,8 @@
 		"runtime_error": "Det finns ett körtidsfel",
 		"space_not_working": "\"Space fungerar inte eftersom\" {0}",
 		"space_paused": "Space är pausat",
-		"use_via_api": "Använd via API"
+		"use_via_api": "Använd via API",
+		"use_via_api_or_mcp": "Använd via API eller MCP"
 	},
 	"file": {
 		"uploading": "Laddar upp..."

package/src/lang/ta.json

@@ -97,7 +97,8 @@
 		"runtime_error": "இயக்க நேர பிழை உள்ளது",
 		"space_not_working": "\"Space செயல்படவில்லை ஏனெனில்\" {0}",
 		"space_paused": "Space இடைநிறுத்தப்பட்டுள்ளது",
-		"use_via_api": "API மூலம் பயன்படுத்தவும்"
+		"use_via_api": "API மூலம் பயன்படுத்தவும்",
+		"use_via_api_or_mcp": "API அல்லது MCP மூலம் பயன்படுத்தவும்"
 	},
 	"file": {
 		"uploading": "பதிவேற்றுகிறது..."

package/src/lang/th.json

@@ -87,7 +87,8 @@
 		"runtime_error": "เกิดข้อผิดพลาดขณะทำงาน",
 		"space_not_working": "\"Space ใช้งานไม่ได้เนื่องจาก\" {0}",
 		"space_paused": "Space ถูกหยุดชั่วคราว",
-		"use_via_api": "ใช้งานผ่าน API"
+		"use_via_api": "ใช้งานผ่าน API",
+		"use_via_api_or_mcp": "ใช้งานผ่าน API หรือ MCP"
 	},
 	"file": {
 		"uploading": "กำลังอัปโหลด..."

package/src/lang/tr.json

@@ -97,7 +97,8 @@
 		"runtime_error": "Bir çalışma zamanı hatası var",
 		"space_not_working": "\"Space çalışmıyor çünkü\" {0}",
 		"space_paused": "Space duraklatıldı",
-		"use_via_api": "API üzerinden kullan"
+		"use_via_api": "API üzerinden kullan",
+		"use_via_api_or_mcp": "API veya MCP üzerinden kullan"
 	},
 	"file": {
 		"uploading": "Yükleniyor..."

package/src/lang/uk.json

@@ -97,7 +97,8 @@
 		"runtime_error": "Є помилка виконання",
 		"space_not_working": "\"Space не працює, оскільки\" {0}",
 		"space_paused": "Space призупинено",
-		"use_via_api": "Використовувати через API"
+		"use_via_api": "Використовувати через API",
+		"use_via_api_or_mcp": "Використовувати через API або MCP"
 	},
 	"file": {
 		"uploading": "Завантаження..."

package/src/lang/ur.json

@@ -97,7 +97,8 @@
 		"runtime_error": "رن ٹائم میں خطا ہے",
 		"space_not_working": "\"Space کام نہیں کر رہا ہے کیونکہ\" {0}",
 		"space_paused": "Space موقوف ہے",
-		"use_via_api": "API کے ذریعے استعمال کریں"
+		"use_via_api": "API کے ذریعے استعمال کریں",
+		"use_via_api_or_mcp": "API یا MCP کے ذریعے استعمال کریں"
 	},
 	"file": {
 		"uploading": "اپلوڈ ہو رہا ہے..."