Merge branch 'master' of https://github.com/gradio-app/gradio

gradio/interface.py

@@ -684,7 +684,7 @@ class Interface:
 
         if self.enable_queue is None:
             self.enable_queue = enable_queue
-        if self.allow_flagging != "never": 
+        if self.allow_flagging != "never":
             self.flagging_callback.setup(self.flagging_dir)
 
         config = self.get_config_file()

test/test_flagging.py

@@ -71,23 +71,21 @@ class TestDisableFlagging(unittest.TestCase):
     def test_flagging_no_permission_error_with_flagging_disabled(self):
         with tempfile.TemporaryDirectory() as tmpdirname:
             os.chmod(tmpdirname, 0o444)  # Make directory read-only
-            nonwritable_path = os.path.join(
-                tmpdirname, 'flagging_dir')
-            
+            nonwritable_path = os.path.join(tmpdirname, "flagging_dir")
+
             io = gr.Interface(
                 lambda x: x,
                 "text",
                 "text",
                 allow_flagging="never",
-                flagging_dir=nonwritable_path
+                flagging_dir=nonwritable_path,
             )
             try:
                 io.launch(prevent_thread_lock=True)
             except PermissionError:
                 self.fail("launch() raised a PermissionError unexpectedly")
-            
+
         io.close()
-            
 
 
 if __name__ == "__main__":

ui/packages/app/public/lang/fr.json

@@ -0,0 +1,19 @@
+{
+    "interface": {
+      "submit": "Soumettre",
+      "clear": "Nettoyer",
+      "interpret": "Interpréter",
+      "flag": "Signaler",
+      "examples": "Exemples",
+      "drop_image": "Déposer l'Image Ici",
+      "drop_video": "Déposer la Vidéo Ici",
+      "drop_audio": "Déposer l'Audio Ici",
+      "drop_file": "Déposer le Fichier Ici",
+      "drop_csv": "Déposer le CSV Ici",
+      "or": "ou",
+      "click_to_upload": "Cliquer pour Télécharger",
+      "view_api": "Voir l'API",
+      "built_with_Gradio": "Conçu avec Gradio"
+    }
+  }
+  

ui/packages/app/public/lang/he.json

@@ -0,0 +1,18 @@
+{
+    "interface": {
+      "submit": "שלח",
+      "clear": "נקה",
+      "interpret": "לפרש",
+      "flag": "סמן",
+      "examples": "דוגמות",
+      "drop_image": "גרור קובץ תמונה לכאן",
+      "drop_video": "גרור קובץ סרטון לכאן",
+      "drop_audio": "גרור לכאן קובץ שמע",
+      "drop_file": "גרור קובץ לכאן",
+      "drop_csv": "גרור csv קובץ לכאן",
+      "or": "או",
+      "click_to_upload": "לחץ כדי להעלות",
+      "view_api": "צפה ב API",
+      "built_with_Gradio": "בנוי עם גרדיו"
+    }
+  }

ui/packages/app/public/lang/zh_TW.json

@@ -0,0 +1,18 @@
+{
+    "interface": {
+      "submit": "提交",
+      "clear": "清除",
+      "interpret": "解釋",
+      "flag": "Flag",
+      "examples": "範例",
+      "drop_image": "刪除圖片",
+      "drop_video": "刪除影片",
+      "drop_audio": "刪除音頻",
+      "drop_file": "刪除檔案",
+      "drop_csv": "刪除CSV",
+      "or": "或",
+      "click_to_upload": "點擊上傳",
+      "view_api": "查看API",
+      "built_with_Gradio": "使用Gradio構建"
+    }
+}

ui/packages/app/src/components/input/DataFrame/DataFrame.svelte

@@ -1,13 +1,11 @@
 <script lang="ts">
 	import { tick } from "svelte";
 
-	export let label = "Title";
 	export let headers: Array<string> = [];
-	export let values: Array<Array<string | number>> = [
-		["Frank", 32, "Male"],
-		["Beatrice", 99, "Female"],
-		["Simone", 999, "Male"]
-	];
+	export let values: Array<Array<string | number>> = [["", "", ""]];
+	export let default_data: Array<Array<string | number>> = [];
+
+	if ($$props.default) values = $$props.default;
 
 	export let setValue: (val: typeof values) => typeof values;
 	export let editable = true;
@@ -126,6 +124,20 @@
 					editing = id;
 				}
 				break;
+			case "Backspace":
+				if (!editable) break;
+				if (!editing) {
+					event.preventDefault();
+					data[i][j].value = "";
+				}
+				break;
+			case "Delete":
+				if (!editable) break;
+				if (!editing) {
+					event.preventDefault();
+					data[i][j].value = "";
+				}
+				break;
 			default:
 				break;
 		}
