diff --git a/src/components/datagrid/body/data_grid_row_manager.test.ts b/src/components/datagrid/body/data_grid_row_manager.test.ts index 047f5f96dce..277d0f320ef 100644 --- a/src/components/datagrid/body/data_grid_row_manager.test.ts +++ b/src/components/datagrid/body/data_grid_row_manager.test.ts @@ -150,6 +150,12 @@ describe('row manager', () => { expect(row0.classList.contains('world')).toBe(true); }); + it('allows passing multiple classes', () => { + rerender({ ...mockArgs, rowClasses: { 0: 'hello world' } }); + expect(getRow(0).classList.contains('hello')).toBe(true); + expect(getRow(0).classList.contains('world')).toBe(true); + }); + it('adds/removes row classes correctly when gridStyle.rowClasses updates', () => { rerender({ ...mockArgs, rowClasses: { 1: 'test' } }); const row0 = getRow(0); diff --git a/src/components/datagrid/body/data_grid_row_manager.ts b/src/components/datagrid/body/data_grid_row_manager.ts index b8d1101e2df..05984951216 100644 --- a/src/components/datagrid/body/data_grid_row_manager.ts +++ b/src/components/datagrid/body/data_grid_row_manager.ts @@ -30,7 +30,7 @@ export const useRowManager = ({ rowElement.dataset.gridRowIndex = String(rowIndex); // Row index from data, not affected by sorting/pagination rowElement.classList.add('euiDataGridRow'); if (rowClasses?.[rowIndex]) { - rowElement.classList.add(rowClasses[rowIndex]); + rowElement.classList.add(...rowClasses[rowIndex].split(' ')); } rowElement.style.position = 'absolute'; rowElement.style.left = '0'; diff --git a/upcoming_changelogs/7301.md b/upcoming_changelogs/7301.md index d09c8b9a597..c6e239d6f8b 100644 --- a/upcoming_changelogs/7301.md +++ b/upcoming_changelogs/7301.md @@ -2,3 +2,4 @@ - Fixed `EuiDataGrid`s with `gridStyle.stripes` sometimes showing buggy row striping after being sorted - Fixed `EuiDataGrid`'s `gridStyle.rowClasses` API to not conflict with `gridStyle.stripes` if dynamically updated +- Fixed `EuiDataGrid`'s `gridStyle.rowClasses` API to support multiple space-separated classes