Skip to main content

dioxus_tw_components/components/
progressbar.rs

1use dioxus::prelude::*;
2
3#[derive(Clone, PartialEq, Props)]
4pub struct ProgressBarProps {
5    #[props(extends = div, extends = GlobalAttributes)]
6    attributes: Vec<Attribute>,
7
8    children: Element,
9}
10
11#[component]
12pub fn ProgressBar(mut props: ProgressBarProps) -> Element {
13    let default_classes = "progressbar";
14    crate::setup_class_attribute(&mut props.attributes, default_classes);
15
16    rsx! {
17        div { ..props.attributes, {props.children} }
18    }
19}
20
21#[derive(Clone, PartialEq, Props)]
22pub struct ProgressBarInnerProps {
23    #[props(default = 50)]
24    progress: u8,
25
26    #[props(extends = div, extends = GlobalAttributes)]
27    attributes: Vec<Attribute>,
28
29    children: Element,
30}
31
32#[component]
33pub fn ProgressBarInner(mut props: ProgressBarInnerProps) -> Element {
34    let default_classes = "progressbar-inner";
35    crate::setup_class_attribute(&mut props.attributes, default_classes);
36
37    // Avoid ProgressBar's data-style being applied to ProgressBarInner
38    if !props
39        .attributes
40        .iter_mut()
41        .any(|attr| attr.name == "data-style")
42    {
43        props
44            .attributes
45            .push(Attribute::new("data-style", "none", None, true));
46    }
47
48    let progress = if props.progress > 100 {
49        100
50    } else {
51        props.progress
52    };
53
54    rsx! {
55        div {
56            style: "width: {progress}%",
57            ..props.attributes,
58            div { {props.children} }
59        }
60    }
61}
62
63#[derive(Clone, PartialEq, Props)]
64pub struct ProgressLabelProps {
65    #[props(default = 50)]
66    progress: u8,
67    #[props(default = true)]
68    show_percentage: bool,
69
70    #[props(extends = span, extends = GlobalAttributes)]
71    attributes: Vec<Attribute>,
72
73    children: Element,
74}
75
76#[component]
77pub fn ProgressLabel(mut props: ProgressLabelProps) -> Element {
78    let default_classes = "progress-label";
79    crate::setup_class_attribute(&mut props.attributes, default_classes);
80
81    rsx! {
82        span { ..props.attributes,
83            "{props.progress.to_string()}"
84            if props.show_percentage {
85                "%"
86            }
87        }
88    }
89}