diff --git a/packages/react-table/src/components/Table/Table.tsx b/packages/react-table/src/components/Table/Table.tsx index 144fc0ccb24..fc2305011a2 100644 --- a/packages/react-table/src/components/Table/Table.tsx +++ b/packages/react-table/src/components/Table/Table.tsx @@ -50,6 +50,8 @@ export interface TableProps extends React.HTMLProps, OUIAProps role?: string; /** @beta Flag indicating if the table should have plain styling with a transparent background */ isPlain?: boolean; + /** @beta Flag indicating if the table should not have plain styling when in the glass theme */ + isNoPlainOnGlass?: boolean; /** If set to true, the table header sticks to the top of its container */ isStickyHeader?: boolean; /** @hide Forwarded ref */ @@ -97,6 +99,7 @@ const TableBase: React.FunctionComponent = ({ borders = true, isStickyHeader = false, isPlain = false, + isNoPlainOnGlass = false, gridBreakPoint = TableGridBreakpoint.gridMd, 'aria-label': ariaLabel, role = 'grid', @@ -226,6 +229,7 @@ const TableBase: React.FunctionComponent = ({ isStriped && styles.modifiers.striped, isExpandable && styles.modifiers.expandable, isPlain && styles.modifiers.plain, + isNoPlainOnGlass && styles.modifiers.noPlainOnGlass, hasNoInset && stylesTreeView.modifiers.noInset, isNested && 'pf-m-nested', hasAnimations && styles.modifiers.animateExpand diff --git a/packages/react-table/src/components/Table/__tests__/Table.test.tsx b/packages/react-table/src/components/Table/__tests__/Table.test.tsx index 3e7af5c9cd5..e5a6dc373a2 100644 --- a/packages/react-table/src/components/Table/__tests__/Table.test.tsx +++ b/packages/react-table/src/components/Table/__tests__/Table.test.tsx @@ -156,3 +156,33 @@ test(`Renders with class ${styles.modifiers.plain} when isPlain is true`, () => expect(screen.getByRole('grid', { name: 'Test table' })).toHaveClass(styles.modifiers.plain); }); + +test(`Does not render with class ${styles.modifiers.plain} when isPlain is not defined`, () => { + render(); + + expect(screen.getByRole('grid', { name: 'Test table' })).not.toHaveClass(styles.modifiers.plain); +}); + +test(`Does not render with class ${styles.modifiers.plain} when isPlain is false`, () => { + render(
); + + expect(screen.getByRole('grid', { name: 'Test table' })).not.toHaveClass(styles.modifiers.plain); +}); + +test(`Renders with class ${styles.modifiers.noPlainOnGlass} when isNoPlainOnGlass is true`, () => { + render(
); + + expect(screen.getByRole('grid', { name: 'Test table' })).toHaveClass(styles.modifiers.noPlainOnGlass); +}); + +test(`Does not render with class ${styles.modifiers.noPlainOnGlass} when isNoPlainOnGlass is undefined`, () => { + render(
); + + expect(screen.getByRole('grid', { name: 'Test table' })).not.toHaveClass(styles.modifiers.noPlainOnGlass); +}); + +test(`Does not render with class ${styles.modifiers.noPlainOnGlass} when isNoPlainOnGlass is false`, () => { + render(
); + + expect(screen.getByRole('grid', { name: 'Test table' })).not.toHaveClass(styles.modifiers.noPlainOnGlass); +});