mui / material-ui

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

Button: LinkComponent in Theme is not used #44389

Closed BennyAlex closed 1 week ago

BennyAlex commented 1 week ago

Steps to reproduce

Previously in v5 I defined the LinkComponent inside theme

MuiButton: {
  defaultProps: {
    LinkComponent: MyLink
}

and it worked fine.

Not this doesnt work anymore. I only see my link component when I do it manually for each button like: https://mui.com/material-ui/integrations/routing/#button

Current behavior

No response

Expected behavior

No response

Context

No response

Your environment

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

Search keywords: LinkComponent

sai6855 commented 1 week ago

Not this doesnt work anymore.

@BennyAlex what do you mean by, This doesn't work anymore? would you mind providing a repro in a sandbox please?

In this sandbox, i can see a being rendered when LinkComponent is passed in theme

https://stackblitz.com/edit/react-ndqyxk?file=Demo.tsx

BennyAlex commented 1 week ago

@sai6855

https://stackblitz.com/edit/react-ndqyxk-run8w3?file=tsconfig.json,Router.jsx,RouterLink.jsx,Home.tsx,BaseRoute.jsx,Demo.jsx,index.tsx

(click go to demo)

This shows the error and also it looks like all default Props are ignored for some reason.

It should show outlined buttons by default and replace the link with the link from the url mapping.

BennyAlex commented 1 week ago

The same code worked fine with mui v5

sai6855 commented 1 week ago

@BennyAlex Few imports are missing in your repro, can you add missing imports in this file and check again? https://stackblitz.com/edit/react-ndqyxk-run8w3?file=RouterLink.jsx

BennyAlex commented 1 week ago

@sai6855 https://stackblitz.com/edit/react-ndqyxk-run8w3?file=RouterLink.jsx,Home.tsx

should be there now, still the same behaviour

sai6855 commented 1 week ago

@BennyAlex I've updated version of @mui/material to 5.16.7 in you repor but still behaviour is same. when you say it was working in v5, which version were you on?

https://stackblitz.com/edit/react-ndqyxk-yvvn19?file=package.json

BennyAlex commented 1 week ago

I was also on the latest I think. But it should work or whats the reason that the defaultProps are not applied? The other stuff from theme seams to be applied correctly

sai6855 commented 1 week ago

@BennyAlex Found the issue, defaultProps are not being applied because you imported ThemeProvider from @emotion/react not from @mui/material in this file https://stackblitz.com/edit/react-ndqyxk-buu58f?file=BaseRoute.jsx

updated import in below sandbox, it's working now

https://stackblitz.com/edit/react-ndqyxk-buu58f?file=BaseRoute.jsx

github-actions[bot] commented 1 week ago

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue. Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

[!NOTE] @BennyAlex How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.

sai6855 commented 1 week ago

@BennyAlex feel free to re-open the issue, if you face any issues

BennyAlex commented 5 days ago

@sai6855 great, thank you very much that helped me a lot :D