Files
beau-gosse-du-92/src/ui/components/button.rs

118 lines
2.8 KiB
Rust

use dioxus::prelude::*;
use dioxus_free_icons::{Icon, IconShape};
turf::style_sheet!("src/ui/components/button.scss");
#[derive(PartialEq, Clone, Props)]
struct _ButtonProps {
children: Element,
#[props(default = false)]
focus: bool,
id: Option<String>,
onclick: Option<EventHandler<MouseEvent>>,
style: String,
}
macro_rules! svg_text_icon {
($name:ident,$text:literal) => {
#[derive(Copy, Clone, PartialEq)]
struct $name;
impl IconShape for $name {
fn view_box(&self) -> &str {
"0 0 250 50"
}
fn xmlns(&self) -> &str {
"http://www.w3.org/2000/svg"
}
fn child_elements(&self) -> Element {
rsx! {
text {
x: "50%",
y: "50%",
$text
}
}
}
}
};
}
macro_rules! svg_text_button {
($name:ident,$style:ident,$icon:ident) => {
pub fn $name(props: ButtonProps) -> Element {
rsx! {
style { {STYLE_SHEET} },
Button {
id: props.id,
style: {ClassName::$style},
onclick: move |event| {
if let Some(cb) = &props.onclick {
cb.call(event);
}
},
focus: props.focus,
Icon {
icon: $icon,
}
}
}
}
};
}
#[derive(PartialEq, Clone, Props)]
pub struct ButtonProps {
#[props(default = false)]
focus: bool,
id: Option<String>,
onclick: Option<EventHandler<MouseEvent>>,
style: Option<String>,
children: Element,
}
fn Button(props: ButtonProps) -> Element {
rsx! {
style { {STYLE_SHEET} },
button {
id: props.id,
class: props.style,
onmounted: move |evt| async move {
_ = evt.set_focus(props.focus).await;
},
onclick: move |evt| {
if let Some(cb) = &props.onclick {
cb.call(evt);
}
},
{props.children},
},
}
}
svg_text_icon!(RegisterText, "REGISTER");
svg_text_button!(RegisterButton, REGISTER_BUTTON, RegisterText);
svg_text_icon!(LoginText, "LOGIN");
svg_text_button!(LoginButton, LOGIN_BUTTON, LoginText);
svg_text_icon!(SuccessText, "OK");
svg_text_button!(SuccessButton, SUCCESS_BUTTON, SuccessText);
svg_text_icon!(WarningText, "WARNING");
svg_text_button!(WarningButton, WARNING_BUTTON, WarningText);
svg_text_icon!(ErrorText, "ERROR");
svg_text_button!(ErrorButton, ERROR_BUTTON, ErrorText);