flams_web_utils/components/
theming.rs

1#![allow(clippy::must_use_candidate)]
2
3use leptos::prelude::*;
4
5#[derive(Copy,Clone,PartialEq,Eq,Debug,Default,serde::Serialize,serde::Deserialize)]
6pub enum ThemeType { #[default] Light,Dark }
7impl<'a> From<&'a thaw::Theme> for ThemeType {
8    fn from(theme: &'a thaw::Theme) -> Self {
9        if theme.name == "dark" {
10            Self::Dark
11        } else {
12            Self::Light
13        }
14    }
15}
16impl From<ThemeType> for thaw::Theme {
17  fn from(tp:ThemeType) -> Self {
18      match tp {
19          ThemeType::Light => Self::light(),
20          ThemeType::Dark => Self::dark()
21      }
22  }
23}
24
25
26#[cfg(feature="ssr")]
27#[component(transparent)]
28pub fn Themer<Ch:IntoView+'static>(children:TypedChildren<Ch>) -> impl IntoView {
29    use thaw::{ConfigProvider,ToasterProvider,Theme};
30    let signal = RwSignal::<thaw::Theme>::new(Theme::light());
31    let children = children.into_inner();
32    provide_context(signal);
33    view!{
34        <ConfigProvider theme=signal>
35          <ToasterProvider>{children()}</ToasterProvider>
36        </ConfigProvider>
37    }
38}
39
40
41#[cfg(all(feature = "hydrate",not(feature="ssr")))]
42#[component(transparent)]
43pub fn Themer<Ch:IntoView+'static>(children:TypedChildren<Ch>) -> impl IntoView {
44    use gloo_storage::Storage;
45    use thaw::{ConfigProvider,ToasterProvider,Theme};
46    let signal = {
47        let sig = gloo_storage::LocalStorage::get("theme")
48            .map_or_else(|_| RwSignal::<thaw::Theme>::new(Theme::light()),
49            |theme:ThemeType| RwSignal::<thaw::Theme>::new(theme.into())
50        );
51        Effect::new(move || {
52            sig.with(move |theme|
53                {let _ = gloo_storage::LocalStorage::set("theme",ThemeType::from(theme));}
54            );
55        });
56        sig
57    };
58    let children = children.into_inner();
59    provide_context(signal);
60    view!{
61      <ConfigProvider theme=signal>
62        <ToasterProvider>{children()}</ToasterProvider>
63      </ConfigProvider>
64    }
65
66}