diff --git a/CHANGELOG.md b/CHANGELOG.md index 69e531b19f5..c90f929a6f9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ - Fixed `EuiDataGrid` to correctly remove the cell expansion action button when a column sets both `cellActions` and `isExpandable` to false ([#5592](https://github.com/elastic/eui/pull/5592)) - Fixed `EuiDataGrid` re-playing the cell actions animation when hovering over an already-focused cell ([#5592](https://github.com/elastic/eui/pull/5592)) +- Fixed `EuiDataGrid` auto row heights bugging out when cell popovers are opened ([#5622](https://github.com/elastic/eui/pull/5622)) **Breaking changes** diff --git a/src/components/datagrid/_data_grid_data_row.scss b/src/components/datagrid/_data_grid_data_row.scss index 673aa58ec6f..dd1a5265883 100644 --- a/src/components/datagrid/_data_grid_data_row.scss +++ b/src/components/datagrid/_data_grid_data_row.scss @@ -1,6 +1,4 @@ .euiDataGridRow { - // needed for footer cells to correctly position - display: flex; background-color: $euiColorEmptyShade; } @@ -10,16 +8,10 @@ padding: $euiDataGridCellPaddingM; border-right: $euiDataGridVerticalBorder; border-bottom: $euiBorderThin; - flex: 0 0 auto; - position: relative; - align-items: center; - display: flex; overflow: hidden; - // Hack to allow for all the focus guard stuff + // Hack to allow focus trap to still stretch to full row height on defined heights > * { - max-width: 100%; - width: 100%; height: 100%; } @@ -114,11 +106,6 @@ z-index: $euiZDataGridCellPopover !important; } -.euiDataGridRowCell__expand { - width: 100%; - max-width: 100%; -} - .euiDataGridRowCell__expandFlex { position: relative; // for positioning expand button display: flex; diff --git a/src/components/datagrid/body/_data_grid_footer_row.scss b/src/components/datagrid/body/_data_grid_footer_row.scss index 46bd9f072cd..c7864889dbc 100644 --- a/src/components/datagrid/body/_data_grid_footer_row.scss +++ b/src/components/datagrid/body/_data_grid_footer_row.scss @@ -1,4 +1,10 @@ +.euiDataGridFooter { + display: flex; +} + @include euiDataGridFooterCell { + flex: 0 0 auto; + position: relative; font-weight: $euiFontWeightBold; } diff --git a/src/components/datagrid/body/data_grid_cell.tsx b/src/components/datagrid/body/data_grid_cell.tsx index 1337ef0a773..6bab64e6610 100644 --- a/src/components/datagrid/body/data_grid_cell.tsx +++ b/src/components/datagrid/body/data_grid_cell.tsx @@ -616,7 +616,6 @@ export class EuiDataGridCell extends Component< onDeactivation={() => { this.setState({ isEntered: false }, this.preventTabbing); }} - style={isDefinedHeight ? { height: '100%' } : {}} clickOutsideDisables={true} >