MUI: The `fade` color utility was renamed to `alpha` to better describe its functionality. (material-table)

Question

I am using material-table (npm latest v1.69.3) with MUI v5.0.6 since I need a editable table. I got this msg in my console.

It says import alpha but since fade is used in material-table which is a npm package I don't know what to do here.

What I want to know is why is this error occurring, how to get rid of this error and fix the issue. Can someone please help me out?

Lovins

Answer 1

material-table package is not actively maintained anymore and currently it only supports MUI v4. There is a community fork here where you can use the material table with MUI v5 by installing the next version:

npm install @material-table/core@next

Rouble

i just have to install that npm right? i did that. doesnt work :( – Lovins

@ShakyaKarunathilake have a look at the working codesandbox in my answer. Here is the package.json file for reference. – Rouble

can u please tell me whether "@types/react": "17.0.33", "@types/react-dom": "17.0.10", these two dependencies are required to fix this issue? – Lovins

@ShakyaKarunathilake those packages add type definitions for react and react-dom if you're using typescript. It should not be related to the error you're having. – Rouble

@ShakyaKarunathilake can you tell me what is working for you so I can include it in my answer? – Rouble

I installed the npm package just like u told me. I never used a community fork before so took some time to get the idea of it. Installing the package and import the relevant components helped – Lovins