[ButtonBase] Fix focus ripple
- [x] I have followed (at least) the PR section of the contributing guide.
Fixes #33303
Problem: The focus ripple doesn't fit the whole width and height of the button
Solution: Based on the explanations this comment, the solution is the removal of this behavior as it's not in accordance with the latest Material Design. Pulsate in the ButtonBase component mainly controlled this effect, so I updated the code and tests based on this removal. Also, the way the width and height of the ripple were calculated caused additional paddings. I proposed to set it equal to the max of width and height.
The pulsate was shared with different components such as tabs, button, and fab.
Button demo in the doc: https://deploy-preview-34258--material-ui.netlify.app/material-ui/react-button/ Fab demo in the doc: https://deploy-preview-34258--material-ui.netlify.app/material-ui/react-floating-action-button/ Tabs demo in the doc: https://deploy-preview-34258--material-ui.netlify.app/material-ui/react-tabs/
@material-ui/core: parsed: -0.15% :heart_eyes:, gzip: -0.16% :heart_eyes: @material-ui/lab: parsed: -0.33% :heart_eyes:, gzip: -0.27% :heart_eyes: @mui/material-next: parsed: -0.34% :heart_eyes:, gzip: +0.21%
Generated by :no_entry_sign: dangerJS against 0911becc37dcecba62e4244b790d86f7f92f977a