Skip to content

Commit

Permalink
Merge branch 'master' into dev/DS-943
Browse files Browse the repository at this point in the history
  • Loading branch information
LarryMatte authored Jan 20, 2025
2 parents 846a34f + ed442d6 commit 5c1311f
Show file tree
Hide file tree
Showing 10 changed files with 721 additions and 301 deletions.
2 changes: 1 addition & 1 deletion .tool-versions
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
nodejs 22.12.0
nodejs 22.13.0
yarn 1.22.5
62 changes: 2 additions & 60 deletions packages/react/src/components/table/table.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -215,45 +215,39 @@ describe('Table', () => {
expect(callback).toHaveBeenCalledTimes(1);
});

test('onSelectedRows callbacks are called when row-checkbox is checked', () => {
test('onSelectedRowIds is called when row-checkbox is checked', () => {
const onSelectedRowIdsChange = jest.fn();
const onSelectedRowsChange = jest.fn();
const wrapper = mountWithTheme(
<Table<TestData>
rowSelectionMode="multiple"
columns={columns}
data={data}
rowIdField="id"
onSelectedRowIdsChange={onSelectedRowIdsChange}
onSelectedRowsChange={onSelectedRowsChange}
/>,
);

getByTestId(wrapper, 'row-checkbox-0').find('input').simulate('change', { target: { checked: true } });

expect(onSelectedRowIdsChange).toHaveBeenCalledWith([data[0].id]);
expect(onSelectedRowsChange).toHaveBeenCalledWith([data[0]]);
});

test('onSelectedRows callbacks are called with all rows when row-checkbox-all is checked', () => {
test('onSelectedRowIds is called with all rows when row-checkbox-all is checked', () => {
const onSelectedRowIdsChange = jest.fn();
const onSelectedRowsChange = jest.fn();
const wrapper = mountWithTheme(
<Table<TestData>
rowSelectionMode="multiple"
columns={columns}
data={data}
rowIdField="id"
onSelectedRowIdsChange={onSelectedRowIdsChange}
onSelectedRowsChange={onSelectedRowsChange}
/>,
);

getByTestId(wrapper, SELECT_ALL_CHECKBOX_TESTID).find('input')
.simulate('change', { target: { checked: true } });

expect(onSelectedRowIdsChange).toHaveBeenCalledWith(data.map((row) => row.id));
expect(onSelectedRowsChange).toHaveBeenCalledWith(data);
});

test('should hide select all checkbox', () => {
Expand Down Expand Up @@ -503,56 +497,4 @@ describe('Table', () => {
.find('input')
.prop('checked')).toBe(true);
});

test('should exclude group row from selectedRows callback', () => {
const onSelectedRowIdsChange = jest.fn();
const onSelectedRowChange = jest.fn();
const dataWithSubRows: TableData<TestData>[] = [
{
id: '0',
column1: 'Hello',
column2: 'World',
subRows: [
{
id: '1',
column1: 'Hello',
column2: 'Planet',
},
{
id: '2',
column1: 'Hello',
column2: 'Galaxy',
},
],
},
];
const wrapper = mountWithTheme(
<Table<TestData>
rowSelectionMode="multiple"
columns={columns}
data={dataWithSubRows}
rowIdField="id"
excludeGroupsFromSelection
onSelectedRowIdsChange={onSelectedRowIdsChange}
onSelectedRowsChange={onSelectedRowChange}
expandChildrenOnRowSelection
/>,
);

getByTestId(wrapper, 'row-checkbox-0')
.find('input')
.simulate('change', { target: { checked: true } });

expect(onSelectedRowIdsChange).toHaveBeenLastCalledWith(['1', '2']);
expect(onSelectedRowChange).toHaveBeenLastCalledWith(dataWithSubRows[0].subRows);
expect(getByTestId(wrapper, 'row-checkbox-0')
.find('input')
.prop('checked')).toBe(true);
expect(getByTestId(wrapper, 'row-checkbox-1')
.find('input')
.prop('checked')).toBe(true);
expect(getByTestId(wrapper, 'row-checkbox-2')
.find('input')
.prop('checked')).toBe(true);
});
});
27 changes: 5 additions & 22 deletions packages/react/src/components/table/table.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -199,9 +199,9 @@ function getSelectionColumn<T extends object>(
column.header = ({ table }) => (
<Checkbox
data-testid="row-checkbox-all"
checked={table.getIsAllRowsSelected()}
indeterminate={table.getIsSomeRowsSelected()}
onChange={table.getToggleAllRowsSelectedHandler()}
checked={table.getIsAllPageRowsSelected()}
indeterminate={table.getIsSomePageRowsSelected()}
onChange={table.getToggleAllPageRowsSelectedHandler()}
/>
);
}
Expand Down Expand Up @@ -348,7 +348,6 @@ export interface TableProps<T extends object> {
data: T[];
defaultSort?: ColumnSort;
columns: TableColumn<T>[];
excludeGroupsFromSelection?: boolean;
expandableRows?: 'single' | 'multiple';
expandChildrenOnRowSelection?: boolean;
hideSelectAll?: boolean;
Expand Down Expand Up @@ -380,9 +379,7 @@ export interface TableProps<T extends object> {

onRowClick?(row: Row<T>): void;

onSelectedRowIdsChange?(selectedRows: TableRowId[]): void;

onSelectedRowsChange?(selectedRows: T[]): void;
onSelectedRowIdsChange?(selectedRowIds: TableRowId[]): void;

onSort?(sort: ColumnSort | null): void;
}
Expand All @@ -394,7 +391,6 @@ export const Table = <T extends object>({
rowIdField,
defaultSort,
columns: providedColumns,
excludeGroupsFromSelection = false,
expandableRows,
expandChildrenOnRowSelection,
hideSelectAll = false,
Expand All @@ -408,7 +404,6 @@ export const Table = <T extends object>({
manualSort = false,
onRowClick,
onSelectedRowIdsChange,
onSelectedRowsChange,
onSort,
}: TableProps<T>): ReactElement => {
const { t } = useTranslation('table');
Expand Down Expand Up @@ -506,19 +501,7 @@ export const Table = <T extends object>({
const currentTable = tableInstance.current;

if (currentTable) {
const emittedRowIds = newSelectedRowIds.filter(
(rowId) => !excludeGroupsFromSelection || !currentTable.getRow(rowId).subRows.length,
);

onSelectedRowIdsChange?.(emittedRowIds);

if (onSelectedRowsChange) {
const emittedSelectedRows = emittedRowIds
.map((rowId) => currentTable.getRow(rowId))
.map((row) => row.original);

onSelectedRowsChange(emittedSelectedRows);
}
onSelectedRowIdsChange?.(newSelectedRowIds);
}
},
};
Expand Down
102 changes: 102 additions & 0 deletions packages/react/src/themes/build-theme.test.ts.snap
Original file line number Diff line number Diff line change
Expand Up @@ -118,5 +118,107 @@ exports[`buildTheme should build the defaultAliasTokens theme with the customiza
"color-menu-item-content-disabled": "#B7BBC2",
"color-menu-item-content-hover": "#000000",
"color-menu-item-subcontent": "green",
"text-action-medium-font-family": ""Open Sans", sans-serif",
"text-action-medium-font-size": "0.75rem",
"text-action-medium-font-weight": "700",
"text-action-medium-letter-spacing": "0.2px",
"text-action-medium-line-height": "1.5rem",
"text-action-medium-transform": "uppercase",
"text-action-small-font-family": ""Open Sans", sans-serif",
"text-action-small-font-size": "0.6875rem",
"text-action-small-font-weight": "700",
"text-action-small-letter-spacing": "0.2px",
"text-action-small-line-height": "1.5rem",
"text-action-small-transform": "uppercase",
"text-body-large-font-family": ""Open Sans", sans-serif",
"text-body-large-font-size": "1rem",
"text-body-large-font-weight": "400",
"text-body-large-letter-spacing": "0.2px",
"text-body-large-line-height": "1.5rem",
"text-body-large-transform": "none",
"text-body-medium-font-family": ""Open Sans", sans-serif",
"text-body-medium-font-size": "0.875rem",
"text-body-medium-font-weight": "400",
"text-body-medium-letter-spacing": "0.2px",
"text-body-medium-line-height": "1.5rem",
"text-body-medium-transform": "none",
"text-body-small-font-family": ""Open Sans", sans-serif",
"text-body-small-font-size": "0.75rem",
"text-body-small-font-weight": "400",
"text-body-small-letter-spacing": "0.2px",
"text-body-small-line-height": "1.25rem",
"text-body-small-transform": "none",
"text-caption-medium-font-family": ""Open Sans", sans-serif",
"text-caption-medium-font-size": "0.875rem",
"text-caption-medium-font-weight": "400",
"text-caption-medium-letter-spacing": "0.2px",
"text-caption-medium-line-height": "1.5rem",
"text-caption-medium-transform": "none",
"text-heading-large-font-family": ""Open Sans", sans-serif",
"text-heading-large-font-size": "1.5rem",
"text-heading-large-font-weight": "600",
"text-heading-large-letter-spacing": "0.2px",
"text-heading-large-line-height": "2rem",
"text-heading-large-transform": "none",
"text-heading-medium-font-family": ""Open Sans", sans-serif",
"text-heading-medium-font-size": "1.25rem",
"text-heading-medium-font-weight": "600",
"text-heading-medium-letter-spacing": "0.2px",
"text-heading-medium-line-height": "1.75rem",
"text-heading-medium-transform": "none",
"text-heading-small-font-family": ""Open Sans", sans-serif",
"text-heading-small-font-size": "1rem",
"text-heading-small-font-weight": "600",
"text-heading-small-letter-spacing": "0.2px",
"text-heading-small-line-height": "1.5rem",
"text-heading-small-transform": "none",
"text-heading-xlarge-font-family": ""Open Sans", sans-serif",
"text-heading-xlarge-font-size": "2rem",
"text-heading-xlarge-font-weight": "600",
"text-heading-xlarge-letter-spacing": "0.2px",
"text-heading-xlarge-line-height": "2.5rem",
"text-heading-xlarge-transform": "none",
"text-heading-xsmall-font-family": ""Open Sans", sans-serif",
"text-heading-xsmall-font-size": "0.875rem",
"text-heading-xsmall-font-weight": "600",
"text-heading-xsmall-letter-spacing": "0.2px",
"text-heading-xsmall-line-height": "1.25rem",
"text-heading-xsmall-transform": "none",
"text-highlight-large-font-family": ""Open Sans", sans-serif",
"text-highlight-large-font-size": "1.5rem",
"text-highlight-large-font-weight": "600",
"text-highlight-large-letter-spacing": "0.2px",
"text-highlight-large-line-height": "2rem",
"text-highlight-large-transform": "none",
"text-highlight-medium-font-family": ""Open Sans", sans-serif",
"text-highlight-medium-font-size": "1.25rem",
"text-highlight-medium-font-weight": "600",
"text-highlight-medium-letter-spacing": "0.2px",
"text-highlight-medium-line-height": "1.75rem",
"text-highlight-medium-transform": "none",
"text-highlight-small-font-family": ""Open Sans", sans-serif",
"text-highlight-small-font-size": "1rem",
"text-highlight-small-font-weight": "600",
"text-highlight-small-letter-spacing": "0.2px",
"text-highlight-small-line-height": "1.5rem",
"text-highlight-small-transform": "none",
"text-label-medium-font-family": ""Open Sans", sans-serif",
"text-label-medium-font-size": "0.875rem",
"text-label-medium-font-weight": "400",
"text-label-medium-letter-spacing": "0.2px",
"text-label-medium-line-height": "1.5rem",
"text-label-medium-transform": "none",
"text-label-small-font-family": ""Open Sans", sans-serif",
"text-label-small-font-size": "0.75rem",
"text-label-small-font-weight": "400",
"text-label-small-letter-spacing": "0.2px",
"text-label-small-line-height": "1.25rem",
"text-label-small-transform": "none",
"text-legend-small-font-family": ""Open Sans", sans-serif",
"text-legend-small-font-size": "0.75rem",
"text-legend-small-font-weight": "400",
"text-legend-small-letter-spacing": "0.2px",
"text-legend-small-line-height": "1.25rem",
"text-legend-small-transform": "none",
}
`;
5 changes: 4 additions & 1 deletion packages/react/src/themes/tokens/alias-tokens.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,11 @@
import { ColorAliasToken, defaultColorAliasTokens } from './alias/color-tokens';
import { defaultTextAliasTokens, TextAliasToken } from './alias/text-tokens';

export type AliasToken =
| ColorAliasToken;
| ColorAliasToken
| TextAliasToken;

export const defaultAliasTokens = {
...defaultColorAliasTokens,
...defaultTextAliasTokens,
};
Loading

0 comments on commit 5c1311f

Please sign in to comment.