diff --git a/build/globals.webpack.js b/build/globals.webpack.js index c1ced89c08..24d211eff4 100644 --- a/build/globals.webpack.js +++ b/build/globals.webpack.js @@ -81,6 +81,8 @@ module.exports = { DETECT_USER_PREFERENCES: s(config.theme.detectUserPreferences()), + POST_PROCESS_THEME: s(config.theme.postProcessor), + DS: runtime.passDesignSystem && pzlr.designSystem ? s(getDS()) : null, diff --git a/index.d.ts b/index.d.ts index 029f274115..cde06d6022 100644 --- a/index.d.ts +++ b/index.d.ts @@ -47,6 +47,8 @@ declare const DETECT_USER_PREFERENCES: CanUndef< }>> >; +declare const POST_PROCESS_THEME: CanUndef; + declare const DS: CanUndef; declare const DS_COMPONENTS_MODS: CanUndef<{ [name: string]: Nullable>; diff --git a/src/components/super/i-static-page/modules/theme/theme-manager.ts b/src/components/super/i-static-page/modules/theme/theme-manager.ts index 0ecd9036d7..e91a213a61 100644 --- a/src/components/super/i-static-page/modules/theme/theme-manager.ts +++ b/src/components/super/i-static-page/modules/theme/theme-manager.ts @@ -7,6 +7,7 @@ */ import symbolGenerator from 'core/symbol'; +import { syncLocalStorage } from 'core/kv-storage/engines/cookie'; import type iBlock from 'components/super/i-block/i-block'; import type iStaticPage from 'components/super/i-static-page/i-static-page'; @@ -50,7 +51,9 @@ export default class ThemeManager extends Friend { let theme = THEME; - if (Object.isDictionary(DETECT_USER_PREFERENCES)) { + if (POST_PROCESS_THEME) { + theme = syncLocalStorage.get('colorTheme') ?? theme; + } else if (Object.isDictionary(DETECT_USER_PREFERENCES)) { const prefersColorSchemeEnabled = Object.get(DETECT_USER_PREFERENCES, 'prefersColorScheme.enabled') ?? false, darkTheme = Object.get(DETECT_USER_PREFERENCES, 'prefersColorScheme.aliases.dark') ?? 'dark', @@ -97,6 +100,7 @@ export default class ThemeManager extends Friend { const oldValue = this.currentStore; this.currentStore = value; + syncLocalStorage.set('colorTheme', value); document.documentElement.setAttribute(this.themeAttribute, value); void this.component.lfc.execCbAtTheRightTime(() => {