feat(material_theme): implement `checkbox::Catalog`

4 files changed, 143 insertions, 2 deletions

diff --git a/crates/material_theme/Cargo.toml b/crates/material_theme/Cargo.toml
index eef9605..58c5e0c 100644
--- a/crates/material_theme/Cargo.toml
+++ b/crates/material_theme/Cargo.toml
@@ -13,7 +13,9 @@ rust-version = "1.85"
 
 [features]
 default = []
+# Provides support for animating with `iced_anim`
 animate = ["dep:iced_anim"]
+# Provides support for `iced_dialog`
 dialog = ["dep:iced_dialog"]
 
 [dependencies]
diff --git a/crates/material_theme/src/checkbox.rs b/crates/material_theme/src/checkbox.rs
new file mode 100644
index 0000000..ac1f974
--- /dev/null
+++ b/crates/material_theme/src/checkbox.rs
@@ -0,0 +1,127 @@
+use iced_widget::checkbox::{Catalog, Status, Style, StyleFn};
+use iced_widget::core::{Background, Border, Color, border};
+
+use super::Theme;
+use crate::utils::{DISABLED_CONTAINER_OPACITY, HOVERED_LAYER_OPACITY, mix};
+
+impl Catalog for Theme {
+    type Class<'a> = StyleFn<'a, Self>;
+
+    fn default<'a>() -> Self::Class<'a> {
+        Box::new(default)
+    }
+
+    fn style(&self, class: &Self::Class<'_>, status: Status) -> Style {
+        class(self, status)
+    }
+}
+
+pub fn styled(
+    background_color: Color,
+    background_hover: Option<Color>,
+    icon_color: Color,
+    border_color: Color,
+    text_color: Option<Color>,
+    is_checked: bool,
+) -> Style {
+    Style {
+        background: Background::Color(if is_checked {
+            background_color
+        } else {
+            background_hover.unwrap_or(Color::TRANSPARENT)
+        }),
+        icon_color,
+        border: if is_checked {
+            border::rounded(2)
+        } else {
+            Border {
+                color: border_color,
+                width: 2.0,
+                radius: border::radius(2),
+            }
+        },
+        text_color,
+    }
+}
+
+pub fn default(theme: &Theme, status: Status) -> Style {
+    let surface = theme.colorscheme.surface;
+    let primary = theme.colorscheme.primary;
+
+    match status {
+        Status::Active { is_checked } => styled(
+            primary.color,
+            None,
+            primary.on_primary,
+            surface.on_surface_variant,
+            Some(surface.on_surface),
+            is_checked,
+        ),
+        Status::Hovered { is_checked } => styled(
+            mix(primary.color, surface.on_surface, HOVERED_LAYER_OPACITY),
+            Some(Color {
+                a: HOVERED_LAYER_OPACITY,
+                ..surface.on_surface
+            }),
+            primary.on_primary,
+            surface.on_surface_variant,
+            Some(surface.on_surface),
+            is_checked,
+        ),
+        Status::Disabled { is_checked } => styled(
+            Color {
+                a: DISABLED_CONTAINER_OPACITY,
+                ..surface.on_surface
+            },
+            None,
+            surface.color,
+            Color {
+                a: DISABLED_CONTAINER_OPACITY,
+                ..surface.on_surface
+            },
+            Some(surface.on_surface),
+            is_checked,
+        ),
+    }
+}
+
+pub fn error(theme: &Theme, status: Status) -> Style {
+    let surface = theme.colorscheme.surface;
+    let error = theme.colorscheme.error;
+
+    match status {
+        Status::Active { is_checked } => styled(
+            error.color,
+            None,
+            error.on_error,
+            error.color,
+            Some(error.color),
+            is_checked,
+        ),
+        Status::Hovered { is_checked } => styled(
+            mix(error.color, surface.on_surface, HOVERED_LAYER_OPACITY),
+            Some(Color {
+                a: HOVERED_LAYER_OPACITY,
+                ..error.color
+            }),
+            error.on_error,
+            error.color,
+            Some(error.color),
+            is_checked,
+        ),
+        Status::Disabled { is_checked } => styled(
+            Color {
+                a: DISABLED_CONTAINER_OPACITY,
+                ..surface.on_surface
+            },
+            None,
+            surface.color,
+            Color {
+                a: DISABLED_CONTAINER_OPACITY,
+                ..surface.on_surface
+            },
+            Some(surface.on_surface),
+            is_checked,
+        ),
+    }
+}
diff --git a/crates/material_theme/src/lib.rs b/crates/material_theme/src/lib.rs
index adffe09..2440538 100644
--- a/crates/material_theme/src/lib.rs
+++ b/crates/material_theme/src/lib.rs
@@ -5,6 +5,7 @@ use iced_widget::core::theme::{Base, Style};
 use serde::Deserialize;
 
 pub mod button;
+pub mod checkbox;
 pub mod container;
 #[cfg(feature = "dialog")]
 pub mod dialog;
diff --git a/theme_test/src/main.rs b/theme_test/src/main.rs
index 799d68d..953d4e0 100644
--- a/theme_test/src/main.rs
+++ b/theme_test/src/main.rs
@@ -1,6 +1,8 @@
 use iced::Element;
 use iced::Length::Fill;
-use iced::widget::{button, column, container, pick_list, row, text_input};
+use iced::widget::{
+    button, checkbox, column, container, pick_list, row, text_input,
+};
 use iced_anim::{Animated, Animation, Event};
 use iced_dialog::dialog;
 use material_theme::button::{elevated, filled_tonal, outlined, text};
@@ -26,6 +28,7 @@ enum Message {
     OpenDialog,
     CloseDialog,
     Input(String),
+    CheckBox(bool),
     SwitchTheme(Event<Theme>),
 }
 
@@ -34,6 +37,7 @@ pub struct State {
     theme: Animated<Theme>,
     show_dialog: bool,
     content: String,
+    is_checked: bool,
 }
 
 impl State {
@@ -47,6 +51,7 @@ impl State {
                 self.show_dialog = false;
             }
             Message::Input(content) => self.content = content,
+            Message::CheckBox(is_checked) => self.is_checked = is_checked,
             Message::SwitchTheme(event) => {
                 self.theme.update(event);
             }
@@ -121,7 +126,13 @@ impl State {
                     .placeholder("Select a theme..."),
                     button("Open Dialog").on_press(Message::OpenDialog),
                     text_input("Type something here...", &self.content)
-                        .on_input(Message::Input)
+                        .on_input(Message::Input),
+                    checkbox("Normal", self.is_checked)
+                        .on_toggle(Message::CheckBox),
+                    checkbox("Error", self.is_checked)
+                        .on_toggle(Message::CheckBox)
+                        .style(material_theme::checkbox::error),
+                    checkbox("Disabled", self.is_checked),
                 ]
                 .spacing(10)
             ]