dioxus_bootstrap_css/
input_group.rs

1use dioxus::prelude::*;
2
3use crate::types::Size;
4
5/// Bootstrap InputGroup component.
6///
7/// ```rust
8/// rsx! {
9///     InputGroup {
10///         InputGroupText { "@" }
11///         Input { placeholder: "Username" }
12///     }
13///     InputGroup {
14///         Input { placeholder: "Search..." }
15///         InputGroupText {
16///             Button { color: Color::Primary, Icon { name: "search" } }
17///         }
18///     }
19/// }
20/// ```
21#[derive(Clone, PartialEq, Props)]
22pub struct InputGroupProps {
23    /// Input group size.
24    #[props(default)]
25    pub size: Size,
26    /// Additional CSS classes.
27    #[props(default)]
28    pub class: String,
29    /// Child elements (inputs, InputGroupText, buttons).
30    pub children: Element,
31}
32
33#[component]
34pub fn InputGroup(props: InputGroupProps) -> Element {
35    let size_class = match props.size {
36        Size::Md => String::new(),
37        s => format!(" input-group-{s}"),
38    };
39
40    let full_class = if props.class.is_empty() {
41        format!("input-group{size_class}")
42    } else {
43        format!("input-group{size_class} {}", props.class)
44    };
45
46    rsx! {
47        div { class: "{full_class}", {props.children} }
48    }
49}
50
51/// Text addon for InputGroup.
52#[derive(Clone, PartialEq, Props)]
53pub struct InputGroupTextProps {
54    /// Additional CSS classes.
55    #[props(default)]
56    pub class: String,
57    /// Child elements.
58    pub children: Element,
59}
60
61#[component]
62pub fn InputGroupText(props: InputGroupTextProps) -> Element {
63    let full_class = if props.class.is_empty() {
64        "input-group-text".to_string()
65    } else {
66        format!("input-group-text {}", props.class)
67    };
68
69    rsx! {
70        span { class: "{full_class}", {props.children} }
71    }
72}
dioxus_bootstrap_css/input_group.rs

dioxus_bootstrap_css/
input_group.rs
