`useColorScheme` should fail when not called under a `ThemeProvider`
Open
@siriwatknp is already working on this.
Since Oct 1, 2024.
customization: theme
scope: all components
- Dominant language
- JavaScript
- Stars
- 99.1k
- Forks
- 32.5k
- Avg merge
- 2d 17h
- Merged PRs (30d)
- 106
Description
Steps to reproduce
Link to live example: https://codesandbox.io/embed/8clfj3?module=/src/Demo.tsx
Try toggling the theme with the two selects
Current behavior
The first one select box doesn't do anything. There is no feedback to the developer that the first call to useColorScheme will never work.
Expected behavior
The call to useColorScheme errors when there is no theme available.
Context
Potentially what this user ran in to.
Orthogonal issue, but I started from this example. It would be more ergonomic if these were radio buttons, or toggle buttons. It halves the amount of clicks necessary to operate the demo.
Your environment
npx @mui/envinfo
Don't forget to mention which browser you used.
Output from `npx @mui/envinfo` goes here.
Search keywords: useColorScheme ThemeProvider
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.