Skip to main content

dioxus_element_plug/components/
result.rs

1use dioxus::prelude::*;
2
3/// Result icon type
4#[derive(Clone, PartialEq)]
5pub enum ResultType {
6    Success,
7    Warning,
8    Info,
9    Error,
10}
11
12impl ResultType {
13    pub fn as_class(&self) -> &'static str {
14        match self {
15            ResultType::Success => "el-result__icon--success",
16            ResultType::Warning => "el-result__icon--warning",
17            ResultType::Info => "el-result__icon--info",
18            ResultType::Error => "el-result__icon--error",
19        }
20    }
21
22    pub fn as_icon(&self) -> &'static str {
23        match self {
24            ResultType::Success => "✓",
25            ResultType::Warning => "⚠",
26            ResultType::Info => "ℹ",
27            ResultType::Error => "✗",
28        }
29    }
30}
31
32/// Result props
33#[derive(Props, Clone, PartialEq)]
34pub struct ResultProps {
35    #[props(default)]
36    pub children: Option<Element>,
37
38    #[props(default = ResultType::Info)]
39    pub result_type: ResultType,
40
41    #[props(default)]
42    pub title: Option<String>,
43
44    #[props(default)]
45    pub sub_title: Option<String>,
46
47    #[props(default)]
48    pub icon: Option<String>,
49
50    #[props(default)]
51    pub class: Option<String>,
52
53    #[props(default)]
54    pub style: Option<String>,
55}
56
57/// Result component for feedback pages
58#[component]
59pub fn Result(props: ResultProps) -> Element {
60    let mut class_names = vec!["el-result".to_string()];
61    if let Some(ref c) = props.class { class_names.push(c.clone()); }
62    let class_string = class_names.join(" ");
63
64    rsx! {
65        div {
66            class: "{class_string}",
67            style: props.style.clone().unwrap_or_default(),
68            div {
69                class: "el-result__icon {props.result_type.as_class()}",
70                style: "font-size: 64px;",
71                if let Some(ref icon) = props.icon {
72                    i { class: "{icon}" }
73                } else {
74                    "{props.result_type.as_icon()}"
75                }
76            }
77            if let Some(ref title) = props.title {
78                div { class: "el-result__title", h2 { "{title}" } }
79            }
80            if let Some(ref sub) = props.sub_title {
81                div { class: "el-result__subtitle", p { "{sub}" } }
82            }
83            if props.children.is_some() {
84                div { class: "el-result__extra", {props.children} }
85            }
86        }
87    }
88}