Merge branch 'master' into intigrate-collect-assets

examples/crm.rs

@@ -1,5 +1,4 @@
 //! Tiny CRM: A port of the Yew CRM example to Dioxus.
-#![allow(non_snake_case)]
 use dioxus::prelude::*;
 use dioxus_router::prelude::*;
 
@@ -27,6 +26,7 @@ pub struct Client {
 
 type ClientContext = Vec<Client>;
 
+#[component]
 fn App(cx: Scope) -> Element {
     use_shared_state_provider::<ClientContext>(cx, Default::default);
 
@@ -50,7 +50,7 @@ fn App(cx: Scope) -> Element {
     }
 }
 
-#[inline_props]
+#[component]
 fn ClientList(cx: Scope) -> Element {
     let clients = use_shared_state::<ClientContext>(cx).unwrap();
 
@@ -80,7 +80,7 @@ fn ClientList(cx: Scope) -> Element {
     })
 }
 
-#[inline_props]
+#[component]
 fn ClientAdd(cx: Scope) -> Element {
     let clients = use_shared_state::<ClientContext>(cx).unwrap();
     let first_name = use_state(cx, String::new);
@@ -173,7 +173,7 @@ fn ClientAdd(cx: Scope) -> Element {
     })
 }
 
-#[inline_props]
+#[component]
 fn Settings(cx: Scope) -> Element {
     let clients = use_shared_state::<ClientContext>(cx).unwrap();
 

examples/dog_app.rs

@@ -2,7 +2,7 @@ use dioxus::prelude::*;
 use std::collections::HashMap;
 
 fn main() {
-    dioxus_desktop::launch(|cx| render!(app_root {}));
+    dioxus_desktop::launch(|cx| render!(AppRoot {}));
 }
 
 #[derive(Debug, Clone, PartialEq, serde::Deserialize)]
@@ -10,7 +10,8 @@ struct ListBreeds {
     message: HashMap<String, Vec<String>>,
 }
 
-fn app_root(cx: Scope<'_>) -> Element {
+#[component]
+fn AppRoot(cx: Scope<'_>) -> Element {
     let breed = use_state(cx, || "deerhound".to_string());
 
     let breeds = use_future!(cx, || async move {
@@ -36,7 +37,7 @@ fn app_root(cx: Scope<'_>) -> Element {
                             }
                         }
                     }
-                    div { flex: "50%", breed_pic { breed: breed.to_string() } }
+                    div { flex: "50%", BreedPic { breed: breed.to_string() } }
                 }
             }
         }),
@@ -49,8 +50,8 @@ struct DogApi {
     message: String,
 }
 
