Releases: yewstack/yew
v0.14.1
v0.14.0
Happy 🥧 (PI) Day! This release brings a number of bug fixes for web-sys
apps and ergonomic improvements to the API. Huge thanks to the community for diving into the migration from stdweb
to web-sys
so quickly and uncovering these issues!
Changelog
-
⚡️ Features
- Implemented
Clone
forWebSocketStatus
. [@kellytk, #1023] - Improved ergonomics for message APIs by accepting
Into<Msg>
. [@captain-yossarian, #999] html!
improved compiler messages and flexible syntax forwith props
. [@captain-yossarian, #960]
- Implemented
-
🛠 Fixes
- Fixed panic in
stdweb
ResizeService
event handling. [@nicklaswj, #1014] - Removed build check for OS compatibility. [@jstarry, #1019]
- Fixed interval and timer usage in
web-sys
workers by updatinggloo
. [@jstarry, #1018] - Send
Connected
message for Public agents. [@TheNeikos, #1007] - Fixed
web-sys
Public / Private agent initialization. [@jstarry, #1006] - Fixed websocket 'text' message handling for
web-sys
agents. [@jstarry, #1005]
- Fixed panic in
-
🚨 Breaking changes
FetchError::FetchFailed
enum variant now wraps aString
to hold the failure reason. [@jstarry, #1025]- Message APIs now accept
Into<Msg>
, so callingmsg.into()
will cause compile errors. [@captain-yossarian, #999]
v0.13.2
v0.13.1
v0.13.0
web-sys
support has arrived!
@daxpedda spear-headed the effort and courageously integrated web-sys
while maintaining support for stdweb
through no small amount of cfg
macro usage. We chose to continue support for apps built with stdweb
because the dev experience is still quite a bit better (Unfortunately cargo-web
is incompatible with web-sys
). However, the Yew team recognizes that the future of cargo-web
of stdweb
are uncertain. For this reason, we recommend devs start making the switch over to web-sys
and wasm-bindgen
. We will likely invest in improving the dev experience with these tools so that switching over is eventually a no-brainer. Please reach out with ideas and feedback for this migration through Github issues and in our Gitter chatroom!
After upgrading to v0.13, devs will now have to opt in to either stdweb
or web-sys
by using either the "web_sys"
or "std_web"
on the yew
crate in their Cargo.toml
.
# Choose `stdweb`
yew = { version = "0.13", features = ["std_web"] }
# Choose `web-sys`
yew = { version = "0.13", features = ["web_sys"] }
Lastly, take note that API docs on https://docs.rs/yew will be using the "web_sys"
feature. For "std_web"
docs, please visit https://docs.rs/yew-stdweb.
Changelog
-
⚡️ Features
-
Added support for building apps with
web-sys
. [@daxpedda, #961] -
Properties 2.0 [@AlephAlpha, #975]
Component properties are now assumed to be required unless otherwise annotated with a default value. Check out the proposal issue #928 for more details!
-
-
🛠 Fixes
- Fixed
Component
children re-rendering bug. [@jstarry, #980] - Fixed panic when interacting with agents after receiving an agent message. [@jstarry, #981]
- Fixed panic when a component with a root
VRef
node is detached. [@jstarry, #983] - Fixed annoying warning when a component with a root
VTag
node is detached. [@jstarry, #983]
- Fixed
-
🚨 Breaking changes
- Changed
Properties
macro behavior. Check out the proposal issue #928 for more details! [@AlephAlpha, #975] - Cleaned up exported apis and doc visibility. [@jstarry, #977]
ReaderService
methods now return aResult
instead of panicking. [@daxpedda, #868]FetchService
methods now return aResult
instead of panicking. [@daxpedda, #867]StorageService
methods now return aResult
instead of panicking. [@daxpedda, #827]
- Changed
v0.12.0
Happy (belated) Valentine's Day for all who
-
⚡️ Features
- Improved ergonomics for
html! { for .. }
. [@jstarry, #875] - Added
#[props(default = "fn_path")]
for specifying a default property value. [@AlephAlpha, #881] - Exposed the macros for creating format types. [@ctm, #883]
- Added support for binary-only and text-only formats in
WebSocketService
. [@ctm, #851] - Implemented
PartialEq
forChildrenRenderer
to allowchildren
comparison. [@jstarry, #916] - Reduced restrictions on
ComponentLink
methods to improveFuture
support. [@jplatte, #931] - Added
referrer
,referrer_policy
andintegrity
toFetchOptions
. [@leo-lb, #931]
- Improved ergonomics for
-
🛠 Fixes
-
🚨 Breaking changes
v0.11.0
This release aims to lay the groundwork for Yew component libraries as well as clean up the API for the ever elusive 1.0 release 😜
Transition Guide
This release comes with a lot of breaking changes. We understand it's a hassle to update projects but the Yew team felt it was necessary to rip a few bandaids off now as we approach a 1.0 release in the (hopefully) near future. To ease the transition, here's a guide which outlines the main refactoring you will need to do for your project. (Note: all of the changes are reflected in the many example projects if you would like a proper reference example)
1. Callback syntax
This is the main painful breaking change. It applies to both element listeners as well as Component
callback properties. A good rule of thumb is that your components will now have to retain a ComponentLink
to create callbacks on demand or initialize callbacks in your component's create()
method.
Before:
struct Model;
enum Msg {
Click,
}
impl Component for Model {
type Message = Msg;
type Properties = ();
fn create(_: Self::Properties, _: ComponentLink<Self>) -> Self {
Model
}
fn update(&mut self, msg: Self::Message) -> ShouldRender {
match msg {
Msg::Click => true,
}
}
fn view(&self) -> Html<Self> {
// BEFORE: Callbacks were created implicitly from this closure syntax
html! {
<button onclick=|_| Msg::Click>{ "Click me!" }</button>
}
}
}
After:
struct Model {
link: ComponentLink<Self>,
}
enum Msg {
Click,
}
impl Component for Model {
type Message = Msg;
type Properties = ();
fn create(_: Self::Properties, link: ComponentLink<Self>) -> Self {
Model { link }
}
fn update(&mut self, msg: Self::Message) -> ShouldRender {
match msg {
Msg::Click => true,
}
}
fn view(&self) -> Html {
// AFTER: Callbacks need to be explicitly created now
let onclick = self.link.callback(|_| Msg::Click);
html! {
<button onclick=onclick>{ "Click me!" }</button>
}
}
}
If a closure has a parameter you will now need to specify the parameter's type. A tip for finding the appropriate type is to search Yew's repo for the HTML attribute the closure is assigned to.
For example, onkeydown
of <button>
:
let onkeydown = self.link.callback(|e: KeyDownEvent| {
// ...
});
and
html! {
<button onkeydown=onkeydown type="button">
{ "button" }
</button>
}
2. Method Renames
It should be safe to do a project-wide find/replace for the following:
send_self(
->send_message(
send_back(
->callback(
response(
->respond(
AgentUpdate
->AgentLifecycleEvent
These renames will probably require some more care:
fn handle(
->fn handle_input(
(for Agent trait implementations)
3. Drop Generic Types for Html<Self>
-> Html
🎉 We are pretty excited about this change! The generic type parameter
was confusing and restrictive and is now a thing of the past!
Before:
impl Component for Model {
// ...
fn view(&self) -> Html<Self> {
html! { /* ... */ }
}
}
After:
impl Component for Model {
// ...
fn view(&self) -> Html {
html! { /* ... */ }
}
}
4. Properties must implement Clone
In yew v0.8 we removed the requirement that component properties implement Clone
and in this release we are adding the requirement again. This change is needed
to improve the ergonomics of nested components. The only time properties will be
cloned is when a wrapper component re-renders nested children components.
Changelog
-
⚡️ Features
- Added
html_nested!
macro to support nested iterable children access. [[@trivigy], #843] - Added
bincode
to the list of supported formats. [[@serzhiio], #806] - Added a
noop()
convenience method toCallback
which creates a no-op callback. [[@mdtusz], #793] - The
html!
macro now accepts aCallback
for element listeners. [[@jstarry], #777]
struct Model { onclick: Callback<ClickEvent>, } enum Msg { Click, } impl Component for Model { type Message = Msg; type Properties = (); fn create(_: Self::Properties, link: ComponentLink<Self>) -> Self { Model { onclick: link.callback(|_| Msg::Click), } } fn update(&mut self, msg: Self::Message) -> ShouldRender { match msg { Msg::Click => true, } } fn view(&self) -> Html { html! { <button onclick=&self.onclick>{ "Click me!" }</button> } } }
- Add
send_message_batch
method toComponentLink
. [[@hgzimmerman], #748] - Allow compilation to
wasi
target withoutwasm_bindgen
. [[@dunnock], #746] AgentLink
now implementsClone
which enablesFuture
usage without explicit Yew framework support. [[@izissise], #802]ComponentLink
now implementsClone
which enablesFuture
usage without explicit Yew framework support. [[@hgzimmerman], #749]
use wasm_bindgen::JsValue; use wasm_bindgen_futures::future_to_promise; // future must implement `Future<Output = Component::Message> + 'static` let link = self.link.clone(); let js_future = async move { link.send_message(future.await); Ok(JsValue::NULL) }; future_to_promise(js_future);
- Added
-
🛠 Fixes
- Fixed handling of boolean tag attributes. [[@mrh0057], #840]
- Improved nested component ergonomics. [[@jstarry], #780]
fn view(&self) -> Html { html! { <Wrapper> // This is now valid. (before #780, this would cause a lifetime // compile error because children nodes were moved into a closure) <Nested on_click=&self.nested_on_click /> </Wrapper> } }
- Creating a
Callback
withComponentLink
is no longer restricted to mutable references, improving ergonomics. [[@jstarry], #780] - The
Callback
reform
method no longer consumes self making it easier to "reverse map" aCallback
. [[@jstarry], #779]
pub struct ListHeader { props: Props, } #[derive(Properties, Clone)] pub struct Props { #[props(required)] pub on_hover: Callback<Hovered>, #[props(required)] pub text: String, } impl Component for ListHeader { type Message = (); type Properties = Props; fn create(props: Self::Properties, _: ComponentLink<Self>) -> Self { ListHeader { props } } fn update(&mut self, _: Self::Message) -> ShouldRender { false } fn view(&self) -> Html { let onmouseover = self.props.on_hover.reform(|_| Hovered::Header); html! { <div class="list-header" onmouseover=onmouseover> { &self.props.text } </div> } } }
- Reduced allocations in the
Classes
to_string
method. [[@hgzimmerman], #772] - Empty string class names are now filtered out to prevent panics. [[@jstarry], #770]
-
🚨 Breaking changes
- Components with generic args now need to be closed with the full type path. (e.g.
html! { <Wrapper<String>></Wrapper<String>>}
) [[@jstarry], #837] - Changed
VTag
listener type fromBox<dyn Listener>
toRc<dyn Listener>
. [[@jstarry], #786] Properties
need to implementClone
again in order to improve nested component ergonomics. [[@jstarry], #786]- Removed
send_future
method fromComponentLink
since it is no longer necessary for using Futures with Yew. [[@hgzimmerman], #799] - Removed generic type parameter from
Html
and all virtual node types:VNode
,VComp
,VTag
,VList
,VText
, etc. [[@jstarry], #783] - Removed support for macro magic closure syntax for element listeners. (See transition guide for how to pass a
Callback
explicitly instead). [[@jstarry], #782] - Renamed
Agent
methods and event type for clarity.handle
->handle_input
,AgentUpdate
->AgentLifecycleEvent
,response
->respond
. [[@philip-peterson], #751] - The
ComponentLink
send_back
method has been renamed tocallback
for clarity. [[@jstarry], #780] - The
ComponentLink
send_self
andsend_self_batch
methods have been renamed tosend_message
andsend_message_batch
for clarity. [[@jstarry], #780] - The
Agent
send_back
method has been renamed tocallback
for clarity. [[@jstarry], #780] - The `VT...
- Components with generic args now need to be closed with the full type path. (e.g.
v0.10
Back to the...
-
⚡️ Features
Future
support 🎉 AComponent
can update following the completion of aFuture
. Check out this example to see how it works. This approach was borrowed from a fork of Yew calledplaster
created by @carlosdp. [@hgzimmerman, #717]- Added the
agent
andservices
features so that those modules can be disabled (useful if you are switching to usingFuture
s). [@hgzimmerman, #684] - Add
ref
keyword for allowing aComponent
to have a direct reference to its rendered elements. For example, you can now easily focus an<input>
element after mounting. [@jstarry, #715]
use stdweb::web::html_element::InputElement; use stdweb::web::IHtmlElement; use yew::*; pub struct Input { node_ref: NodeRef, } impl Component for Input { type Message = (); type Properties = (); fn create(_: Self::Properties, _: ComponentLink<Self>) -> Self { Input { node_ref: NodeRef::default(), } } fn mounted(&mut self) -> ShouldRender { if let Some(input) = self.node_ref.try_into::<InputElement>() { input.focus(); } false } fn update(&mut self, _: Self::Message) -> ShouldRender { false } fn view(&self) -> Html<Self> { html! { <input ref=self.node_ref.clone() type="text" /> } } }
- Make
Agent
related typespublic
to allow other crates to create custom agents. [@dunnock, #721] Component::change
will now returnfalse
for components that haveComponent::Properties == ()
. [@kellytk, #690]]- Updated
wasm-bindgen
dependency to0.2.54
. Please update yourwasm-bindgen-cli
tool by runningcargo install --force --version 0.2.54 -- wasm-bindgen-cli
. [@jstarry, #730], [@ctaggart, #681]
-
🛠 Fixes
- Fixed the mount order of components. The root component will be mounted after all descendants have been mounted. [@jstarry, #725]
- All public items now implement
Debug
. [@hgzimmerman, #673]
-
🚨 Breaking changes
-
Minimum rustc version has been bumped to
1.39.0
forFuture
support. [@jstarry, #730] -
Component
now has a requiredview
method and automatically implements theRenderable
trait. Theview
method in theRenderable
trait has been renamed torender
. [@jstarry, #563]Before:
impl Component for Model { type Message = Msg; type Properties = (); fn create(_: Self::Properties, _: ComponentLink<Self>) -> Self { Model {} } fn update(&mut self, msg: Self::Message) -> ShouldRender { true } } impl Renderable<Model> for Model { fn view(&self) -> Html<Self> { html! { "hello" } } }
After:
impl Component for Model { type Message = Msg; type Properties = (); fn create(_: Self::Properties, _: ComponentLink<Self>) -> Self { Model {} } fn update(&mut self, msg: Self::Message) -> ShouldRender { true } fn view(&self) -> Html<Self> { html! { "hello" } } }
-
Removed the
Transferable
trait since it did no more than extend the serdeSerialize
andDeserialize
traits. [@hgzimmerman, #319]Before:
impl Transferable for Input {} #[derive(Serialize, Deserialize)] pub enum Input { Connect, }
After:
#[derive(Serialize, Deserialize)] pub enum Input { Connect, }
-
WebSocketService::connect
will now return aResult
in order to stop panicking on malformed urls. [@lizhaoxian, #727] -
VTag
now is boxed withinVNode
to shrink the size of its enum representation. [@hgzimmerman, #675]
-
v0.9.2
v0.9.1
Happy Canadian Thanksgiving! 🦃
-
⚡️ Features
- Implemented
Default
trait forVNode
so thatunwrap_or_default
can be called onOption<Html<Self>>
. [@hgzimmerman, #672] - Implemented
PartialEq
trait forClasses
so that is more ergonomic to useClasses
type in component props. [@hgzimmerman, #680] - Updated
wasm-bindgen
dependency to0.2.50
. Please update yourwasm-bindgen-cli
tool by runningcargo install --force --version 0.2.50 -- wasm-bindgen-cli
. [@jstarry, #695]
- Implemented
-
🛠 Fixes
- Fixed issue where text nodes were sometimes rendered out of order. [@jstarry, #697]
- Fixed regression introduced in 0.9.0 that prevented tag attributes from updating properly. [@jstarry, #698]
- Fixed emscripten builds by pinning the version for the
ryu
downstream dependency. [@jstarry, #703] - Updated
stdweb
to0.4.20
which fixed emscripten builds and unblocked updatingwasm-bindgen
to0.2.50
. [@ctaggart, @jstarry, #683, #694] - Cleaned up build warnings for missing
dyn
keywords. [@benreyn, #687]