Update Yew to 0.18 (#107)

This commit is contained in:
Cecile Tonglet 2021-05-16 09:51:07 +01:00 committed by GitHub
parent 6616ad81bd
commit 1a2594049c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
26 changed files with 183 additions and 178 deletions

View file

@ -38,8 +38,8 @@ jobs:
- run: rustup install --profile default nightly
# NOTE: we use nightly here to enable the options error_on_line_overflow and
# error_on_unformatted
- run: cargo +nightly fmt -- --check
- uses: actions-rs/clippy-check@v1
with:
token: ${{ secrets.GITHUB_TOKEN }}
args: --all-features -- -D warnings
args: --all-features --workspace -- -D warnings
- run: cargo +nightly fmt -- --check

35
Cargo.lock generated
View file

@ -3100,8 +3100,9 @@ dependencies = [
[[package]]
name = "yew"
version = "0.17.4"
source = "git+https://github.com/yewstack/yew.git?rev=db3170f629f#db3170f629fc91b15c68b12d4204d6f1394520f4"
version = "0.18.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "e4d5154faef86dddd2eb333d4755ea5643787d20aca683e58759b0e53351409f"
dependencies = [
"anyhow",
"anymap",
@ -3127,8 +3128,9 @@ dependencies = [
[[package]]
name = "yew-macro"
version = "0.17.0"
source = "git+https://github.com/yewstack/yew.git?rev=db3170f629f#db3170f629fc91b15c68b12d4204d6f1394520f4"
version = "0.18.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "d6e23bfe3dc3933fbe9592d149c9985f3047d08c637a884b9344c21e56e092ef"
dependencies = [
"boolinator",
"lazy_static",
@ -3139,8 +3141,9 @@ dependencies = [
[[package]]
name = "yew-router"
version = "0.14.0"
source = "git+https://github.com/yewstack/yew.git?rev=db3170f629f#db3170f629fc91b15c68b12d4204d6f1394520f4"
version = "0.15.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "27666236d9597eac9be560e841e415e20ba67020bc8cd081076be178e159c8bc"
dependencies = [
"cfg-if 1.0.0",
"cfg-match",
@ -3159,8 +3162,9 @@ dependencies = [
[[package]]
name = "yew-router-macro"
version = "0.14.0"
source = "git+https://github.com/yewstack/yew.git?rev=db3170f629f#db3170f629fc91b15c68b12d4204d6f1394520f4"
version = "0.15.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "4c0ace2924b7a175e2d1c0e62ee7022a5ad840040dcd52414ce5f410ab322dba"
dependencies = [
"proc-macro2",
"quote",
@ -3170,8 +3174,9 @@ dependencies = [
[[package]]
name = "yew-router-route-parser"
version = "0.14.0"
source = "git+https://github.com/yewstack/yew.git?rev=db3170f629f#db3170f629fc91b15c68b12d4204d6f1394520f4"
version = "0.15.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "de4a67208fb46b900af18a7397938b01f379dfc18da34799cfa8347eec715697"
dependencies = [
"nom",
]
@ -3205,8 +3210,9 @@ dependencies = [
[[package]]
name = "yewtil"
version = "0.3.2"
source = "git+https://github.com/yewstack/yew.git?rev=db3170f629f#db3170f629fc91b15c68b12d4204d6f1394520f4"
version = "0.4.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "8543663ac49cd613df079282a1d8bdbdebdad6e02bac229f870fd4237b5d9aaa"
dependencies = [
"log",
"wasm-bindgen",
@ -3218,8 +3224,9 @@ dependencies = [
[[package]]
name = "yewtil-macro"
version = "0.2.0"
source = "git+https://github.com/yewstack/yew.git?rev=db3170f629f#db3170f629fc91b15c68b12d4204d6f1394520f4"
version = "0.3.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "1433d8554db0f0a87a38aeea190780c1d5f9570384d99a34ab4de1c51d8eb8f3"
dependencies = [
"proc-macro2",
"quote",

View file

@ -11,10 +11,10 @@ crate-type = ["cdylib"]
[dependencies]
wasm-bindgen = "=0.2"
yew = { git = "https://github.com/yewstack/yew.git", rev = "db3170f629f" }
yew = "0.18"
web-sys = { version = "0.3", features = ["Window", "MediaQueryList"] }
yewprint = { path = "../yewprint" }
yew-router = { git = "https://github.com/yewstack/yew.git", rev = "db3170f629f" }
yew-router = "0.15"
# `wee_alloc` is a tiny allocator for wasm that is only ~1K in code size
# compared to the default allocator's ~10K. It is slower than the default

View file

@ -17,6 +17,7 @@ use crate::tabs::*;
use crate::tag::*;
use crate::text::*;
use crate::tree::*;
use std::borrow::Cow;
use yew::prelude::*;
use yew_router::{
agent::{RouteAgentDispatcher, RouteRequest},
@ -114,114 +115,114 @@ impl Component for App {
/>
<MenuItem
text={html!("Button")}
href="#button"
href=Cow::Borrowed("#button")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Button))
/>
<MenuItem
text={html!("ButtonGroup")}
href="#button-group"
href=Cow::Borrowed("#button-group")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::ButtonGroup))
/>
<MenuItem
text={html!("Callout")}
href="#callout"
href=Cow::Borrowed("#callout")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Callout))
/>
<MenuItem
text={html!("Card")}
href="#card"
href=Cow::Borrowed("#card")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Card))
/>
<MenuItem
text={html!("Collapse")}
href="#collapse"
href=Cow::Borrowed("#collapse")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Collapse))
/>
<MenuItem
text={html!("ControlGroup")}
href="#control-group"
href=Cow::Borrowed("#control-group")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::ControlGroup))
/>
<MenuItem
text={html!("Divider")}
href="#divider"
href=Cow::Borrowed("#divider")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Divider))
/>
<MenuItem
text={html!("HtmlSelect")}
href="#html-select"
href=Cow::Borrowed("#html-select")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::HtmlSelect))
/>
<MenuItem
text={html!("Icon")}
href="#icon"
href=Cow::Borrowed("#icon")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Icon))
/>
<MenuItem
text={html!("InputGroup")}
href="#input-group"
href=Cow::Borrowed("#input-group")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::InputGroup))
/>
<MenuItem
text={html!("Menu")}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>
<MenuItem
text={html!("ProgressBar")}
href="#progress-bar"
href=Cow::Borrowed("#progress-bar")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::ProgressBar))
/>
<MenuItem
text={html!("Slider")}
href="#slider"
href=Cow::Borrowed("#slider")
onclick=self.link.callback(|_| Msg::GoToMenu(DocMenu::Slider))
/>
<MenuItem
text={html!("Spinner")}
href="#spinner"
href=Cow::Borrowed("#spinner")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Spinner))
/>
<MenuItem
text={html!("Switch")}
href="#switch"
href=Cow::Borrowed("#switch")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Switch))
/>
<MenuItem
text={html!("Tabs")}
href="#tabs"
href=Cow::Borrowed("#tabs")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Tabs))
/>
<MenuItem
text={html!("Tag")}
href="#tag"
href=Cow::Borrowed("#tag")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Tag))
/>
<MenuItem
text={html!("Text")}
href="#text"
href=Cow::Borrowed("#text")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Text))
/>
<MenuItem
text={html!("Tree")}
href="#tree"
href=Cow::Borrowed("#tree")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Tree))
/>
@ -229,7 +230,7 @@ impl Component for App {
// alphabetically (except for the light switch)
</Menu>
<div class="docs-nav-sponsors">
<a href="https://www.netlify.com">
<a href=Cow::Borrowed("https://www.netlify.com")>
<img
src=netlify_badge
alt="Deploys by Netlify"

View file

@ -1,3 +1,4 @@
use std::borrow::Cow;
use yew::prelude::*;
use yewprint::{Button, ButtonGroup, IconName};
@ -41,7 +42,7 @@ impl Component for Example {
fill=self.props.fill
large=self.props.large
vertical=self.props.vertical
style="margin:0;"
style=Cow::Borrowed("margin:0;")
>
<Button icon=IconName::Database>{"Queries"}</Button>
<Button icon=IconName::Function>{"Functions"}</Button>

View file

@ -1,3 +1,4 @@
use std::borrow::Cow;
use yew::prelude::*;
use yewprint::{Callout, Intent};
@ -34,14 +35,12 @@ impl Component for Example {
}
fn view(&self) -> Html {
let title = if self.props.show_title {
Some("Visually important content")
} else {
None
};
html! {
<Callout title=title without_icon=!self.props.show_icon intent=self.props.intent>
<Callout
title=self.props.show_title.then(|| Cow::Borrowed("Visually important content"))
without_icon=!self.props.show_icon
intent=self.props.intent
>
<p>{"The Callout element's background reflects its intent, if any."}</p>
</Callout>
}

View file

@ -103,7 +103,7 @@ impl Component for Example {
disabled=self.props.disabled
left_icon=IconName::Filter
placeholder={"Filter histogram..."}
value=&self.histogram_value
value=self.histogram_value.clone()
oninput=self.link.callback(|e: InputData| Msg::UpdateHistogram(e.value))
onkeydown=self.link.callback(|e: KeyboardEvent| {
if e.key() == "Enter" { Msg::AddHistogramEntry } else { Msg::Nope }
@ -116,7 +116,7 @@ impl Component for Example {
round=self.props.round
disabled=self.props.disabled
placeholder={"Enter your password..."}
value=&self.password_value
value=self.password_value.clone()
oninput=self.link.callback(|e: InputData| Msg::UpdatePassword(e.value))
onkeydown=self.link.callback(|e: KeyboardEvent| {
if e.key() == "Enter" { Msg::AddPasswordEntry } else { Msg::Nope }
@ -137,7 +137,7 @@ impl Component for Example {
disabled=self.props.disabled
left_icon=IconName::Tag
placeholder={"Find tags"}
value=&self.tags_value
value=self.tags_value.clone()
oninput=self.link.callback(|e: InputData| Msg::UpdateTags(e.value))
onkeydown=self.link.callback(|e: KeyboardEvent| {
if e.key() == "Enter" { Msg::AddTagsEntry } else { Msg::Nope }

View file

@ -1,4 +1,4 @@
#![allow(clippy::redundant_closure, clippy::needless_update)]
#![allow(clippy::redundant_closure, clippy::needless_update, dead_code)]
mod app;
mod button_group;

View file

@ -1,4 +1,5 @@
use crate::app::DocMenu;
use std::borrow::Cow;
use yew::prelude::*;
use yewprint::{Icon, IconName, Menu, MenuDivider, MenuItem};
@ -38,21 +39,21 @@ impl Component for Example {
<MenuItem
icon=IconName::NewTextBox
text={html!{"New text box"}}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>
<MenuItem
icon=IconName::NewObject
text={html!{"New object"}}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>
<MenuItem
icon=IconName::NewLink
text={html!{"New link"}}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>
@ -63,7 +64,7 @@ impl Component for Example {
label=html! {
<Icon icon=IconName::Share />
}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>
@ -74,7 +75,7 @@ impl Component for Example {
icon=IconName::Cut
text={html!("Cut")}
label={html!("Ctrl+X")}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>
@ -82,7 +83,7 @@ impl Component for Example {
icon=IconName::Duplicate
text={html!("Copy")}
label={html!("Ctrl+C")}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>
@ -96,21 +97,21 @@ impl Component for Example {
<MenuItem
icon=IconName::AlignLeft
text={html!("Alignment")}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>
<MenuItem
icon=IconName::Style
text={html!("Style")}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>
<MenuItem
icon=IconName::Asterisk
text={html!("Miscellaneous")}
href="#menu"
href=Cow::Borrowed("#menu")
onclick=self.link
.callback(|_| Msg::GoToMenu(DocMenu::Menu))
/>

View file

@ -1,3 +1,4 @@
use std::borrow::Cow;
use yew::prelude::*;
use yewprint::{Intent, Slider, Tag};
@ -64,8 +65,8 @@ impl Component for Example {
fn view(&self) -> Html {
let percentage_labels = (0..=100)
.step_by(1)
.map(|x| (x, (x % 10 == 0).then(|| format!("{}%", x))))
.collect::<Vec<(i32, Option<String>)>>();
.map(|x| (x, (x % 10 == 0).then(|| format!("{}%", x).into())))
.collect::<Vec<_>>();
html! {
<>
@ -75,23 +76,23 @@ impl Component for Example {
<Slider<f64>
selected=self.float
values=vec![
(0.0, Some(String::from("0"))),
(0.0, Some("0".into())),
(0.1, None),
(0.2, None),
(0.3, None),
(0.4, None),
(0.5, Some(String::from("0.5"))),
(0.5, Some("0.5".into())),
(0.6, None),
(0.7, None),
(0.8, None),
(0.9, None),
(1.0, Some(String::from("1"))),
(1.0, Some("1".into())),
]
intent=self.props.intent
onchange=self.link.callback(|x| Msg::FloatUpdate(x))
/>
<Tag
style="width: 32px; margin-left: 16px"
style=Cow::Borrowed("width: 32px; margin-left: 16px")
minimal=true
intent=self.props.intent
>
@ -102,24 +103,24 @@ impl Component for Example {
values=percentage_labels
selected=self.integer
intent=self.props.intent
value_label=format!("{}%", self.integer)
value_label=Cow::Owned(format!("{}%", self.integer))
onchange=self.link.callback(|x| Msg::IntegerUpdate(x))
/>
<Slider<LogLevel>
values=vec![
(LogLevel::Off, Some("OFF".to_string())),
(LogLevel::Error, Some("ERROR".to_string())),
(LogLevel::Warn, Some("WARN".to_string())),
(LogLevel::Info, Some("INFO".to_string())),
(LogLevel::Debug, Some("DEBUG".to_string())),
(LogLevel::Trace, Some("TRACE".to_string())),
(LogLevel::Off, Some("OFF".into())),
(LogLevel::Error, Some("ERROR".into())),
(LogLevel::Warn, Some("WARN".into())),
(LogLevel::Info, Some("INFO".into())),
(LogLevel::Debug, Some("DEBUG".into())),
(LogLevel::Trace, Some("TRACE".into())),
]
intent=self.props.intent
selected=self.log_level.clone()
onchange=self.link.callback(|x| Msg::LogLevelUpdate(x))
/>
<Slider<()>
values=vec![((), Some("Neo".to_string()))]
values=vec![((), Some("Neo".into()))]
intent=self.props.intent
selected=()
onchange=self.link.callback(|_| Msg::Noop)

View file

@ -90,16 +90,16 @@ crate::build_example_prop_component! {
<Slider<u32>
selected=self.props.size
values={vec![
(10, Some("10".to_string())),
(10, Some("10".into())),
(20, None),
(30, None),
(40, None),
(50, Some("50".to_string())),
(50, Some("50".into())),
(60, None),
(70, None),
(80, None),
(90, None),
(100, Some("100".to_string())),
(100, Some("100".into())),
]}
onchange=self.update_props(|props, size| ExampleProps {
size,

View file

@ -93,7 +93,7 @@ crate::build_example_prop_component! {
}
})
type="text"
value={&self.props.text}
value={self.props.text.clone()}
/>
</div>
}

View file

@ -10,16 +10,11 @@ edition = "2018"
default = ["tree"]
tree = ["id_tree"]
[badges]
travis-ci = { repository = "cecton/yewprint", branch = "main" }
is-it-maintained-issue-resolution = { repository = "cecton/yewprint" }
is-it-maintained-open-issues = { repository = "cecton/yewprint" }
[dependencies]
web-sys = { version = "0.3", features = ["DomRect", "Element"] }
yew = { git = "https://github.com/yewstack/yew.git", rev = "db3170f629f" }
yew = "0.18"
id_tree = { version = "1.7", optional = true }
yewtil = { git = "https://github.com/yewstack/yew.git", rev = "db3170f629f", features = ["pure"] }
yewtil = { version = "0.4", features = ["pure"] }
wasm-bindgen = "0.2"
[build-dependencies]

View file

@ -1,3 +1,4 @@
use std::borrow::Cow;
use yew::prelude::*;
pub struct ButtonGroup {
@ -15,7 +16,7 @@ pub struct ButtonGroupProps {
#[prop_or_default]
pub large: bool,
#[prop_or_default]
pub style: Option<String>,
pub style: Option<Cow<'static, str>>,
#[prop_or_default]
pub children: html::Children,
#[prop_or_default]
@ -54,7 +55,7 @@ impl Component for ButtonGroup {
self.props.vertical.then(|| "bp3-vertical"),
self.props.class.clone(),
)
style?=self.props.style.clone()
style=self.props.style.clone()
>
{self.props.children.clone()}
</div>

View file

@ -1,5 +1,6 @@
use crate::icon::ICON_SIZE_LARGE;
use crate::{Icon, IconName, Intent};
use std::borrow::Cow;
use yew::prelude::*;
pub struct Callout {
@ -17,7 +18,7 @@ pub struct CalloutProps {
#[prop_or_default]
pub intent: Option<Intent>,
#[prop_or_default]
pub title: Option<String>,
pub title: Option<Cow<'static, str>>,
pub children: html::Children,
}
@ -64,7 +65,7 @@ impl Component for Callout {
<div class=classes>
{
icon.iter()
.map(|name| html!{<Icon icon=name icon_size=ICON_SIZE_LARGE/>})
.map(|name| html!{<Icon icon=*name icon_size=ICON_SIZE_LARGE/>})
.collect::<Html>()
}
{

View file

@ -186,7 +186,7 @@ impl Component for Collapse {
self.props.class.clone(),
)
style={content_style}
aria-hidden={!self.render_children}
aria-hidden={(!self.render_children).then(|| "true")}
ref={self.contents_ref.clone()}
>
{

View file

@ -81,7 +81,7 @@ impl<T: Clone + PartialEq + Hash + 'static> Component for HtmlSelect<T> {
};
html! {
<option selected=selected value=value>
<option selected=selected value=value.to_string()>
{label}
</option>
}
@ -102,16 +102,16 @@ impl<T: Clone + PartialEq + Hash + 'static> Component for HtmlSelect<T> {
<select
disabled=self.props.disabled
onchange={self.link.callback(|x| x)}
value?={
value={
self.props.value
.as_ref()
.map(|value| {
let mut hasher = DefaultHasher::new();
value.hash(&mut hasher);
hasher.finish()
hasher.finish().to_string()
})
}
title?={self.props.title.clone()}
title={self.props.title.clone()}
>
{option_children}
</select>

View file

@ -73,17 +73,17 @@ impl Component for Icon {
onclick=self.props.onclick.clone()
>
<svg
fill?={self.props.color.clone()}
fill={self.props.color.clone()}
data-icon={icon_string.clone()}
width={self.props.icon_size}
height={self.props.icon_size}
width={self.props.icon_size.to_string()}
height={self.props.icon_size.to_string()}
viewBox={format!("0 0 {x} {x}", x=pixel_grid_size)}
>
<desc>{self.props.title.clone().unwrap_or(icon_string)}</desc>
{
paths.iter()
.map(|x| html! {
<path d=x fillRule="evenodd" />
<path d=*x fillRule="evenodd" />
})
.collect::<Html>()
}

View file

@ -139,12 +139,12 @@ impl Component for InputGroup {
ref=self.props.input_ref.clone()
class="bp3-input"
type=self.props.input_type.as_str()
placeholder=&self.props.placeholder
placeholder=self.props.placeholder.clone()
disabled=self.props.disabled
oninput={self.props.oninput.clone()}
onkeyup={self.props.onkeyup.clone()}
onkeydown={self.props.onkeydown.clone()}
value=&self.props.value
value=self.props.value.clone()
/>
{
if let Some(right_element) = self.props.right_element.clone() {

View file

@ -1,4 +1,8 @@
#![allow(clippy::redundant_closure, clippy::needless_update)]
#![allow(
clippy::redundant_closure,
clippy::needless_update,
clippy::inconsistent_struct_constructor
)]
mod button_group;
mod buttons;

View file

@ -1,4 +1,5 @@
use crate::{Icon, IconName, Intent, H6};
use std::borrow::Cow;
use yew::prelude::*;
pub struct Menu {
@ -70,7 +71,7 @@ pub struct MenuItemProps {
#[prop_or_default]
pub disabled: bool,
#[prop_or_default]
pub href: Option<String>,
pub href: Option<Cow<'static, str>>,
#[prop_or_default]
pub label: Option<yew::virtual_dom::VNode>,
#[prop_or_default]
@ -119,8 +120,8 @@ impl Component for MenuItem {
.or_else(|| self.props.active.then(|| Intent::Primary)),
self.props.class.clone(),
)
href?={(!self.props.disabled).then(|| self.props.href.clone())}.flatten()
tabIndex?={(!self.props.disabled).then(|| 0)}
href={(!self.props.disabled).then(|| self.props.href.clone())}.flatten()
tabIndex={(!self.props.disabled).then(|| "0")}
onclick={self.props.onclick.clone()}
>
<Icon icon={self.props.icon} />

View file

@ -1,4 +1,5 @@
use crate::Intent;
use std::borrow::Cow;
use wasm_bindgen::closure::Closure;
use wasm_bindgen::JsCast;
use web_sys::Element;
@ -24,9 +25,9 @@ pub struct SliderProps<T: Clone + PartialEq + 'static> {
#[prop_or_default]
pub intent: Option<Intent>,
#[prop_or_default]
pub value_label: Option<String>,
pub value_label: Option<Cow<'static, str>>,
pub onchange: Callback<T>,
pub values: Vec<(T, Option<String>)>,
pub values: Vec<(T, Option<Cow<'static, str>>)>,
pub selected: T,
}
@ -235,7 +236,7 @@ impl<T: Clone + PartialEq + 'static> Component for Slider<T> {
"bp3-slider",
self.props.vertical.then(|| "bp3-vertical"),
)
onmousedown?=(self.props.values.len() > 1).then(
onmousedown=(self.props.values.len() > 1).then(
|| self.link.batch_callback(
|event: MouseEvent| vec![Msg::StartChange, Msg::Mouse(event)]
)

View file

@ -78,21 +78,21 @@ impl Component for Spinner {
class=classes!("bp3-spinner-animation")
>
<svg
width=size
height=size
stroke-width=stroke_width
width=size.to_string()
height=size.to_string()
stroke-width=stroke_width.to_string()
viewBox=view_box
>
<path
class=classes!("bp3-spinner-track")
d=spinner_track
d=spinner_track.clone()
/>
<path
class=classes!("bp3-spinner-head")
d=spinner_track
pathLength=PATH_LENGTH
pathLength=PATH_LENGTH.to_string()
stroke-dasharray=format!("{} {}", PATH_LENGTH, PATH_LENGTH)
stroke-dashoffset=stroke_offset
stroke-dashoffset=stroke_offset.to_string()
/>
</svg>
</div>

View file

@ -4,9 +4,9 @@ use web_sys::HtmlElement;
use yew::prelude::*;
pub struct Tabs<T: Clone + PartialEq + Hash + 'static> {
link: ComponentLink<Self>,
props: TabsProps<T>,
tab_refs: HashMap<u64, NodeRef>,
indicator_ref: NodeRef,
}
#[derive(Clone, PartialEq, Properties)]
@ -34,7 +34,7 @@ impl<T: Clone + PartialEq + Hash + 'static> Component for Tabs<T> {
type Message = ();
type Properties = TabsProps<T>;
fn create(props: Self::Properties, link: ComponentLink<Self>) -> Self {
fn create(props: Self::Properties, _link: ComponentLink<Self>) -> Self {
let tab_refs = props
.tabs
.iter()
@ -49,7 +49,7 @@ impl<T: Clone + PartialEq + Hash + 'static> Component for Tabs<T> {
Tabs {
props,
tab_refs,
link,
indicator_ref: Default::default(),
}
}
@ -66,12 +66,6 @@ impl<T: Clone + PartialEq + Hash + 'static> Component for Tabs<T> {
}
}
fn rendered(&mut self, first_render: bool) {
if first_render && self.props.animate {
self.link.send_message(());
}
}
fn view(&self) -> Html {
let tabs = self
.props
@ -104,28 +98,13 @@ impl<T: Clone + PartialEq + Hash + 'static> Component for Tabs<T> {
>
{
if self.props.animate {
let mut hasher = DefaultHasher::new();
self.props.selected_tab_id.hash(&mut hasher);
let id = hasher.finish();
if let Some(element) = self.tab_refs[&id].cast::<HtmlElement>()
{
let indicator_style = format!(
"height: {}px; width: {}px; \
transform: translateX({}px) translateY({}px);",
element.client_height(),
element.client_width(),
element.offset_left(),
element.offset_top(),
);
html! {
<div class="bp3-tab-indicator-wrapper" style=indicator_style>
<div class="bp3-tab-indicator" />
</div>
}
} else {
html!()
html! {
<div
class="bp3-tab-indicator-wrapper"
ref=self.indicator_ref.clone()
>
<div class="bp3-tab-indicator" />
</div>
}
} else {
html!()
@ -140,31 +119,21 @@ impl<T: Clone + PartialEq + Hash + 'static> Component for Tabs<T> {
"bp3-tab",
props.title_class.clone(),
)
aria-disabled=props.disabled
aria-expanded=selected
aria-selected=selected
aria-disabled=props.disabled.then(|| "true")
aria-expanded=selected.to_string()
aria-selected=selected.to_string()
role="tab"
tabIndex?={
if props.disabled {
Some("0")
} else {
None
}
}
id=title_id
aria-controls=panel_id
data-tab-id=id
onclick?={
if props.disabled {
None
} else {
let tab_id = props.id.clone();
Some(self
.props
.onchange
.reform(move |_| tab_id.clone()))
}
}
tabIndex={(!props.disabled).then(|| "0")}
id=title_id.to_string()
aria-controls=panel_id.to_string()
data-tab-id=id.to_string()
onclick={(!props.disabled).then(|| {
let tab_id = props.id.clone();
self
.props
.onchange
.reform(move |_| tab_id.clone())
})}
key=*id
ref=self.tab_refs[&id].clone()
>
@ -186,10 +155,10 @@ impl<T: Clone + PartialEq + Hash + 'static> Component for Tabs<T> {
"bp3-tab-panel",
props.panel_class.clone(),
)
aria-labelledby=title_id
aria-hidden=!selected
aria-labelledby=title_id.to_string()
aria-hidden=(!selected).then(|| "true")
role="tabpanel"
id=panel_id
id=panel_id.to_string()
key=*id
>
{ props.panel.clone() }
@ -200,6 +169,27 @@ impl<T: Clone + PartialEq + Hash + 'static> Component for Tabs<T> {
</div>
}
}
fn rendered(&mut self, _first_render: bool) {
if self.props.animate {
let mut hasher = DefaultHasher::new();
self.props.selected_tab_id.hash(&mut hasher);
let id = hasher.finish();
let indicator = self.indicator_ref.cast::<HtmlElement>().unwrap();
if let Some(element) = self.tab_refs[&id].cast::<HtmlElement>() {
let indicator_style = format!(
"height: {}px; width: {}px; \
transform: translateX({}px) translateY({}px);",
element.client_height(),
element.client_width(),
element.offset_left(),
element.offset_top(),
);
let _ = indicator.set_attribute("style", &indicator_style);
}
}
}
}
#[derive(Clone, PartialEq)]

View file

@ -1,4 +1,5 @@
use crate::{if_html, Icon, IconName, Intent, Text};
use std::borrow::Cow;
use yew::prelude::*;
pub struct Tag {
@ -35,11 +36,11 @@ pub struct TagProps {
#[prop_or_default]
pub round: bool,
#[prop_or_default]
pub title: Option<String>,
pub title: Option<Cow<'static, str>>,
#[prop_or_default]
pub class: Classes,
#[prop_or_default]
pub style: Option<String>,
pub style: Option<Cow<'static, str>>,
}
impl Component for Tag {
@ -75,7 +76,7 @@ impl Component for Tag {
<button
class=classes!("bp3-tag-remove")
onclick={callback}
tabindex?={self.props.interactive.then(|| 0)}
tabindex={self.props.interactive.then(|| "0")}
>
<Icon icon=IconName::SmallCross />
</button>
@ -95,7 +96,7 @@ impl Component for Tag {
self.props.round.then(|| "bp3-round"),
self.props.class.clone(),
)
style?=self.props.style.clone()
style=self.props.style.clone()
onclick={self.props.onclick.clone()}
>
{icon}

View file

@ -1,3 +1,4 @@
use std::borrow::Cow;
use yew::prelude::*;
pub struct Text {
@ -16,9 +17,9 @@ pub struct TextProps {
#[prop_or_default]
pub inline: bool,
#[prop_or_default]
pub title: Option<String>,
pub title: Option<Cow<'static, str>>,
#[prop_or_default]
pub style: Option<String>,
pub style: Option<Cow<'static, str>>,
}
impl Component for Text {
@ -49,8 +50,8 @@ impl Component for Text {
self.props.class.clone(),
self.props.ellipsize.then (|| "bp3-text-overflow-ellipsis"),
)
style?=self.props.style.clone()
title?=self.props.title.clone()
style=self.props.style.clone()
title=self.props.title.clone()
>
{self.props.children.clone()}
</@>