feat: expose nativeTheme.shouldUseDarkColorsForSystemIntegratedUI
(#46599)
feat: expose shouldUseDarkColorsForSystemIntegratedUI Closes https://github.com/electron/electron/issues/46429. Refs https://github.com/electron/electron/pull/19735. This PR adds a new API `shouldUseDarkColorsForSystemIntegratedUI` to the `nativeTheme` module. This API returns a boolean indicating whether the system is using dark colors for system integrated UI elements. This is useful for applications that want to adapt their UI to match the system theme, especially for those that use system integrated UI elements like the shell theme or taskbar appearance. Co-authored-by: trop[bot] <37223003+trop[bot]@users.noreply.github.com> Co-authored-by: Shelley Vohr <shelley.vohr@gmail.com>
This commit is contained in:
parent
1d2107ebff
commit
592d0155f1
4 changed files with 21 additions and 0 deletions
|
@ -63,6 +63,14 @@ Your application should then always use `shouldUseDarkColors` to determine what
|
||||||
A `boolean` for if the OS / Chromium currently has high-contrast mode enabled
|
A `boolean` for if the OS / Chromium currently has high-contrast mode enabled
|
||||||
or is being instructed to show a high-contrast UI.
|
or is being instructed to show a high-contrast UI.
|
||||||
|
|
||||||
|
### `nativeTheme.shouldUseDarkColorsForSystemIntegratedUI` _macOS_ _Windows_ _Readonly_
|
||||||
|
|
||||||
|
A `boolean` property indicating whether or not the system theme has been set to dark or light.
|
||||||
|
|
||||||
|
On Windows this property distinguishes between system and app light/dark theme, returning
|
||||||
|
`true` if the system theme is set to dark theme and `false` otherwise. On macOS the return
|
||||||
|
value will be the same as `nativeTheme.shouldUseDarkColors`.
|
||||||
|
|
||||||
### `nativeTheme.shouldUseInvertedColorScheme` _macOS_ _Windows_ _Readonly_
|
### `nativeTheme.shouldUseInvertedColorScheme` _macOS_ _Windows_ _Readonly_
|
||||||
|
|
||||||
A `boolean` for if the OS / Chromium currently has an inverted color scheme
|
A `boolean` for if the OS / Chromium currently has an inverted color scheme
|
||||||
|
|
|
@ -63,6 +63,10 @@ bool NativeTheme::ShouldUseHighContrastColors() {
|
||||||
return ui_theme_->UserHasContrastPreference();
|
return ui_theme_->UserHasContrastPreference();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
bool NativeTheme::ShouldUseDarkColorsForSystemIntegratedUI() {
|
||||||
|
return ui_theme_->ShouldUseDarkColorsForSystemIntegratedUI();
|
||||||
|
}
|
||||||
|
|
||||||
bool NativeTheme::InForcedColorsMode() {
|
bool NativeTheme::InForcedColorsMode() {
|
||||||
return ui_theme_->InForcedColorsMode();
|
return ui_theme_->InForcedColorsMode();
|
||||||
}
|
}
|
||||||
|
@ -109,6 +113,8 @@ gin::ObjectTemplateBuilder NativeTheme::GetObjectTemplateBuilder(
|
||||||
&NativeTheme::SetThemeSource)
|
&NativeTheme::SetThemeSource)
|
||||||
.SetProperty("shouldUseHighContrastColors",
|
.SetProperty("shouldUseHighContrastColors",
|
||||||
&NativeTheme::ShouldUseHighContrastColors)
|
&NativeTheme::ShouldUseHighContrastColors)
|
||||||
|
.SetProperty("shouldUseDarkColorsForSystemIntegratedUI",
|
||||||
|
&NativeTheme::ShouldUseDarkColorsForSystemIntegratedUI)
|
||||||
.SetProperty("shouldUseInvertedColorScheme",
|
.SetProperty("shouldUseInvertedColorScheme",
|
||||||
&NativeTheme::ShouldUseInvertedColorScheme)
|
&NativeTheme::ShouldUseInvertedColorScheme)
|
||||||
.SetProperty("inForcedColorsMode", &NativeTheme::InForcedColorsMode)
|
.SetProperty("inForcedColorsMode", &NativeTheme::InForcedColorsMode)
|
||||||
|
|
|
@ -48,6 +48,7 @@ class NativeTheme final : public gin::Wrappable<NativeTheme>,
|
||||||
ui::NativeTheme::ThemeSource GetThemeSource() const;
|
ui::NativeTheme::ThemeSource GetThemeSource() const;
|
||||||
bool ShouldUseDarkColors();
|
bool ShouldUseDarkColors();
|
||||||
bool ShouldUseHighContrastColors();
|
bool ShouldUseHighContrastColors();
|
||||||
|
bool ShouldUseDarkColorsForSystemIntegratedUI();
|
||||||
bool ShouldUseInvertedColorScheme();
|
bool ShouldUseInvertedColorScheme();
|
||||||
bool InForcedColorsMode();
|
bool InForcedColorsMode();
|
||||||
bool GetPrefersReducedTransparency();
|
bool GetPrefersReducedTransparency();
|
||||||
|
|
|
@ -102,6 +102,12 @@ describe('nativeTheme module', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('nativeTheme.shouldUseDarkColorsForSystemIntegratedUI', () => {
|
||||||
|
it('returns a boolean', () => {
|
||||||
|
expect(nativeTheme.shouldUseDarkColorsForSystemIntegratedUI).to.be.a('boolean');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe('nativeTheme.inForcedColorsMode', () => {
|
describe('nativeTheme.inForcedColorsMode', () => {
|
||||||
it('returns a boolean', () => {
|
it('returns a boolean', () => {
|
||||||
expect(nativeTheme.inForcedColorsMode).to.be.a('boolean');
|
expect(nativeTheme.inForcedColorsMode).to.be.a('boolean');
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue