Add Event Metadata

Cargo.toml

@@ -58,7 +58,7 @@ dioxus-core = { path = "packages/core", version = "0.4.2" }
 dioxus-core-macro = { path = "packages/core-macro", version = "0.4.0"  }
 dioxus-router = { path = "packages/router", version = "0.4.1"  }
 dioxus-router-macro = { path = "packages/router-macro", version = "0.4.1" }
-dioxus-html = { path = "packages/html", version = "0.4.0"  }
+dioxus-html = { path = "packages/html", default-features = false, version = "0.4.0"  }
 dioxus-hooks = { path = "packages/hooks", version = "0.4.0" }
 dioxus-web = { path = "packages/web", version = "0.4.0"  }
 dioxus-ssr = { path = "packages/ssr", version = "0.4.0"  }

examples/compose.rs

@@ -73,7 +73,7 @@ fn compose(cx: Scope<ComposeProps>) -> Element {
 
             input {
                 oninput: move |e| {
-                    user_input.set(e.value.clone());
+                    user_input.set(e.value());
                 },
                 value: "{user_input}"
             }

examples/counter.rs

@@ -22,7 +22,7 @@ fn app(cx: Scope) -> Element {
                     input {
                         value: "{counter}",
                         oninput: move |e| {
-                            if let Ok(value) = e.value.parse::<usize>() {
+                            if let Ok(value) = e.value().parse::<usize>() {
                                 counters.make_mut()[i] = value;
                             }
                         }

examples/crm.rs

@@ -119,7 +119,7 @@ fn ClientAdd(cx: Scope) -> Element {
                         placeholder: "First Name…",
                         required: "",
                         value: "{first_name}",
-                        oninput: move |e| first_name.set(e.value.clone())
+                        oninput: move |e| first_name.set(e.value())
                     }
                 }
 
@@ -135,7 +135,7 @@ fn ClientAdd(cx: Scope) -> Element {
                         placeholder: "Last Name…",
                         required: "",
                         value: "{last_name}",
-                        oninput: move |e| last_name.set(e.value.clone())
+                        oninput: move |e| last_name.set(e.value())
                     }
                 }
 
@@ -149,7 +149,7 @@ fn ClientAdd(cx: Scope) -> Element {
                         id: "description",
                         placeholder: "Description…",
                         value: "{description}",
-                        oninput: move |e| description.set(e.value.clone())
+                        oninput: move |e| description.set(e.value())
                     }
                 }
 

examples/file_upload.rs

@@ -16,7 +16,7 @@ fn App(cx: Scope) -> Element {
                 r#type: "checkbox",
                 checked: "{enable_directory_upload}",
                 oninput: move |evt| {
-                    enable_directory_upload.set(evt.value.parse().unwrap());
+                    enable_directory_upload.set(evt.value().parse().unwrap());
                 },
             },
             "Enable directory upload"
@@ -30,7 +30,7 @@ fn App(cx: Scope) -> Element {
             onchange: |evt| {
                 to_owned![files_uploaded];
                 async move {
-                    if let Some(file_engine) = &evt.files {
+                    if let Some(file_engine) = &evt.files() {
                         let files = file_engine.files();
                         for file_name in files {
                             sleep(std::time::Duration::from_secs(1)).await;

examples/form.rs

@@ -14,8 +14,8 @@ fn app(cx: Scope) -> Element {
         div {
             h1 { "Form" }
             form {
-                onsubmit: move |ev| println!("Submitted {:?}", ev.values),
-                oninput: move |ev| println!("Input {:?}", ev.values),
+                onsubmit: move |ev| println!("Submitted {:?}", ev.values()),
+                oninput: move |ev| println!("Input {:?}", ev.values()),
                 input { r#type: "text", name: "username" }
                 input { r#type: "text", name: "full-name" }
                 input { r#type: "password", name: "password" }

examples/login_form.rs

@@ -13,8 +13,8 @@ fn app(cx: Scope) -> Element {
             let resp = reqwest::Client::new()
                 .post("http://localhost:8080/login")
                 .form(&[
-                    ("username", &evt.values["username"]),
-                    ("password", &evt.values["password"]),
+                    ("username", &evt.values()["username"]),
+                    ("password", &evt.values()["password"]),
                 ])
                 .send()
                 .await;

examples/shared_state.rs

@@ -64,7 +64,7 @@ fn DataEditor(cx: Scope, id: usize) -> Element {
 fn DataView(cx: Scope, id: usize) -> Element {
     let cool_data = use_shared_state::<CoolData>(cx).unwrap();
 
-    let oninput = |e: FormEvent| cool_data.write().set(*id, e.value.clone());
+    let oninput = |e: FormEvent| cool_data.write().set(*id, e.value());
 
     let cool_data = cool_data.read();
     let my_data = &cool_data.view(id).unwrap();

examples/textarea.rs

@@ -17,7 +17,7 @@ fn app(cx: Scope) -> Element {
             rows: "10",
             cols: "80",
             value: "{model}",
-            oninput: move |e| model.set(e.value.clone()),
+            oninput: move |e| model.set(e.value().clone()),
         }
     })
 }

examples/todomvc.rs

@@ -66,7 +66,7 @@ pub fn app(cx: Scope<()>) -> Element {
                     value: "{draft}",
                     autofocus: "true",
                     oninput: move |evt| {
-                        draft.set(evt.value.clone());
+                        draft.set(evt.value());
                     },
                     onkeydown: move |evt| {
                         if evt.key() == Key::Enter && !draft.is_empty() {
@@ -176,7 +176,7 @@ pub fn TodoEntry<'a>(cx: Scope<'a, TodoEntryProps<'a>>) -> Element {
                     id: "cbg-{todo.id}",
                     checked: "{todo.checked}",
                     oninput: move |evt| {
-                        cx.props.todos.make_mut()[&cx.props.id].checked = evt.value.parse().unwrap();
+                        cx.props.todos.make_mut()[&cx.props.id].checked = evt.value().parse().unwrap();
                     }
                 }
                 label {
@@ -195,7 +195,7 @@ pub fn TodoEntry<'a>(cx: Scope<'a, TodoEntryProps<'a>>) -> Element {
                 input {
                     class: "edit",
                     value: "{todo.contents}",
-                    oninput: move |evt| cx.props.todos.make_mut()[&cx.props.id].contents = evt.value.clone(),
+                    oninput: move |evt| cx.props.todos.make_mut()[&cx.props.id].contents = evt.value(),
                     autofocus: "true",
                     onfocusout: move |_| is_editing.set(false),
                     onkeydown: move |evt| {

examples/window_zoom.rs

@@ -14,7 +14,7 @@ fn app(cx: Scope) -> Element {
             r#type: "number",
             value: "{level}",
             oninput: |e| {
-                if let Ok(new_zoom) = e.value.parse::<f64>() {
+                if let Ok(new_zoom) = e.value().parse::<f64>() {
                     level.set(new_zoom);
                     window.webview.zoom(new_zoom);
                 }

examples/xss_safety.rs

@@ -20,7 +20,7 @@ fn app(cx: Scope) -> Element {
             input {
                 value: "{contents}",
                 r#type: "text",
-                oninput: move |e| contents.set(e.value.clone()),
+                oninput: move |e| contents.set(e.value()),
             }
         }
     })

packages/autofmt/src/component.rs

@@ -182,11 +182,32 @@ impl Writer<'_> {
                         s.source.as_ref().unwrap().to_token_stream()
                     )?;
                 }
-                ContentField::OnHandlerRaw(exp) => {
-                    let out = prettyplease::unparse_expr(exp);
+                ContentField::OnHandlerRaw { handler, metadata } => {
+                    let out = prettyplease::unparse_expr(handler);
                     let mut lines = out.split('\n').peekable();
+                    write!(self.out, "{name}")?;
+                    if let Some(metadata) = metadata {
+                        write!(self.out, "[")?;
+                        for (index, expr) in metadata.iter().enumerate() {
+                            let is_last = index == metadata.len() - 1;
+
+                            let out = prettyplease::unparse_expr(expr);
+                            let mut lines = out.split('\n').peekable();
+                            let first = lines.next().unwrap();
+                            write!(self.out, "{first}")?;
+                            for line in lines {
+                                self.out.new_line()?;
+                                self.out.indented_tab()?;
+                                write!(self.out, "{line}")?;
+                            }
+                            if !is_last {
+                                write!(self.out, ", ")?;
+                            }
+                        }
+                        write!(self.out, "]")?;
+                    }
                     let first = lines.next().unwrap();
-                    write!(self.out, "{name}: {first}")?;
+                    write!(self.out, ": {first}")?;
                     for line in lines {
                         self.out.new_line()?;
                         self.out.indented_tab()?;
@@ -223,7 +244,31 @@ impl Writer<'_> {
             .iter()
             .map(|field| match &field.content {
                 ContentField::Formatted(s) => ifmt_to_string(s).len() ,
-                ContentField::OnHandlerRaw(exp) | ContentField::ManExpr(exp) => {
+                ContentField::OnHandlerRaw { handler, metadata} => {
+                    let formatted = prettyplease::unparse_expr(handler);
+                    let mut len= if formatted.contains('\n') {
+                        10000
+                    } else {
+                        formatted.len()
+                    };
+                    self.cached_formats.insert(Location::new(handler.span().start()) , formatted);
+
+                    if let Some(metadata) = metadata{
+                        for expr in metadata {
+                            let formatted = prettyplease::unparse_expr(expr);
+                            len += if formatted.contains('\n') {
+                                10000
+                            } else {
+                                formatted.len()
+                            };
+                            self.cached_formats.insert(Location::new(expr.span().start()) , formatted);
+                            len += 2;
+                        }
+                    }
+
+                    len
+                },
+                ContentField::ManExpr(exp) => {
                     let formatted = prettyplease::unparse_expr(exp);
                     let len = if formatted.contains('\n') {
                         10000

packages/autofmt/src/element.rs

@@ -252,28 +252,46 @@ impl Writer<'_> {
                 write!(self.out, "{}: {}", name.to_token_stream(), out)?;
             }
 
-            ElementAttr::EventTokens { name, tokens } => {
+            ElementAttr::EventTokens {
+                name,
+                tokens,
+                metadata,
+            } => {
                 let out = self.retrieve_formatted_expr(tokens).to_string();
 
                 let mut lines = out.split('\n').peekable();
                 let first = lines.next().unwrap();
 
                 // a one-liner for whatever reason
                 // Does not need a new line
-                if lines.peek().is_none() {
-                    write!(self.out, "{name}: {first}")?;
-                } else {
-                    writeln!(self.out, "{name}: {first}")?;
-
-                    while let Some(line) = lines.next() {
-                        self.out.indented_tab()?;
-                        write!(self.out, "{line}")?;
-                        if lines.peek().is_none() {
-                            write!(self.out, "")?;
-                        } else {
-                            writeln!(self.out)?;
+                if lines.peek().is_some() {
+                    writeln!(self.out, "")?;
+                }
+                write!(self.out, "{name}")?;
+                if let Some(metadata) = metadata {
+                    write!(self.out, "[")?;
+                    for expr in metadata {
+                        let out = self.retrieve_formatted_expr(expr).to_string();
+                        let mut lines = out.split('\n').peekable();
+                        let first = lines.next().unwrap();
+                        write!(self.out, "{first}")?;
+                        for line in lines {
+                            self.out.indented_tab()?;
+                            write!(self.out, "{line}")?;
                         }
                     }
+                    write!(self.out, "]")?;
+                }
+                write!(self.out, ": {first}")?;
+
+                while let Some(line) = lines.next() {
+                    self.out.indented_tab()?;
+                    write!(self.out, "{line}")?;
+                    if lines.peek().is_none() {
+                        write!(self.out, "")?;
+                    } else {
+                        writeln!(self.out)?;
+                    }
                 }
             }
         }

packages/autofmt/src/writer.rs

@@ -159,10 +159,14 @@ impl<'a> Writer<'a> {
                 ElementAttr::CustomAttrExpression { name, value } => {
                     name.to_token_stream().to_string().len() + value.span().line_length() + 6
                 }
-                ElementAttr::EventTokens { tokens, name } => {
+                ElementAttr::EventTokens {
+                    tokens,
+                    name,
+                    metadata,
+                } => {
                     let location = Location::new(tokens.span().start());
 
-                    let len = if let std::collections::hash_map::Entry::Vacant(e) =
+                    let mut len = if let std::collections::hash_map::Entry::Vacant(e) =
                         self.cached_formats.entry(location)
                     {
                         let formatted = prettyplease::unparse_expr(tokens);
@@ -177,6 +181,28 @@ impl<'a> Writer<'a> {
                         self.cached_formats[&location].len()
                     };
 
+                    if let Some(metadata) = metadata {
+                        for expr in metadata {
+                            let location = Location::new(expr.span().start());
+
+                            len += if let std::collections::hash_map::Entry::Vacant(e) =
+                                self.cached_formats.entry(location)
+                            {
+                                let formatted = prettyplease::unparse_expr(expr);
+                                let len = if formatted.contains('\n') {
+                                    10000
+                                } else {
+                                    formatted.len()
+                                };
+                                e.insert(formatted);
+                                len
+                            } else {
+                                self.cached_formats[&location].len()
+                            };
+                            len += 2;
+                        }
+                    }
+
                     len + name.span().line_length() + 6
                 }
             };

packages/core/Cargo.toml

@@ -36,6 +36,7 @@ serde = { version = "1", features = ["derive"], optional = true }
 [dev-dependencies]
 tokio = { workspace = true, features = ["full"] }
 dioxus = { workspace = true }
+dioxus-html = { workspace = true, features = ["serialize"] }
 pretty_assertions = "1.3.0"
 rand = "0.8.5"
 dioxus-ssr = { workspace = true }

packages/core/src/arena.rs

@@ -169,7 +169,7 @@ impl VirtualDom {
             let listener = unsafe { &*listener };
             match &listener.value {
                 AttributeValue::Listener(l) => {
-                    _ = l.take();
+                    _ = l.callback.take();
                 }
                 AttributeValue::Any(a) => {
                     _ = a.take();