@@ -272,8 +284,6 @@
 	};
 </script>
 
-<h4 id="title">{label}</h4>
-
 <div class="shadow overflow-hidden border-gray-200 rounded-sm relative">
 	<table
 		id="grid"

ui/packages/app/src/components/utils/helpers.test.ts

@@ -1,24 +1,93 @@
-import { assert, describe, expect, it } from "vitest";
-import { prettyBytes } from "./helpers";
+import { assert, describe, test } from "vitest";
+import { prettyBytes, deepCopy, randInt, getNextColor } from "./helpers";
 
 describe("prettyBytes", () => {
-	it("handle B", () => {
+	test("handle B", () => {
 		assert.equal(prettyBytes(10), "10.0 B");
 	});
 
-	it("handles KB", () => {
+	test("handles KB", () => {
 		assert.equal(prettyBytes(1_300), "1.3 KB");
 	});
 
-	it("handles MB", () => {
+	test("handles MB", () => {
 		assert.equal(prettyBytes(1_300_000), "1.2 MB");
 	});
 
-	it("handles GB", () => {
+	test("handles GB", () => {
 		assert.equal(prettyBytes(1_300_000_123), "1.2 GB");
 	});
 
-	it("handles PB", () => {
+	test("handles PB", () => {
 		assert.equal(prettyBytes(1_300_000_123_000), "1.2 PB");
 	});
 });
+
+describe("deepCopy", () => {
+	test("handle arrays", () => {
+		const array = [1, 2, 3];
+		const copy = deepCopy(array);
+		assert.ok(array !== copy);
+		assert.deepEqual(array, copy);
+	});
+
+	test("handle objects", () => {
+		const obj = { a: 1, b: 2, c: 3 };
+		const copy = deepCopy(obj);
+		assert.ok(obj !== copy);
+		assert.deepEqual(obj, copy);
+	});
+
+	test("handle complex structures", () => {
+		const obj = {
+			a: 1,
+			b: {
+				a: 1,
+				b: {
+					a: 1,
+					b: { a: 1, b: 2, c: 3 },
+					c: [
+						1,
+						2,
+						{ a: 1, b: { a: 1, b: { a: 1, b: 2, c: 3 }, c: [1, 2, 3] } }
+					]
+				},
+				c: 3
+			},
+			c: 3
+		};
+		const copy = deepCopy(obj);
+		assert.ok(obj !== copy);
+		assert.deepEqual(obj, copy);
+	});
+});
+
+describe("randInt", () => {
+	test("returns a random number", () => {
+		assert.typeOf(randInt(0, 10), "number");
+	});
+
+	test("respects min and max", () => {
+		const n = randInt(0, 10);
+		assert.ok(n >= 0 && n <= 10);
+	});
+
+	test("respects min and max when negative", () => {
+		const n = randInt(-100, -10);
+		assert.ok(n > -100 && n < -10);
+	});
+});
+
+describe("getNextColor", () => {
+	test("returns a color", () => {
+		assert.equal(getNextColor(0), "rgba(255, 99, 132, 1)");
+	});
+
+	test("returns a color when index is very high", () => {
+		assert.ok(
+			getNextColor(999999999).match(
+				/rgba\([0-9]{1,3}, [0-9]{1,3}, [0-9]{1,3}, [0-9]\)/
+			)
+		);
+	});
+});

ui/packages/app/src/components/utils/helpers.ts

@@ -15,8 +15,7 @@ export function randInt(min: number, max: number): number {
 	return Math.floor(Math.random() * (max - min) + min);
 }
 
-export const getNextColor = (index: number, alpha?: number): string => {
-	alpha = alpha || 1;
+export const getNextColor = (index: number, alpha: number = 1): string => {
 	let default_colors = [
 		[255, 99, 132],
 		[54, 162, 235],

ui/packages/app/src/i18n.js

@@ -1,11 +1,15 @@
 import { addMessages, init, getLocaleFromNavigator } from "svelte-i18n";
 import en from "../public/lang/en.json";
 import es from "../public/lang/es.json";
+import fr from "../public/lang/fr.json";
 import ur from "../public/lang/ur.json";
+import zh_TW from "../public/lang/zh_TW.json";
 
 addMessages("en", en);
 addMessages("es", es);
+addMessages("fr", fr);
 addMessages("ur", ur);
+addMessages("zh_TW", zh_TW);
 
 export function setupi18n() {
 	init({