dioxus_bootstrap_css/
breadcrumb.rs

1use dioxus::prelude::*;
2
3/// Bootstrap Breadcrumb component.
4///
5/// ```rust
6/// rsx! {
7///     Breadcrumb {
8///         BreadcrumbItem { href: "/", "Home" }
9///         BreadcrumbItem { href: "/products", "Products" }
10///         BreadcrumbItem { active: true, "Current Page" }
11///     }
12/// }
13/// ```
14#[derive(Clone, PartialEq, Props)]
15pub struct BreadcrumbProps {
16    /// Additional CSS classes.
17    #[props(default)]
18    pub class: String,
19    /// Child elements (BreadcrumbItem components).
20    pub children: Element,
21}
22
23#[component]
24pub fn Breadcrumb(props: BreadcrumbProps) -> Element {
25    let full_class = if props.class.is_empty() {
26        "breadcrumb".to_string()
27    } else {
28        format!("breadcrumb {}", props.class)
29    };
30
31    rsx! {
32        nav { "aria-label": "breadcrumb",
33            ol { class: "{full_class}", {props.children} }
34        }
35    }
36}
37
38/// A single item in a Breadcrumb.
39#[derive(Clone, PartialEq, Props)]
40pub struct BreadcrumbItemProps {
41    /// Link href. Not rendered if active.
42    #[props(default)]
43    pub href: String,
44    /// Active (current page) state — renders as plain text instead of link.
45    #[props(default)]
46    pub active: bool,
47    /// Additional CSS classes.
48    #[props(default)]
49    pub class: String,
50    /// Child elements.
51    pub children: Element,
52}
53
54#[component]
55pub fn BreadcrumbItem(props: BreadcrumbItemProps) -> Element {
56    let mut classes = vec!["breadcrumb-item".to_string()];
57    if props.active {
58        classes.push("active".to_string());
59    }
60    if !props.class.is_empty() {
61        classes.push(props.class.clone());
62    }
63    let full_class = classes.join(" ");
64
65    if props.active {
66        rsx! {
67            li {
68                class: "{full_class}",
69                "aria-current": "page",
70                {props.children}
71            }
72        }
73    } else {
74        rsx! {
75            li { class: "{full_class}",
76                a { href: "{props.href}", {props.children} }
77            }
78        }
79    }
80}
dioxus_bootstrap_css/breadcrumb.rs

dioxus_bootstrap_css/
breadcrumb.rs
