Open shahzebgit opened 1 month ago
Hello @shahzebgit.
Could you please check our demo using Joy UI as a reference for configuration?
Please also check this documentation for more information about using @mui/material
and @mui/joy
together.
Does it help you resolve the problem? 🤔
Hello @LukasTy ,
Could you please check our demo using Joy UI as a reference for configuration?
Oh, nice this actually works pretty well. Thank you, could be a good way to mention this in Date Picker docs. if people are using Joy UI
used MaterialCssVarsProvider
at top level to sync the theme too.
Would a dedicated section of using a different styling system be a thing @LukasTy ? I agree that discoverability of this is not ideal atm
This issue looks a lot like #13799 It's funny to see 2 issues related to Joy in such a small amount of time.
@michelengelen the issues here seems very related to Joy UI, not sure if we can document something more general, and given the current trend with Joy UI not sure it's worth investing time in it either :grimacing: We have an ongoing OKR about supporting other Design System, I would be in favor of advancing in this direction rather than documenting the current state of things (which sucks to be honest).
We could link to this page in our demos that use Joy UI, but I would not invest to much time building a complex demo that would probably because outdated in the coming months.
I completely agree with @flaviendelangle on this one. Let's add a link to the Joy page in the relevant docs, but in the current state, I would like to keep relying on the search for discoverability. 🤔
Steps to reproduce
Link to live example: (required)
Steps:
CssVarsProvider
Wrapper in your top level component as a wrapper.CssVarsProvider
Wrapper and the page crashes.Current behavior
Crash errors whenever i try to use DatePicker component in any of my component.![Date Picker Error](https://i.sstatic.net/mQHBjlDs.png)
Turns out using
CssVarsProvider
wrapper causes it to crash.App.js
CreateUser.tsx
Parent ComponentI have imported that to my parent component in a modal.
CustomDatePicker.tsx
Expected behavior
I was expecting it to show a view just like its shown here
Context
No response
Your environment
``` System: OS: Linux 5.15 Ubuntu 20.04.6 LTS (Focal Fossa) Binaries: Node: 16.20.2 - ~/.nvm/versions/node/v16.20.2/bin/node npm: 8.19.4 - ~/.nvm/versions/node/v16.20.2/bin/npm pnpm: Not Found Browsers: Chrome: 126.0.6478.182 npmPackages: @emotion/react: ^11.11.4 => 11.11.4 @emotion/styled: ^11.11.5 => 11.11.5 @mui/base: 5.0.0-beta.40 @mui/core-downloads-tracker: 5.16.4 @mui/icons-material: ^5.16.1 => 5.16.1 @mui/joy: ^5.0.0-beta.36 => 5.0.0-beta.48 @mui/material: ^5.16.4 => 5.16.4 @mui/private-theming: 5.16.4 @mui/styled-engine: 5.16.4 @mui/system: 5.16.4 @mui/types: 7.2.15 @mui/utils: 5.16.4 @mui/x-date-pickers: ^7.10.0 => 7.10.0 @types/react: 18.3.3 react: ^18.3.1 => 18.3.1 react-dom: ^18.3.1 => 18.3.1 typescript: ^5.5.3 => 5.5.3 ```npx @mui/envinfo
Search keywords: CssVarsProvider, datepicker, mui/joy