fix(carbon-components-react) Updated DataTableCustomSelectionProps accordingly to the Element's props (#42128)

* Updated DataTableCustomSelectionProps accordingly to the Element's props

* Added test for DataTable

* Fixed test lint
This commit is contained in:
Sébastien 2020-02-06 18:48:50 +01:00 committed by GitHub
parent 7858186a9f
commit dbfc9ddb5b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 60 additions and 2 deletions

View File

@ -2,6 +2,7 @@ import * as React from 'react';
import {
AccordionItem,
DataTable,
DataTableCustomRenderProps,
DataTableHeader,
DataTableRow,
Slider,
@ -169,6 +170,63 @@ const t4 = (
}}
/>
);
// RenderProps are compatible with sub-elements
interface T5RowType extends DataTableRow {
col1: number;
col2: number;
}
const t5RowItems: T5RowType[] = [
{ id: "row0", col1: 0, col2: 0},
{ id: "row1", col1: 1, col2: 1},
];
const t5Headers: DataTableHeader[] = [
{key: 'col1', header: 'First column'},
{key: 'col2', header: 'Second column'}
];
const t5 = (
<DataTable
rows={t5RowItems}
headers={t5Headers}
render={(renderProps: DataTableCustomRenderProps<T5RowType>) => (
<DataTable.TableContainer>
<DataTable.Table {...renderProps.getTableProps()}>
<DataTable.TableHead>
<DataTable.TableRow>
<DataTable.TableSelectAll
{...renderProps.getSelectionProps()}
/>
{renderProps.headers.map(header => (
<DataTable.TableHeader
{...renderProps.getHeaderProps({ header })}
>
{header.header}
</DataTable.TableHeader>
))}
<DataTable.TableHeader />
</DataTable.TableRow>
</DataTable.TableHead>
<DataTable.TableBody>
{renderProps.rows.map(row => (
<React.Fragment key={row.id}>
<DataTable.TableRow {...renderProps.getRowProps({ row })}>
<DataTable.TableSelectRow
{...renderProps.getSelectionProps({ row })}
/>
{row.cells.map(cell => (
<DataTable.TableCell key={cell.id}>
{cell.value}
</DataTable.TableCell>
))}
<DataTable.TableCell key={`options${row.id}`} />
</DataTable.TableRow>
</React.Fragment>
))}
</DataTable.TableBody>
</DataTable.Table>
</DataTable.TableContainer>
)}
/>
);
// UIShell - Link
interface TestCompProps {

View File

@ -70,13 +70,13 @@ export interface DataTableCustomSelectionData<R extends DataTableRow = DataTable
export interface DataTableCustomSelectionProps<R extends DataTableRow = DataTableRow> {
ariaLabel?: string,
checked: R extends never ? boolean : R["isSelected"],
checked: R extends never ? boolean : NonNullable<R["isSelected"]>,
disabled: R extends never ? never : R["disabled"],
id: string,
indeterminate: R extends never ? boolean : never,
name: string,
onSelect(event: React.MouseEvent<HTMLElement>): void,
radio: R extends never ? never : (Extract<DataTableProps["radio"], true> | null),
radio?: R extends never ? never : (Extract<DataTableProps["radio"], boolean>),
}
// endregion Row Types