[data grid] icon must inherit fontSize from baseIconButton

[vadimka123]

Summary

Currently I'm unable to override fontSize of icon in GridActionsCellItem IconButton https://github.com/mui/mui-x/blob/master/packages/x-data-grid/src/components/cell/GridActionsCellItem.tsx#L50 Here hardcoded always small

baseIconButton size can be overwritten easy through props or slotProps, but not icon itself

So I'd like to inherit fontSize from button (if look suitable for most of cases) Or any ability to customize fontSize instead of having hardcoded one

Examples

No response

Motivation

No response

Search keywords: data grid, icon, baseIconButton

[michelengelen]

hey @vadimka123 this is a great suggestion, so thanks for raising this. I would advocate for just inheriting the fontSize from the IconButton.

So the diff for this would look something like this:

diff --git a/packages/x-data-grid/src/components/cell/GridActionsCellItem.tsx b/packages/x-data-grid/src/components/cell/GridActionsCellItem.tsx
index d11bd1518..8e70a68e5 100644
--- a/packages/x-data-grid/src/components/cell/GridActionsCellItem.tsx
+++ b/packages/x-data-grid/src/components/cell/GridActionsCellItem.tsx
@@ -47,7 +47,7 @@ const GridActionsCellItem = React.forwardRef<HTMLElement, GridActionsCellItemPro
           onClick={handleClick}
           {...rootProps.slotProps?.baseIconButton}
         >
-          {React.cloneElement(icon!, { fontSize: 'small' })}
+          {React.cloneElement(icon!, { fontSize: 'inherit' })}
         </rootProps.slots.baseIconButton>
       );
     }

you could then change the sizing by just adding in a size prop on the GridActionCellItem

<GridActionsCellItem
  icon={<EditIcon />}
  label="Edit"
  className="textPrimary"
  onClick={handleEditClick(id)}
  color="inherit"
  size="large"
/>

Since this a rather small change i would like to open this up as a good first issue.

objections @mui/xgrid ?

[vadimka123]

@michelengelen , yep, I already using size prop for GridActionsCellItem, but as result getting medium button with small icon