mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-15 02:11:05 +00:00
Adding display attr to DataTableCell (#615)
This commit is contained in:
parent
2676d8d045
commit
47c79b16c7
2 changed files with 9 additions and 8 deletions
|
@ -7,7 +7,7 @@
|
||||||
* @typedef {DataTableNonEmptyHeader | DataTableEmptyHeader} DataTableHeader
|
* @typedef {DataTableNonEmptyHeader | DataTableEmptyHeader} DataTableHeader
|
||||||
* @typedef {{ id: any; [key: string]: DataTableValue; }} DataTableRow
|
* @typedef {{ id: any; [key: string]: DataTableValue; }} DataTableRow
|
||||||
* @typedef {string} DataTableRowId
|
* @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 {{ row: DataTableRow; }} expanded-row
|
||||||
* @slot {{ header: DataTableNonEmptyHeader; }} cell-header
|
* @slot {{ header: DataTableNonEmptyHeader; }} cell-header
|
||||||
* @slot {{ row: DataTableRow; cell: DataTableCell; }} cell
|
* @slot {{ row: DataTableRow; cell: DataTableCell; }} cell
|
||||||
|
@ -167,7 +167,11 @@
|
||||||
$: headerKeys = headers.map(({ key }) => key);
|
$: headerKeys = headers.map(({ key }) => key);
|
||||||
$: rows = rows.map((row) => ({
|
$: rows = rows.map((row) => ({
|
||||||
...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;
|
$: sortedRows = rows;
|
||||||
$: ascending = $sortHeader.sortDirection === "ascending";
|
$: ascending = $sortHeader.sortDirection === "ascending";
|
||||||
|
@ -377,9 +381,7 @@
|
||||||
{#if headers[j].empty}
|
{#if headers[j].empty}
|
||||||
<td class:bx--table-column-menu="{headers[j].columnMenu}">
|
<td class:bx--table-column-menu="{headers[j].columnMenu}">
|
||||||
<slot name="cell" row="{row}" cell="{cell}">
|
<slot name="cell" row="{row}" cell="{cell}">
|
||||||
{headers[j].display
|
{cell.display ? cell.display(cell.value) : cell.value}
|
||||||
? headers[j].display(cell.value)
|
|
||||||
: cell.value}
|
|
||||||
</slot>
|
</slot>
|
||||||
</td>
|
</td>
|
||||||
{:else}
|
{:else}
|
||||||
|
@ -390,9 +392,7 @@
|
||||||
}}"
|
}}"
|
||||||
>
|
>
|
||||||
<slot name="cell" row="{row}" cell="{cell}">
|
<slot name="cell" row="{row}" cell="{cell}">
|
||||||
{headers[j].display
|
{cell.display ? cell.display(cell.value) : cell.value}
|
||||||
? headers[j].display(cell.value)
|
|
||||||
: cell.value}
|
|
||||||
</slot>
|
</slot>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
1
types/DataTable/DataTable.d.ts
vendored
1
types/DataTable/DataTable.d.ts
vendored
|
@ -33,6 +33,7 @@ export type DataTableRowId = string;
|
||||||
export interface DataTableCell {
|
export interface DataTableCell {
|
||||||
key: DataTableKey;
|
key: DataTableKey;
|
||||||
value: DataTableValue;
|
value: DataTableValue;
|
||||||
|
display?: (item: Value) => DataTableValue;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DataTableProps
|
export interface DataTableProps
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue