yew/CHANGELOG and yew Releases

All Versions

Latest Version

0.19.0

Avg Release Cycle

39 days

Latest Release

549 days ago

Changelog History

Page 3

v0.11 Changes
January 06, 2020
🚀 This release aims to lay the groundwork for Yew component libraries and 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 MyComponent;

enum Msg {
    Click,
}

impl Component for MyComponent {
    type Message = Msg;
    type Properties = ();

    fn create(_: Self::Properties, _: ComponentLink<Self>) -> Self {
        MyComponent
    }

    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 MyComponent {
  link: ComponentLink<Self>,
}

enum Msg {
    Click,
}

impl Component for MyComponent {
    type Message = Msg;
    type Properties = ();

    fn create(_: Self::Properties, link: ComponentLink<Self>) -> Self {
        MyComponent { 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

:tada: 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 MyComponent {
    // ...

    fn view(&self) -> Html<Self> {
        html! { /* ... */ }
    }
}
```
After:
```
impl Component for MyComponent {
    // ...

    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.
- ⚡️ 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 to Callback which creates a no-op callback. [[@mdtusz], #793]
  - The html! macro now accepts a Callback for element listeners. [[@jstarry], #777]
```
  struct MyComponent {
      onclick: Callback<ClickEvent>,
  }

  enum Msg {
      Click,
  }

  impl Component for MyComponent {
      type Message = Msg;
      type Properties = ();

      fn create(_: Self::Properties, link: ComponentLink<Self>) -> Self {
          MyComponent {
              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 to ComponentLink. [[@hgzimmerman], #748]
- Allow compilation to wasi target without wasm_bindgen. [[@dunnock], #746]
- AgentLink now implements Clone which enables Future usage without explicit Yew framework support. [[@izissise], #802]
- ComponentLink now implements Clone which enables Future 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);
```
- 🛠 #### 🛠 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 with ComponentLink 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" a Callback. [[@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 from Box<dyn Listener> to Rc<dyn Listener>. [[@jstarry], #786]
- Properties need to implement Clone again in order to improve nested component ergonomics. [[@jstarry], #786]
- Removed send_future method from ComponentLink 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 to callback for clarity. [[@jstarry], #780]
- The ComponentLink send_self and send_self_batch methods have been renamed to send_message and send_message_batch for clarity. [[@jstarry], #780]
- The Agent send_back method has been renamed to callback for clarity. [[@jstarry], #780]
- The VTag children value type has changed from Vec<VNode> to VList. [[@jstarry], #754]
v0.10 Changes
November 11, 2019
- ⚡️ Features
  - Future support :tada: A Component can update following the completion of a Future. Check out this example to see how it works. This approach was borrowed from a fork of Yew called plaster created by [@carlosdp]. [[@hgzimmerman], #717]
  - Added the agent and services features so that this functionality can be disabled (useful if you are switching to using Futures). [[@hgzimmerman], #684]
  - Add ref keyword for allowing a Component 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::prelude::*;

  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 types public to allow other crates to create custom agents. [[@dunnock], #721]
- Component::change will now return false for components that have Component::Properties == (). [[@kellytk], #690]]
- Updated wasm-bindgen dependency to 0.2.54. Please update your wasm-bindgen-cli tool by running cargo 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 for Future support. [[@jstarry], #730]
- Component now has a required view method and automatically implements the Renderable trait. The view method in the Renderable trait has been renamed to render. [[@jstarry], #563]
  
  Before:
```
impl Component for MyComponent {
    type Message = Msg;
    type Properties = ();

    fn create(_: Self::Properties, _: ComponentLink<Self>) -> Self {
        MyComponent {}
    }

    fn update(&mut self, msg: Self::Message) -> ShouldRender {
        true
    }
}

impl Renderable<MyComponent> for MyComponent {
    fn view(&self) -> Html<Self> {
        html! { "hello" }
    }
}
```
  After:
```
impl Component for MyComponent {
    type Message = Msg;
    type Properties = ();

    fn create(_: Self::Properties, _: ComponentLink<Self>) -> Self {
        MyComponent {}
    }

    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 serde Serialize and Deserialize 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 a Result in order to stop panicking on malformed urls. [[@lizhaoxian], #727]
- VTag now is boxed within VNode to shrink the size of its enum representation. [[@hgzimmerman], #675]
v0.9.2 Changes
October 12, 2019
- 🛠 #### 🛠 Fixes
  - Fix yew-macro dependency version
v0.9.1 Changes
October 12, 2019
Happy Canadian Thanksgiving! 🦃
- ⚡️ Features
  - Implemented Default trait for VNode so that unwrap_or_default can be called on Option<Html<Self>>. [[@hgzimmerman], #672]
  - Implemented PartialEq trait for Classes so that is more ergonomic to use Classes type in component props. [[@hgzimmerman], #680]
  - Updated wasm-bindgen dependency to 0.2.50. Please update your wasm-bindgen-cli tool by running cargo install --force --version 0.2.50 -- wasm-bindgen-cli. [[@jstarry], #695]
- 🛠 #### 🛠 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 to 0.4.20 which fixed emscripten builds and unblocked updating wasm-bindgen to 0.2.50. [[@ctaggart], [@jstarry], #683, #694]
  - Cleaned up build warnings for missing dyn keywords. [[@benreyn], #687]
v0.9 Changes
September 27, 2019
- ⚡️ Features
  - New KeyboardService for setting up key listeners on browsers which support the feature. [[@hgzimmerman], #647]
  - ComponentLink can now create a Callback with more than one Message. The Message's will be batched together so that the Component will not be re-rendered more than necessary. [[@stkevintan], #660]
  - Message's to Public Agent's will now be queued if the Agent hasn't finished setting up yet. [[@serzhiio], #596]
  - Agent's can now be connected to without a Callback. Instead of creating a bridge to the agent, create a dispatcher like so: MyAgent::dispatcher(). [[@hgzimmerman], #639]
  - Component's can now accept children in the html! macro. [[@jstarry], #589]
```
// app.rs

html! {
  <MyList name="Grocery List">
    <MyListItem text="Apples" />
  </MyList>
}
```
```
// my_list.rs

use yew::prelude::*;

pub struct MyList(Props);

#[derive(Properties)]
pub struct Props {
    #[props(required)]
    pub name: String,
    pub children: Children<MyListItem>,
}

impl Renderable<MyList> for MyList {
  fn view(&self) -> Html<Self> {
    html! {{
      self.props.children.iter().collect::<Html<Self>>()
    }}
  }
}
```
  - Iterators can now be rendered in the html! macro without using the for keyword. [[@hgzimmerman], #622]
  Before:
```
html! {{
  for self.props.items.iter().map(renderItem)
}}
```
  After:
```
html! {{
  self.props.items.iter().map(renderItem).collect::<Html<Self>>()
}}
```
  - Closures are now able to be transformed into optional Callback properties. [[@Wodann], #612]
  - Improved CSS class ergonomics with new Classes type. [[@DenisKolodin], #585], [[@hgzimmerman], #626]
  - Touch events are now supported <div ontouchstart=|_| Msg::TouchStart> [[@boydjohnson], #584], [[@jstarry], #656]
  - The Component trait now has an mounted method which can be implemented to react to when your components have been mounted to the DOM. [[@hgzimmerman], #583]
  - Additional Fetch options mode, cache, and redirect are now supported [[@davidkna], #579]
  - The derive props macro now supports Properties with lifetimes [[@jstarry], #580]
  - New ResizeService for registering for window size updates [[@hgzimmerman], #577]
- 🛠 #### 🛠 Fixes
  - Fixed JS typo in RenderService. This was causing animation frames to not be dropped correctly. [[@jstarry], #658]
  - Fixed VNode orphaning bug when destroying VTag elements. This caused some Components to not be properly destroyed when they should have been. [[@hgzimmerman], #651]
  - Fix mishandling of Properties where clause in derive_props macro [[@astraw], #640]
- 🚨 Breaking changes
None
v0.8.1 Changes
January 10, 2020
- 🛠 #### 🛠 Fixes
  - Fixed a dependency issue with wasm-bindgen that would cause builds to fail when building for the wasm32-unknown-unknown target.
v0.8 Changes
August 10, 2019
Props! Props! Props!

🚀 This release introduces a more developer friendly way to handle your Component props. Use the new #[derive(Properties)] macro to beef up your props! Property values can now be annotated as #[props(required)] which will enforce that props are present at compile time. This means that your props struct no longer needs to implement Default, so time to clean up all of those prop values you wrapped in Option to have a default value.
- ⚡️ Features
  - html! - Self-closing html tags can now be used: <div class="marker" /> [[@totorigolo], #523]
  - html! - SVG name-spaced tags are now supported! [[@jstarry], #550]
  - Properties can now be required at compile time [[@jstarry], #553]
  - App components can now be mounted with properties [[@jstarry], #567]
  - Apps can now be mounted as the <body> tag [[@jstarry], [@kellytk], #540]
  - Content editable elements can now trigger oninput events [[@tiziano88], #549]
- 🛠 #### 🛠 Fixes
  - html! - Class name order is now preserved which unlocks the use of Semantic UI [[@charvp], #424]
  - html! - Dashed tag names and properties are supported [[@jstarry], #512, #550]
  - html! - All rust keywords can be used as tag attributes [[@jstarry], #550]
  - html! - Support Callback closure with explicit return type [[@totorigolo], #564]
  - html! - Fixed edge case where > token would break parser [[@totorigolo], #565]
  - Performance improvement to the diff engine [[@totorigolo], #539]
  - Properties no longer need to implement the PartialEq, Clone, or Default traits [[@jstarry], #553]
  - Component will not panic if the change method is unimplemented [[@jstarry], #554]
- 🚨 Breaking changes
  - The Component::Properties associated type must implement the new Properties trait [[@jstarry], #553]
  The new Properties trait is what powers the ability to check required props are present at compile time. Use the derive props macro to implement automatically.
```
use yew::Properties;

#[derive(Properties)]
pub struct Props {
  #[props(required)]
  pub value: MyStruct,
}
```
  - Callback props no longer transform into Option types [[@jstarry], #553]
```
html! { <Button on_click=Msg::Click /> }
```
  before:
```
#[derive(PartialEq, Clone, Default)]
pub struct Props {
    on_click: Option<Callback<()>>,
}
```
  after: note the #[props(required)] attribute
```
#[derive(PartialEq, Properties)]
pub struct Props {
    #[props(required)]
    on_click: Callback<()>,
}
```
v0.7 Changes
July 19, 2019
Commas? We don't need no stinkin' commas!

🚀 This release brings a new and improved html! macro for writing JSX-like syntax. Commas and colons are no longer necessary now that the macro is written as a procedural macro.
- ⚡️ Features
  - html!{} is now valid syntax and can be used to render nothing [[@jstarry], #500]
  - Apps can now be built without cargo-web using wasm-bindgen [[@jstarry], #497]
  - Callback now implements Debug [[@DenisKolodin], #485]
  - New utility method for getting the host of the current page [[@DenisKolodin], #509]
- 🛠 #### 🛠 Fixes
  - html! - Commas are no longer necessary for splitting up attributes [[@jstarry], #500]
  - html! - Colons are no longer necessary for denoting a Component tag [[@jstarry], #500]
  - Textarea value can be now be set: <textarea value="content"> [[@DenisKolodin], #476]
  - changed StorageService::restore to take an immutable receiver [[@dermetfan], #480]
  - Fixed a component rendering bug [[@jstarry], #502]
v0.6.1 Changes
November 01, 2019
- #### ⚡️ Features
  - Bring back {}, {*}, and {<number>} capture syntax for tuple structs/enum variants. If your variant or struct doesn't have named fields, you don't need to supply names in the matcher string [116]
  - Allow ! special character in more places.
  - Greatly improve the quality of matcher string parsing errors. [171]
  - Add impl<SW: Switch, T> From<SW> for Route<T>. Now Routes can be created from Switches easily.
  - Allow escaping {, }, and ! special characters by using {{, }}, and !! respectively.
  - Provide a correct error message when attempting to derive Switch for a Unit struct/variant with a capture group.
v0.6 Changes
February 20, 2019
- ⚡️ Features
  - Added start_app convenience method for initializing the app and mounting it to the body [[@DenisKolodin], #462]
  - Added handling of files of input element. There is now a ChangeData::Files variant for the onchange handler [[@DenisKolodin], #464]
  - Added ReaderService to read data from File instances. [[@DenisKolodin], #464, #468]
- 🛠 #### 🛠 Fixes
  - It was impossible to set value attribute for any tag instead of option, because it used inner value of VTag to keep the value for input element. Now value attribute works for options, progress tags, etc.
- 🔮 Examples
  - New example file_upload that prints sizes of uploaded files [[@DenisKolodin], #464]

yew changelog

Rust / Wasm framework for building client web apps

Changelog History

Page 3

v0.11 Changes

Transition Guide

1. Callback syntax

2. Method Renames

3. Drop Generic Types for `Html<Self>` -> `Html`

👯 4. Properties must implement `Clone`

⚡️ Features

v0.10 Changes

⚡️ Features

v0.9.2 Changes

v0.9.1 Changes

⚡️ Features

v0.9 Changes

⚡️ Features

🚨 Breaking changes

v0.8.1 Changes

v0.8 Changes

⚡️ Features

🚨 Breaking changes

v0.7 Changes

⚡️ Features

v0.6.1 Changes

v0.6 Changes

⚡️ Features

🔮 Examples

yew changelog

Rust / Wasm framework for building client web apps

Changelog History Page 3

Transition Guide

1. Callback syntax

2. Method Renames

3. Drop Generic Types for Html<Self> -> Html

👯 4. Properties must implement Clone

⚡️ Features

⚡️ Features

⚡️ Features

⚡️ Features

🚨 Breaking changes

⚡️ Features

🚨 Breaking changes

⚡️ Features

⚡️ Features

🔮 Examples

Changelog History

Page 3

3. Drop Generic Types for `Html<Self>` -> `Html`

👯 4. Properties must implement `Clone`