diff --git a/src/DataTable/DataTable.svelte b/src/DataTable/DataTable.svelte index 06ced220..a85aa924 100644 --- a/src/DataTable/DataTable.svelte +++ b/src/DataTable/DataTable.svelte @@ -7,7 +7,7 @@ * @typedef {DataTableNonEmptyHeader | DataTableEmptyHeader} DataTableHeader * @typedef {{ id: any; [key: string]: DataTableValue; }} DataTableRow * @typedef {string} DataTableRowId - * @typedef {{ key: DataTableKey; value: DataTableValue; }} DataTableCell + * @typedef {{ key: DataTableKey; value: DataTableValue; display?: (item: Value) => DataTableValue; }} DataTableCell * @slot {{ row: DataTableRow; }} expanded-row * @slot {{ header: DataTableNonEmptyHeader; }} cell-header * @slot {{ row: DataTableRow; cell: DataTableCell; }} cell @@ -167,7 +167,11 @@ $: headerKeys = headers.map(({ key }) => key); $: rows = rows.map((row) => ({ ...row, - cells: headerKeys.map((key) => ({ key, value: resolvePath(row, key, "") })), + cells: headerKeys.map((key, index) => ({ + key, + value: resolvePath(row, key, ""), + display: headers[index].display, + })), })); $: sortedRows = rows; $: ascending = $sortHeader.sortDirection === "ascending"; @@ -377,9 +381,7 @@ {#if headers[j].empty} - {headers[j].display - ? headers[j].display(cell.value) - : cell.value} + {cell.display ? cell.display(cell.value) : cell.value} {:else} @@ -390,9 +392,7 @@ }}" > - {headers[j].display - ? headers[j].display(cell.value) - : cell.value} + {cell.display ? cell.display(cell.value) : cell.value} {/if} diff --git a/types/DataTable/DataTable.d.ts b/types/DataTable/DataTable.d.ts index 66812d6a..ab82b5ed 100644 --- a/types/DataTable/DataTable.d.ts +++ b/types/DataTable/DataTable.d.ts @@ -33,6 +33,7 @@ export type DataTableRowId = string; export interface DataTableCell { key: DataTableKey; value: DataTableValue; + display?: (item: Value) => DataTableValue; } export interface DataTableProps