-#[inline_props]
-fn breed_pic(cx: Scope, breed: String) -> Element {
+#[component]
+fn BreedPic(cx: Scope, breed: String) -> Element {
     let fut = use_future!(cx, |breed| async move {
         reqwest::get(format!("https://dog.ceo/api/breed/{breed}/images/random"))
             .await

examples/error_handle.rs

@@ -1,10 +1,11 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus_desktop::launch(app);
+    dioxus_desktop::launch(App);
 }
 
-fn app(cx: Scope) -> Element {
+#[component]
+fn App(cx: Scope) -> Element {
     let val = use_state(cx, || "0.0001");
 
     let num = match val.parse::<f32>() {
@@ -19,13 +20,13 @@ fn app(cx: Scope) -> Element {
             "Set an invalid number"
         }
         (0..5).map(|i| rsx! {
-            demo_c { x: i }
+            DemoC { x: i }
         })
     })
 }
 
-#[inline_props]
-fn demo_c(cx: Scope, x: i32) -> Element {
+#[component]
+fn DemoC(cx: Scope, x: i32) -> Element {
     cx.render(rsx! {
         h1 {
             "asdasdasdasd {x}"

examples/flat_router.rs

@@ -1,5 +1,3 @@
-#![allow(non_snake_case)]
-
 use dioxus::prelude::*;
 use dioxus_desktop::{tao::dpi::LogicalSize, Config, WindowBuilder};
 use dioxus_router::prelude::*;
@@ -13,10 +11,11 @@ fn main() {
             .with_resizable(false),
     );
 
-    dioxus_desktop::launch_cfg(app, cfg)
+    dioxus_desktop::launch_cfg(App, cfg)
 }
 
-fn app(cx: Scope) -> Element {
+#[component]
+fn App(cx: Scope) -> Element {
     render! {
         Router::<Route> {}
     }
@@ -36,7 +35,7 @@ enum Route {
         Settings {},
 }
 
-#[inline_props]
+#[component]
 fn Footer(cx: Scope) -> Element {
     render! {
         div {
@@ -58,22 +57,22 @@ fn Footer(cx: Scope) -> Element {
     }
 }
 
-#[inline_props]
+#[component]
 fn Home(cx: Scope) -> Element {
     render!("Home")
 }
 
-#[inline_props]
+#[component]
 fn Games(cx: Scope) -> Element {
     render!("Games")
 }
 
-#[inline_props]
+#[component]
 fn Play(cx: Scope) -> Element {
     render!("Play")
 }
 
-#[inline_props]
+#[component]
 fn Settings(cx: Scope) -> Element {
     render!("Settings")
 }

examples/inlineprops.rs

@@ -1,33 +1,35 @@
-//! Run with `cargo-expand` to see what each one expands to
-#![allow(non_snake_case)]
-
+//! Run with `cargo-expand` to see what each one expands to.
+//! This file is named `inlineprops.rs`, because there used to be a `#[inline_props]` macro to
+//! do this. However, it's now deprecated (and will likely be removed in a future major version),
+//! so please use `#[component]` instead!
 use dioxus::prelude::*;
 
-#[inline_props]
+#[component]
 fn Thing1<T>(cx: Scope, _a: T) -> Element {
     cx.render(rsx! { "" })
 }
 
-#[inline_props]
+#[component]
 fn Thing2(cx: Scope, _a: u32) -> Element<'a> {
     cx.render(rsx! { "" })
 }
 
-#[inline_props]
+#[component]
 fn Thing3<'a, T>(cx: Scope<'a>, _a: &'a T) -> Element<'a> {
     cx.render(rsx! { "" })
 }
 
-#[inline_props]
+#[component]
 fn Thing4<'a>(cx: Scope<'a>, _a: &'a u32) -> Element<'a> {
     cx.render(rsx! { "" })
 }
 
 fn main() {
-    dioxus_desktop::launch(app);
+    dioxus_desktop::launch(App);
 }
 
-fn app(cx: Scope) -> Element {
+#[component]
+fn App(cx: Scope) -> Element {
     let state = use_state(cx, || 1);
 
     cx.render(rsx! {

examples/link.rs

@@ -1,13 +1,12 @@
-#![allow(non_snake_case)]
-
 use dioxus::prelude::*;
 use dioxus_router::prelude::*;
 
 fn main() {
-    dioxus_desktop::launch(app);
+    dioxus_desktop::launch(App);
 }
 
-fn app(cx: Scope) -> Element {
+#[component]
+fn App(cx: Scope) -> Element {
     cx.render(rsx! (
         div {
             p {
@@ -38,7 +37,7 @@ enum Route {
         Settings {},
 }
 
-#[inline_props]
+#[component]
 fn Header(cx: Scope) -> Element {
     render! {
         h1 { "Your app here" }
@@ -50,12 +49,12 @@ fn Header(cx: Scope) -> Element {
     }
 }
 
-#[inline_props]
+#[component]
 fn Home(cx: Scope) -> Element {
     render!(h1 { "Home" })
 }
 
-#[inline_props]
+#[component]
 fn Settings(cx: Scope) -> Element {
     render!(h1 { "Settings" })
 }

examples/query_segments_demo/src/main.rs

@@ -1,4 +1,4 @@
-#![allow(non_snake_case, unused)]
+#![allow(unused)]
 //! Example: Url query segments usage
 //! ------------------------------------
 //!
@@ -56,7 +56,7 @@ impl FromQuery for BlogQuerySegments {
     }
 }
 
-#[inline_props]
+#[component]
 fn BlogPost(cx: Scope, query_params: BlogQuerySegments) -> Element {
     render! {
         div{"This is your blogpost with a query segment:"}
@@ -64,6 +64,7 @@ fn BlogPost(cx: Scope, query_params: BlogQuerySegments) -> Element {
     }
 }
 
+#[component]
 fn App(cx: Scope) -> Element {
     render! { Router::<Route>{} }
 }

examples/router.rs

@@ -1,5 +1,3 @@
-#![allow(non_snake_case)]
-
 use dioxus::prelude::*;
 use dioxus_router::prelude::*;
 
@@ -37,12 +35,14 @@ enum Route {
 }
 // ANCHOR_END: router
 
+#[component]
 fn App(cx: Scope) -> Element {
     render! {
         Router::<Route> {}
     }
 }
 
+#[component]
 fn NavBar(cx: Scope) -> Element {
     render! {
         nav {
@@ -55,12 +55,14 @@ fn NavBar(cx: Scope) -> Element {
     }
 }
 
+#[component]
 fn Home(cx: Scope) -> Element {
     render! {
         h1 { "Welcome to the Dioxus Blog!" }
     }
 }
 
+#[component]
 fn Blog(cx: Scope) -> Element {
     render! {
         h1 { "Blog" }
@@ -68,6 +70,7 @@ fn Blog(cx: Scope) -> Element {
     }
 }
 
+#[component]
 fn BlogList(cx: Scope) -> Element {
     render! {
         h2 { "Choose a post" }
@@ -88,14 +91,14 @@ fn BlogList(cx: Scope) -> Element {
     }
 }
 
-#[inline_props]
+#[component]
 fn BlogPost(cx: Scope, name: String) -> Element {
     render! {
         h2 { "Blog Post: {name}"}
     }
 }
 
-#[inline_props]
+#[component]
 fn PageNotFound(cx: Scope, route: Vec<String>) -> Element {
     render! {
         h1 { "Page not found" }

examples/rsx_usage.rs

@@ -1,4 +1,3 @@
-#![allow(non_snake_case)]
 //! A tour of the rsx! macro
 //! ------------------------
 //!
@@ -40,7 +39,7 @@
 //! - Allow top-level fragments
 
 fn main() {
-    dioxus_desktop::launch(app);
+    dioxus_desktop::launch(App);
 }
 
 use core::{fmt, str::FromStr};
@@ -49,7 +48,8 @@ use std::fmt::Display;
 use baller::Baller;
 use dioxus::prelude::*;
 
-fn app(cx: Scope) -> Element {
+#[component]
+fn App(cx: Scope) -> Element {
     let formatting = "formatting!";
     let formatting_tuple = ("a", "b");
     let lazy_fmt = format_args!("lazily formatted text");
@@ -217,12 +217,16 @@ fn format_dollars(dollars: u32, cents: u32) -> String {
     format!("${dollars}.{cents:02}")
 }
 
-fn helper<'a>(cx: &'a ScopeState, text: &str) -> Element<'a> {
+fn helper<'a>(cx: &'a ScopeState, text: &'a str) -> Element<'a> {
     cx.render(rsx! {
         p { "{text}" }
     })
 }
 
+// no_case_check disables PascalCase checking if you *really* want a snake_case component.
+// This will likely be deprecated/removed in a future update that will introduce a more polished linting system,
+// something like Clippy.
+#[component(no_case_check)]
 fn lowercase_helper(cx: Scope) -> Element {
     cx.render(rsx! {
         "asd"
@@ -234,12 +238,16 @@ mod baller {
     #[derive(Props, PartialEq, Eq)]
     pub struct BallerProps {}
 
-    #[allow(non_snake_case)]
+    #[component]
     /// This component totally balls
-    pub fn Baller(_: Scope<BallerProps>) -> Element {
+    pub fn Baller(_cx: Scope<BallerProps>) -> Element {
         todo!()
     }
 
+    // no_case_check disables PascalCase checking if you *really* want a snake_case component.
+    // This will likely be deprecated/removed in a future update that will introduce a more polished linting system,
+    // something like Clippy.
+    #[component(no_case_check)]
     pub fn lowercase_component(cx: Scope) -> Element {
         cx.render(rsx! { "look ma, no uppercase" })
     }
@@ -253,7 +261,7 @@ pub struct TallerProps<'a> {
 }
 
 /// Documention for this component is visible within the rsx macro
-#[allow(non_snake_case)]
+#[component]
 pub fn Taller<'a>(cx: Scope<'a, TallerProps<'a>>) -> Element {
     cx.render(rsx! {
         &cx.props.children
@@ -275,15 +283,14 @@ where
     todo!()
 }
 
-#[inline_props]
+#[component]
 fn WithInline<'a>(cx: Scope<'a>, text: &'a str) -> Element {
     cx.render(rsx! {
         p { "{text}" }
     })
 }
 
-// generic component with inline_props too
-#[inline_props]
+#[component]
 fn Label<T>(cx: Scope, text: T) -> Element
 where
     T: Display,

examples/shared_state.rs

@@ -1,5 +1,3 @@
-#![allow(non_snake_case)]
-
 use std::collections::HashMap;
 
 use dioxus::prelude::*;
@@ -27,6 +25,7 @@ impl CoolData {
     }
 }
 
+#[component]
 #[rustfmt::skip]
 pub fn App(cx: Scope) -> Element {
     use_shared_state_provider(cx, || CoolData::new(HashMap::from([
@@ -50,7 +49,7 @@ pub fn App(cx: Scope) -> Element {
     )
 }
 
-#[inline_props]
+#[component]
 fn DataEditor(cx: Scope, id: usize) -> Element {
     let cool_data = use_shared_state::<CoolData>(cx).unwrap().read();
 
@@ -61,7 +60,7 @@ fn DataEditor(cx: Scope, id: usize) -> Element {
     })
 }
 
-#[inline_props]
+#[component]
 fn DataView(cx: Scope, id: usize) -> Element {
     let cool_data = use_shared_state::<CoolData>(cx).unwrap();
 

examples/simple_desktop.rs

@@ -9,10 +9,11 @@ fn main() {
         .with_module_level("dioxus", log::LevelFilter::Trace)
         .init()
         .unwrap();
-    dioxus_desktop::launch(app);
+    dioxus_desktop::launch(App);
 }
 
-fn app(cx: Scope) -> Element {
+#[component]
+fn App(cx: Scope) -> Element {
     render! {
         Router::<Route> {}
     }
@@ -36,7 +37,7 @@ enum Route {
         Oranges {},
 }
 
-#[inline_props]
+#[component]
 fn NavBar(cx: Scope) -> Element {
     render! {
         h1 { "Your app here" }
@@ -51,19 +52,19 @@ fn NavBar(cx: Scope) -> Element {
     }
 }
 
-#[inline_props]
+#[component]
 fn Home(cx: Scope) -> Element {
     log::debug!("rendering home {:?}", cx.scope_id());
     render! { h1 { "Home" } }
 }
 
-#[inline_props]
+#[component]
 fn BlogList(cx: Scope) -> Element {
     log::debug!("rendering blog list {:?}", cx.scope_id());
     render! { div { "Blog List" } }
 }
 
-#[inline_props]
+#[component]
 fn BlogPost(cx: Scope, post: String) -> Element {
     log::debug!("rendering blog post {}", post);
 
@@ -75,7 +76,7 @@ fn BlogPost(cx: Scope, post: String) -> Element {
     }
 }
 
-#[inline_props]
+#[component]
 fn Oranges(cx: Scope) -> Element {
     render!("Oranges are not apples!")
 }

examples/simple_router.rs

@@ -12,12 +12,12 @@ enum Route {
     Blog { id: String },
 }
 
-#[inline_props]
+#[component]
 fn Homepage(cx: Scope) -> Element {
     render! { h1 { "Welcome home" } }
 }
 
-#[inline_props]
+#[component]
 fn Blog(cx: Scope, id: String) -> Element {
     render! {
         h1 { "How to make: " }
@@ -25,7 +25,7 @@ fn Blog(cx: Scope, id: String) -> Element {
     }
 }
 
-#[inline_props]
+#[component]
 fn Nav(cx: Scope) -> Element {
     render! {
         nav {