@gradio/dataframe 0.24.4 → 0.24.6

package/dist/shared/utils/table_utils.js

@@ -8,11 +8,12 @@ export function make_header_id(col) {
 export async function copy_table_data(data, selected_cells) {
     if (!data || !data.length)
         return;
-    const cells_to_copy = selected_cells ||
-        data.flatMap((row, r) => row.map((_, c) => [r, c]));
-    const csv = cells_to_copy.reduce((acc, [row, col]) => {
+    const csv = selected_cells.reduce((acc, [row, col]) => {
         acc[row] = acc[row] || {};
-        const value = String(data[row][col].value);
+        // only the headers are padded out to the column count on the way in, so
+        // a selection can name a cell a short row does not have
+        const cell = data[row]?.[col];
+        const value = cell ? String(cell.value) : "";
         acc[row][col] =
             value.includes(",") || value.includes('"') || value.includes("\n")
                 ? `"${value.replace(/"/g, '""')}"`
@@ -22,7 +23,9 @@ export async function copy_table_data(data, selected_cells) {
     const rows = Object.keys(csv).sort((a, b) => +a - +b);
     if (!rows.length)
         return;
-    const cols = Object.keys(csv[rows[0]]).sort((a, b) => +a - +b);
+    // every column any selected row contributes: taking them from the first row
+    // alone drops the rest of a selection that is not rectangular there
+    const cols = Array.from(new Set(rows.flatMap((r) => Object.keys(csv[r])))).sort((a, b) => +a - +b);
     const text = rows
         .map((r) => cols.map((c) => csv[r][c] || "").join(","))
         .join("\n");
@@ -33,41 +36,43 @@ export async function copy_table_data(data, selected_cells) {
         throw new Error("Failed to copy to clipboard: " + err.message);
     }
 }
-export function guess_delimiter(text, possibleDelimiters) {
-    return possibleDelimiters.filter(weedOut);
-    function weedOut(delimiter) {
-        var cache = -1;
-        return text.split("\n").every(checkLength);
-        function checkLength(line) {
-            if (!line)
-                return true;
-            var length = line.split(delimiter).length;
-            if (cache < 0)
-                cache = length;
-            return cache === length && length > 1;
+export async function parse_table_file(file) {
+    const text = await file.text();
+    if (!text.trim())
+        return { headers: [], values: [] };
+    // the drop zone only accepts .csv and .tsv, so the extension goes first and
+    // wins any tie, but a mislabeled file is still read by its content: a
+    // separator only takes the file if it splits every line the same way, which
+    // is what tells a real separator from one that sits in a header name. the
+    // split is d3's rather than a raw count, so a separator inside a quoted
+    // field does not throw the detection off.
+    const by_extension = file.name.toLowerCase().endsWith(".tsv") ? "\t" : ",";
+    const candidates = by_extension === "\t" ? ["\t", ","] : [",", "\t"];
+    let consistent;
+    let ragged;
+    let unsplit;
+    for (const delimiter of candidates) {
+        // a blank line parses to a single empty field, which both the width
+        // checks below and the caller's ragged check would read as a short row
+        const parsed = dsvFormat(delimiter)
+            .parseRows(text)
+            .filter((row) => row.length > 1 || row[0] !== "");
+        const width = parsed[0]?.length ?? 0;
+        // the extension is first in `candidates`, so this keeps its parse for the
+        // single-column case rather than running it again at the end
+        unsplit ??= parsed;
+        if (width < 2)
+            continue;
+        if (parsed.every((row) => row.length === width)) {
+            consistent = parsed;
+            break;
         }
+        // a separator that splits the header but leaves the rows uneven is
+        // usually the one that just happens to appear in a header name. keep it
+        // only in case the other does not split at all, where a ragged table is
+        // still better to report on than an unsplit one
+        ragged ??= parsed;
     }
-}
-export function data_uri_to_blob(data_uri) {
-    const byte_str = atob(data_uri.split(",")[1]);
-    const mime_str = data_uri.split(",")[0].split(":")[1].split(";")[0];
-    const ab = new ArrayBuffer(byte_str.length);
-    const ia = new Uint8Array(ab);
-    for (let i = 0; i < byte_str.length; i++) {
-        ia[i] = byte_str.charCodeAt(i);
-    }
-    return new Blob([ab], { type: mime_str });
-}
-export function handle_file_upload(data_uri, update_headers, update_values) {
-    const blob = data_uri_to_blob(data_uri);
-    const reader = new FileReader();
-    reader.addEventListener("loadend", (e) => {
-        if (!e?.target?.result || typeof e.target.result !== "string")
-            return;
-        const [delimiter] = guess_delimiter(e.target.result, [",", "\t"]);
-        const [head, ...rest] = dsvFormat(delimiter).parseRows(e.target.result);
-        update_headers(head);
-        update_values(rest);
-    });
-    reader.readAsText(blob);
+    const [head = [], ...rest] = consistent ?? ragged ?? unsplit ?? [];
+    return { headers: head.map((h) => h ?? ""), values: rest };
 }

package/dist/shared/utils/utils.d.ts

@@ -5,10 +5,6 @@ export type Datatype = "str" | "number" | "bool" | "date" | "markdown" | "html"
 export type Metadata = {
     [key: string]: string[][] | null;
 } | null;
-export type HeadersWithIDs = {
-    value: string;
-    id: string;
-}[];
 export type DataframeValue = {
     data: Data;
     headers: Headers;

package/dist/standalone/default_i18n.js

@@ -5,6 +5,13 @@ export const default_i18n = {
     "dataframe.add_column_left": "Add column left",
     "dataframe.add_column_right": "Add column right",
     "dataframe.delete_column": "Delete column",
+    "dataframe.drop_to_upload": "Drop CSV or TSV files here to import data into dataframe",
+    "dataframe.import_empty_file": "The dropped file is empty.",
+    "dataframe.import_no_column_names": "The dropped file has no column names.",
+    "dataframe.import_ragged_row": "Line {line} of the file has {fields} fields, the header has {columns}.",
+    "dataframe.import_static_columns": "Cannot import into a table with read-only columns.",
+    "dataframe.import_fixed_columns": "This table takes exactly {expected} columns, the file has {actual}.",
+    "dataframe.import_fixed_rows": "This table takes exactly {expected} rows, the file has {actual}.",
     "dataframe.sort_asc": "Sort ascending",
     "dataframe.sort_desc": "Sort descending",
     "dataframe.sort_ascending": "Sort ascending",

package/dist/types.d.ts

@@ -6,6 +6,7 @@ export interface DataframeEvents {
     input: never;
     select: SelectData;
     edit: EditData;
+    error: string;
     clear_status: LoadingStatus;
 }
 export interface DataframeProps {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gradio/dataframe",
-  "version": "0.24.4",
+  "version": "0.24.6",
   "description": "Gradio UI packages",
   "type": "module",
   "author": "",
@@ -16,14 +16,14 @@
     "@tanstack/table-core": "^8.21.3",
     "@tanstack/virtual-core": "^3.13.6",
     "@gradio/atoms": "^0.26.2",
+    "@gradio/button": "^0.8.3",
     "@gradio/checkbox": "^0.8.3",
-    "@gradio/button": "^0.8.2",
+    "@gradio/client": "^2.7.1",
     "@gradio/icons": "^0.16.0",
-    "@gradio/client": "^2.6.0",
     "@gradio/markdown-code": "^0.10.1",
-    "@gradio/upload": "^0.18.3",
-    "@gradio/statustracker": "^0.15.3",
-    "@gradio/utils": "^0.14.1"
+    "@gradio/statustracker": "^0.15.4",
+    "@gradio/upload": "^0.19.0",
+    "@gradio/utils": "^0.14.2"
   },
   "exports": {
     ".": {
@@ -42,7 +42,7 @@
     "svelte": "^5.48.0"
   },
   "devDependencies": {
-    "@gradio/preview": "^0.17.0"
+    "@gradio/preview": "^0.17.1"
   },
   "repository": {
     "type": "git",

package/shared/EmptyRowButton.svelte

@@ -16,7 +16,6 @@
 		color: var(--body-text-color);
 		cursor: pointer;
 		transition: all 150ms;
-		margin-top: var(--size-2);
 		z-index: 10;
 		position: relative;
 		pointer-events: auto;