patternfly_yew/components/dual_list_selector/control/
button.rs

1//! The DualListSelectorControl component.
2
3use crate::{
4    components::{
5        button::{Button, ButtonVariant},
6        tooltip::Tooltip,
7    },
8    prelude::TooltipProperties,
9};
10use yew::prelude::*;
11
12/// Renders an individual control button for moving selected options between each
13/// dual list selector pane.
14#[derive(Debug, Clone, PartialEq, Properties)]
15pub struct DualListSelectorControlProps {
16    /// Additional classes applied to the dual list selector control.
17    #[prop_or_default]
18    pub class: Classes,
19
20    /// Content to be displayed in a tooltip on hover of control.
21    #[prop_or_default]
22    pub tooltip: Option<AttrValue>,
23
24    /// Additional tooltip properties passed to the tooltip.
25    #[prop_or_default]
26    pub tooltip_props: Option<TooltipProperties>,
27
28    /// Flag indicating the control is disabled.
29    #[prop_or(true)]
30    pub disabled: bool,
31
32    /// Content to be rendered in the dual list selector control.
33    #[prop_or_default]
34    pub children: Html,
35
36    /// Callback fired when dual list selector control is selected.
37    #[prop_or_default]
38    pub onclick: Callback<MouseEvent>,
39}
40
41#[function_component(DualListSelectorControl)]
42pub fn control(props: &DualListSelectorControlProps) -> Html {
43    let button = html! {
44        <Button
45            disabled={props.disabled}
46            variant={ButtonVariant::Plain}
47            tabindex={Some(-1)}
48            onclick={props.onclick.clone()}
49        >
50            { props.children.clone() }
51        </Button>
52    };
53    let inner = if let Some(text) = &props.tooltip {
54        html! {
55            if let Some(props) = &props.tooltip_props {
56                <Tooltip text={text.to_string()} ..props.clone()>{ button }</Tooltip>
57            } else {
58                <Tooltip text={text.to_string()}>{ button }</Tooltip>
59            }
60        }
61    } else {
62        button
63    };
64    html! {
65        <div class={classes!["pf-v6-c-dual-list-selector__controls-item", props.class.clone()]}>
66            { inner }
67        </div>
68    }
69}
patternfly_yew/components/dual_list_selector/control/button.rs

patternfly_yew/components/dual_list_selector/control/
button.rs
