patternfly_yew/components/
brand.rs

1//! Brand visual
2use yew::prelude::*;
3
4/// Properties for [`Brand`]
5#[derive(PartialEq, Properties)]
6pub struct BrandProperties {
7    pub src: AttrValue,
8    pub alt: AttrValue,
9
10    /// Additional style
11    #[prop_or_default]
12    pub style: AttrValue,
13
14    #[prop_or_default]
15    pub children: ChildrenWithProps<BrandSource>,
16}
17
18#[derive(Clone, PartialEq, Properties)]
19pub struct BrandSourceProperties {
20    #[prop_or_default]
21    /// media selector
22    pub media: Option<String>,
23    /// source
24    pub srcset: AttrValue,
25}
26
27#[function_component(BrandSource)]
28pub fn brand_source(props: &BrandSourceProperties) -> Html {
29    html!(<source media={props.media.clone()} srcset={&props.srcset} />)
30}
31
32/// Brand component
33///
34/// > A **brand** is used to place a product logotype on a screen.
35///
36/// See: <https://www.patternfly.org/components/brand>
37///
38/// Both basic and responsive modes are supported. If the list of sources is empty, then the basic
39/// mode is used. Otherwise it will use the response mode, with the default image as fallback.
40///
41/// The additional style will either be applied to the plain `img` element, or to the `picture`
42/// element in case of the responsive mode.
43///
44/// ## Properties
45///
46/// Defined by [`BrandProperties`].
47#[function_component(Brand)]
48pub fn brand(props: &BrandProperties) -> Html {
49    if props.children.is_empty() {
50        html! (<img class="pf-v6-c-brand" style={&props.style} src={&props.src} alt={&props.alt} />)
51    } else {
52        html! (
53            <picture class="pf-v6-c-brand pf-m-picture" style={&props.style}>
54                { for props.children.iter() }
55                <img class="pf-v6-c-brand" src={&props.src} alt={&props.alt} />
56            </picture>
57        )
58    }
59}
patternfly_yew/components/brand.rs

patternfly_yew/components/
brand.rs
