Expand description
主题(浅色 / 深色 / 跟随系统)管理。
三态模型:
Theme::Light/Theme::Dark:用户显式选择,持久化到 localStorage。Theme::System:跟随系统偏好。移除 localStorage 持久化,首屏防闪烁 脚本因此自动回退到prefers-color-scheme分支;运行时监听matchMedia('(prefers-color-scheme: dark)')的change事件,系统切换 主题时实时同步.darkclass 与下游(CodeMirror 等)。
SSR 与客户端 hydration 都从 Theme::System 开始;挂载后再读取
localStorage 恢复用户选择。首屏配色和图标均由 ThemePreload 提前设置,
不依赖 WASM 加载速度或服务端无法读取的浏览器偏好。
下游消费者(CodeMirror、SVG 图标判定)应读 ResolvedTheme(实际生效明暗),
而非 Theme(用户意图),这样 System 模式下系统偏好变化能自动传播。
Re-exports§
pub use ThemePreload_completions::Component::ThemePreload;pub use ThemeToggle_completions::Component::ThemeToggle;
Enums§
- Resolved
Theme - 实际生效的明暗主题(用户选择经
resolve()解析后的结果)。 - Theme
- 用户选择的主题意图(三态)。
Constants§
Functions§
- Theme
Preload - 首屏主题预加载脚本组件。
- Theme
Toggle - 主题切换按钮组件(三态循环:Dark → Light → System → Dark)。
- mode_
label 🔒 - 主题意图的中文标签,用于 aria-label / title。
- read_
system_ 🔒dark - 读取当前系统是否为深色偏好。
- use_
resolved_ theme - 读取实际生效明暗主题的 Hook。
- use_
theme - 读取当前主题意图 Signal 的 Hook。
- use_
theme_ provider - 提供主题上下文的 Hook。