mui / material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
https://mui.com/material-ui/
MIT License
93.83k stars 32.25k forks source link

[Tabs] color prop should not be available as it is ignored #43603

Open pcorpet opened 1 month ago

pcorpet commented 1 month ago

Steps to reproduce

Link to live example

Code extract:

<Tab label="Red Item One" color="red" {...a11yProps(0)} />

Current behavior

This does not trigger any typescript alert, although the color is not used.

Expected behavior

Raise an error that "color" is not a valid prop for <Tab>

Context

I got surprised when not being able to color a Tab with a prop.

Your environment

npx @mui/envinfo ``` System: OS: macOS 14.6.1 Binaries: Node: 22.2.0 - /opt/homebrew/bin/node npm: 10.7.0 - /opt/homebrew/bin/npm pnpm: 9.3.0 - /opt/homebrew/bin/pnpm Browsers: Chrome: 128.0.6613.119 npmPackages: @emotion/react: 11.13.3 => 11.13.3 @emotion/styled: 11.13.0 => 11.13.0 @mui/base: 5.0.0-beta.40 @mui/core-downloads-tracker: 5.16.7 @mui/lab: 5.0.0-alpha.173 => 5.0.0-alpha.173 @mui/material: 5.16.7 => 5.16.7 @mui/private-theming: 5.16.5 @mui/styled-engine: 5.16.4 @mui/system: 5.16.5 @mui/types: 7.2.15 @mui/utils: 5.16.6 @mui/x-data-grid: 7.15.0 @mui/x-data-grid-premium: 7.15.0 => 7.15.0 @mui/x-data-grid-pro: 7.15.0 @mui/x-date-pickers: 7.15.0 => 7.15.0 @mui/x-internals: 7.15.0 @mui/x-license: 7.15.0 @types/react: 18.3.5 => 18.3.5 react: 18.3.1 => 18.3.1 react-dom: 18.3.1 => 18.3.1 typescript: 5.5.4 => 5.5.4 ```

Search keywords: Tab, color

mnajdova commented 1 month ago

The color is a valid HTML attribute, this is why TS is not complaining. We need to accept all valid HTML attributes, otherwise, developers will not be able to add any additional props on the element.