Merge branch 'master' into agent-v2

examples/README.md

@@ -3,13 +3,8 @@
 ## How to Run
 
 The examples are built with [trunk](https://github.com/thedodd/trunk).
-You can install it with the following command:
-
-```bash
-cargo install --locked trunk
-```
-
-Running an example is as easy as running a single command:
+Once you have the development envrionment fully set up (see [documentation](https://yew.rs/docs/next/getting-started/introduction)),
+running an example is as easy as running a single command:
 
 ```bash
 # move into the directory of the example you want to run

examples/simple_ssr/src/lib.rs

@@ -18,7 +18,7 @@ async fn fetch_uuid() -> Uuid {
 
 #[function_component]
 fn Content() -> HtmlResult {
-    let uuid = use_prepared_state!(async move |_| -> Uuid { fetch_uuid().await }, ())?.unwrap();
+    let uuid = use_prepared_state!((), async move |_| -> Uuid { fetch_uuid().await })?.unwrap();
 
     Ok(html! {
         <div>{"Random UUID: "}{uuid}</div>

examples/suspense/index.scss

@@ -10,10 +10,10 @@ html, body {
 .layout {
   height: 100vh;
   width: 100%;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
+  display: grid;
+  justify-items: center;
   align-items: center;
+  grid-template-columns: 1fr 1fr;
 }
 
 .content {
@@ -69,3 +69,7 @@ button {
 
   color: rgb(100, 100, 100);
 }
+
+h2 {
+  text-align: center;
+}

examples/suspense/src/main.rs

@@ -1,13 +1,19 @@
 use web_sys::HtmlTextAreaElement;
 use yew::prelude::*;
 
+mod struct_consumer;
 mod use_sleep;
 
-use use_sleep::use_sleep;
+pub use use_sleep::use_sleep;
+
+#[derive(Debug, PartialEq, Properties)]
+struct PleaseWaitProps {
+    from: &'static str,
+}
 
 #[function_component(PleaseWait)]
-fn please_wait() -> Html {
-    html! {<div class="content-area">{"Please wait 5 Seconds..."}</div>}
+fn please_wait(props: &PleaseWaitProps) -> Html {
+    html! {<div class="content-area">{"Please wait 5 Seconds for "}{props.from}{" component to load..."}</div>}
 }
 
 #[function_component(AppContent)]
@@ -20,7 +26,7 @@ fn app_content() -> HtmlResult {
         let value = value.clone();
 
         Callback::from(move |e: InputEvent| {
-            let input: HtmlTextAreaElement = e.target_unchecked_into();
+            let input: HtmlTextAreaElement = e.target_unchecked_into::<HtmlTextAreaElement>();
 
             value.set(input.value());
         })
@@ -41,14 +47,21 @@ fn app_content() -> HtmlResult {
 
 #[function_component(App)]
 fn app() -> Html {
-    let fallback = html! {<PleaseWait />};
+    let fallback_fn = html! {<PleaseWait from="function" />};
+    let fallback_struct = html! {<PleaseWait from="struct" />};
 
     html! {
         <div class="layout">
             <div class="content">
-                <h1>{"Yew Suspense Demo"}</h1>
-                <Suspense fallback={fallback}>
-                    <AppContent />
+                <h2>{"  Yew Suspense Demo -- function component consumer"}</h2>
+                    <Suspense fallback={fallback_fn}>
+                        <AppContent  />
+                    </Suspense>
+            </div>
+            <div class="content">
+                <h2>{"Yew Suspense Demo -- struct component consumer"}</h2>
+                <Suspense fallback={fallback_struct}>
+                        <struct_consumer::AppContent />
                 </Suspense>
             </div>
         </div>

examples/suspense/src/struct_consumer.rs

@@ -0,0 +1,70 @@
+use web_sys::HtmlTextAreaElement;
+use yew::prelude::*;
+
+use crate::use_sleep;
+
+#[function_component]
+pub fn WithSleep<Comp>() -> HtmlResult
+where
+    Comp: BaseComponent<Properties = AppContentProps>,
+{
+    let sleep = use_sleep()?;
+    let sleep = Callback::from(move |_| sleep());
+    Ok(yew::virtual_dom::VChild::<Comp>::new(AppContentProps { resleep: sleep }, None).into())
+}
+
+#[derive(Debug, PartialEq, Properties)]
+pub struct AppContentProps {
+    pub resleep: Callback<()>,
+}
+
+pub type AppContent = WithSleep<BaseAppContent>;
+
+pub enum Msg {
+    ValueUpdate(String),
+    TakeABreak,
+}
+
+pub struct BaseAppContent {
+    value: String,
+}
+
+impl Component for BaseAppContent {
+    type Message = Msg;
+    type Properties = AppContentProps;
+
+    fn create(_ctx: &Context<Self>) -> Self {
+        Self {
+            value: "I am writing a long story...".to_string(),
+        }
+    }
+
+    fn update(&mut self, ctx: &Context<Self>, msg: Self::Message) -> bool {
+        match msg {
+            Msg::ValueUpdate(v) => {
+                self.value = v;
+            }
+            Msg::TakeABreak => {
+                ctx.props().resleep.emit(());
+            }
+        };
+        true
+    }
+
+    fn view(&self, ctx: &Context<Self>) -> Html {
+        let oninput = ctx.link().callback(|e: InputEvent| {
+            let input: HtmlTextAreaElement = e.target_unchecked_into::<HtmlTextAreaElement>();
+            Msg::ValueUpdate(input.value())
+        });
+        let on_take_a_break = ctx.link().callback(|_| Msg::TakeABreak);
+        html! {
+            <div class="content-area">
+                <textarea value={self.value.clone()} {oninput}></textarea>
+                <div class="action-area">
+                    <button onclick={on_take_a_break}>{"Take a break!"}</button>
+                    <div class="hint">{"You can take a break at anytime"}<br />{"and your work will be preserved."}</div>
+                </div>
+            </div>
+        }
+    }
+}

packages/yew-macro/src/derive_props/field.rs

@@ -345,15 +345,7 @@ impl TryFrom<Field> for PropField {
 
 impl PartialOrd for PropField {
     fn partial_cmp(&self, other: &PropField) -> Option<Ordering> {
-        if self.name == other.name {
-            Some(Ordering::Equal)
-        } else if self.name == "children" {
-            Some(Ordering::Greater)
-        } else if other.name == "children" {
-            Some(Ordering::Less)
-        } else {
-            self.name.partial_cmp(&other.name)
-        }
+        Some(self.cmp(other))
     }
 }
 

packages/yew-macro/src/html_tree/html_element.rs

@@ -428,8 +428,9 @@ impl ToTokens for HtmlElement {
                     #[allow(clippy::redundant_clone, unused_braces, clippy::let_and_return)]
                     let mut #vtag = match () {
                         _ if "input".eq_ignore_ascii_case(::std::convert::AsRef::<::std::primitive::str>::as_ref(&#vtag_name)) => {
-                            ::yew::virtual_dom::VTag::__new_textarea(
+                            ::yew::virtual_dom::VTag::__new_input(
                                 #value,
+                                #checked,
                                 #node_ref,
                                 #key,
                                 #attributes,
@@ -465,7 +466,8 @@ impl ToTokens for HtmlElement {
                     // For literal tags this is already done at compile-time.
                     //
                     // check void element
-                    if !::std::matches!(
+                    if ::yew::virtual_dom::VTag::children(&#vtag).is_some() &&
+                       !::std::matches!(
                         ::yew::virtual_dom::VTag::children(&#vtag),
                         ::std::option::Option::Some(::yew::virtual_dom::VNode::VList(ref #void_children)) if ::std::vec::Vec::is_empty(#void_children)
                     ) {
@@ -639,6 +641,9 @@ impl Parse for HtmlElementOpen {
                             if let Some(attr) = props.value.take() {
                                 props.attributes.push(attr);
                             }
+                            if let Some(attr) = props.checked.take() {
+                                props.attributes.push(attr);
+                            }
                         }
                     }
                 }

packages/yew-macro/src/use_prepared_state.rs

@@ -12,13 +12,8 @@ pub struct PreparedState {
 
 impl Parse for PreparedState {
     fn parse(input: ParseStream) -> syn::Result<Self> {
-        // Reads a closure.
-        let expr: Expr = input.parse()?;
-
-        let closure = match expr {
-            Expr::Closure(m) => m,
-            other => return Err(syn::Error::new_spanned(other, "expected closure")),
-        };
+        // Reads the deps.
+        let deps = input.parse()?;
 
         input.parse::<Token![,]>().map_err(|e| {
             syn::Error::new(
@@ -27,6 +22,14 @@ impl Parse for PreparedState {
             )
         })?;
 
+        // Reads a closure.
+        let expr: Expr = input.parse()?;
+
+        let closure = match expr {
+            Expr::Closure(m) => m,
+            other => return Err(syn::Error::new_spanned(other, "expected closure")),
+        };
+
         let return_type = match &closure.output {
             ReturnType::Default => {
                 return Err(syn::Error::new_spanned(
@@ -38,9 +41,6 @@ impl Parse for PreparedState {
             ReturnType::Type(_rarrow, ty) => *ty.to_owned(),
         };
 
-        // Reads the deps.
-        let deps = input.parse()?;
-
         if !input.is_empty() {
             let maybe_trailing_comma = input.lookahead1();
 
@@ -107,10 +107,10 @@ impl PreparedState {
 
         match &self.closure.asyncness {
             Some(_) => quote! {
-                ::yew::functional::use_prepared_state_with_suspension::<#rt, _, _, _>(#closure, #deps)
+                ::yew::functional::use_prepared_state_with_suspension::<#rt, _, _, _>(#deps, #closure)
             },
             None => quote! {
-                ::yew::functional::use_prepared_state::<#rt, _, _>(#closure, #deps)
+                ::yew::functional::use_prepared_state::<#rt, _, _>(#deps, #closure)
             },
         }
     }

packages/yew-macro/src/use_transitive_state.rs

@@ -12,13 +12,8 @@ pub struct TransitiveState {
 
 impl Parse for TransitiveState {
     fn parse(input: ParseStream) -> syn::Result<Self> {
-        // Reads a closure.
-        let expr: Expr = input.parse()?;
-
-        let closure = match expr {
-            Expr::Closure(m) => m,
-            other => return Err(syn::Error::new_spanned(other, "expected closure")),
-        };
+        // Reads the deps.
+        let deps = input.parse()?;
 
         input.parse::<Token![,]>().map_err(|e| {
             syn::Error::new(
@@ -27,6 +22,14 @@ impl Parse for TransitiveState {
             )
         })?;
 
+        // Reads a closure.
+        let expr: Expr = input.parse()?;
+
+        let closure = match expr {
+            Expr::Closure(m) => m,
+            other => return Err(syn::Error::new_spanned(other, "expected closure")),
+        };
+
         let return_type = match &closure.output {
             ReturnType::Default => {
                 return Err(syn::Error::new_spanned(
@@ -38,9 +41,6 @@ impl Parse for TransitiveState {
             ReturnType::Type(_rarrow, ty) => *ty.to_owned(),
         };
 
-        // Reads the deps.
-        let deps = input.parse()?;
-
         if !input.is_empty() {
             let maybe_trailing_comma = input.lookahead1();
 
@@ -64,7 +64,7 @@ impl TransitiveState {
         let closure = &self.closure;
 
         quote! {
-            ::yew::functional::use_transitive_state::<#rt, _, _>(#closure, #deps)
+            ::yew::functional::use_transitive_state::<#rt, _, _>(#deps, #closure)
         }
     }
 

packages/yew-macro/tests/hook_macro/use_prepared_state-fail.rs

@@ -5,23 +5,31 @@ use yew_macro::{use_prepared_state_with_closure, use_prepared_state_without_clos
 fn Comp() -> HtmlResult {
     use_prepared_state_with_closure!(123)?;
 
-    use_prepared_state_with_closure!(|_| { todo!() }, 123)?;
+    use_prepared_state_with_closure!(123, |_| { todo!() })?;
 
     use_prepared_state_with_closure!(|_| -> u32 { todo!() })?;
 
+    use_prepared_state_with_closure!(|_| -> u32 { todo!() }, 123)?;
+
     use_prepared_state_with_closure!(async |_| -> u32 { todo!() })?;
 
+    use_prepared_state_with_closure!(|_| { todo!() }, 123)?;
+
     Ok(Html::default())
 }
 
 #[function_component]
 fn Comp2() -> HtmlResult {
     use_prepared_state_without_closure!(123)?;
 
+    use_prepared_state_without_closure!(123, |_| { todo!() })?;
+
     use_prepared_state_without_closure!(|_| { todo!() }, 123)?;
 
     use_prepared_state_without_closure!(|_| -> u32 { todo!() })?;
 
+    use_prepared_state_without_closure!(|_| -> u32 { todo!() }, 123)?;
+
     use_prepared_state_without_closure!(async |_| -> u32 { todo!() })?;
 
     Ok(Html::default())