Fix strut CSS for expander cells as well

elastic · Apr 2, 2024 · 22b40da · 22b40da
1 parent 4a6a8e8
commit 22b40da
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/src/components/table/table_row_cell.styles.ts b/src/components/table/table_row_cell.styles.ts
@@ -18,15 +18,19 @@ export const euiTableRowCellStyles = (euiThemeContext: UseEuiTheme) => {
 
   const { mobileSizes } = euiTableVariables(euiThemeContext);
 
+  // Unsets the extra strut caused by inline-block display of buttons/icons/tooltips.
+  // Without this, the row height jumps whenever actions are disabled.
+  const hasIcons = `line-height: 1;`;
+
   return {
     euiTableRowCell: css`
       color: ${euiTheme.colors.text};
     `,
-
+    isExpander: css`
+      ${hasIcons}
+    `,
     hasActions: css`
-      /* Unsets the extra strut caused by inline-block display of buttons/icons/tooltips.
-         Without this, the row height jumps whenever actions are disabled. */
-      line-height: 1;
+      ${hasIcons}
 
       /* TODO: Move this to EuiTableCellContent, once we're further along in the Emotion conversion */
       .euiTableCellContent {

diff --git a/src/components/table/table_row_cell.tsx b/src/components/table/table_row_cell.tsx
@@ -132,6 +132,7 @@ export const EuiTableRowCell: FunctionComponent<Props> = ({
   const styles = useEuiMemoizedStyles(euiTableRowCellStyles);
   const cssStyles = [
     styles.euiTableRowCell,
+    isExpander && styles.isExpander,
     hasActions && styles.hasActions,
     styles[valign],
     ...(isResponsive