-
-
Notifications
You must be signed in to change notification settings - Fork 32.3k
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
[docs] Add note in docs about componentsProps.root
taking precedence
#33097
[docs] Add note in docs about componentsProps.root
taking precedence
#33097
Conversation
componentsProps.root
taking precedence
cc @michaldudak can you verify and approve? |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
However, I think that it should be the other way around, the additional native props passed directly on the component should take precedence.
IMO what's set explicitly should override values set implicitly. If you set componentsProps.root.id = 'x'
, you clearly state that the id
prop of the root slot should be 'x'. On the other hand, spreading additional unstyled component's props on the root is more of a convention. That's why I think the current way is more intuitive.
Co-authored-by: Michał Dudak <michal.dudak@gmail.com>
…s://github.com/ZeeshanTamboli/material-ui into base-componentsProps-root-slot-precedence-docs
I am merging this. The docs suggestion is applied. Could be helpful in #33272. |
mui#33097) * docs * docs wording * run CI * Update docs/data/base/getting-started/usage/usage.md Co-authored-by: Michał Dudak <michal.dudak@gmail.com> Co-authored-by: Michał Dudak <michal.dudak@gmail.com>
While working on
SnackbarUnstyled
component, I stumbled upon a use case about what if both props are specified which one will take precedence?componentsProps.root
or the additional native DOM props?This is what I mean - see the following CodeSandbox: https://codesandbox.io/s/eloquent-hugle-xfri7g?file=/src/Demo.tsx:1245-1449
Here the id
badge-1
ofroot
slot gets applied, notbadge-2
. Hence mentioned it in the docs.However, I think that it should be the other way around, the additional native props passed directly on the component should take precedence. But then we will have to change the implementation on all the components.
Docs preview: https://deploy-preview-33097--material-ui.netlify.app/base/getting-started/usage/