dioxus_bootstrap_css/icon.rs
1use dioxus::prelude::*;
2
3/// Bootstrap Icon component.
4///
5/// Renders a Bootstrap Icon by name. See https://icons.getbootstrap.com/ for available icons.
6///
7/// # Bootstrap HTML → Dioxus
8///
9/// | HTML | Dioxus |
10/// |---|---|
11/// | `<i class="bi bi-search">` | `Icon { name: "search" }` |
12/// | `<i class="bi bi-shield-lock me-2 fs-4">` | `Icon { name: "shield-lock", class: "me-2 fs-4" }` |
13///
14/// ```rust
15/// rsx! {
16/// Icon { name: "search" }
17/// Icon { name: "shield-lock", class: "me-2 fs-4" }
18/// }
19/// ```
20#[derive(Clone, PartialEq, Props)]
21pub struct IconProps {
22 /// Icon name without the `bi-` prefix (e.g., "search", "shield-lock").
23 pub name: String,
24 /// Additional CSS classes.
25 #[props(default)]
26 pub class: String,
27}
28
29#[component]
30pub fn Icon(props: IconProps) -> Element {
31 let icon_class = if props.class.is_empty() {
32 format!("bi bi-{}", props.name)
33 } else {
34 format!("bi bi-{} {}", props.name, props.class)
35 };
36 rsx! {
37 i { class: "{icon_class}" }
38 }
39}