material-ui icon indicating copy to clipboard operation
material-ui copied to clipboard
verified publisher icon mui

Component customization and extension related issues

Open siriwatknp opened this issue 3 years ago • 5 comments

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

Custom components

  • https://github.com/mui/material-ui/issues/34768: a custom component via MUI styled does not bind to theme typings.
  • https://github.com/mui/material-ui/issues/34539: basically move useThemeProps to an option in styled.
  • https://github.com/mui/material-ui/issues/31019
  • https://github.com/mui/material-ui/issues/29875
  • https://github.com/mui/material-ui/issues/29492: request API like styled-components attrs

Composition

  • https://github.com/mui/material-ui/issues/33018: missing componentsProps in LoadingButton

Theming

  • https://github.com/mui/material-ui/issues/34294: adopting dark mode.
  • https://github.com/mui/material-ui/issues/34214: should shallow merge slots with theme default props.
  • https://github.com/mui/material-ui/issues/33387: need examples to demonstrate the best practices for customizing TextField and Autocomplete.
  • https://github.com/mui/material-ui/issues/32721: custom mixins
  • https://github.com/mui/material-ui/issues/32150: ask for clarity about the theming capability
  • https://github.com/mui/material-ui/issues/31094: want to styles using the new props
  • https://github.com/mui/material-ui/issues/28754: want to styles using the new props
  • https://github.com/mui/material-ui/issues/30484: responsive typography creation
  • https://github.com/mui/material-ui/issues/30037: theming without using ThemeProvider
  • https://github.com/mui/material-ui/issues/29644
  • https://github.com/mui/material-ui/issues/29008
  • https://github.com/mui/material-ui/issues/28820
  • https://github.com/mui/material-ui/issues/33054: extending color palette
  • https://github.com/mui/material-ui/issues/35159
  • https://github.com/mui/material-ui/issues/35156
  • https://github.com/mui/material-ui/issues/34900: How to attach a custom object to the theme (locale in this case)

sx prop

  • https://github.com/mui/material-ui/issues/33525: want to custom sx functionality to support other aliases.
  • https://github.com/mui/material-ui/issues/29734
  • https://github.com/mui/material-ui/issues/32734
  • https://github.com/mui/material-ui/issues/33281: sx spacing support
  • https://github.com/mui/material-ui/issues/32656: Typed color-related properties with the theme palette
  • https://github.com/mui/material-ui/issues/32198
  • https://github.com/mui/material-ui/issues/30725

Others

  • https://github.com/mui/material-ui/issues/33686: want to use css to get the same experience as makeStyles.
  • https://github.com/mui/material-ui/issues/32269: Typography color confusion.
  • https://github.com/mui/material-ui/issues/30420: Button color confusion
  • https://github.com/mui/material-ui/issues/29596: Link color confusion
  • https://github.com/mui/material-ui/issues/29595: color and theme palette confusion
  • https://github.com/mui/material-ui/issues/32274: the mismatched expectation of what the color prop does
  • https://github.com/mui/material-ui/issues/32270: inconsistent color prop causes confusion
  • https://github.com/mui/material-ui/issues/31097: how to create theme augmentation for use in different projects
  • https://github.com/mui/material-ui/issues/30869: related to shadows
  • https://github.com/mui/material-ui/issues/30678: theme typography typings
  • https://github.com/mui/material-ui/issues/29864
  • https://github.com/mui/material-ui/issues/29677: theme spacing functionality
  • https://github.com/mui/material-ui/issues/28244
  • https://github.com/mui/material-ui/issues/27673: MUI system style
  • https://github.com/mui/material-ui/issues/35939

siriwatknp avatar Oct 25 '22 10:10 siriwatknp

Does it make sense to include https://github.com/mui/material-ui/issues/32967 as well under this umbrella?

tomsseisums avatar Oct 25 '22 14:10 tomsseisums

Does it make sense to include #32967 as well under this umbrella?

Thanks, it should be included!

siriwatknp avatar Oct 25 '22 14:10 siriwatknp

Thanks for creating this umbrella issue @siriwatknp It shows really nicely the different aspects of the problem.

mnajdova avatar Oct 26 '22 10:10 mnajdova

Thanks for putting this together @siriwatknp!! 🙌

mapache-salvaje avatar Oct 27 '22 15:10 mapache-salvaje

Migrated to v6 and implemented own theme solution inly to see that I can't use my custom palette as a color prop, because it have 3 level of depth and I haven't found a way to use the nested property from the palette.

nike1v avatar Oct 15 '24 16:10 nike1v

The list is still missing https://github.com/mui/material-ui/issues/19466.

ChristianGrete avatar Nov 12 '24 14:11 ChristianGrete