Mirrors/yewprint
2
0
Fork 0
mirror of https://github.com/yewprint/yewprint synced 2024-11-25 04:50:20 +00:00
Code Issues Projects Releases Packages Wiki Activity

Implements Text component with doc example (#40)

Browse source
This commit is contained in:
Benoit Chassignol 2020-10-02 18:44:32 +02:00 committed by GitHub
parent 3149778317
commit 8fdd788d24
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 233 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
yewprint-doc/src/app.rs
View file

@ -4,6 +4,7 @@ use crate::card::*;
use crate::collapse::*;
use crate::icon::*;
use crate::progressbar::*;
use crate::text::*;
use crate::tree::*;
use yew::prelude::*;
@ -137,6 +138,11 @@ impl Component for App {
text={html!("Switch")}
onclick=self.link.callback(|_| Msg::GoToMenu(DocMenu::Switch))
/>
<MenuItem
text={html!("Text")}
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Text))
/>
<MenuItem
text={html!("Tree")}
onclick=self.link.callback(|_| Msg::GoToMenu(DocMenu::Tree))
@ -164,6 +170,7 @@ impl Component for App {
DocMenu::Callout => html!(<CalloutDoc />),
DocMenu::Card => html!(<CardDoc />),
DocMenu::Collapse => html!(<CollapseDoc />),
DocMenu::Text => html!(<TextDoc />),
DocMenu::Tree => html!(<TreeDoc />),
DocMenu::Icon => html!(<IconDoc />),
DocMenu::ProgressBar => html!(<ProgressBarDoc />),
@ -197,6 +204,8 @@ pub enum DocMenu {
ProgressBar,
#[to = "/#switch"]
Switch,
#[to = "/#text"]
Text,
#[to = "/#tree"]
Tree,
#[to = "/"]

4
yewprint-doc/src/buttons/mod.rs
View file

@ -68,7 +68,7 @@ crate::build_example_prop_component! {
<div>
<H5>{"Props"}</H5>
<Switch
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
minimal: !props.minimal,
..props
})
@ -76,7 +76,7 @@ crate::build_example_prop_component! {
label="Minimal"
/>
<Switch
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
fill: !props.fill,
..props
})

14
yewprint-doc/src/callout/mod.rs
View file

@ -68,7 +68,7 @@ crate::build_example_prop_component! {
<H5>{"Props"}</H5>
<div>
<Switch
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
show_icon: !props.show_icon,
..props
})
@ -76,7 +76,7 @@ crate::build_example_prop_component! {
label="Show/hide icon"
/>
<Switch
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
show_title: !props.show_title,
..props
})
@ -86,14 +86,14 @@ crate::build_example_prop_component! {
<p>{"Select intent:"}</p>
<Menu>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: None,
..props
})
text=html!{"None"}
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: Some(Intent::Primary),
..props
})
@ -101,7 +101,7 @@ crate::build_example_prop_component! {
intent=Intent::Primary
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: Some(Intent::Success),
..props
})
@ -109,7 +109,7 @@ crate::build_example_prop_component! {
intent=Intent::Success
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: Some(Intent::Warning),
..props
})
@ -117,7 +117,7 @@ crate::build_example_prop_component! {
intent=Intent::Warning
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: Some(Intent::Danger),
..props
})

12
yewprint-doc/src/card/mod.rs
View file

@ -67,7 +67,7 @@ crate::build_example_prop_component! {
<H5>{"Props"}</H5>
<div>
<Switch
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
interactive: !props.interactive,
..props
})
@ -77,35 +77,35 @@ crate::build_example_prop_component! {
<p>{"Elevation:"}</p>
<Menu>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
elevation: Elevation::Level0,
..props
})
text=html!{"Level 0"}
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
elevation: Elevation::Level1,
..props
})
text=html!{"Level 1"}
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
elevation: Elevation::Level2,
..props
})
text=html!{"Level 2"}
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
elevation: Elevation::Level3,
..props
})
text=html!{"Level 3"}
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
elevation: Elevation::Level4,
..props
})

8
yewprint-doc/src/example.rs
View file

@ -123,12 +123,12 @@ macro_rules! build_example_prop_component {
}
impl $name {
fn update_props(
fn update_props<T>(
&self,
updater: impl Fn($prop_component) -> $prop_component + 'static,
) -> Callback<MouseEvent> {
updater: impl Fn($prop_component, T) -> $prop_component + 'static,
) -> Callback<T> {
let props = self.props.clone();
self.callback.clone().reform(move |_| updater(props.clone()))
self.callback.clone().reform(move |event| updater(props.clone(), event))
}
}
};

1
yewprint-doc/src/lib.rs
View file

@ -7,6 +7,7 @@ mod example;
mod icon;
mod progressbar;
mod switch;
mod text;
mod tree;
pub use app::*;

14
yewprint-doc/src/progressbar/mod.rs
View file

