patternfly_yew/components/
hint.rs

1//! Hint
2
3use yew::prelude::*;
4
5/// Properties for [`Hint`]
6#[derive(Clone, PartialEq, Properties)]
7pub struct HintProperties {
8    #[prop_or_default]
9    pub id: AttrValue,
10    #[prop_or_default]
11    pub actions: Option<Html>,
12    #[prop_or_default]
13    pub class: Classes,
14    #[prop_or_default]
15    pub children: Html,
16}
17
18/// Hint component
19///
20/// > A **hint** is in-app messaging that provides a one-step reminder, explanation, or call to action for a page or modal.
21///
22/// See: <https://www.patternfly.org/components/hint>
23///
24/// ## Properties
25///
26/// Defined by [`HintProperties`].
27#[function_component(Hint)]
28pub fn hint(props: &HintProperties) -> Html {
29    let mut class = props.class.clone();
30    class.push("pf-v5-c-hint");
31
32    html! (
33        <div
34            id={props.id.clone()}
35            {class}
36        >
37            if let Some(actions) = &props.actions {
38                <div class="pf-v5-c-hint__actions">{ actions.clone() }</div>
39            }
40            { props.children.clone() }
41        </div>
42    )
43}
44
45/// Properties for [`HintTitle`]
46#[derive(Clone, PartialEq, Properties)]
47pub struct HintTitleProperties {
48    #[prop_or_default]
49    pub id: AttrValue,
50    #[prop_or_default]
51    pub class: Classes,
52    #[prop_or_default]
53    pub children: Html,
54}
55
56/// HintTitle component
57///
58/// ## Properties
59///
60/// Defined by [`HintTitleProperties`].
61#[function_component(HintTitle)]
62pub fn hint_title(props: &HintTitleProperties) -> Html {
63    let mut class = props.class.clone();
64    class.push("pf-v5-c-hint__title");
65
66    html! (
67        <div
68            id={props.id.clone()}
69            {class}
70        >
71            { props.children.clone() }
72        </div>
73    )
74}
75
76/// Properties for [`HintBody`]
77#[derive(Clone, PartialEq, Properties)]
78pub struct HintBodyProperties {
79    #[prop_or_default]
80    pub id: AttrValue,
81    #[prop_or_default]
82    pub class: Classes,
83    #[prop_or_default]
84    pub children: Html,
85}
86
87/// HintBody component
88///
89/// ## Properties
90///
91/// Defined by [`HintBodyProperties`].
92#[function_component(HintBody)]
93pub fn hint_body(props: &HintBodyProperties) -> Html {
94    let mut class = props.class.clone();
95    class.push("pf-v5-c-hint__body");
96
97    html! (
98        <div
99            id={props.id.clone()}
100            {class}
101        >
102            { props.children.clone() }
103        </div>
104    )
105}
106
107/// Properties for [`HintFooter`]
108#[derive(Clone, PartialEq, Properties)]
109pub struct HintFooterProperties {
110    #[prop_or_default]
111    pub id: AttrValue,
112    #[prop_or_default]
113    pub class: Classes,
114    #[prop_or_default]
115    pub children: Html,
116}
117
118/// HintFooter component
119///
120/// ## Properties
121///
122/// Defined by [`HintFooterProperties`].
123#[function_component(HintFooter)]
124pub fn hint_footer(props: &HintFooterProperties) -> Html {
125    let mut class = props.class.clone();
126    class.push("pf-v5-c-hint__footer");
127
128    html! (
129        <div
130            id={props.id.clone()}
131            {class}
132        >
133            { props.children.clone() }
134        </div>
135    )
136}