eps1lon
commented
3 years ago I can definitely see some room to improve the customization documentation. Though the initial prototype feels a bit lost.
It should be clear what are classes, what are components, where are these located in the component etc. Right now the prototype isn't telling anything new because we already document in prose and name that MuiSwitch-Thumb is applied to the Thumb component of the Switch.
Summary 💡
I'd like to gather feedback about a possible improvement to the documentation: visualization of a component structure. It could (conceptually, don't mind the visual design) look like this: https://codesandbox.io/s/component-structure-visualisation-d31po?file=/demo.tsx (blue chips represent static classes, purple chips - conditional ones).
In my opinion this will have the most impact where component customization is required. Unstyled components come to mind first, but core components could also make use of it. It is important to know the structure of slots when customizing a component. Having a visual representation of CSS classes and where they are applied could also help.