-
-
Notifications
You must be signed in to change notification settings - Fork 31.7k
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
possibility to override defaultProps of custom styled components #42248
Comments
Isn't this what you are looking for @dberardo-com ? |
thanks for the quick reply. i would like to keep defaultProps for native MUI element untouched, and change them only for my custom elements |
this would work of course, but i am not defining a custom component in that way, but simply using styled: export const MyButton = styled(Button, {name: "MyButton", slot: "root"})({}) |
Got it, Thanks for clarifying. I'd say the styled components are for defining the styles. |
i see ... i thought that was the whole point of it :D thanks for the reply |
As of right now, it's not supported the way you are expecting. We could probably add a way to override default props through the second argument of styled - const MyButton = styled(Button, {
defaultProps: {
// new props
}
})() But I'd say this would be least on our priorities right now. @DiegoAndai Your thoughts ? |
thanks for evaluating this suggestion. indeed i can wrap the styled component around a functional one for now, but i just wanted a more elegant solution. i think it would be enough to make this point more explicit from the documentation, in fact i am still wondering what can be overriden within the theme for themed styled component. i am assuming that only the "stylesOverride" part of the theme has an impact on the themed styled component, but again, that is just my assumption. i guess it would be great if the doc clearly states that, so no misambiguity arise. btw FYI what i am trying to achieve here is the following:
for now i use stylesOverride, but just wanted to know whether i could achieve that with defaultProps, which seems not to be the case. cheers |
I'm not sure about this API, seems like we would be coupling the styled call with business logic. @dberardo-com reading your use case, I think it would be better to decouple your logic from the theme. Instead of using the theme's default props, why not create a separate context in which the logo link is propagated, and then the component can read from it? |
i would love to use MUITheme because it has a pre-defined and pre-documented structure, so it is much easier to adopt and more robust. |
Summary
following this i am creating themed components: https://mui.com/material-ui/customization/theme-components/#creating-new-component-variants
styled overrides work fine, but now i would like to override defaultProps from the theme as well, this is not possible currently.
would it be possible at least to override defaultProps from inside the styled()({ .... }) declaration ?
Examples
No response
Motivation
No response
Search keywords: theme components
The text was updated successfully, but these errors were encountered: