+Available cargo features:
+- default: core (macro, hooks, html)
+- macro: support for `Props` and `rsx` macros
+- hooks: foundational hooks like `use_state`, `use_ref`, etc.
+- html: the entire namespace of `html` elements, their listeners, and attributes
+- router: a cross-platform (web and desktop) solution for global app routing
+- liveview: a threadpool to spawn new VirtualDoms and their handles in
+- ssr: render the virtualdom to a string
+- web: render the your app on the web
+- desktop: render your app locally rendered with webview
+- mobile: render your app on your device rendered with webview
+
## Examples:
-| File Navigator (Desktop) | Bluetooth scanner (Desktop) | TodoMVC (All platforms) | Widget Gallery |
-| --------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------- |
-| [](https://github.com/DioxusLabs/file-explorer-example) |  | [](https://github.com/dioxusLabs/todomvc/) |  |
+| File Navigator (Desktop) | Bluetooth scanner (Desktop) | TodoMVC (All platforms) | Tailwind (Liveview) |
+| --------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
+| [](https://github.com/DioxusLabs/file-explorer-example) | [](https://github.com/DioxusLabs/file-explorer-example) | [](https://github.com/dioxusLabs/todomvc/) | [](https://github.com/DioxusLabs/file-explorer-example) |
See the awesome-dioxus page for a curated list of content in the Dioxus Ecosystem.
@@ -159,6 +171,7 @@ Dioxus is heavily inspired by React, but we want your transition to feel like an
| Re-hydration | ✅ | ✅ | Pre-render to HTML to speed up first contentful paint |
| Jank-Free Rendering | ✅ | ✅ | Large diffs are segmented across frames for silky-smooth transitions |
| Effects | ✅ | ✅ | Run effects after a component has been committed to render |
+| Portals | 🛠 | ✅ | Render nodes outside of the traditional tree structure |
| Cooperative Scheduling | 🛠 | ✅ | Prioritize important events over non-important events |
| Server Components | 🛠 | ✅ | Hybrid components for SPA and Server |
| Bundle Splitting | 👀 | ✅ | Efficiently and asynchronously load the app |
@@ -166,6 +179,7 @@ Dioxus is heavily inspired by React, but we want your transition to feel like an
| 1st class global state | ✅ | ✅ | redux/recoil/mobx on top of context |
| Runs natively | ✅ | ❓ | runs as a portable binary w/o a runtime (Node) |
| Subtree Memoization | ✅ | ❓ | skip diffing static element subtrees |
+| High-efficiency templates | 🛠 | ❓ | rsx! calls are translated to templates on the DOM's side |
| Compile-time correct | ✅ | ❓ | Throw errors on invalid template layouts |
| Heuristic Engine | ✅ | ❓ | track component memory usage to minimize future allocations |
| Fine-grained reactivity | 👀 | ❓ | Skip diffing for fine-grain updates |
@@ -185,5 +199,5 @@ This project is licensed under the [MIT license].
### Contribution
Unless you explicitly state otherwise, any contribution intentionally submitted
-for inclusion in Pipette by you, shall be licensed as MIT, without any additional
+for inclusion in Dioxus by you, shall be licensed as MIT, without any additional
terms or conditions.
diff --git a/docs/guide/src/README.md b/docs/guide/src/README.md
index faf58e309..419828620 100644
--- a/docs/guide/src/README.md
+++ b/docs/guide/src/README.md
@@ -6,7 +6,7 @@
```rust
fn App(cx: Context, props: &()) -> Element {
- let mut count = use_state(cx, || 0);
+ let mut count = use_state(&cx, || 0);
cx.render(rsx!(
h1 { "High-Five counter: {count}" }
@@ -53,7 +53,7 @@ Dioxus supports server-side rendering!
For rendering statically to an `.html` file or from a WebServer, then you'll want to make sure the `ssr` feature is enabled in the `dioxus` crate and use the `dioxus::ssr` API. We don't expect the SSR API to change drastically in the future.
```rust
-let contents = dioxus::ssr::render_vdom(&dom, |c| c);
+let contents = dioxus::ssr::render_vdom(&dom);
```
[Jump to the getting started guide for SSR.]()
diff --git a/docs/guide/src/concepts/00-index.md b/docs/guide/src/concepts/00-index.md
index 715c3d69b..cc432cf9a 100644
--- a/docs/guide/src/concepts/00-index.md
+++ b/docs/guide/src/concepts/00-index.md
@@ -45,7 +45,7 @@ As the UI grows in scale, our logic to keep each element in the proper state wou
Instead, with Dioxus, we *declare* what we want our UI to look like:
```rust
-let mut state = use_state(cx, || "red");
+let mut state = use_state(&cx, || "red");
cx.render(rsx!(
Container {
diff --git a/docs/guide/src/concepts/11-arena-memo.md b/docs/guide/src/concepts/11-arena-memo.md
index 28eccda24..12f99a1d6 100644
--- a/docs/guide/src/concepts/11-arena-memo.md
+++ b/docs/guide/src/concepts/11-arena-memo.md
@@ -21,9 +21,9 @@ fn test() -> DomTree {
}
}
-static TestComponent: FC<()> = |cx, props|html!{
};
```
## Why this behavior?
diff --git a/docs/guide/src/concepts/12-signals.md b/docs/guide/src/concepts/12-signals.md
index 5000faebc..3737a4885 100644
--- a/docs/guide/src/concepts/12-signals.md
+++ b/docs/guide/src/concepts/12-signals.md
@@ -12,7 +12,7 @@ Your component today might look something like this:
```rust
fn Comp(cx: Context<()>) -> DomTree {
- let (title, set_title) = use_state(cx, || "Title".to_string());
+ let (title, set_title) = use_state(&cx, || "Title".to_string());
cx.render(rsx!{
input {
value: title,
@@ -26,7 +26,7 @@ This component is fairly straightforward - the input updates its own value on ev
```rust
fn Comp(cx: Context<()>) -> DomTree {
- let (title, set_title) = use_state(cx, || "Title".to_string());
+ let (title, set_title) = use_state(&cx, || "Title".to_string());
cx.render(rsx!{
div {
input {
@@ -96,7 +96,7 @@ Sometimes you want a signal to propagate across your app, either through far-awa
```rust
const TITLE: Atom = || "".to_string();
-const Provider: FC<()> = |cx, props|{
+const Provider: Component<()> = |cx, props|{
let title = use_signal(&cx, &TITLE);
rsx!(cx, input { value: title })
};
@@ -105,7 +105,7 @@ const Provider: FC<()> = |cx, props|{
If we use the `TITLE` atom in another component, we can cause updates to flow between components without calling render or diffing either component trees:
```rust
-const Receiver: FC<()> = |cx, props|{
+const Receiver: Component<()> = |cx, props|{
let title = use_signal(&cx, &TITLE);
log::info!("This will only be called once!");
rsx!(cx,
@@ -132,7 +132,7 @@ Dioxus automatically understands how to use your signals when mixed with iterato
```rust
const DICT: AtomFamily = |_| {};
-const List: FC<()> = |cx, props|{
+const List: Component<()> = |cx, props|{
let dict = use_signal(&cx, &DICT);
cx.render(rsx!(
ul {
diff --git a/docs/guide/src/concepts/components.md b/docs/guide/src/concepts/components.md
index ef750f87a..9eb67ab39 100644
--- a/docs/guide/src/concepts/components.md
+++ b/docs/guide/src/concepts/components.md
@@ -124,7 +124,7 @@ fn VoteButton(cx: Context, props: &VoteButtonProps) -> Element {
cx.render(rsx!{
div { class: "votebutton"
div { class: "arrow up" }
- div { class: "score", "{props.score}"}
+ div { class: "score", "{cx.props.score}"}
div { class: "arrow down" }
}
})
@@ -147,7 +147,7 @@ struct TitleCardProps<'a> {
fn TitleCard(cx: Context, props: &TitleCardProps) -> Element {
cx.render(rsx!{
- h1 { "{props.title}" }
+ h1 { "{cx.props.title}" }
})
}
```
diff --git a/docs/guide/src/concepts/conditional_rendering.md b/docs/guide/src/concepts/conditional_rendering.md
index e35fce36d..ef62b8701 100644
--- a/docs/guide/src/concepts/conditional_rendering.md
+++ b/docs/guide/src/concepts/conditional_rendering.md
@@ -83,7 +83,7 @@ fn App(cx: Context, props: &())-> Element {
This syntax even enables us to write a one-line component:
```rust
-static App: FC<()> = |cx, props| rsx!(cx, "hello world!");
+static App: Component<()> = |cx, props| rsx!(cx, "hello world!");
```
Alternatively, for match statements, we can just return the builder itself and pass it into a final, single call to `cx.render`:
diff --git a/docs/guide/src/concepts/exporting_components.md b/docs/guide/src/concepts/exporting_components.md
index 9b5a65ca1..6139a97e6 100644
--- a/docs/guide/src/concepts/exporting_components.md
+++ b/docs/guide/src/concepts/exporting_components.md
@@ -22,7 +22,7 @@ Let's say our app looks something like this:
use dioxus::prelude::*;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
fn App((cx, props): Component<()>) -> Element {}
@@ -87,7 +87,7 @@ In our `main.rs`, we'll want to declare the `post` module so we can access our `
use dioxus::prelude::*;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
mod post;
@@ -186,7 +186,7 @@ Ultimately, including and exporting components is governed by Rust's module syst
use dioxus::prelude::*;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
mod post;
diff --git a/docs/guide/src/concepts/interactivity.md b/docs/guide/src/concepts/interactivity.md
index bd8ff14aa..63cf6741c 100644
--- a/docs/guide/src/concepts/interactivity.md
+++ b/docs/guide/src/concepts/interactivity.md
@@ -64,7 +64,7 @@ The most common hook you'll use for storing state is `use_state`. `use_state` pr
```rust
fn App(cx: Context, props: &())-> Element {
- let post = use_state(cx, || {
+ let post = use_state(&cx, || {
PostData {
id: Uuid::new_v4(),
score: 10,
@@ -112,7 +112,7 @@ For example, let's say we provide a button to generate a new post. Whenever the
```rust
fn App(cx: Context, props: &())-> Element {
- let post = use_state(cx, || PostData::new());
+ let post = use_state(&cx, || PostData::new());
cx.render(rsx!{
button {
@@ -135,7 +135,7 @@ We can use tasks in our components to build a tiny stopwatch that ticks every se
```rust
fn App(cx: Context, props: &())-> Element {
- let mut sec_elapsed = use_state(cx, || 0);
+ let mut sec_elapsed = use_state(&cx, || 0);
cx.spawn_task(async move {
TimeoutFuture::from_ms(1000).await;
diff --git a/docs/guide/src/hello_world.md b/docs/guide/src/hello_world.md
index 2520c286a..2b0cebf87 100644
--- a/docs/guide/src/hello_world.md
+++ b/docs/guide/src/hello_world.md
@@ -92,7 +92,7 @@ use dioxus::prelude::*;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
fn App(cx: Context, props: &()) -> Element {
@@ -118,7 +118,7 @@ This initialization code launches a Tokio runtime on a helper thread where your
```rust
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
```
@@ -135,7 +135,7 @@ fn App(cx: Context, props: &()) -> Element {
Writing `fn App(cx: Context, props: &()) -> Element {` might become tedious. Rust will also let you write functions as static closures, but these types of Components cannot have props that borrow data.
```rust
-static App: FC<()> = |cx, props| cx.render(rsx!(div { "Hello, world!" }));
+static App: Component<()> = |cx, props| cx.render(rsx!(div { "Hello, world!" }));
```
### What is this `Context` object?
diff --git a/examples/README.md b/examples/README.md
index 06a73db07..2c05466a2 100644
--- a/examples/README.md
+++ b/examples/README.md
@@ -72,7 +72,7 @@ fn App(cx: Context, props: &()) -> Element {
struct ToggleProps { children: Element }
fn Toggle(cx: Context, props: &ToggleProps) -> Element {
- let mut toggled = use_state(cx, || false);
+ let mut toggled = use_state(&cx, || false);
cx.render(rsx!{
div {
{&props.children}
@@ -87,7 +87,7 @@ fn Toggle(cx: Context, props: &ToggleProps) -> Element {
Controlled inputs:
```rust
fn App(cx: Context, props: &()) -> Element {
- let value = use_state(cx, String::new);
+ let value = use_state(&cx, String::new);
cx.render(rsx!(
input {
"type": "text",
@@ -123,13 +123,13 @@ fn App(cx: Context, props: &()) -> Element {
Tiny components:
```rust
-static App: FC<()> = |cx, _| rsx!(cx, div {"hello world!"});
+static App: Component<()> = |cx, _| rsx!(cx, div {"hello world!"});
```
Borrowed prop contents:
```rust
fn App(cx: Context, props: &()) -> Element {
- let name = use_state(cx, || String::from("example"));
+ let name = use_state(&cx, || String::from("example"));
rsx!(cx, Child { title: name.as_str() })
}
@@ -137,7 +137,7 @@ fn App(cx: Context, props: &()) -> Element {
struct ChildProps<'a> { title: &'a str }
fn Child(cx: Context, props: &ChildProps) -> Element {
- rsx!(cx, "Hello {props.title}")
+ rsx!(cx, "Hello {cx.props.title}")
}
```
diff --git a/examples/async.rs b/examples/async.rs
index 7143a9af6..16f28809e 100644
--- a/examples/async.rs
+++ b/examples/async.rs
@@ -8,12 +8,12 @@ use gloo_timers::future::TimeoutFuture;
#[tokio::main]
async fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
-pub static App: Component<()> = |cx, _| {
- let count = use_state(cx, || 0);
- let mut direction = use_state(cx, || 1);
+pub static App: Component<()> = |cx| {
+ let count = use_state(&cx, || 0);
+ let mut direction = use_state(&cx, || 1);
let (async_count, dir) = (count.for_async(), *direction);
diff --git a/examples/borrowed.rs b/examples/borrowed.rs
index 35ec2cfba..cf497bbc4 100644
--- a/examples/borrowed.rs
+++ b/examples/borrowed.rs
@@ -17,10 +17,10 @@ and is proven to be safe with MIRI.
use dioxus::prelude::*;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
-fn App(cx: Scope, props: &()) -> Element {
+fn App(cx: Scope<()>) -> Element {
let text: &mut Vec = cx.use_hook(|_| vec![String::from("abc=def")], |f| f);
let first = text.get_mut(0).unwrap();
@@ -39,7 +39,7 @@ struct C1Props<'a> {
text: &'a mut String,
}
-fn Child1(cx: Scope, props: &C1Props) -> Element {
+fn Child1<'a>(cx: Scope<'a, C1Props<'a>>) -> Element {
let (left, right) = props.text.split_once("=").unwrap();
cx.render(rsx! {
@@ -55,7 +55,7 @@ struct C2Props<'a> {
text: &'a str,
}
-fn Child2(cx: Scope, props: &C2Props) -> Element {
+fn Child2<'a>(cx: Scope<'a, C2Props<'a>>) -> Element {
cx.render(rsx! {
Child3 {
text: props.text
@@ -68,8 +68,8 @@ struct C3Props<'a> {
text: &'a str,
}
-fn Child3(cx: Scope, props: &C3Props) -> Element {
+fn Child3<'a>(cx: Scope<'a, C3Props<'a>>) -> Element {
cx.render(rsx! {
- div { "{props.text}"}
+ div { "{cx.props.text}"}
})
}
diff --git a/examples/calculator.rs b/examples/calculator.rs
index 442ddb7f8..6a83bfa63 100644
--- a/examples/calculator.rs
+++ b/examples/calculator.rs
@@ -10,13 +10,13 @@ use dioxus::prelude::*;
use separator::Separatable;
fn main() {
- dioxus::desktop::launch(APP, |cfg| cfg);
+ dioxus::desktop::launch(APP);
}
-const APP: Component<()> = |cx, _| {
- let cur_val = use_state(cx, || 0.0_f64);
- let operator = use_state(cx, || None as Option<&'static str>);
- let display_value = use_state(cx, || String::from(""));
+static APP: Component<()> = |cx| {
+ let cur_val = use_state(&cx, || 0.0_f64);
+ let operator = use_state(&cx, || None as Option<&'static str>);
+ let display_value = use_state(&cx, || String::from(""));
let toggle_percent = move |_| todo!();
let input_digit = move |num: u8| display_value.modify().push_str(num.to_string().as_str());
@@ -117,13 +117,13 @@ const APP: Component<()> = |cx, _| {
struct CalculatorKeyProps<'a> {
name: &'static str,
onclick: &'a dyn Fn(Arc),
- children: Element,
+ children: Element<'a>,
}
-fn CalculatorKey<'a>(cx: Scope, props: &CalculatorKeyProps) -> Element {
+fn CalculatorKey<'a>(cx: Scope<'a, CalculatorKeyProps<'a>>) -> Element {
rsx!(cx, button {
- class: "calculator-key {props.name}"
- onclick: {props.onclick}
+ class: "calculator-key {cx.props.name}"
+ onclick: {cx.props.onclick}
{&props.children}
})
}
diff --git a/examples/core/alternative.rs b/examples/core/alternative.rs
index 6c20e2adf..a009a88cb 100644
--- a/examples/core/alternative.rs
+++ b/examples/core/alternative.rs
@@ -9,7 +9,7 @@ fn main() {
println!("{}", dom);
}
-pub static EXAMPLE: FC<()> = |cx, _| {
+pub static EXAMPLE: Component<()> = |cx| {
let list = (0..10).map(|_f| {
rsx! {
"{_f}"
diff --git a/examples/core/async.rs b/examples/core/async.rs
index a21f82652..2919651d2 100644
--- a/examples/core/async.rs
+++ b/examples/core/async.rs
@@ -5,7 +5,7 @@ fn main() {
dom.rebuild();
}
-const App: FC<()> = |cx, props| {
+const App: Component<()> = |cx| {
let id = cx.scope_id();
// cx.submit_task(Box::pin(async move { id }));
diff --git a/examples/core/contextapi.rs b/examples/core/contextapi.rs
index 6c90a60c7..d538d49ae 100644
--- a/examples/core/contextapi.rs
+++ b/examples/core/contextapi.rs
@@ -6,7 +6,7 @@ struct SomeContext {
}
#[allow(unused)]
-static Example: FC<()> = |cx, props| {
+static Example: Component<()> = |cx| {
todo!()
// let value = cx.use_context(|c: &SomeContext| c.items.last().unwrap());
diff --git a/examples/core/jsframework.rs b/examples/core/jsframework.rs
index 207f6e84e..15c25ec8d 100644
--- a/examples/core/jsframework.rs
+++ b/examples/core/jsframework.rs
@@ -47,9 +47,9 @@ fn Row<'a>((cx, props): Scope<'a, RowProps>) -> Element<'a> {
};
cx.render(rsx! {
tr {
- // td { class:"col-md-1", "{props.row_id}" }
+ // td { class:"col-md-1", "{cx.props.row_id}" }
// td { class:"col-md-1", onclick: move |_| { /* run onselect */ }
- // a { class: "lbl", "{props.label}" }
+ // a { class: "lbl", "{cx.props.label}" }
// }
// td { class: "col-md-1"
// a { class: "remove", onclick: {handler}
diff --git a/examples/core/syntax.rs b/examples/core/syntax.rs
index 9a21bc7e6..2339af8ad 100644
--- a/examples/core/syntax.rs
+++ b/examples/core/syntax.rs
@@ -31,9 +31,9 @@ fn html_usage() {
// let p = rsx!(div { {f} });
}
-static App2: FC<()> = |cx, _| cx.render(rsx!("hello world!"));
+static App2: Component<()> = |cx, _| cx.render(rsx!("hello world!"));
-static App: FC<()> = |cx, props| {
+static App: Component<()> = |cx| {
let name = cx.use_state(|| 0);
cx.render(rsx!(div {
@@ -71,7 +71,7 @@ struct ChildProps {
fn Child<'a>((cx, props): Scope<'a, ChildProps>) -> Element<'a> {
cx.render(rsx!(div {
- // {props.children}
+ // {cx.props.children}
}))
}
@@ -99,7 +99,7 @@ impl<'a> Children<'a> {
}
}
-static Bapp: FC<()> = |cx, props| {
+static Bapp: Component<()> = |cx| {
let name = cx.use_state(|| 0);
cx.render(rsx!(
@@ -114,7 +114,7 @@ static Bapp: FC<()> = |cx, props| {
))
};
-static Match: FC<()> = |cx, props| {
+static Match: Component<()> = |cx| {
//
let b: Box VNode> = Box::new(|f| todo!());
diff --git a/examples/core/syntax2.rs b/examples/core/syntax2.rs
index 54c0bedaa..0b3a9e049 100644
--- a/examples/core/syntax2.rs
+++ b/examples/core/syntax2.rs
@@ -40,7 +40,7 @@ fn t() {
// let a = rsx! {
// div {
// "asd"
-// "{props.foo}"
+// "{cx.props.foo}"
// }
// };
diff --git a/examples/core/vdom_usage.rs b/examples/core/vdom_usage.rs
index cbe3c324f..844174062 100644
--- a/examples/core/vdom_usage.rs
+++ b/examples/core/vdom_usage.rs
@@ -4,7 +4,7 @@ use dioxus_core::{lazynodes::LazyNodes, prelude::*};
// #[async_std::main]
fn main() {
- static App: FC<()> =
+ static App: Component<()> =
|cx, props| cx.render(Some(LazyNodes::new(move |f| f.text(format_args!("hello")))));
let mut dom = VirtualDom::new(App);
diff --git a/examples/core_reference/antipatterns.rs b/examples/core_reference/antipatterns.rs
index 735a57104..50fecc4f5 100644
--- a/examples/core_reference/antipatterns.rs
+++ b/examples/core_reference/antipatterns.rs
@@ -32,14 +32,14 @@ use dioxus::prelude::*;
struct NoKeysProps {
data: std::collections::HashMap,
}
-static AntipatternNoKeys: FC = |cx, props| {
+static AntipatternNoKeys: Component = |cx| {
// WRONG: Make sure to add keys!
rsx!(cx, ul {
- {props.data.iter().map(|(k, v)| rsx!(li { "List item: {v}" }))}
+ {cx.props.data.iter().map(|(k, v)| rsx!(li { "List item: {v}" }))}
});
// RIGHT: Like this:
rsx!(cx, ul {
- {props.data.iter().map(|(k, v)| rsx!(li { key: "{k}", "List item: {v}" }))}
+ {cx.props.data.iter().map(|(k, v)| rsx!(li { key: "{k}", "List item: {v}" }))}
})
};
@@ -54,7 +54,7 @@ static AntipatternNoKeys: FC = |cx, props| {
///
/// Only Component and Fragment nodes are susceptible to this issue. Dioxus mitigates this with components by providing
/// an API for registering shared state without the ContextProvider pattern.
-static AntipatternNestedFragments: FC<()> = |cx, props| {
+static AntipatternNestedFragments: Component<()> = |cx| {
// Try to avoid heavily nesting fragments
rsx!(cx,
Fragment {
@@ -82,8 +82,8 @@ static AntipatternNestedFragments: FC<()> = |cx, props| {
/// However, calling set_state will *not* update the current version of state in the component. This should be easy to
/// recognize from the function signature, but Dioxus will not update the "live" version of state. Calling `set_state`
/// merely places a new value in the queue and schedules the component for a future update.
-static AntipatternRelyingOnSetState: FC<()> = |cx, props| {
- let (state, set_state) = use_state(cx, || "Hello world").classic();
+static AntipatternRelyingOnSetState: Component<()> = |cx| {
+ let (state, set_state) = use_state(&cx, || "Hello world").classic();
set_state("New state");
// This will return false! `state` will *still* be "Hello world"
assert!(state == &"New state");
@@ -99,7 +99,7 @@ static AntipatternRelyingOnSetState: FC<()> = |cx, props| {
/// - All components must start with an uppercase character
///
/// i.e.: the following component will be rejected when attempted to be used in the rsx! macro
-static antipattern_component: FC<()> = |cx, props| todo!();
+static antipattern_component: Component<()> = |cx, props| todo!();
/// Antipattern: Misusing hooks
/// ---------------------------
@@ -120,11 +120,11 @@ static antipattern_component: FC<()> = |cx, props| todo!();
struct MisuedHooksProps {
should_render_state: bool,
}
-static AntipatternMisusedHooks: FC = |cx, props| {
+static AntipatternMisusedHooks: Component = |cx| {
if props.should_render_state {
// do not place a hook in the conditional!
// prefer to move it out of the conditional
- let (state, set_state) = use_state(cx, || "hello world").classic();
+ let (state, set_state) = use_state(&cx, || "hello world").classic();
rsx!(cx, div { "{state}" })
} else {
rsx!(cx, div { "Not rendering state" })
@@ -153,7 +153,7 @@ static AntipatternMisusedHooks: FC = |cx, props| {
/// }
/// }
/// })
-static _example: FC<()> = |cx, props| todo!();
+static _example: Component<()> = |cx, props| todo!();
/// Antipattern: publishing components and hooks with all features enabled
/// ----------------------------------------------------------------------
@@ -171,9 +171,9 @@ static _example: FC<()> = |cx, props| todo!();
///
/// This will only include the `core` dioxus crate which is relatively slim and fast to compile and avoids target-specific
/// libraries.
-static __example: FC<()> = |cx, props| todo!();
+static __example: Component<()> = |cx, props| todo!();
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
AntipatternNoKeys { data: std::collections::HashMap::new() }
AntipatternNestedFragments {}
diff --git a/examples/core_reference/basics.rs b/examples/core_reference/basics.rs
index 6a3807bb2..11c3a59c3 100644
--- a/examples/core_reference/basics.rs
+++ b/examples/core_reference/basics.rs
@@ -9,7 +9,7 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
div {
Greeting {
@@ -25,10 +25,10 @@ struct GreetingProps {
name: &'static str,
}
-static Greeting: FC = |cx, props| {
+static Greeting: Component = |cx| {
cx.render(rsx! {
div {
- h1 { "Hello, {props.name}!" }
+ h1 { "Hello, {cx.props.name}!" }
p { "Welcome to the Dioxus framework" }
br {}
{cx.children()}
diff --git a/examples/core_reference/children.rs b/examples/core_reference/children.rs
index bdd3108d0..48c940b60 100644
--- a/examples/core_reference/children.rs
+++ b/examples/core_reference/children.rs
@@ -18,7 +18,7 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
div {
Banner {
@@ -31,7 +31,7 @@ pub static Example: FC<()> = |cx, props| {
})
};
-pub static Banner: FC<()> = |cx, props| {
+pub static Banner: Component<()> = |cx| {
cx.render(rsx! {
div {
h1 { "This is a great banner!" }
diff --git a/examples/core_reference/conditional_rendering.rs b/examples/core_reference/conditional_rendering.rs
index 6a5fe9a64..d73f562e0 100644
--- a/examples/core_reference/conditional_rendering.rs
+++ b/examples/core_reference/conditional_rendering.rs
@@ -16,10 +16,10 @@ use dioxus::prelude::*;
pub struct MyProps {
should_show: bool,
}
-pub static Example0: FC = |cx, props| {
+pub static Example0: Component = |cx| {
cx.render(rsx! {
div {
- {props.should_show.then(|| rsx!{
+ {cx.props.should_show.then(|| rsx!{
h1 { "showing the title!" }
})}
}
@@ -39,7 +39,7 @@ pub static Example0: FC = |cx, props| {
pub struct MyProps1 {
should_show: bool,
}
-pub static Example1: FC = |cx, props| {
+pub static Example1: Component = |cx| {
cx.render(rsx! {
div {
// With matching
@@ -77,7 +77,7 @@ pub enum Color {
pub struct MyProps2 {
color: Color,
}
-pub static Example2: FC = |cx, props| {
+pub static Example2: Component = |cx| {
cx.render(rsx! {
div {
{match props.color {
@@ -89,9 +89,9 @@ pub static Example2: FC = |cx, props| {
})
};
-pub static Example: FC<()> = |cx, props| {
- let should_show = use_state(cx, || false);
- let mut color_index = use_state(cx, || 0);
+pub static Example: Component<()> = |cx| {
+ let should_show = use_state(&cx, || false);
+ let mut color_index = use_state(&cx, || 0);
let color = match *color_index % 2 {
2 => Color::Green,
1 => Color::Yellow,
diff --git a/examples/core_reference/controlled_inputs.rs b/examples/core_reference/controlled_inputs.rs
index bdabe83d2..2c97ec1ff 100644
--- a/examples/core_reference/controlled_inputs.rs
+++ b/examples/core_reference/controlled_inputs.rs
@@ -1,7 +1,7 @@
use dioxus::prelude::*;
fn main() {}
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
div {
@@ -10,8 +10,8 @@ pub static Example: FC<()> = |cx, props| {
};
// A controlled component:
-static ControlledSelect: FC<()> = |cx, props| {
- let value = use_state(cx, || String::from("Grapefruit"));
+static ControlledSelect: Component<()> = |cx| {
+ let value = use_state(&cx, || String::from("Grapefruit"));
cx.render(rsx! {
select { value: "{value}", onchange: move |evt| value.set(evt.value()),
option { value: "Grapefruit", "Grapefruit"}
@@ -23,8 +23,8 @@ static ControlledSelect: FC<()> = |cx, props| {
};
// TODO - how do uncontrolled things work?
-static UncontrolledSelect: FC<()> = |cx, props| {
- let value = use_state(cx, || String::new());
+static UncontrolledSelect: Component<()> = |cx| {
+ let value = use_state(&cx, || String::new());
cx.render(rsx! {
select {
diff --git a/examples/core_reference/custom_elements.rs b/examples/core_reference/custom_elements.rs
index 053b3aea5..63024213a 100644
--- a/examples/core_reference/custom_elements.rs
+++ b/examples/core_reference/custom_elements.rs
@@ -11,7 +11,7 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
div {
custom_element {
diff --git a/examples/core_reference/empty.rs b/examples/core_reference/empty.rs
index 28914bd6b..aebf7e71f 100644
--- a/examples/core_reference/empty.rs
+++ b/examples/core_reference/empty.rs
@@ -5,4 +5,4 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| cx.render(rsx! { Fragment {} });
+pub static Example: Component<()> = |cx, props| cx.render(rsx! { Fragment {} });
diff --git a/examples/core_reference/errorhandling.rs b/examples/core_reference/errorhandling.rs
index e598726e5..cc21a62f9 100644
--- a/examples/core_reference/errorhandling.rs
+++ b/examples/core_reference/errorhandling.rs
@@ -23,14 +23,14 @@ fn main() {}
/// This is one way to go about error handling (just toss things away with unwrap).
/// However, if you get it wrong, the whole app will crash.
/// This is pretty flimsy.
-static App: FC<()> = |cx, props| {
+static App: Component<()> = |cx| {
let data = get_data().unwrap();
cx.render(rsx!( div { "{data}" } ))
};
/// This is a pretty verbose way of error handling
/// However, it's still pretty good since we don't panic, just fail to render anything
-static App1: FC<()> = |cx, props| {
+static App1: Component<()> = |cx| {
let data = match get_data() {
Some(data) => data,
None => return None,
@@ -46,7 +46,7 @@ static App1: FC<()> = |cx, props| {
/// a user is logged in.
///
/// Dioxus will throw an error in the console if the None-path is ever taken.
-static App2: FC<()> = |cx, props| {
+static App2: Component<()> = |cx| {
let data = get_data()?;
cx.render(rsx!( div { "{data}" } ))
};
@@ -54,14 +54,14 @@ static App2: FC<()> = |cx, props| {
/// This is top-tier error handling since it displays a failure state.
///
/// However, the error is lacking in context.
-static App3: FC<()> = |cx, props| match get_data() {
+static App3: Component<()> = |cx, props| match get_data() {
Some(data) => cx.render(rsx!( div { "{data}" } )),
None => cx.render(rsx!( div { "Failed to load data :(" } )),
};
/// For errors that return results, it's possible to short-circuit the match-based error handling with `.ok()` which converts
/// a Result into an Option and lets you abort rendering by early-returning `None`
-static App4: FC<()> = |cx, props| {
+static App4: Component<()> = |cx| {
let data = get_data_err().ok()?;
cx.render(rsx!( div { "{data}" } ))
};
@@ -69,7 +69,7 @@ static App4: FC<()> = |cx, props| {
/// This is great error handling since it displays a failure state... with context!
///
/// Hopefully you'll never need to display a screen like this. It's rather bad taste
-static App5: FC<()> = |cx, props| match get_data_err() {
+static App5: Component<()> = |cx, props| match get_data_err() {
Ok(data) => cx.render(rsx!( div { "{data}" } )),
Err(c) => cx.render(rsx!( div { "Failed to load data: {c}" } )),
};
diff --git a/examples/core_reference/fragments.rs b/examples/core_reference/fragments.rs
index 88c9dcaea..0532abd27 100644
--- a/examples/core_reference/fragments.rs
+++ b/examples/core_reference/fragments.rs
@@ -11,7 +11,7 @@
use dioxus::prelude::*;
// Returning multiple elements with rsx! or html!
-static App1: FC<()> = |cx, props| {
+static App1: Component<()> = |cx| {
cx.render(rsx! {
h1 { }
h2 { }
@@ -20,7 +20,7 @@ static App1: FC<()> = |cx, props| {
};
// Using the Fragment component
-static App2: FC<()> = |cx, props| {
+static App2: Component<()> = |cx| {
cx.render(rsx! {
Fragment {
div {}
@@ -31,7 +31,7 @@ static App2: FC<()> = |cx, props| {
};
// Using the `fragment` method on the NodeFactory
-static App3: FC<()> = |cx, props| {
+static App3: Component<()> = |cx| {
cx.render(LazyNodes::new(move |fac| {
fac.fragment_from_iter([
fac.text(format_args!("A")),
@@ -42,7 +42,7 @@ static App3: FC<()> = |cx, props| {
}))
};
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
App1 {}
App2 {}
diff --git a/examples/core_reference/global_css.rs b/examples/core_reference/global_css.rs
index 5e7c75a8c..6b7de70f0 100644
--- a/examples/core_reference/global_css.rs
+++ b/examples/core_reference/global_css.rs
@@ -19,7 +19,7 @@ h1 {color: blue;}
p {color: red;}
"#;
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
head { style { "{STYLE}" } }
body {
diff --git a/examples/core_reference/inline_styles.rs b/examples/core_reference/inline_styles.rs
index e3a45154c..c60364b75 100644
--- a/examples/core_reference/inline_styles.rs
+++ b/examples/core_reference/inline_styles.rs
@@ -10,7 +10,7 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
head {
style: { background_color: "powderblue" }
@@ -29,7 +29,7 @@ pub static Example: FC<()> = |cx, props| {
// .... technically the rsx! macro is slightly broken at the moment and allows styles not wrapped in style {}
// I haven't noticed any name collisions yet, and am tentatively leaving this behavior in..
// Don't rely on it.
-static Example2: FC<()> = |cx, props| {
+static Example2: Component<()> = |cx| {
cx.render(rsx! {
div { color: "red"
"hello world!"
diff --git a/examples/core_reference/iterators.rs b/examples/core_reference/iterators.rs
index f8feae8a8..55d725a21 100644
--- a/examples/core_reference/iterators.rs
+++ b/examples/core_reference/iterators.rs
@@ -12,8 +12,8 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| {
- let example_data = use_state(cx, || 0);
+pub static Example: Component<()> = |cx| {
+ let example_data = use_state(&cx, || 0);
let v = (0..10).map(|f| {
rsx! {
diff --git a/examples/core_reference/listener.rs b/examples/core_reference/listener.rs
index 63813e423..891ee3743 100644
--- a/examples/core_reference/listener.rs
+++ b/examples/core_reference/listener.rs
@@ -7,7 +7,7 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
ButtonList {}
NonUpdatingEvents {}
@@ -16,8 +16,8 @@ pub static Example: FC<()> = |cx, props| {
};
/// We can use `set_name` in multiple closures; the closures automatically *copy* the reference to set_name.
-static ButtonList: FC<()> = |cx, props| {
- let name = use_state(cx, || "...?");
+static ButtonList: Component<()> = |cx| {
+ let name = use_state(&cx, || "...?");
let names = ["jack", "jill", "john", "jane"]
.iter()
@@ -33,7 +33,7 @@ static ButtonList: FC<()> = |cx, props| {
/// This shows how listeners may be without a visible change in the display.
/// Check the console.
-static NonUpdatingEvents: FC<()> = |cx, props| {
+static NonUpdatingEvents: Component<()> = |cx| {
rsx!(cx, div {
button {
onclick: move |_| log::info!("Did not cause any updates!")
@@ -42,7 +42,7 @@ static NonUpdatingEvents: FC<()> = |cx, props| {
})
};
-static DisablePropagation: FC<()> = |cx, props| {
+static DisablePropagation: Component<()> = |cx| {
rsx!(cx,
div {
onclick: move |_| log::info!("event propagated to the div!")
diff --git a/examples/core_reference/memo.rs b/examples/core_reference/memo.rs
index 40aa54191..86831842b 100644
--- a/examples/core_reference/memo.rs
+++ b/examples/core_reference/memo.rs
@@ -21,7 +21,7 @@ use dioxus::prelude::*;
// By default, components with no props are always memoized.
// A props of () is considered empty.
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
div { "100% memoized!" }
})
@@ -35,9 +35,9 @@ pub struct MyProps1 {
name: String,
}
-pub static Example1: FC = |cx, props| {
+pub static Example1: Component = |cx| {
cx.render(rsx! {
- div { "100% memoized! {props.name}" }
+ div { "100% memoized! {cx.props.name}" }
})
};
@@ -49,9 +49,9 @@ pub struct MyProps2 {
name: std::rc::Rc,
}
-pub static Example2: FC = |cx, props| {
+pub static Example2: Component = |cx| {
cx.render(rsx! {
- div { "100% memoized! {props.name}" }
+ div { "100% memoized! {cx.props.name}" }
})
};
@@ -61,11 +61,11 @@ pub struct MyProps3<'a> {
name: &'a str,
}
// We need to manually specify a lifetime that ensures props and scope (the component's state) share the same lifetime.
-// Using the `pub static Example: FC<()>` pattern _will_ specify a lifetime, but that lifetime will be static which might
+// Using the `pub static Example: Component<()>` pattern _will_ specify a lifetime, but that lifetime will be static which might
// not exactly be what you want
fn Example3<'a>(cx: Context<'a>, props: &'a MyProps3) -> DomTree<'a> {
cx.render(rsx! {
- div { "Not memoized! {props.name}" }
+ div { "Not memoized! {cx.props.name}" }
})
}
diff --git a/examples/core_reference/noderefs.rs b/examples/core_reference/noderefs.rs
index 8d22ee5b4..c520abdca 100644
--- a/examples/core_reference/noderefs.rs
+++ b/examples/core_reference/noderefs.rs
@@ -1,7 +1,7 @@
use dioxus::prelude::*;
fn main() {}
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
let p = 10;
cx.render(rsx! {
diff --git a/examples/core_reference/signals.rs b/examples/core_reference/signals.rs
index 2e69d8e66..06fb6ab1b 100644
--- a/examples/core_reference/signals.rs
+++ b/examples/core_reference/signals.rs
@@ -1,7 +1,7 @@
use dioxus::prelude::*;
fn main() {}
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
div {
diff --git a/examples/core_reference/spreadpattern.rs b/examples/core_reference/spreadpattern.rs
index 58a813cb5..c197f87e6 100644
--- a/examples/core_reference/spreadpattern.rs
+++ b/examples/core_reference/spreadpattern.rs
@@ -9,7 +9,7 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
let props = MyProps {
count: 0,
live: true,
@@ -27,7 +27,7 @@ pub struct MyProps {
name: &'static str,
}
-pub static Example1: FC = |cx, MyProps { count, live, name }| {
+pub static Example1: Component = |cx, MyProps { count, live, name }| {
cx.render(rsx! {
div {
h1 { "Hello, {name}"}
diff --git a/examples/core_reference/statemanagement.rs b/examples/core_reference/statemanagement.rs
index 2e69d8e66..06fb6ab1b 100644
--- a/examples/core_reference/statemanagement.rs
+++ b/examples/core_reference/statemanagement.rs
@@ -1,7 +1,7 @@
use dioxus::prelude::*;
fn main() {}
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
div {
diff --git a/examples/core_reference/suspense.rs b/examples/core_reference/suspense.rs
index e3bbd2574..bbe536d3e 100644
--- a/examples/core_reference/suspense.rs
+++ b/examples/core_reference/suspense.rs
@@ -14,7 +14,7 @@ struct DogApi {
}
const ENDPOINT: &str = "https://dog.ceo/api/breeds/image/random";
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
let doggo = use_suspense(
cx,
|| surf::get(ENDPOINT).recv_json::(),
diff --git a/examples/core_reference/task.rs b/examples/core_reference/task.rs
index a5e877bc6..7fad94381 100644
--- a/examples/core_reference/task.rs
+++ b/examples/core_reference/task.rs
@@ -24,9 +24,9 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| {
- let count = use_state(cx, || 0);
- let mut direction = use_state(cx, || 1);
+pub static Example: Component<()> = |cx| {
+ let count = use_state(&cx, || 0);
+ let mut direction = use_state(&cx, || 1);
// Tasks are 'static, so we need to copy relevant items in
let (async_count, dir) = (count.for_async(), *direction);
diff --git a/examples/core_reference/testing.rs b/examples/core_reference/testing.rs
index 587ce19cc..ec10acaa3 100644
--- a/examples/core_reference/testing.rs
+++ b/examples/core_reference/testing.rs
@@ -1,6 +1,6 @@
use dioxus::prelude::*;
-pub static Example: FC<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
cx.render(rsx! {
div {
diff --git a/examples/core_reference/tostring.rs b/examples/core_reference/tostring.rs
index a04a165da..09f8d95d1 100644
--- a/examples/core_reference/tostring.rs
+++ b/examples/core_reference/tostring.rs
@@ -1,13 +1,13 @@
use dioxus::prelude::*;
use dioxus::ssr;
-pub static Example: FC<()> = |cx, props| {
- let as_string = use_state(cx, || {
+pub static Example: Component<()> = |cx| {
+ let as_string = use_state(&cx, || {
// Currently, SSR is only supported for whole VirtualDOMs
// This is an easy/low hanging fruit to improve upon
let mut dom = VirtualDom::new(SomeApp);
dom.rebuild();
- ssr::render_vdom(&dom, |c| c)
+ ssr::render_vdom(&dom)
});
cx.render(rsx! {
@@ -15,7 +15,7 @@ pub static Example: FC<()> = |cx, props| {
})
};
-static SomeApp: FC<()> = |cx, props| {
+static SomeApp: Component<()> = |cx| {
cx.render(rsx! {
div { style: {background_color: "blue"}
h1 {"Some amazing app or component"}
diff --git a/examples/coroutine.rs b/examples/coroutine.rs
index 61bed91c3..e112c2995 100644
--- a/examples/coroutine.rs
+++ b/examples/coroutine.rs
@@ -22,14 +22,14 @@
//! the coroutine was initiated. `use_state` always returns the same setter, so you don't need to worry about
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
use dioxus::prelude::*;
-static App: Component<()> = |cx, props| {
- let p1 = use_state(cx, || 0);
- let p2 = use_state(cx, || 0);
+static App: Component<()> = |cx| {
+ let p1 = use_state(&cx, || 0);
+ let p2 = use_state(&cx, || 0);
let (mut p1_async, mut p2_async) = (p1.for_async(), p2.for_async());
let (p1_handle, _) = use_coroutine(cx, || async move {
diff --git a/examples/crm.rs b/examples/crm.rs
index f146e0856..2ae7d3ee0 100644
--- a/examples/crm.rs
+++ b/examples/crm.rs
@@ -4,7 +4,7 @@ Tiny CRM: A port of the Yew CRM example to Dioxus.
use dioxus::prelude::*;
fn main() {
- dioxus::web::launch(App, |c| c);
+ dioxus::web::launch(App);
}
enum Scene {
ClientsList,
@@ -19,13 +19,13 @@ pub struct Client {
pub description: String,
}
-static App: Component<()> = |cx, _| {
- let mut clients = use_ref(cx, || vec![] as Vec);
- let mut scene = use_state(cx, || Scene::ClientsList);
+static App: Component<()> = |cx| {
+ let mut clients = use_ref(&cx, || vec![] as Vec);
+ let mut scene = use_state(&cx, || Scene::ClientsList);
- let mut firstname = use_state(cx, || String::new());
- let mut lastname = use_state(cx, || String::new());
- let mut description = use_state(cx, || String::new());
+ let mut firstname = use_state(&cx, || String::new());
+ let mut lastname = use_state(&cx, || String::new());
+ let mut description = use_state(&cx, || String::new());
let scene = match *scene {
Scene::ClientsList => {
diff --git a/examples/desktop/crm.rs b/examples/desktop/crm.rs
index 8cc5b2988..f216f884f 100644
--- a/examples/desktop/crm.rs
+++ b/examples/desktop/crm.rs
@@ -5,7 +5,7 @@ use dioxus_hooks::*;
use dioxus_html as dioxus_elements;
fn main() {
- dioxus_desktop::launch(App, |c| c)
+ dioxus_desktop::launch(App)
}
enum Scene {
@@ -21,13 +21,13 @@ pub struct Client {
pub description: String,
}
-static App: FC<()> = |cx, _| {
- let mut scene = use_state(cx, || Scene::ClientsList);
- let clients = use_ref(cx, || vec![] as Vec);
+static App: Component<()> = |cx| {
+ let mut scene = use_state(&cx, || Scene::ClientsList);
+ let clients = use_ref(&cx, || vec![] as Vec);
- let mut firstname = use_state(cx, String::new);
- let mut lastname = use_state(cx, String::new);
- let mut description = use_state(cx, String::new);
+ let mut firstname = use_state(&cx, String::new);
+ let mut lastname = use_state(&cx, String::new);
+ let mut description = use_state(&cx, String::new);
let scene = match scene.get() {
Scene::ClientsList => {
diff --git a/examples/desktop/demo.rs b/examples/desktop/demo.rs
index 77a927e99..d327b7f32 100644
--- a/examples/desktop/demo.rs
+++ b/examples/desktop/demo.rs
@@ -5,10 +5,10 @@ use dioxus_core_macro::*;
use dioxus_html as dioxus_elements;
fn main() {
- dioxus_desktop::launch(App, |c| c);
+ dioxus_desktop::launch(App);
}
-static App: FC<()> = |cx, props| {
+static App: Component<()> = |cx| {
cx.render(rsx!(
div {
"hello world!"
diff --git a/examples/desktop/todomvc.rs b/examples/desktop/todomvc.rs
index d8edf40e4..2674d9dee 100644
--- a/examples/desktop/todomvc.rs
+++ b/examples/desktop/todomvc.rs
@@ -14,7 +14,7 @@ fn main() {
SimpleLogger::new().init().unwrap();
}
- dioxus_desktop::launch(App, |c| c)
+ dioxus_desktop::launch(App)
}
#[derive(PartialEq)]
@@ -32,14 +32,14 @@ pub struct TodoItem {
}
pub type Todos = HashMap;
-pub static App: FC<()> = |cx, _| {
+pub static App: Component<()> = |cx| {
// Share our TodoList to the todos themselves
use_provide_state(cx, Todos::new);
// Save state for the draft, filter
- let draft = use_state(cx, || "".to_string());
- let filter = use_state(cx, || FilterState::All);
- let mut todo_id = use_state(cx, || 0);
+ let draft = use_state(&cx, || "".to_string());
+ let filter = use_state(&cx, || FilterState::All);
+ let mut todo_id = use_state(&cx, || 0);
// Consume the todos
let todos = use_shared_state::(cx)?;
@@ -142,7 +142,7 @@ pub fn TodoEntry((cx, props): Scope) -> Element {
let _todos = todos.read();
let todo = _todos.get(&props.id)?;
- let is_editing = use_state(cx, || false);
+ let is_editing = use_state(&cx, || false);
let completed = if todo.checked { "completed" } else { "" };
cx.render(rsx!{
diff --git a/examples/file_explorer.rs b/examples/file_explorer.rs
index 74ea6a7d9..98b729896 100644
--- a/examples/file_explorer.rs
+++ b/examples/file_explorer.rs
@@ -9,7 +9,7 @@ use dioxus::prelude::*;
fn main() {
simple_logger::init_with_level(log::Level::Debug);
- dioxus::desktop::launch(App, |c| {
+ dioxus::desktop::launch_cfg(App, |c| {
c.with_window(|w| {
w.with_resizable(true).with_inner_size(
dioxus::desktop::wry::application::dpi::LogicalSize::new(400.0, 800.0),
@@ -18,8 +18,8 @@ fn main() {
});
}
-static App: Component<()> = |cx, props| {
- let file_manager = use_ref(cx, || Files::new());
+static App: Component<()> = |cx| {
+ let file_manager = use_ref(&cx, Files::new);
let files = file_manager.read();
let file_list = files.path_names.iter().enumerate().map(|(dir_id, path)| {
@@ -39,13 +39,15 @@ static App: Component<()> = |cx, props| {
let current_dir = files.current();
- rsx!(cx, div {
- h1 {"Files: "}
- h3 {"Cur dir: {current_dir}"}
- button { "go up", onclick: move |_| file_manager.write().go_up() }
- ol { {file_list} }
- {err_disp}
- })
+ cx.render(rsx!(
+ div {
+ h1 {"Files: "}
+ h3 {"Cur dir: {current_dir}"}
+ button { "go up", onclick: move |_| file_manager.write().go_up() }
+ ol { {file_list} }
+ {err_disp}
+ }
+ ))
};
struct Files {
diff --git a/examples/framework_benchmark.rs b/examples/framework_benchmark.rs
index 44fe202e1..fada80ad4 100644
--- a/examples/framework_benchmark.rs
+++ b/examples/framework_benchmark.rs
@@ -2,8 +2,8 @@ use dioxus::prelude::*;
use rand::prelude::*;
fn main() {
- dioxus::web::launch(App, |c| c);
- // dioxus::desktop::launch(App, |c| c);
+ dioxus::web::launch(App);
+ // dioxus::desktop::launch(App);
}
#[derive(Clone, PartialEq)]
@@ -30,9 +30,9 @@ impl Label {
}
}
-static App: Component<()> = |cx, _props| {
- let mut items = use_ref(cx, || vec![]);
- let mut selected = use_state(cx, || None);
+static App: Component<()> = |cx| {
+ let mut items = use_ref(&cx, || vec![]);
+ let mut selected = use_state(&cx, || None);
cx.render(rsx! {
div { class: "container"
@@ -95,10 +95,10 @@ struct ActionButtonProps<'a> {
onclick: &'a dyn Fn(),
}
-fn ActionButton(cx: Scope, props: &ActionButtonProps) -> Element {
+fn ActionButton<'a>(cx: Scope<'a, ActionButtonProps<'a>>) -> Element {
rsx!(cx, div { class: "col-sm-6 smallpad"
- button { class:"btn btn-primary btn-block", r#type: "button", id: "{props.id}", onclick: move |_| (props.onclick)(),
- "{props.name}"
+ button { class:"btn btn-primary btn-block", r#type: "button", id: "{cx.props.id}", onclick: move |_| (props.onclick)(),
+ "{cx.props.name}"
}
})
}
@@ -149,9 +149,9 @@ static NOUNS: &[&str] = &[
// fn Row(cx: Context, props: &RowProps) -> Element {
// rsx!(cx, tr {
-// td { class:"col-md-1", "{props.row_id}" }
+// td { class:"col-md-1", "{cx.props.row_id}" }
// td { class:"col-md-1", onclick: move |_| { /* run onselect */ }
-// a { class: "lbl", {props.label.labels} }
+// a { class: "lbl", {cx.props.label.labels} }
// }
// td { class: "col-md-1"
// a { class: "remove", onclick: move |_| {/* remove */}
diff --git a/examples/hello_world.rs b/examples/hello_world.rs
index e6c874ba5..f788f9791 100644
--- a/examples/hello_world.rs
+++ b/examples/hello_world.rs
@@ -1,7 +1,7 @@
use dioxus::prelude::*;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
fn App((cx, props): ScopeState<()>) -> Element {
diff --git a/examples/hydration.rs b/examples/hydration.rs
index 22a81ffe7..8189f7cdd 100644
--- a/examples/hydration.rs
+++ b/examples/hydration.rs
@@ -19,8 +19,8 @@ fn main() {
dioxus::desktop::launch(App, |c| c.with_prerendered(content));
}
-static App: Component<()> = |cx, props| {
- let mut val = use_state(cx, || 0);
+static App: Component<()> = |cx| {
+ let mut val = use_state(&cx, || 0);
cx.render(rsx! {
div {
diff --git a/examples/pattern_model.rs b/examples/pattern_model.rs
index d0a9e7290..f59a548cb 100644
--- a/examples/pattern_model.rs
+++ b/examples/pattern_model.rs
@@ -16,13 +16,13 @@
//! RefMuts at the same time.
use dioxus::desktop::wry::application::dpi::LogicalSize;
-use dioxus::events::{on::*, KeyCode};
+use dioxus::events::*;
use dioxus::prelude::*;
const STYLE: &str = include_str!("./assets/calculator.css");
fn main() {
env_logger::init();
- dioxus::desktop::launch(App, |cfg| {
+ dioxus::desktop::launch_cfg(App, |cfg| {
cfg.with_window(|w| {
w.with_title("Calculator Demo")
.with_resizable(false)
@@ -31,8 +31,8 @@ fn main() {
});
}
-static App: Component<()> = |cx, props| {
- let state = use_ref(cx, || Calculator::new());
+static App: Component<()> = |cx| {
+ let state = use_ref(&cx, || Calculator::new());
let clear_display = state.read().display_value.eq("0");
let clear_text = if clear_display { "C" } else { "AC" };
@@ -80,8 +80,8 @@ struct CalculatorKeyProps<'a> {
fn CalculatorKey<'a>((cx, props): ScopeState<'a, CalculatorKeyProps<'a>>) -> Element<'a> {
cx.render(rsx! {
button {
- class: "calculator-key {props.name}"
- onclick: {props.onclick}
+ class: "calculator-key {cx.props.name}"
+ onclick: {cx.props.onclick}
{&props.children}
}
})
diff --git a/examples/pattern_reducer.rs b/examples/pattern_reducer.rs
index 42c1976f9..7441516a3 100644
--- a/examples/pattern_reducer.rs
+++ b/examples/pattern_reducer.rs
@@ -8,11 +8,11 @@
use dioxus::prelude::*;
fn main() {
env_logger::init();
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
-pub static App: Component<()> = |cx, _| {
- let state = use_state(cx, PlayerState::new);
+pub static App: Component<()> = |cx| {
+ let state = use_state(&cx, PlayerState::new);
let is_playing = state.is_playing();
diff --git a/examples/readme.rs b/examples/readme.rs
index afff68f87..aa4cd9a8a 100644
--- a/examples/readme.rs
+++ b/examples/readme.rs
@@ -4,11 +4,11 @@
use dioxus::prelude::*;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
-static App: Component<()> = |cx, props| {
- let mut count = use_state(cx, || 0);
+static App: Component<()> = |cx| {
+ let mut count = use_state(&cx, || 0);
cx.render(rsx! {
div {
diff --git a/examples/router.rs b/examples/router.rs
index 66b86f56d..be055fe9e 100644
--- a/examples/router.rs
+++ b/examples/router.rs
@@ -23,7 +23,7 @@ pub enum Route {
NotFound,
}
-static App: Component<()> = |cx, props| {
+static App: Component<()> = |cx| {
let route = use_router(cx, Route::parse)?;
cx.render(rsx! {
diff --git a/examples/rsx_usage.rs b/examples/rsx_usage.rs
index e27d4c828..9b6283d92 100644
--- a/examples/rsx_usage.rs
+++ b/examples/rsx_usage.rs
@@ -39,7 +39,7 @@
//! - Allow top-level fragments
//!
fn main() {
- dioxus::desktop::launch(Example, |c| c);
+ dioxus::desktop::launch(Example);
}
/// When trying to return "nothing" to Dioxus, you'll need to specify the type parameter or Rust will be sad.
@@ -49,7 +49,7 @@ const NONE_ELEMENT: Option<()> = None;
use baller::Baller;
use dioxus::prelude::*;
-pub static Example: Component<()> = |cx, props| {
+pub static Example: Component<()> = |cx| {
let formatting = "formatting!";
let formatting_tuple = ("a", "b");
let lazy_fmt = format_args!("lazily formatted text");
diff --git a/examples/ssr.rs b/examples/ssr.rs
index e23251ada..542417c00 100644
--- a/examples/ssr.rs
+++ b/examples/ssr.rs
@@ -5,11 +5,11 @@ use dioxus::ssr;
fn main() {
let mut vdom = VirtualDom::new(App);
- // vdom.rebuild_in_place().expect("Rebuilding failed");
- println!("{}", ssr::render_vdom(&vdom, |c| c));
+ vdom.rebuild_in_place().expect("Rebuilding failed");
+ println!("{}", ssr::render_vdom(&vdom));
}
-static App: Component<()> = |cx, props| {
+static App: Component<()> = |cx| {
cx.render(rsx!(
div {
h1 { "Title" }
@@ -21,6 +21,6 @@ static App: Component<()> = |cx, props| {
struct MyProps<'a> {
text: &'a str,
}
-fn App2(cx: Scope, props: &MyProps) -> Element {
+fn App2<'a>(cx: Scope<'a, MyProps<'a>>) -> Element {
None
}
diff --git a/examples/ssr/basic.rs b/examples/ssr/basic.rs
index c89c425e3..89b976d42 100644
--- a/examples/ssr/basic.rs
+++ b/examples/ssr/basic.rs
@@ -12,7 +12,7 @@ fn main() {
)
}
-pub static App: FC<()> = |cx, props| {
+pub static App: Component<()> = |cx| {
cx.render(rsx!(
div {
class: "overflow-hidden"
diff --git a/examples/ssr/tide.rs b/examples/ssr/tide.rs
index d86fbdf55..d7255b91d 100644
--- a/examples/ssr/tide.rs
+++ b/examples/ssr/tide.rs
@@ -26,7 +26,7 @@ fn main() {}
// dom.rebuild();
// Ok(Response::builder(200)
-// .body(format!("{}", dioxus_ssr::render_vdom(&dom, |c| c)))
+// .body(format!("{}", dioxus_ssr::render_vdom(&dom)))
// .content_type(tide::http::mime::HTML)
// .build())
// });
@@ -42,8 +42,8 @@ fn main() {}
// initial_name: String,
// }
-// static Example: FC = |cx, props| {
-// let dispaly_name = use_state(cx, move || props.initial_name.clone());
+// static Example: Component = |cx| {
+// let dispaly_name = use_state(&cx, move || props.initial_name.clone());
// cx.render(rsx! {
// div { class: "py-12 px-4 text-center w-full max-w-2xl mx-auto",
diff --git a/examples/ssr/tofile.rs b/examples/ssr/tofile.rs
index e3091580a..8440074e8 100644
--- a/examples/ssr/tofile.rs
+++ b/examples/ssr/tofile.rs
@@ -24,7 +24,7 @@ fn main() {
.unwrap();
}
-pub static App: FC<()> = |cx, props| {
+pub static App: Component<()> = |cx| {
cx.render(rsx!(
div { class: "overflow-hidden"
link { href:"https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel:"stylesheet" }
@@ -39,7 +39,7 @@ pub static App: FC<()> = |cx, props| {
))
};
-pub static Header: FC<()> = |cx, props| {
+pub static Header: Component<()> = |cx| {
cx.render(rsx! {
div {
header { class: "text-gray-400 bg-gray-900 body-font"
@@ -65,7 +65,7 @@ pub static Header: FC<()> = |cx, props| {
})
};
-pub static Hero: FC<()> = |cx, props| {
+pub static Hero: Component<()> = |cx| {
//
cx.render(rsx! {
section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -103,7 +103,7 @@ pub static Hero: FC<()> = |cx, props| {
}
})
};
-pub static Entry: FC<()> = |cx, props| {
+pub static Entry: Component<()> = |cx| {
//
cx.render(rsx! {
section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -116,7 +116,7 @@ pub static Entry: FC<()> = |cx, props| {
})
};
-pub static StacksIcon: FC<()> = |cx, props| {
+pub static StacksIcon: Component<()> = |cx| {
cx.render(rsx!(
svg {
xmlns: "http://www.w3.org/2000/svg"
@@ -131,7 +131,7 @@ pub static StacksIcon: FC<()> = |cx, props| {
}
))
};
-pub static RightArrowIcon: FC<()> = |cx, props| {
+pub static RightArrowIcon: Component<()> = |cx| {
cx.render(rsx!(
svg {
fill: "none"
diff --git a/examples/tailwind.rs b/examples/tailwind.rs
index 555d13d5d..70a0448fd 100644
--- a/examples/tailwind.rs
+++ b/examples/tailwind.rs
@@ -14,7 +14,7 @@ fn main() {
const STYLE: &str = "body {overflow:hidden;}";
-pub static App: Component<()> = |cx, props| {
+pub static App: Component<()> = |cx| {
cx.render(rsx!(
div { class: "overflow-hidden"
style { "{STYLE}" }
@@ -30,7 +30,7 @@ pub static App: Component<()> = |cx, props| {
))
};
-pub static Header: Component<()> = |cx, props| {
+pub static Header: Component<()> = |cx| {
cx.render(rsx! {
div {
header { class: "text-gray-400 bg-gray-900 body-font"
@@ -56,7 +56,7 @@ pub static Header: Component<()> = |cx, props| {
})
};
-pub static Hero: Component<()> = |cx, props| {
+pub static Hero: Component<()> = |cx| {
//
cx.render(rsx! {
section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -94,7 +94,7 @@ pub static Hero: Component<()> = |cx, props| {
}
})
};
-pub static Entry: Component<()> = |cx, props| {
+pub static Entry: Component<()> = |cx| {
//
cx.render(rsx! {
section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -107,7 +107,7 @@ pub static Entry: Component<()> = |cx, props| {
})
};
-pub static StacksIcon: Component<()> = |cx, props| {
+pub static StacksIcon: Component<()> = |cx| {
cx.render(rsx!(
svg {
// xmlns: "http://www.w3.org/2000/svg"
@@ -122,7 +122,7 @@ pub static StacksIcon: Component<()> = |cx, props| {
}
))
};
-pub static RightArrowIcon: Component<()> = |cx, props| {
+pub static RightArrowIcon: Component<()> = |cx| {
cx.render(rsx!(
svg {
fill: "none"
diff --git a/examples/tasks.rs b/examples/tasks.rs
index 699ae1274..3b14faff1 100644
--- a/examples/tasks.rs
+++ b/examples/tasks.rs
@@ -6,11 +6,11 @@ use std::time::Duration;
use dioxus::prelude::*;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
-static App: Component<()> = |cx, props| {
- let mut count = use_state(cx, || 0);
+static App: Component<()> = |cx| {
+ let mut count = use_state(&cx, || 0);
cx.push_task(async move {
tokio::time::sleep(Duration::from_millis(100)).await;
diff --git a/examples/todomvc.rs b/examples/todomvc.rs
index 395b86696..b73d4ef49 100644
--- a/examples/todomvc.rs
+++ b/examples/todomvc.rs
@@ -4,7 +4,7 @@ use im_rc::HashMap;
use std::rc::Rc;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
#[derive(PartialEq)]
@@ -22,10 +22,10 @@ pub struct TodoItem {
}
const STYLE: &str = include_str!("./assets/todomvc.css");
-const App: Component<()> = |cx, props| {
- let mut draft = use_state(cx, || "".to_string());
- let mut todos = use_state(cx, || HashMap::>::new());
- let mut filter = use_state(cx, || FilterState::All);
+const App: Component<()> = |cx| {
+ let mut draft = use_state(&cx, || "".to_string());
+ let mut todos = use_state(&cx, || HashMap::>::new());
+ let mut filter = use_state(&cx, || FilterState::All);
let todolist = todos
.iter()
@@ -85,9 +85,9 @@ pub struct TodoEntryProps {
todo: Rc,
}
-pub fn TodoEntry(cx: Scope, props: &TodoEntryProps) -> Element {
- let mut is_editing = use_state(cx, || false);
- let mut contents = use_state(cx, || String::from(""));
+pub fn TodoEntry(cx: Scope) -> Element {
+ let mut is_editing = use_state(&cx, || false);
+ let mut contents = use_state(&cx, || String::from(""));
let todo = &props.todo;
rsx!(cx, li {
diff --git a/examples/weather_app.rs b/examples/weather_app.rs
index 20fde8a28..0ba2ffa0f 100644
--- a/examples/weather_app.rs
+++ b/examples/weather_app.rs
@@ -7,12 +7,12 @@
use dioxus::prelude::*;
fn main() {
- dioxus::desktop::launch(App, |c| c);
+ dioxus::desktop::launch(App);
}
const ENDPOINT: &str = "https://api.openweathermap.org/data/2.5/weather";
-static App: Component<()> = |cx, props| {
+static App: Component<()> = |cx| {
//
let body = use_suspense(
cx,
@@ -40,7 +40,7 @@ static App: Component<()> = |cx, props| {
#[derive(PartialEq, Props)]
struct WeatherProps {}
-static WeatherDisplay: Component = |cx, props| {
+static WeatherDisplay: Component = |cx| {
//
cx.render(rsx!(
div { class: "flex items-center justify-center flex-col"
diff --git a/examples/web/async_web.rs b/examples/web/async_web.rs
index a64ea0598..a1a0f8bb1 100644
--- a/examples/web/async_web.rs
+++ b/examples/web/async_web.rs
@@ -8,7 +8,7 @@ use dioxus_html as dioxus_elements;
fn main() {
console_error_panic_hook::set_once();
wasm_logger::init(wasm_logger::Config::new(log::Level::Debug));
- dioxus_web::launch(APP, |c| c)
+ dioxus_web::launch(APP)
}
#[derive(serde::Deserialize)]
@@ -16,8 +16,8 @@ struct DogApi {
message: String,
}
-static APP: FC<()> = |(cx, _props)| {
- let state = use_state(cx, || 0);
+static APP: Component<()> = |(cx, _props)| {
+ let state = use_state(&cx, || 0);
const ENDPOINT: &str = "https://dog.ceo/api/breeds/image/random/";
let doggo = use_suspense(
diff --git a/examples/web/basic.rs b/examples/web/basic.rs
index 4c4d52ce5..ff70f8a1b 100644
--- a/examples/web/basic.rs
+++ b/examples/web/basic.rs
@@ -11,13 +11,13 @@ fn main() {
console_error_panic_hook::set_once();
// Run the app
- dioxus_web::launch(APP, |c| c)
+ dioxus_web::launch(APP)
}
-static APP: FC<()> = |cx, _| {
- let mut count = use_state(cx, || 3);
- let content = use_state(cx, || String::from("h1"));
- let text_content = use_state(cx, || String::from("Hello, world!"));
+static APP: Component<()> = |cx| {
+ let mut count = use_state(&cx, || 3);
+ let content = use_state(&cx, || String::from("h1"));
+ let text_content = use_state(&cx, || String::from("Hello, world!"));
cx.render(rsx! {
div {
@@ -86,4 +86,4 @@ fn render_list(cx: Context, count: usize) -> Element {
rsx!(cx, ul { {items} })
}
-static CHILD: FC<()> = |cx, _| rsx!(cx, div {"hello child"});
+static CHILD: Component<()> = |cx, _| rsx!(cx, div {"hello child"});
diff --git a/examples/web/blah.rs b/examples/web/blah.rs
index d21cd5fd0..5553ceede 100644
--- a/examples/web/blah.rs
+++ b/examples/web/blah.rs
@@ -21,11 +21,11 @@ fn main() {
console_error_panic_hook::set_once();
// Run the app
- dioxus_web::launch(App, |c| c)
+ dioxus_web::launch(App)
}
-static App: FC<()> = |cx, props| {
- let mut state = use_state(cx, || 0);
+static App: Component<()> = |cx| {
+ let mut state = use_state(&cx, || 0);
cx.render(rsx! {
div {
style: {
diff --git a/examples/web/btns.rs b/examples/web/btns.rs
index 179074ee7..a3c96ad7a 100644
--- a/examples/web/btns.rs
+++ b/examples/web/btns.rs
@@ -18,12 +18,12 @@ use dioxus_html as dioxus_elements;
// #[cfg]
fn main() {
wasm_logger::init(wasm_logger::Config::new(log::Level::Debug));
- dioxus_web::launch(App, |c| c);
+ dioxus_web::launch(App);
// env_logger::init();
- // dioxus::web::launch(App, |c| c);
+ // dioxus::web::launch(App);
}
-static App: FC<()> = |cx, props| {
+static App: Component<()> = |cx| {
dbg!("rednering parent");
cx.render(rsx! {
div {
@@ -40,8 +40,8 @@ static App: FC<()> = |cx, props| {
})
};
-static But: FC<()> = |cx, props| {
- let mut count = use_state(cx, || 0);
+static But: Component<()> = |cx| {
+ let mut count = use_state(&cx, || 0);
// let d = Dropper { name: "asd" };
// let handler = move |_| {
diff --git a/examples/web/crm2.rs b/examples/web/crm2.rs
index 4dfe9db34..4f0eff48f 100644
--- a/examples/web/crm2.rs
+++ b/examples/web/crm2.rs
@@ -12,7 +12,7 @@ fn main() {
wasm_logger::init(wasm_logger::Config::new(log::Level::Debug));
console_error_panic_hook::set_once();
- dioxus_web::launch(App, |c| c)
+ dioxus_web::launch(App)
}
enum Scene {
@@ -28,13 +28,13 @@ pub struct Client {
pub description: String,
}
-static App: FC<()> = |cx, _| {
- let scene = use_state(cx, || Scene::ClientsList);
- let clients = use_ref(cx, || vec![] as Vec);
+static App: Component<()> = |cx| {
+ let scene = use_state(&cx, || Scene::ClientsList);
+ let clients = use_ref(&cx, || vec![] as Vec);
- let firstname = use_state(cx, || String::new());
- let lastname = use_state(cx, || String::new());
- let description = use_state(cx, || String::new());
+ let firstname = use_state(&cx, || String::new());
+ let lastname = use_state(&cx, || String::new());
+ let description = use_state(&cx, || String::new());
let scene = match *scene {
Scene::ClientsList => {
diff --git a/examples/web/demo.rs b/examples/web/demo.rs
index 603b84de5..6c21aa48d 100644
--- a/examples/web/demo.rs
+++ b/examples/web/demo.rs
@@ -21,10 +21,10 @@ fn main() {
console_error_panic_hook::set_once();
// Run the app
- dioxus_web::launch(App, |c| c)
+ dioxus_web::launch(App)
}
-pub static App: FC<()> = |cx, props| {
+pub static App: Component<()> = |cx| {
cx.render(rsx!(
div { class: "overflow-hidden"
link { href:"https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel:"stylesheet" }
@@ -39,7 +39,7 @@ pub static App: FC<()> = |cx, props| {
))
};
-pub static Header: FC<()> = |cx, props| {
+pub static Header: Component<()> = |cx| {
cx.render(rsx! {
div {
header { class: "text-gray-400 bg-gray-900 body-font"
@@ -65,7 +65,7 @@ pub static Header: FC<()> = |cx, props| {
})
};
-pub static Hero: FC<()> = |cx, props| {
+pub static Hero: Component<()> = |cx| {
//
cx.render(rsx! {
section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -103,7 +103,7 @@ pub static Hero: FC<()> = |cx, props| {
}
})
};
-pub static Entry: FC<()> = |cx, props| {
+pub static Entry: Component<()> = |cx| {
//
cx.render(rsx! {
section{ class: "text-gray-400 bg-gray-900 body-font"
@@ -116,7 +116,7 @@ pub static Entry: FC<()> = |cx, props| {
})
};
-pub static StacksIcon: FC<()> = |cx, props| {
+pub static StacksIcon: Component<()> = |cx| {
cx.render(rsx!(
svg {
// xmlns: "http://www.w3.org/2000/svg"
@@ -131,7 +131,7 @@ pub static StacksIcon: FC<()> = |cx, props| {
}
))
};
-pub static RightArrowIcon: FC<()> = |cx, props| {
+pub static RightArrowIcon: Component<()> = |cx| {
cx.render(rsx!(
svg {
fill: "none"
diff --git a/examples/web_tick.rs b/examples/web_tick.rs
index 3a24ce523..098bfc1f3 100644
--- a/examples/web_tick.rs
+++ b/examples/web_tick.rs
@@ -16,10 +16,10 @@ fn main() {
#[cfg(target_arch = "wasm32")]
intern_strings();
- dioxus::web::launch(App, |c| c);
+ dioxus::web::launch(App);
}
-static App: Component<()> = |cx, props| {
+static App: Component<()> = |cx| {
let mut rng = SmallRng::from_entropy();
let rows = (0..1_000).map(|f| {
let label = Label::new(&mut rng);
@@ -49,7 +49,7 @@ fn Row((cx, props): ScopeState) -> Element {
let [adj, col, noun] = props.label.0;
cx.render(rsx! {
tr {
- td { class:"col-md-1", "{props.row_id}" }
+ td { class:"col-md-1", "{cx.props.row_id}" }
td { class:"col-md-1", onclick: move |_| { /* run onselect */ }
a { class: "lbl", "{adj}" "{col}" "{noun}" }
}
diff --git a/examples/webview_web.rs b/examples/webview_web.rs
index 55f9f4309..a31096be7 100644
--- a/examples/webview_web.rs
+++ b/examples/webview_web.rs
@@ -13,11 +13,11 @@
use dioxus::prelude::*;
fn main() {
- dioxus::web::launch(App, |c| c);
+ dioxus::web::launch(App);
}
-static App: Component<()> = |cx, props| {
- let mut count = use_state(cx, || 0);
+static App: Component<()> = |cx| {
+ let mut count = use_state(&cx, || 0);
cx.render(rsx! {
div {
diff --git a/notes/Parity.md b/notes/Parity.md
index 5cc0851c9..fa51fff58 100644
--- a/notes/Parity.md
+++ b/notes/Parity.md
@@ -12,7 +12,7 @@ https://github.com/rustwasm/gloo
For example, resize observer would function like this:
```rust
-pub static Example: FC<()> = |cx, props|{
+pub static Example: Component<()> = |cx, props|{
let observer = use_resize_observer();
cx.render(rsx!(
diff --git a/notes/SOLVEDPROBLEMS.md b/notes/SOLVEDPROBLEMS.md
index 3c42094ee..baf88701b 100644
--- a/notes/SOLVEDPROBLEMS.md
+++ b/notes/SOLVEDPROBLEMS.md
@@ -153,13 +153,13 @@ Notice that LiveComponent receivers (the client-side interpretation of a LiveCom
The `VNodeTree` type is a very special type that allows VNodes to be created using a pluggable allocator. The html! macro creates something that looks like:
```rust
-pub static Example: FC<()> = |cx, props|{
+pub static Example: Component<()> = |cx, props|{
html! {
"blah"
}
};
// expands to...
-pub static Example: FC<()> = |cx, props|{
+pub static Example: Component<()> = |cx, props|{
// This function converts a Fn(allocator) -> DomTree closure to a VNode struct that will later be evaluated.
html_macro_to_vnodetree(move |allocator| {
let mut node0 = allocator.alloc(VElement::div);
@@ -313,7 +313,7 @@ Here's how react does it:
Any "dirty" node causes an entire subtree render. Calling "setState" at the very top will cascade all the way down. This is particularly bad for this component design:
```rust
-static APP: FC<()> = |cx, props|{
+static APP: Component<()> = |cx, props|{
let title = use_context(Title);
cx.render(html!{
})
};
-static HEAVY_LIST: FC<()> = |cx, props|{
+static HEAVY_LIST: Component<()> = |cx, props|{
cx.render({
{0.100.map(i => )}
})
@@ -378,7 +378,7 @@ struct Props {
}
-static Component: FC = |cx, props|{
+static Component: Component = |cx, props|{
}
```
diff --git a/packages/core-macro/CHANGELOG.md b/packages/core-macro/CHANGELOG.md
new file mode 100644
index 000000000..ead050b12
--- /dev/null
+++ b/packages/core-macro/CHANGELOG.md
@@ -0,0 +1,184 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## v0.1.2 (2021-12-15)
+
+### Documentation
+
+ - update local examples and docs to support new syntaxes
+ - big updates to the reference
+ - examples
+ - more work on docs
+ - update cargo tomls
+
+### New Features
+
+ - upgrade syntax
+ - pull children out of component definition
+ - cleanuup
+ - full html support
+ - massage lifetimes
+ - mutations
+ - amazingly awesome error handling
+ - mvoe away from compound context
+ - wire up event delegator for webview
+ - add aria
+ - beaf up the use_state hook
+ - enable arbitrary body in rsx! macro
+ - namespaced attributes
+ this commit adds namespaced attributes. This lets us support attribute groups, and thus, inline styles.
+
+ This namespaced attribute stuff is only available for styles at the moment, though it theoretically could be enabled for any other attributes.
+ - add edits back! and more webview support!
+ This commit adds a new type - the DomEdit - for serializing the changes made by the diffing machine. The architecture of how DomEdits fit into the cooperative scheduling is still TBD but it will allow us to build change lists without applying them immediately. This is more performant and allows us to only render parts of the page at a time.
+
+ This commit also adds more infrastructure around webview. Dioxus can now run on the web, generate static pages, run in the desktop, and run on mobile, with a large part of thanks to webview.
+ - two calculator examples
+ - props memoization is more powerful
+ This commit solves the memoization , properly memoizing properties that don't have any generic parameters. This is a rough heuristic to prevent non-static lifetimes from creeping into props and breaking our minual lifetime management.
+
+ Props that have a generic parameter are opted-out of the `partialeq` requirement and props *without* lifetimes must implement partialeq. We're going to leave manual disabling of memoization for future work.
+ - todomvc
+
+### Bug Fixes
+
+ - really big bug around hooks
+ - use annotation method from rust/58052 to fix closure lifetimes
+ - messed up how lifetimes worked, need to render once per component
+ - tags
+ - keyword length
+
+### Commit Statistics
+
+
+
+ - 113 commits contributed to the release over the course of 329 calendar days.
+ - 106 commits where understood as [conventional](https://www.conventionalcommits.org).
+ - 0 issues like '(#ID)' where seen in commit messages
+
+### Commit Details
+
+
+
+view details
+
+ * **Uncategorized**
+ - Release dioxus-core v0.1.3, dioxus-core-macro v0.1.2, dioxus-html v0.1.0, dioxus-desktop v0.0.0, dioxus-hooks v0.1.3, dioxus-liveview v0.1.0, dioxus-mobile v0.0.0, dioxus-router v0.1.0, dioxus-ssr v0.1.0, dioxus-web v0.0.0, dioxus v0.1.0 ([`0d480a4`](https://github.comgit//DioxusLabs/dioxus/commit/0d480a4c437d424f0eaff486e510a8fd3f3e6584))
+ - keyword length ([`868f673`](https://github.comgit//DioxusLabs/dioxus/commit/868f6739d2b2c5f2ace0c5240cff8008901e818c))
+ - Release dioxus-core v0.1.3, dioxus-core-macro v0.1.2, dioxus-html v0.1.0, dioxus-desktop v0.0.0, dioxus-hooks v0.1.3, dioxus-liveview v0.1.0, dioxus-mobile v0.0.0, dioxus-router v0.1.0, dioxus-ssr v0.1.0, dioxus-web v0.0.0, dioxus v0.1.0 ([`b32665d`](https://github.comgit//DioxusLabs/dioxus/commit/b32665d7212a5b9a3e21cb7af7abba63ae399fac))
+ - tags ([`a33f770`](https://github.comgit//DioxusLabs/dioxus/commit/a33f7701fcf5f917fea8719253650b5ad92554fd))
+ - Release dioxus-core v0.1.3, dioxus-core-macro v0.1.2, dioxus-html v0.1.0, dioxus-desktop v0.0.0, dioxus-hooks v0.1.3, dioxus-liveview v0.1.0, dioxus-mobile v0.0.0, dioxus-router v0.1.0, dioxus-ssr v0.1.0, dioxus-web v0.0.0, dioxus v0.1.0 ([`3a706ac`](https://github.comgit//DioxusLabs/dioxus/commit/3a706ac4168db137723bea90d7a0058190adfc3c))
+ - update cargo tomls ([`e4c06ce`](https://github.comgit//DioxusLabs/dioxus/commit/e4c06ce8e893779d2aad0883a1bb27d193bc5985))
+ - update local examples and docs to support new syntaxes ([`4de16c4`](https://github.comgit//DioxusLabs/dioxus/commit/4de16c4779648e591b3869b5df31271ae603c812))
+ - docs ([`8814977`](https://github.comgit//DioxusLabs/dioxus/commit/8814977eeebe06748a3b9677a8070e42a037ebd7))
+ - polish ([`8bf57dc`](https://github.comgit//DioxusLabs/dioxus/commit/8bf57dc21dfbcbae5b95650203b68d3f41227652))
+ - really big bug around hooks ([`52c7154`](https://github.comgit//DioxusLabs/dioxus/commit/52c7154897111b570918127ffe3285bb1d5951a0))
+ - rename ([`36d89be`](https://github.comgit//DioxusLabs/dioxus/commit/36d89beb34821694cb0afb546d3b0cb4e01aaae1))
+ - updates to router ([`bab21a0`](https://github.comgit//DioxusLabs/dioxus/commit/bab21a0aa1cbf8e6bd95f823e49f53c082e8d6cc))
+ - add router ([`d298b62`](https://github.comgit//DioxusLabs/dioxus/commit/d298b626d3ae21a39a8ec4426373369ac94edf9f))
+ - docs and router ([`a5f05d7`](https://github.comgit//DioxusLabs/dioxus/commit/a5f05d73acc0e47b05cff64a373482519414bc7c))
+ - upgrade syntax ([`fd93ee8`](https://github.comgit//DioxusLabs/dioxus/commit/fd93ee89c19b085a04307ef30217170518defa8e))
+ - Merge branch 'master' into jk/remove_node_safety ([`db00047`](https://github.comgit//DioxusLabs/dioxus/commit/db0004758c77331cc3b93ea8cf227c060028e12e))
+ - pull children out of component definition ([`2cf90b6`](https://github.comgit//DioxusLabs/dioxus/commit/2cf90b6903411e42f01a801f89037686194ee068))
+ - bubbling in progress ([`a21020e`](https://github.comgit//DioxusLabs/dioxus/commit/a21020ea575e467ba0d608737269fe1b0792dba7))
+ - cleanuup ([`84fd0c6`](https://github.comgit//DioxusLabs/dioxus/commit/84fd0c616252bf29cd665782258530032b54d13a))
+ - clippy happy on macro ([`e1c858d`](https://github.comgit//DioxusLabs/dioxus/commit/e1c858dda5c937a56f402bfb3e8b90baf34b84f1))
+ - remove bump ([`fcc6738`](https://github.comgit//DioxusLabs/dioxus/commit/fcc6738f1703006d7678f31a39bbf6d59464a7e1))
+ - fix some bugs around the rsx macro ([`339e450`](https://github.comgit//DioxusLabs/dioxus/commit/339e450027b4a5d2e1317e13863cd1b2e7ab5853))
+ - full html support ([`79503f1`](https://github.comgit//DioxusLabs/dioxus/commit/79503f15c5db04fa04575c8735941a2e3a75030b))
+ - remove HTML macro and add custom fields ([`9f7eb0f`](https://github.comgit//DioxusLabs/dioxus/commit/9f7eb0f6002156d3e6e14ea2cb24829133b531c5))
+ - use annotation method from rust/58052 to fix closure lifetimes ([`27d8919`](https://github.comgit//DioxusLabs/dioxus/commit/27d891934a70424b45e6278b7e2baaa2d1b78b35))
+ - worked backwards a bit and got it slightly figured out ([`9ee2bfb`](https://github.comgit//DioxusLabs/dioxus/commit/9ee2bfb010ce90ec97e93e173c31aab281db32c4))
+ - massage lifetimes ([`9726a06`](https://github.comgit//DioxusLabs/dioxus/commit/9726a065b0d4fb1ede5b53a2ddd58c855e51539f))
+ - book documentation ([`16dbf4a`](https://github.comgit//DioxusLabs/dioxus/commit/16dbf4a6f84103857385fb4b142a718b0ce72118))
+ - messed up how lifetimes worked, need to render once per component ([`ba9e1db`](https://github.comgit//DioxusLabs/dioxus/commit/ba9e1dbb8fa24048a6c9ccef8a8722688226a845))
+ - major cleanups to scheduler ([`2933e4b`](https://github.comgit//DioxusLabs/dioxus/commit/2933e4bc11b3074c2bde8d76ec55364fca841988))
+ - move everything over to a stack dst ([`0e9d5fc`](https://github.comgit//DioxusLabs/dioxus/commit/0e9d5fc5306ab508d5af6999a4064f9b8b48460f))
+ - remove warnings on core macero ([`6587224`](https://github.comgit//DioxusLabs/dioxus/commit/6587224debffa8e8d5282dc3f120abbaa96f552b))
+ - mutations ([`fac4233`](https://github.comgit//DioxusLabs/dioxus/commit/fac42339c272b0e430ebf4f31b6061a0635d3e19))
+ - bottom up dropping ([`f2334c1`](https://github.comgit//DioxusLabs/dioxus/commit/f2334c17be2612d926361686d7d40a57e3ffe9b9))
+ - fill out the snippets ([`6051b0e`](https://github.comgit//DioxusLabs/dioxus/commit/6051b0ec86927704451f4ce6cdf8f988e59702ae))
+ - amazingly awesome error handling ([`4a72b31`](https://github.comgit//DioxusLabs/dioxus/commit/4a72b3140bd244da602deada1eeecded65ff5848))
+ - big updates to the reference ([`583fdfa`](https://github.comgit//DioxusLabs/dioxus/commit/583fdfa5618e11d660985b97e570d4503be2ff49))
+ - docs, html! macro, more ([`caf772c`](https://github.comgit//DioxusLabs/dioxus/commit/caf772cf249d2f56c8d0b0fa2737ad48e32c6e82))
+ - get keyed diffing compiling ([`0a0be95`](https://github.comgit//DioxusLabs/dioxus/commit/0a0be95c3e58dc065409f02f703b82700c1003f8))
+ - changes to scheduler ([`098d382`](https://github.comgit//DioxusLabs/dioxus/commit/098d3821ed89ad38d99077a6556b48a7e91fc3fc))
+ - clean up warnings ([`b32e261`](https://github.comgit//DioxusLabs/dioxus/commit/b32e2611e37b17c2371ffb10cf1ac647f017d917))
+ - mvoe away from compound context ([`a2c7d17`](https://github.comgit//DioxusLabs/dioxus/commit/a2c7d17b0595769f60bc1c2bbf7cbe32cec37486))
+ - wire up event delegator for webview ([`7dfe89c`](https://github.comgit//DioxusLabs/dioxus/commit/7dfe89c9581f45a445f17f9fe4bb94e61f67e971))
+ - basic support for scheduled rendering ([`c52af22`](https://github.comgit//DioxusLabs/dioxus/commit/c52af221f755601a9e826ffc2c355def138999d0))
+ - solve some issues regarding listeners ([`dfaf5ad`](https://github.comgit//DioxusLabs/dioxus/commit/dfaf5adee164f44a679ab21d730caaab3610e01f))
+ - change in cx to cx ([`9971ff2`](https://github.comgit//DioxusLabs/dioxus/commit/9971ff215db6f771b7ec1cae2517c85d47d38622))
+ - move things into a "shared" object ([`f644d7c`](https://github.comgit//DioxusLabs/dioxus/commit/f644d7c44159eef091552dcc90acbb151ea76b21))
+ - apply formatting ([`a85b8c4`](https://github.comgit//DioxusLabs/dioxus/commit/a85b8c4b6be83f7aba06714b6a1ff0aa5f2ee729))
+ - more upgades to html parser ([`22f894e`](https://github.comgit//DioxusLabs/dioxus/commit/22f894e6b98073bffa39f08b890071ffc00b8d49))
+ - serious refactor with const generics ([`160d86a`](https://github.comgit//DioxusLabs/dioxus/commit/160d86abbe1b325e3123202aef29025dcd96f4eb))
+ - ....sigh..... so the diffing algorithm is robust ([`68ed1c0`](https://github.comgit//DioxusLabs/dioxus/commit/68ed1c04e7e773f9e6c0a5148f0ea89b97b6784e))
+ - add aria ([`4091846`](https://github.comgit//DioxusLabs/dioxus/commit/4091846934b4b3b2bc03d3ca8aaf7712aebd4e36))
+ - move examples around ([`304259d`](https://github.comgit//DioxusLabs/dioxus/commit/304259d8186d1d34224a74c95f4fd7d14126b499))
+ - beaf up the use_state hook ([`e4cdb64`](https://github.comgit//DioxusLabs/dioxus/commit/e4cdb645aad800484b19ec35ba1f8bb9ccf71d12))
+ - enable arbitrary body in rsx! macro ([`7aec40d`](https://github.comgit//DioxusLabs/dioxus/commit/7aec40d57e78ec13ff3a90ca8149521cbf1d9ff2))
+ - move some examples around ([`98a0933`](https://github.comgit//DioxusLabs/dioxus/commit/98a09339fd3190799ea4dd316908f0a53fdf2413))
+ - fix issues with lifetimes ([`a38a81e`](https://github.comgit//DioxusLabs/dioxus/commit/a38a81e1290375cae685f7c49d3745e4298fab26))
+ - namespaced attributes ([`22e659c`](https://github.comgit//DioxusLabs/dioxus/commit/22e659c2bd7797ca5a822180aca0cb5d950c5287))
+ - groundwork for noderefs ([`c1afeba`](https://github.comgit//DioxusLabs/dioxus/commit/c1afeba1efb1a063705466a14648beee08cacb86))
+ - add edits back! and more webview support! ([`904b26f`](https://github.comgit//DioxusLabs/dioxus/commit/904b26f7111c3fc66400744ff6192e4b20bf6d74))
+ - enable more diffing ([`e8f29a8`](https://github.comgit//DioxusLabs/dioxus/commit/e8f29a8f8ac56020bee0048021efa52547307a77))
+ - two calculator examples ([`b5e5ef1`](https://github.comgit//DioxusLabs/dioxus/commit/b5e5ef171aa9f8986fb4ab04d793eb63f557c4ae))
+ - examples ([`d9e6d09`](https://github.comgit//DioxusLabs/dioxus/commit/d9e6d0925b30690212d1d690dfba288f1a694a27))
+ - wip ([`952a91d`](https://github.comgit//DioxusLabs/dioxus/commit/952a91d5408aaf789b496f11d01c3b3f7fcf9059))
+ - rename ctx to cx ([`81382e7`](https://github.comgit//DioxusLabs/dioxus/commit/81382e7044fb3dba61d4abb1e6086b7b29143116))
+ - rethinking stack machine ([`62ae5d3`](https://github.comgit//DioxusLabs/dioxus/commit/62ae5d3bb94cb9ead030ae0b39d9d9bc2b8b4532))
+ - more work on docs ([`daa9bd8`](https://github.comgit//DioxusLabs/dioxus/commit/daa9bd82c365763fe240528c7df222d230bce613))
+ - some cleanup and documentation ([`517d7f1`](https://github.comgit//DioxusLabs/dioxus/commit/517d7f14957c4dae9fc894bfbdcd00a955d09f20))
+ - docs ([`f5683a2`](https://github.comgit//DioxusLabs/dioxus/commit/f5683a23464992ecace463a61414795b5a2c58c8))
+ - pre vnodes instead of vnode ([`fe6938c`](https://github.comgit//DioxusLabs/dioxus/commit/fe6938ceb3dba0796ae8bab52ae41248dc0d3650))
+ - props memoization is more powerful ([`73047fe`](https://github.comgit//DioxusLabs/dioxus/commit/73047fe95678d50fcfd62a4ace7c6b406c5304e1))
+ - merge in some code from the other branch ([`7790750`](https://github.comgit//DioxusLabs/dioxus/commit/7790750349b40055673a0ec16074a0426b84d3b3))
+ - move the rsx macro around ([`50c8b93`](https://github.comgit//DioxusLabs/dioxus/commit/50c8b93aade1bfa83a091fb51ee48638507f89b0))
+ - massive changes to definition of components ([`508c560`](https://github.comgit//DioxusLabs/dioxus/commit/508c560320d78730fa058156421523ffa5695d9d))
+ - move to static props ([`c1fd848`](https://github.comgit//DioxusLabs/dioxus/commit/c1fd848f89b0146581d8e485fa0d4a847387b963))
+ - more progress on parity docs. ([`c5089ba`](https://github.comgit//DioxusLabs/dioxus/commit/c5089ba3c5a8daad4de4d6257604011cc87f6ac7))
+ - buff the readme and docs ([`3cfa1fe`](https://github.comgit//DioxusLabs/dioxus/commit/3cfa1fe125886787f35905ed9b05340a739bc654))
+ - Todomvc in progress ([`b843dbd`](https://github.comgit//DioxusLabs/dioxus/commit/b843dbd3679abf86a34347d87fd4ce5fe9e2aca5))
+ - remove old code ([`3de54d0`](https://github.comgit//DioxusLabs/dioxus/commit/3de54d0b5202aca678d485a68ef8de006a63e21b))
+ - some code health ([`c28697e`](https://github.comgit//DioxusLabs/dioxus/commit/c28697e1fe3136d1835f2b663715f34aab9f4b17))
+ - major overhaul to diffing ([`9810fee`](https://github.comgit//DioxusLabs/dioxus/commit/9810feebf57f93114e3d7faf6de053ac192593a9))
+ - todos ([`8c541f6`](https://github.comgit//DioxusLabs/dioxus/commit/8c541f66d5f7ef2286f2cdf9b0496a9c404471f9))
+ - todomvc ([`cfa0927`](https://github.comgit//DioxusLabs/dioxus/commit/cfa0927cdd40bc3dba22996018605dbad91d0391))
+ - todomvc ([`ce33031`](https://github.comgit//DioxusLabs/dioxus/commit/ce33031519fbbbd207f1dffb75acf62bf59e3c9e))
+ - more ergonomics, more examples ([`0bcff1f`](https://github.comgit//DioxusLabs/dioxus/commit/0bcff1f88e4b1a633b7a9b7c6c2e39b8bd3666c4))
+ - use rsx! inline! ([`44aad27`](https://github.comgit//DioxusLabs/dioxus/commit/44aad2746c117ba9742c86a53327f4f9e96509e7))
+ - building large apps, revamp macro ([`9f7f43b`](https://github.comgit//DioxusLabs/dioxus/commit/9f7f43b6614aaef2d7dded7058e81934f28f5dec))
+ - begint to accept iterator types ([`742f150`](https://github.comgit//DioxusLabs/dioxus/commit/742f150eb3eba89913f5a0fabb229e72e2a0a5ee))
+ - props now autoderives its own trait ([`b3c96a5`](https://github.comgit//DioxusLabs/dioxus/commit/b3c96a5996f434332813c737bb83ad564d91af5f))
+ - staticify? ([`5ad8188`](https://github.comgit//DioxusLabs/dioxus/commit/5ad81885e499bf02ac79e0098f7956d02ee5f2e5))
+ - cargo fix to clean up things ([`78d093a`](https://github.comgit//DioxusLabs/dioxus/commit/78d093a9454386397a991bd01e603e4ad554521f))
+ - wire up props macro ([`37f5a7a`](https://github.comgit//DioxusLabs/dioxus/commit/37f5a7ad33e272a9e210bf480304d54ff0df0d67))
+ - revert FC changes (like the old style). ([`7158bc3`](https://github.comgit//DioxusLabs/dioxus/commit/7158bc3575e180dbe8641549b040e74ae3baf80b))
+ - yeet, synthetic somewhat wired up ([`d959806`](https://github.comgit//DioxusLabs/dioxus/commit/d9598066c2679d9d0b9ca0ce1d3f26110a238cd2))
+ - remove FC ([`92d9521`](https://github.comgit//DioxusLabs/dioxus/commit/92d9521a73aefb620b354ae5954617109dd06e7e))
+ - more cleanup ([`5a9155b`](https://github.comgit//DioxusLabs/dioxus/commit/5a9155b059acc1fb3c8b8accbeca3701ce4f0ab6))
+ - add context to builder ([`cf16090`](https://github.comgit//DioxusLabs/dioxus/commit/cf16090838d127354e333dcbc0b06474835b87d6))
+ - listeners now have scope information ([`fcd68e6`](https://github.comgit//DioxusLabs/dioxus/commit/fcd68e61d2400628469ba193b009e7bf1fd3acdf))
+ - broken, but solved ([`cb74d70`](https://github.comgit//DioxusLabs/dioxus/commit/cb74d70f831b5510f1ee191d91eaff621ffa6256))
+ - accept closures directly in handler ([`f225030`](https://github.comgit//DioxusLabs/dioxus/commit/f225030506967415a21f4af0372477cb5224ee7c))
+ - wowza got it all working ([`4b8e9f4`](https://github.comgit//DioxusLabs/dioxus/commit/4b8e9f4a125b9d55439d919786f33d9d5df234e8))
+ - parse custom rsx syntax ([`da00df6`](https://github.comgit//DioxusLabs/dioxus/commit/da00df66889f4fa2e39651491e08794e1fe78549))
+ - update readme and examples ([`ffaf687`](https://github.comgit//DioxusLabs/dioxus/commit/ffaf6878963981860089c2362947bf77a84c9058))
+ - add core macro crate ([`6a7bf3f`](https://github.comgit//DioxusLabs/dioxus/commit/6a7bf3f964150bcb8f7ba35ad285dd7deff7955c))
+ - add in style crate, and abort any styligng ([`c09b71f`](https://github.comgit//DioxusLabs/dioxus/commit/c09b71f473ceeac7d37cd2b4117786350b6b11b6))
+ - remove html crate ([`9dcee01`](https://github.comgit//DioxusLabs/dioxus/commit/9dcee01b335901cf2c80b453b97180e0d2551dc2))
+ - add core macro crate ([`9f49ecb`](https://github.comgit//DioxusLabs/dioxus/commit/9f49ecbd95b60deb74c646f3798dfde3542c44be))
+ - custom format_args for inlining variables into html templates ([`e4b1f6e`](https://github.comgit//DioxusLabs/dioxus/commit/e4b1f6ea0d0db707cf757dabf8635e9fc91a3e0f))
+ - comment out examples and move lifetime in FC type ([`62d4ad5`](https://github.comgit//DioxusLabs/dioxus/commit/62d4ad58787185032100a2d25e79b70f6ec97a3c))
+ - include the helper ([`07341d2`](https://github.comgit//DioxusLabs/dioxus/commit/07341d2c65dc61b90587e2e5daadf72ec82623a8))
+ - Dioxus-webview ([`9c01736`](https://github.comgit//DioxusLabs/dioxus/commit/9c0173689539210d14847613f9a1694e6cb34506))
+ - update fc_macro ([`28ac37a`](https://github.comgit//DioxusLabs/dioxus/commit/28ac37a8b23874c77011a46a11e6b9cbdf79ecdd))
+ - dioxus frontend crate ([`4d7ac5b`](https://github.comgit//DioxusLabs/dioxus/commit/4d7ac5bb5d3aa1897c0f6c1f322aca08c0c791f0))
+
+
diff --git a/packages/core-macro/Cargo.toml b/packages/core-macro/Cargo.toml
index 69f7117f4..dd18287b0 100644
--- a/packages/core-macro/Cargo.toml
+++ b/packages/core-macro/Cargo.toml
@@ -1,11 +1,14 @@
[package]
name = "dioxus-core-macro"
version = "0.1.2"
-authors = ["Jonathan Kelley "]
+authors = ["Jonathan Kelley"]
edition = "2018"
description = "Core macro for Dioxus Virtual DOM"
-"license" = "MIT/Apache-2.0"
-
+license = "MIT/Apache-2.0"
+repository = "https://github.com/DioxusLabs/dioxus/"
+homepage = "https://dioxuslabs.com"
+documentation = "https://dioxuslabs.com"
+keywords = ["dom", "ui", "gui", "react", "wasm"]
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
[lib]
diff --git a/packages/core-macro/src/lib.rs b/packages/core-macro/src/lib.rs
index 6e754a163..268c38276 100644
--- a/packages/core-macro/src/lib.rs
+++ b/packages/core-macro/src/lib.rs
@@ -17,7 +17,7 @@ pub fn format_args_f(input: TokenStream) -> TokenStream {
.into()
}
-#[proc_macro_derive(Props, attributes(builder))]
+#[proc_macro_derive(Props, attributes(props))]
pub fn derive_typed_builder(input: proc_macro::TokenStream) -> proc_macro::TokenStream {
let input = parse_macro_input!(input as syn::DeriveInput);
match props::impl_my_derive(&input) {
@@ -30,7 +30,7 @@ pub fn derive_typed_builder(input: proc_macro::TokenStream) -> proc_macro::Token
///
/// ## Complete Reference Guide:
/// ```
-/// const Example: FC<()> = |cx, props|{
+/// const Example: Component<()> = |cx, props|{
/// let formatting = "formatting!";
/// let formatting_tuple = ("a", "b");
/// let lazy_fmt = format_args!("lazily formatted text");
diff --git a/packages/core-macro/src/props/mod.rs b/packages/core-macro/src/props/mod.rs
index c13f1b174..c2b667524 100644
--- a/packages/core-macro/src/props/mod.rs
+++ b/packages/core-macro/src/props/mod.rs
@@ -3,8 +3,8 @@
//! However, it has been adopted to fit the Dioxus Props builder pattern.
//!
//! For dioxus, we make a few changes:
-//! - automatically implement Into