yew_bs/components/
spacing.rs

1use yew::prelude::*;
2#[derive(Clone, Copy, PartialEq, Debug)]
3pub enum SpacingSize {
4    Size0,
5    Size1,
6    Size2,
7    Size3,
8    Size4,
9    Size5,
10    Auto,
11}
12impl SpacingSize {
13    pub fn as_str(&self) -> &'static str {
14        match self {
15            SpacingSize::Size0 => "0",
16            SpacingSize::Size1 => "1",
17            SpacingSize::Size2 => "2",
18            SpacingSize::Size3 => "3",
19            SpacingSize::Size4 => "4",
20            SpacingSize::Size5 => "5",
21            SpacingSize::Auto => "auto",
22        }
23    }
24}
25/// Margin spacing options available in Bootstrap
26#[derive(Clone, Copy, PartialEq, Debug)]
27pub enum MarginSpacing {
28    M(SpacingSize),
29    MT(SpacingSize),
30    MB(SpacingSize),
31    MS(SpacingSize),
32    ME(SpacingSize),
33    MX(SpacingSize),
34    MY(SpacingSize),
35}
36impl MarginSpacing {
37    pub fn as_str(&self) -> String {
38        match self {
39            MarginSpacing::M(size) => format!("m-{}", size.as_str()),
40            MarginSpacing::MT(size) => format!("mt-{}", size.as_str()),
41            MarginSpacing::MB(size) => format!("mb-{}", size.as_str()),
42            MarginSpacing::MS(size) => format!("ms-{}", size.as_str()),
43            MarginSpacing::ME(size) => format!("me-{}", size.as_str()),
44            MarginSpacing::MX(size) => format!("mx-{}", size.as_str()),
45            MarginSpacing::MY(size) => format!("my-{}", size.as_str()),
46        }
47    }
48}
49/// Padding spacing options available in Bootstrap
50#[derive(Clone, Copy, PartialEq, Debug)]
51pub enum PaddingSpacing {
52    P(SpacingSize),
53    PT(SpacingSize),
54    PB(SpacingSize),
55    PS(SpacingSize),
56    PE(SpacingSize),
57    PX(SpacingSize),
58    PY(SpacingSize),
59}
60impl PaddingSpacing {
61    pub fn as_str(&self) -> String {
62        match self {
63            PaddingSpacing::P(size) => format!("p-{}", size.as_str()),
64            PaddingSpacing::PT(size) => format!("pt-{}", size.as_str()),
65            PaddingSpacing::PB(size) => format!("pb-{}", size.as_str()),
66            PaddingSpacing::PS(size) => format!("ps-{}", size.as_str()),
67            PaddingSpacing::PE(size) => format!("pe-{}", size.as_str()),
68            PaddingSpacing::PX(size) => format!("px-{}", size.as_str()),
69            PaddingSpacing::PY(size) => format!("py-{}", size.as_str()),
70        }
71    }
72}
73/// Props for the Spacing component
74#[derive(Properties, PartialEq)]
75pub struct SpacingProps {
76    /// Margin spacing to apply
77    #[prop_or_default]
78    pub margin: Option<MarginSpacing>,
79    /// Padding spacing to apply
80    #[prop_or_default]
81    pub padding: Option<PaddingSpacing>,
82    /// The child elements to be spaced
83    #[prop_or_default]
84    pub children: Children,
85    /// Additional CSS classes to apply
86    #[prop_or_default]
87    pub class: Option<AttrValue>,
88}
89/// A utility component for applying Bootstrap spacing utilities
90///
91/// The Spacing component provides easy access to Bootstrap's margin and padding
92#[function_component(Spacing)]
93pub fn spacing(props: &SpacingProps) -> Html {
94    let mut classes = Classes::new();
95    if let Some(margin) = &props.margin {
96        classes.push(margin.as_str());
97    }
98    if let Some(padding) = &props.padding {
99        classes.push(padding.as_str());
100    }
101    if let Some(custom_class) = &props.class {
102        classes.push(custom_class.to_string());
103    }
104    html! {
105        < div class = { classes } > { for props.children.iter() } </ div >
106    }
107}