Mirrors/yewprint
2
0
Fork 0
mirror of https://github.com/yewprint/yewprint synced 2024-11-22 03:23:03 +00:00
Code Issues Projects Releases Packages Wiki Activity

Switch: add inner labels (#126)

Browse source
This commit is contained in:
Lachezar Lechev 2021-12-12 13:19:33 +02:00 committed by GitHub
parent 87fcffdb71
commit fd67f09ba5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 40 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
yewprint-doc/src/switch/example.rs
View file

@ -41,25 +41,28 @@ impl Component for Example {
disabled=self.props.disabled
inline=self.props.inline
large=self.props.large
label=html!("Enabled")
label=html!{<strong>{"Enabled"}</strong>}
/>
<Switch
disabled=self.props.disabled
inline=self.props.inline
large=self.props.large
label=html!(<em>{"Public"}</em>)
label=html!{<em>{"Public"}</em>}
/>
<Switch
disabled=self.props.disabled
inline=self.props.inline
large=self.props.large
label=html!{<strong>{"Cooperative"}</strong>}
checked=true
label=html!{<u>{"Cooperative"}</u>}
/>
<Switch
disabled=self.props.disabled
inline=self.props.inline
large=self.props.large
label=html!(<u>{"Containing Text"}</u>)
label=html!{"Containing Text"}
inner_label_checked={"on".to_string()}
inner_label={"off".to_string()}
/>
</div>
}

33
yewprint/src/switch.rs
View file

@ -20,6 +20,10 @@ pub struct SwitchProps {
pub label: yew::virtual_dom::VNode,
#[prop_or_default]
pub class: Classes,
#[prop_or_default]
pub inner_label_checked: Option<String>,
#[prop_or_default]
pub inner_label: Option<String>,
}
impl Component for Switch {
@ -44,6 +48,34 @@ impl Component for Switch {
}
fn view(&self) -> Html {
let display_label = {
if self.props.inner_label.is_some() || self.props.inner_label_checked.is_some() {
let inner_label = self.props.inner_label.as_deref().unwrap_or_default();
let inner_label_checked = self.props.inner_label_checked.as_ref();
html! {
<>
<div class=classes!("bp3-control-indicator-child")>
<div class=classes!("bp3-switch-inner-text")>
{
if let Some(label_checked) = inner_label_checked {
label_checked.clone()
} else {
inner_label.to_string()
}
}
</div>
</div>
<div class=classes!("bp3-control-indicator-child")>
<div class=classes!("bp3-switch-inner-text")>
{inner_label.to_string()}
</div>
</div>
</>
}
} else {
Html::default()
}
};
html! {
<label
class=classes!(
@ -64,6 +96,7 @@ impl Component for Switch {
<span
class=classes!("bp3-control-indicator")
>
{display_label}
</span>
{self.props.label.clone()}
</label>