dioxus_bulma/components/
box_.rs

1use dioxus::prelude::*;
2use crate::utils::build_class;
3
4/// A Bulma `Box` element — a simple white-on-grey container with a subtle border-radius and shadow.
5///
6/// See <https://bulma.io/documentation/elements/box/>.
7///
8/// Note: the type is named `BulmaBox` because `Box` collides with Rust's built-in
9/// `Box<T>` smart pointer. The component is also re-exported as `Box` for convenience
10/// in modules where `std::boxed::Box` is not used directly; prefer `BulmaBox` in new code
11/// to avoid ambiguity.
12#[derive(Props, Clone, PartialEq)]
13pub struct BulmaBoxProps {
14    #[props(default)]
15    pub onclick: Option<EventHandler<MouseEvent>>,
16    #[props(default)]
17    pub id: Option<String>,
18    #[props(default)]
19    pub class: Option<String>,
20    #[props(default)]
21    pub style: Option<String>,
22    pub children: Element,
23}
24
25#[component]
26pub fn BulmaBox(props: BulmaBoxProps) -> Element {
27    let base_classes = vec!["box"];
28    let optional_classes = vec![props.class.clone()];
29    let final_class = build_class(&base_classes, &optional_classes);
30    let box_style = props.style.as_deref().unwrap_or("");
31
32    rsx! {
33        div {
34            class: "{final_class}",
35            style: "{box_style}",
36            id: props.id.clone(),
37            onclick: move |evt| {
38                if let Some(handler) = &props.onclick {
39                    handler.call(evt);
40                }
41            },
42            {props.children}
43        }
44    }
45}
46
47/// A Bulma `Block` element — a simple spacer block used to add consistent vertical
48/// rhythm between elements. See <https://bulma.io/documentation/elements/block/>.
49#[derive(Props, Clone, PartialEq)]
50pub struct BlockProps {
51    #[props(default)]
52    pub id: Option<String>,
53    #[props(default)]
54    pub class: Option<String>,
55    #[props(default)]
56    pub style: Option<String>,
57    pub children: Element,
58}
59
60#[component]
61pub fn Block(props: BlockProps) -> Element {
62    let base_classes = vec!["block"];
63    let optional_classes = vec![props.class.clone()];
64    let final_class = build_class(&base_classes, &optional_classes);
65    let block_style = props.style.as_deref().unwrap_or("");
66
67    rsx! {
68        div {
69            class: "{final_class}",
70            style: "{block_style}",
71            id: props.id.clone(),
72            {props.children}
73        }
74    }
75}
dioxus_bulma/components/box_.rs

dioxus_bulma/components/
box_.rs
