Component customization and extension related issues

Open

#34,883 opened on Oct 25, 2022 6 comments 37 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

scope: all components umbrella

Dominant language: JavaScript
Stars: 99.1k
Forks: 32.5k
Avg merge: 2d 17h
Merged PRs (30d): 106

Description

This umbrella issue collects customization-related issues to help the core team see the big picture about the underlying problems (could be poor documentation, lack of features, etc.). Once we have identified and categorized the problems, we will prioritize the work and ask for help from the community.

For the community, feel free to jump into the discussion and share your thoughts, use cases, needs, or anything that you think it is important for us to consider.

As a first draft, I have gone through 30 pages of issues (til Jun 2021) and grouped the issues based on my understanding:

Extending theme variants

https://github.com/mui/material-ui/issues/34831: to apply styles based on the custom prop which spread to DOM.
https://github.com/mui/material-ui/issues/34812: able to set the default props based on the theme.
https://github.com/mui/material-ui/issues/34715: want to target child slots in theme variants.
https://github.com/mui/material-ui/issues/34600: (specific to Button) custom variant does not work with size prop.
https://github.com/mui/material-ui/issues/32427
https://github.com/mui/material-ui/issues/34615: (specific to Paper) custom variant does not work with elevation prop.
https://github.com/mui/material-ui/issues/34290: (specific to Typography) color prop, becomes sx at the end, overrides the styleOverrides.
https://github.com/mui/material-ui/issues/33785: (specific to Tabs) can't extend the variant because the logic is bind to the values.
https://github.com/mui/material-ui/issues/33510: all components should have a variant prop to be extendable (the author mentioned that the docs is misleading).
https://github.com/mui/material-ui/issues/31204: (specific to Menu) can't extend the variant because the logic is bind to the values.
https://github.com/mui/material-ui/issues/29524
https://github.com/mui/material-ui/issues/29455
https://github.com/mui/material-ui/issues/28671: (specific to Input) can't extend the variant because the logic is bind to the values.
https://github.com/mui/material-ui/issues/27130
https://github.com/mui/material-ui/issues/27267
https://github.com/mui/material-ui/issues/34885

Contributor guide

Open the contributing guide

First steps

Read the whole issue, then the project's contributing guide.
Comment on the issue to say you are picking it up — it saves two people doing the same work.
Fork the repository and make your change on a branch.
Open a pull request that references the issue number.

Research direction

Start by reviewing the linked issues grouped under Extending theme variants, Custom components, Composition, Theming, sx prop, and Others. Compare their stated problems and categorize them consistently, then identify which customization problems still need prioritization; the umbrella issue is complete when the problems are identified, categorized, and ready for community discussion.

Written by the indexing model from the issue text.

Assessment

Tech stack: javascript, react
Domain: design, frontend
Issue type: Feature
Difficulty: 5/5
Estimated time: Over a week
Activity status: Stale
Clarity: Needs clarification
Newbie friendliness: 18/100

Component customization and extension related issues

Description

Extending theme variants

Custom components

Composition

Theming

sx prop

Others

Contributor guide

First steps

Research direction

Assessment

Get new issues in your inbox

`sx` prop