In order to use the quiet button with icon in the Mismatch Finder, we need to investigate how to ensure that the spacing between icons and labels in buttons is right.
Our current approach to displaying icons within our different button variants involves inserting them in the existing button slot, to the left and/or the right of the text label. We should make sure that this approach still allows us to apply a proper spacing between the icon and the button label (as defined by the button design specs).
- As an approach, we may decide to add a prefix and suffix slots to the button that will only accept Icon children.
- Another approach could be to add a "left" or "right" prop to the Icon that then adds the expected padding to that icon, like in vuetify: https://vuetifyjs.com/en/components/icons/#buttons