@ -68,7 +68,7 @@ crate::build_example_prop_component! {
<H5>{"Props"}</H5>
<div>
<Switch
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
stripes: !props.stripes,
..props
})
@ -76,7 +76,7 @@ crate::build_example_prop_component! {
label="Stripes"
/>
<Switch
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
animate: !props.animate,
..props
})
@ -86,14 +86,14 @@ crate::build_example_prop_component! {
<p>{"Select intent:"}</p>
<Menu>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: None,
..props
})
text=html!{"None"}
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: Some(Intent::Primary),
..props
})
@ -101,7 +101,7 @@ crate::build_example_prop_component! {
intent=Intent::Primary
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: Some(Intent::Success),
..props
})
@ -109,7 +109,7 @@ crate::build_example_prop_component! {
intent=Intent::Success
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: Some(Intent::Warning),
..props
})
@ -117,7 +117,7 @@ crate::build_example_prop_component! {
intent=Intent::Warning
/>
<MenuItem
onclick=self.update_props(|props| ExampleProps {
onclick=self.update_props(|props, _| ExampleProps {
intent: Some(Intent::Danger),
..props
})

45
yewprint-doc/src/text/example.rs Normal file
View file

@ -0,0 +1,45 @@
use yew::prelude::*;
use yewprint::Text;
pub struct Example {
props: ExampleProps,
}
#[derive(Clone, PartialEq, Properties)]
pub struct ExampleProps {
pub ellipsize: bool,
pub text: String,
}
impl Component for Example {
type Message = ();
type Properties = ExampleProps;
fn create(props: Self::Properties, _link: ComponentLink<Self>) -> Self {
Example { props }
}
fn update(&mut self, _msg: Self::Message) -> ShouldRender {
true
}
fn change(&mut self, props: Self::Properties) -> ShouldRender {
if self.props != props {
self.props = props;
true
} else {
false
}
}
fn view(&self) -> Html {
html! {
<div style="width: 150px; height: 20px">
<Text
ellipsize=self.props.ellipsize
text=&self.props.text
/>
</div>
}
}
}

101
yewprint-doc/src/text/mod.rs Normal file
View file

@ -0,0 +1,101 @@
mod example;
use crate::ExampleContainer;
use example::*;
use yew::prelude::*;
use yewprint::{Switch, H1, H5};
pub struct TextDoc {
callback: Callback<ExampleProps>,
state: ExampleProps,
}
impl Component for TextDoc {
type Message = ExampleProps;
type Properties = ();
fn create(_: Self::Properties, link: ComponentLink<Self>) -> Self {
TextDoc {
callback: link.callback(|x| x),
state: ExampleProps {
ellipsize: false,
text: String::from("Hello, world!"),
},
}
}
fn update(&mut self, msg: Self::Message) -> ShouldRender {
self.state = msg;
true
}
fn change(&mut self, _props: Self::Properties) -> ShouldRender {
true
}
fn view(&self) -> Html {
let example_props = self.state.clone();
let source = crate::include_raw_html!(
concat!(env!("OUT_DIR"), "/", file!(), ".html"),
"bp3-code-block"
);
html! {
<div>
<H1 class="docs-title">{"Text"}</H1>
<div>
<ExampleContainer
source=source
props=Some(html! {
<TextProps
callback={self.callback.clone()}
props=example_props.clone()
/>
})
>
<Example with example_props />
</ExampleContainer>
</div>
</div>
}
}
}
crate::build_example_prop_component! {
TextProps for ExampleProps =>
fn view(&self) -> Html {
html! {
<div>
<H5>{"Props"}</H5>
<Switch
onclick=self.update_props(|props, _| ExampleProps {
ellipsize: !props.ellipsize,
..props
})
checked=self.props.ellipsize
label="Ellipsize"
/>
<input
class="bp3-input"
onchange=self.update_props(|props, e|
match e {
ChangeData::Value(text) => {
ExampleProps {
text,
..props
}
},
_ => {
ExampleProps {
text: "Hello, world!".to_string(),
..props
}
}
})
type="text"
value={&self.props.text}
/>
</div>
}
}
}

2
yewprint/src/lib.rs
View file

@ -7,6 +7,7 @@ mod icon;
mod menu;
mod progressbar;
mod switch;
mod text;
#[cfg(feature = "tree")]
mod tree;
@ -21,6 +22,7 @@ pub use id_tree;
pub use menu::*;
pub use progressbar::*;
pub use switch::*;
pub use text::*;
#[cfg(feature = "tree")]
pub use tree::*;

49
yewprint/src/text.rs Normal file
View file

@ -0,0 +1,49 @@
use crate::ConditionalClass;
use yew::prelude::*;
pub struct Text {
props: Props,
}
#[derive(Clone, PartialEq, Properties)]
pub struct Props {
#[prop_or_default]
pub ellipsize: ConditionalClass,
#[prop_or_default]
pub text: String,
}
impl Component for Text {
type Message = ();
type Properties = Props;
fn create(props: Self::Properties, _link: ComponentLink<Self>) -> Self {
Text { props }
}
fn update(&mut self, _msg: Self::Message) -> ShouldRender {
true
}
fn change(&mut self, props: Self::Properties) -> ShouldRender {
if self.props != props {
self.props = props;
true
} else {
false
}
}
fn view(&self) -> Html {
html! {
<p
class=(
"bp3-text",
self.props.ellipsize.map_some("bp3-text-overflow-ellipsis"),
)
>
{self.props.text.clone()}
</p>
}
}
}