Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Documented theme level defaultProps overrides do not work for react admin components #9706

Closed
wattry opened this issue Mar 9, 2024 · 4 comments · Fixed by #9713
Closed
Assignees

Comments

@wattry
Copy link

wattry commented Mar 9, 2024

What you were expecting:
We use medium size buttons for our custom filter components and the FilterButton component which uses an RA Button which defaults the size to small. This means we cannot use the MUI defaultProps to override it at a theme level and it does not take a size prop. The RA upgrading to v4 docs state that you can override the defaultProps on RA components, however, this does not seem to be work as I tried the example provided RaTextInput and this issue states that it won't be implemented.

You can find the reference to where it is documented here, I'm not sure if the position has changed or the RA Button does not allow for it. Since upgrading to RA4 we've tried to avoid creating too many wrapped copies unless necessary, since it made the upgrade considerably more work.

Screen Shot 2024-03-08 at 3 44 20 PM

** Related Code **

Button.ts:39

Environment

  • React-admin version: 4.16.1
  • React version: 17.0.2
@fzaninotto
Copy link
Member

The migration documentation you're referring to (https://marmelab.com/react-admin/Upgrade.html#simpleform-and-tabbedform-no-longer-accept-margin-and-variant) explains that you can apply custom props on the MuiTextField. This works. Can you confirm it?

We probably need to remove the mention of overriding RaTextInput default props as it's not working. Marking this as a documentation issue.

@wattry
Copy link
Author

wattry commented Mar 11, 2024

I'll be specific to the component we're attempting to override. RA Button

const {
        alignIcon = 'left',
        children,
        className,
        disabled,
        label,
        color = 'primary',
        size = 'small',
        to: locationDescriptor,
        ...rest
    } = props;

Since the props are being provided as overrides here MUI does not use the defaultProps defined in the theme. You can see this working for color on the columns button, as it does not set a default color, however the rest of the toolbar does. So the color override works and the size does not.

Stackblitz example can be found in the index

@fzaninotto
Copy link
Member

@wattry concerning the ability to override react-admin components, it's not possible without a breaking change (cf #9546). We're preparing v5, so it's the right time to work on that. I suggest you open a new issue about it.

@wattry
Copy link
Author

wattry commented Mar 12, 2024

@fzaninotto we were more interested in if we were misinterpreting the documentation or if that component wasn't implemented to use RA overrides. We've managed thus far and since it's in RA5 is on the horizon, I'm not going to request your teams resources to update this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants