Skip to content

[ThemeProvider] Support setting default mode#43951

Merged
siriwatknp merged 4 commits intomui:masterfrom
siriwatknp:css-vars-default-mode
Oct 1, 2024
Merged

[ThemeProvider] Support setting default mode#43951
siriwatknp merged 4 commits intomui:masterfrom
siriwatknp:css-vars-default-mode

Conversation

@siriwatknp
Copy link
Member

@siriwatknp siriwatknp commented Oct 1, 2024

closes #43622

Changes

The default mode can be controlled by a prop (see #43622 for use cases):

<ThemeProvider defaultMode="dark | light | system">

@siriwatknp siriwatknp added scope: system The system, the design tokens / styling foundations used across components. eg. @mui/system with MUI package: material-ui type: enhancement It’s an improvement, but we can’t make up our mind whether it's a bug fix or a new feature. labels Oct 1, 2024
@siriwatknp siriwatknp requested review from a team and Janpot October 1, 2024 07:21
@mui-bot
Copy link

mui-bot commented Oct 1, 2024

Netlify deploy preview

Bundle size report

Details of bundle changes (Toolpad)
Details of bundle changes

Generated by 🚫 dangerJS against 980c206

Copy link
Member

@Janpot Janpot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Small suggestion to satisfy vale, otherwise looks good.

Co-authored-by: Jan Potoms <2109932+Janpot@users.noreply.github.com>
Signed-off-by: Siriwat K <siriwatkunaporn@gmail.com>
*/
documentNode?: Document | null;
/**
* The default mode when the storage is empty,
Copy link
Member

@aarongarciah aarongarciah Oct 1, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What does "storage" mean? Could we specify a bit more?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

May be local storage is more direct?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

Co-authored-by: Aarón García Hervás <aaron.garcia.hervas@gmail.com>
Signed-off-by: Siriwat K <siriwatkunaporn@gmail.com>
@siriwatknp siriwatknp merged commit f7feae3 into mui:master Oct 1, 2024
@codemine24
Copy link

codemine24 commented Jan 23, 2025

this one was life saver: <ThemeProvider defaultMode="dark | light | system">
By default mui theme mode is system but i wanted it to be started as light mode. Thanks for the suggesiton.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

scope: system The system, the design tokens / styling foundations used across components. eg. @mui/system with MUI type: enhancement It’s an improvement, but we can’t make up our mind whether it's a bug fix or a new feature.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Mui v6] Set default mode at first render

5 participants