fix(data-table): expandable rows should work with zebra styles

This commit is contained in:
Eric Liu 2022-03-23 07:55:09 -07:00
commit 6587691f58

View file

@ -356,6 +356,7 @@
{#each sorting ? displayedSortedRows : displayedRows as row, i (row.id)} {#each sorting ? displayedSortedRows : displayedRows as row, i (row.id)}
<TableRow <TableRow
id="row-{row.id}" id="row-{row.id}"
data-parent-row="{expandable ? true : undefined}"
class="{selectedRowIds.includes(row.id) class="{selectedRowIds.includes(row.id)
? 'bx--data-table--selected' ? 'bx--data-table--selected'
: ''} {expandedRows[row.id] ? 'bx--expandable-row' : ''} {expandable : ''} {expandedRows[row.id] ? 'bx--expandable-row' : ''} {expandable
@ -483,14 +484,16 @@
{/each} {/each}
</TableRow> </TableRow>
{#if expandable && expandedRows[row.id] && !nonExpandableRowIds.includes(row.id)} {#if expandable}
<tr <tr
data-child-row data-child-row
class:bx--expandable-row="{true}" class:bx--expandable-row="{true}"
on:mouseenter="{() => { on:mouseenter="{() => {
if (nonExpandableRowIds.includes(row.id)) return;
parentRowId = row.id; parentRowId = row.id;
}}" }}"
on:mouseleave="{() => { on:mouseleave="{() => {
if (nonExpandableRowIds.includes(row.id)) return;
parentRowId = null; parentRowId = null;
}}" }}"
> >