possibility to override defaultProps of custom styled components about material-ui HOT 10 OPEN

Isn't this what you are looking for @dberardo-com ?
https://mui.com/material-ui/customization/theme-components/#theme-default-props

from material-ui.

thanks for the quick reply.

i would like to keep defaultProps for native MUI element untouched, and change them only for my custom elements

from material-ui.

In that case, have you considered overriding the default props inside the custom component?

from material-ui.

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"})({})

from material-ui.

Got it, Thanks for clarifying.

I'd say the styled components are for defining the styles.
But your idea of using prop overrides for creating new components is actually interesting. Let's wait for the thoughts from the maintainers.

from material-ui.

i see ... i thought that was the whole point of it :D

thanks for the reply

from material-ui.

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 ?

from material-ui.

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:

• every user of my app has the ability to upload a logo picture
• the app loads a different MUI theme per each user
• the link to the logo is defined as a MyCustomCardMedia.defaultProps.image attribute of the theme

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

from material-ui.

We could probably add a way to override default props through the second argument of styled

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?

from material-ui.

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.

from material-ui.