question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[system] Passing incompatible `grey` color to palette does not throw

See original GitHub issue

This issue exists in alpha.36

  • The issue is present in the latest release.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

When creating a custom Chip variant+color combination, I see an error in the JavaScript console that throws an exception. Note that custom variant props work, but not color.

Expected Behavior 🤔

I should be able to customize both the variant and colour of a Chip.

Steps to Reproduce 🕹

https://codesandbox.io/s/mui-chip-error-1vntn?file=/src/index.js

Steps:

Context 🔦

I started receiving this error message after upgrading from alpha.24 to alpha.36

Your Environment 🌎

`npx @material-ui/envinfo`
  Don't forget to mention which browser you used.
  Output from `npx @material-ui/envinfo` goes here.

Issue Analytics

  • State:open
  • Created 2 years ago
  • Comments:10 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
alexplumbcommented, Jul 1, 2021

Fascinating - thanks so much! This change actually makes the original code sandbox work as well. So strange - should the issue title be changed then? I’ll leave that to you folks 😃

1reaction
eps1loncommented, Jun 10, 2021

Agree, the typings are correct, but for this specific color I believe we can add runtime check as well +1

Ideally the shape would be consistent to begin with considering the Color interface (the one with the A100 etc swatches) is something specific to Material design as far as I can tell.

Read more comments on GitHub >

github_iconTop Results From Across the Web

The sx prop - MUI System
Array values​​ If foo: true , then color: red; backgroundColor: grey; is applied when hovering. If bar: true , then color: red; backgroundColor:...
Read more >
Colors.js Error Causes Incompatibility Issue With Chalk #68
It looks like an issue with Colors.js is causing problems now that Chalk is used for cli coloring. This caused an issue with...
Read more >
Can't customize color palette types on Material UI theme in ...
and it tells me this: Property 'gradient' does not exist on type 'Palette'. Environment: "@material- ...
Read more >
Colors and Styling for Visual Studio - Microsoft Learn
Learn how the Visual Studio User Experience uses color as a communication tool, instead of for purely aesthetic reasons.
Read more >
Why You Shouldn't Gray Out Disabled Buttons - UX Movement
If the button's active color is not clearly being used for other interactive elements then it's not obvious it's actually transparent. In the ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found