diff --git a/packages/react/src/components/DataTable/stories/DataTable-batch-actions.stories.js b/packages/react/src/components/DataTable/stories/DataTable-batch-actions.stories.js index d6cca2fd7ac1..762cfd725d1a 100644 --- a/packages/react/src/components/DataTable/stories/DataTable-batch-actions.stories.js +++ b/packages/react/src/components/DataTable/stories/DataTable-batch-actions.stories.js @@ -29,8 +29,11 @@ import DataTable, { TableToolbarMenu, } from '..'; +import { Toggletip, ToggletipButton, ToggletipContent } from '../../Toggletip'; + import { batchActionClick, rows, headers } from './shared'; import mdx from '../DataTable.mdx'; +import Link from '../../Link'; export default { title: 'Components/DataTable/Batch Actions', @@ -285,6 +288,62 @@ export const Playground = (args) => ( ); +export const Test = () => ( + + {({ + rows, + headers, + getHeaderProps, + getRowProps, + getTableProps, + getTableContainerProps, + }) => ( + + + + + {headers.map((header) => ( + + {header.header} + + ))} + + + + {rows.map((row) => ( + + {row.cells.map((cell) => ( + + + {cell.value} + +

+ Lorem ipsum dolor{' '} + + sit amet + + . +

+
+
+
+ ))} +
+ ))} +
+
+
+ )} +
+); + Playground.argTypes = { filterRows: { table: { diff --git a/packages/styles/scss/components/data-table/_data-table.scss b/packages/styles/scss/components/data-table/_data-table.scss index 9ad130ce00b4..123c5ed9157d 100644 --- a/packages/styles/scss/components/data-table/_data-table.scss +++ b/packages/styles/scss/components/data-table/_data-table.scss @@ -120,11 +120,17 @@ color: $text-primary; } - .#{$prefix}--data-table tr:hover .#{$prefix}--link { + .#{$prefix}--data-table + tr + + :not(.#{$prefix}--popover-container):hover + .#{$prefix}--link { color: $link-secondary; } - .#{$prefix}--data-table tr:hover .#{$prefix}--link--disabled { + .#{$prefix}--data-table + tr + + :not(.#{$prefix}--popover-container):hover + .#{$prefix}--link--disabled { color: $text-disabled; }