Skip to main content

dioxus_element_plug/components/
spin.rs

1use dioxus::prelude::*;
2
3/// Spin props
4#[derive(Props, Clone, PartialEq)]
5pub struct SpinProps {
6    #[props(default)]
7    pub children: Option<Element>,
8
9    /// Whether the spinner is visible
10    #[props(default = true)]
11    pub spinning: bool,
12
13    /// Spin size
14    #[props(default = "default".to_string())]
15    pub size: String,
16
17    /// Spin tip text
18    #[props(default)]
19    pub tip: Option<String>,
20
21    /// Additional CSS classes
22    #[props(default)]
23    pub class: Option<String>,
24
25    /// Inline styles
26    #[props(default)]
27    pub style: Option<String>,
28}
29
30/// Spin component for loading states
31#[component]
32pub fn Spin(props: SpinProps) -> Element {
33    let mut class_names = vec!["el-spin".to_string()];
34    if props.spinning { class_names.push("is-spinning".to_string()); }
35    class_names.push(format!("el-spin--{}", props.size));
36    if let Some(ref c) = props.class { class_names.push(c.clone()); }
37    let class_string = class_names.join(" ");
38
39    rsx! {
40        div {
41            class: "{class_string}",
42            style: props.style.clone().unwrap_or_default(),
43            if props.spinning {
44                div {
45                    class: "el-spin__container",
46                    div {
47                        class: "el-spin__indicator",
48                        i { class: "el-icon-loading" }
49                        if let Some(ref tip) = props.tip {
50                            span { class: "el-spin__text", "{tip}" }
51                        }
52                    }
53                }
54            }
55            {props.children}
56        }
57    }
58}