[material-ui][Button] Variants don't consume the size prop

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

Creating a button variant doesn't seem to use the size prop. When a button and a variant button are placed next to each other they look misaligned.

export const components = {
  MuiButton: {
    defaultProps: {
      variant: 'contained'
    },
    variants: [
      {
        props: { variant: 'action' },
        style: {
          background: 'red'
        }
      }
    ]
  }
} as Components;

<div>
  <Button color="primary" size="large">
    Normal Button
  </Button>
  <Button color="secondary" size="large" variant="action">
    Variant Button
  </Button>
</div>

Expected behavior 🤔

I assumed size would be consumed so buttons and their variants could still be grouped together to have the same font sizes and padding etc.

Steps to reproduce 🕹

Steps:

1. Create a button variant
2. Try and use different sizes on the variant while comparing font size and padding to the normal button

Context 🔦

Create a button variant with different styles while still being able to consume the existing props like size. I'd like to be able to position the buttons next to each other and have them using the same font sizes and padding without looking misaligned.

Your environment 🌎