1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72
use dioxus::prelude::*;
use freya_elements as dioxus_elements;
use freya_hooks::{
use_applied_theme,
BodyTheme,
BodyThemeWith,
};
/// Properties for the [`Body`] component.
#[derive(Props, Clone, PartialEq)]
pub struct BodyProps {
/// Theme override.
pub theme: Option<BodyThemeWith>,
/// Inner children for the Body.
pub children: Element,
/// Spacing for the inner children of the Body.
pub spacing: Option<String>,
/// Padding for the inner children of the Body.
pub padding: Option<String>,
/// Width of the Body.
#[props(default = "fill".to_string())]
pub width: String,
/// Height of the Body.
#[props(default = "fill".to_string())]
pub height: String,
}
/// Usually used to wrap the application root component.
///
/// # Styling
/// Inherits the [`BodyTheme`](freya_hooks::BodyTheme) theme.
///
/// # Example
///
/// ```no_run
/// # use freya::prelude::*;
/// fn app() -> Element {
/// rsx!(
/// Body {
/// label {
/// "Click this"
/// }
/// }
/// )
/// }
/// ```
#[allow(non_snake_case)]
pub fn Body(
BodyProps {
children,
theme,
spacing,
padding,
width,
height,
}: BodyProps,
) -> Element {
let theme = use_applied_theme!(&theme, body);
let BodyTheme { background, color } = theme;
rsx!(
rect {
width,
height,
color: "{color}",
background: "{background}",
spacing,
padding,
{&children}
}
)
}