I'm doing a React Admin based project, and I have my own DeleteButton component which uses React Admin's DeleteButton export (https://marmelab.com/react-admin/Buttons.html#deletebutton) with some styles applied.

For my DeleteButton, I've opted to get rid of the icon on it by passing in icon={<></>} as a prop. This works, but the text/label on the button has a 0.5em left padding on it and is causing it to look a bit odd.

It currently looks like this.

I was hoping to supply a style that targets the label and removes the left padding, but so far I've been unable to figure it out, and I was wondering if anyone could help me with it.

I've tried supplying a few things as a classes prop:

const useDeleteButtonStyles = makeStyles({label: {leftPadding: 0}});
const useDeleteButtonStyles = makeStyles({MuiButton: {label: {leftPadding: 0}}});
const useDeleteButtonStyles = makeStyles({RaButton: {label: {leftPadding: 0}}});

const deleteButtonClasses = deleteButtonStyles();

<DeleteButton icon={<></>} classes={deleteButtonClasses} />

But so far, none of them have had any effect. I did see there was also a labelRightIcon property but I've not changed the position of the icon on my DeleteButton so I believe it should be the regular label prop.

I did find that passing those classes does work on a regular React Admin Button, it just doesn't seem to on the specific action ones.

The only way I've managed to hit it is with a global addition to the theme that targets RaButton.label, but that removes the padding from ALL buttons including ones that I want to keep the padding on as they have icons.

I'm not sure if I've incorrectly assumed I can also use classes on the action ones like DeleteButton or if I'm just plain doing it incorrectly, but if anyone can provide some insight I'd really appreciate it.

Thanks!