diff --git a/src/DataTable/DataTable.svelte b/src/DataTable/DataTable.svelte index f9289e9b..bd6b79c7 100644 --- a/src/DataTable/DataTable.svelte +++ b/src/DataTable/DataTable.svelte @@ -146,11 +146,13 @@ .map(({ key }, i) => ({ key, id: key })) .reduce((a, c) => ({ ...a, [c.key]: c.id }), {}) ); - const resolvePath = (object, path) => - path + const resolvePath = (object, path) => { + if (path in object) return object[path]; + return path .split(/[\.\[\]\'\"]/) .filter((p) => p) .reduce((o, p) => (o && typeof o === "object" ? o[p] : o), object); + }; setContext("DataTable", { sortHeader, @@ -195,14 +197,18 @@ $: if (radio || batchSelection) selectable = true; $: tableSortable.set(sortable); $: headerKeys = headers.map(({ key }) => key); - $: $tableRows = rows.map((row) => ({ - ...row, - cells: headerKeys.map((key, index) => ({ - key, - value: resolvePath(row, key), - display: headers[index].display, - })), - })); + $: tableCellsByRowId = rows.reduce( + (rows, row) => ({ + ...rows, + [row.id]: headerKeys.map((key, index) => ({ + key, + value: resolvePath(row, key), + display: headers[index].display, + })), + }), + {} + ); + $: $tableRows = rows; $: sortedRows = [...$tableRows]; $: ascending = $sortHeader.sortDirection === "ascending"; $: sortKey = $sortHeader.key; @@ -213,11 +219,11 @@ } else { sortedRows = [...$tableRows].sort((a, b) => { const itemA = ascending - ? resolvePath(a, sortKey, "") - : resolvePath(b, sortKey, ""); + ? resolvePath(a, sortKey) + : resolvePath(b, sortKey); const itemB = ascending - ? resolvePath(b, sortKey, "") - : resolvePath(a, sortKey, ""); + ? resolvePath(b, sortKey) + : resolvePath(a, sortKey); if ($sortHeader.sort) return $sortHeader.sort(itemA, itemB); @@ -464,7 +470,7 @@ {/if} {/if} - {#each row.cells as cell, j (cell.key)} + {#each tableCellsByRowId[row.id] as cell, j (cell.key)} {#if headers[j].empty} { return Object.entries(row) - .filter(([key]) => !["cells", "id"].includes(key)) + .filter(([key]) => key !== "id") .some(([key, _value]) => { if (typeof _value === "string" || typeof _value === "number") { return (_value + "")