upgrade to yew 0.22, fix #51

Author: jetli

crates/yew-hooks-test/Cargo.toml

@@ -15,4 +15,4 @@ documentation = "https://github.com/jetli/yew-hooks"
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [dependencies]
-yew = { version = "0.21.0", features=["csr"]}
+yew = { version = "0.22.0", features=["csr"]}

crates/yew-hooks/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "yew-hooks"
-version = "0.3.4"
+version = "0.4.0"
 edition = "2021"
 authors = ["Jet Li <jing.i.qin@icloud.com>"]
 categories = ["gui", "wasm", "web-programming"]
@@ -16,7 +16,7 @@ documentation = "https://docs.rs/yew-hooks/"
 
 [dependencies]
 log = "0.4"
-yew = { version = "0.21.0", features = ["csr"] }
+yew = { version = "0.22.0", features = ["csr"] }
 gloo = "0.11"
 wasm-bindgen = "0.2"
 wasm-bindgen-futures = "0.4"

crates/yew-hooks/src/hooks/use_list.rs

@@ -18,7 +18,7 @@ impl<T> UseListHandle<T> {
     /// # Panics
     ///
     /// Panics if the value is currently mutably borrowed
-    pub fn current(&self) -> Ref<Vec<T>> {
+    pub fn current(&'_ self) -> Ref<'_, Vec<T>> {
         self.inner.borrow()
     }
 

crates/yew-hooks/src/hooks/use_map.rs

@@ -19,7 +19,7 @@ impl<K, V> UseMapHandle<K, V> {
     /// # Panics
     ///
     /// Panics if the value is currently mutably borrowed
-    pub fn current(&self) -> Ref<HashMap<K, V>> {
+    pub fn current(&'_ self) -> Ref<'_, HashMap<K, V>> {
         self.inner.borrow()
     }
 

crates/yew-hooks/src/hooks/use_queue.rs

@@ -19,7 +19,7 @@ impl<T> UseQueueHandle<T> {
     /// # Panics
     ///
     /// Panics if the value is currently mutably borrowed
-    pub fn current(&self) -> Ref<VecDeque<T>> {
+    pub fn current(&'_ self) -> Ref<'_, VecDeque<T>> {
         self.inner.borrow()
     }
 

crates/yew-hooks/src/hooks/use_set.rs

@@ -19,7 +19,7 @@ impl<T> UseSetHandle<T> {
     /// # Panics
     ///
     /// Panics if the value is currently mutably borrowed
-    pub fn current(&self) -> Ref<HashSet<T>> {
+    pub fn current(&'_ self) -> Ref<'_, HashSet<T>> {
         self.inner.borrow()
     }
 

examples/yew-app/Cargo.toml

@@ -17,8 +17,8 @@ gloo = "0.11"
 js-sys = "0.3"
 serde = "1"
 reqwest = { version = "0.12.4", features = ["json"] }
-yew = { version = "0.21.0", features = ["csr"] }
-yew-router = { version = "0.18.0" }
+yew = { version = "0.22.0", features = ["csr"] }
+yew-router = { version = "0.19.0" }
 yew-hooks = { path = "../../crates/yew-hooks" }
 wasm-bindgen = "0.2"
 wasm-logger = "0.2.0"

examples/yew-app/src/app/hooks/use_before_unload.rs

@@ -21,9 +21,9 @@ pub fn UseBeforeUnload() -> Html {
         <div class="container">
             <header class="mt-24 text-xl text-center">
                 <div class="space-x-4 space-y-4">
-                    <Button {onclick}>{if *dirty { "Disable" } else { "Enable" }}</Button>
+                    <Button {onclick}>{ if *dirty { html! { "Disable" } } else { html! { "Enable" } } }</Button>
                     <p>
-                        <b>{if *dirty { "Try to reload or close tab." } else { "" }}</b>
+                        <b>{ if *dirty { html! { "Try to reload or close tab." } } else { html! {} } }</b>
                     </p>
                 </div>
             </header>

examples/yew-app/src/app/hooks/use_drop.rs

@@ -31,9 +31,9 @@ pub fn UseDrop() -> Html {
                         (*state.files).as_ref().map_or_else(
                             || html! {},
                             |files| {
-                                html! {for files.iter().map(|file| {
-                                    html! { <p> { file.name() }</p> }
-                                })}
+                                html! { for file in files.iter() {
+                                    <p>{ file.name() }</p>
+                                } }
                             },
                         )
                     }

examples/yew-app/src/app/hooks/use_effect_once.rs

@@ -31,7 +31,7 @@ pub fn UseEffectOnce() -> Html {
         <div class="container">
             <header class="mt-24 text-xl text-center">
                 <div class="space-x-4 space-y-4">
-                    <Button {onclick}>{ *toggle }</Button>
+                    <Button {onclick}>{ html! { *toggle } }</Button>
                     <p>
                         {
                             if *toggle == "Unmount" {