Renderers are now packages, not features. (#387)

* feat: use synchronous router design

* feat: function to get router out of dom

* chore: restructure workspace to use renderers as packages, not features

docs/guide/Cargo.toml

@@ -6,7 +6,16 @@ description = "Dioxus guide, including testable examples"
 license = "MIT/Apache-2.0"
 
 [dev-dependencies]
-dioxus = { path = "../..", features = ["desktop", "web", "ssr", "router", "fermi", "tui"] }
+dioxus = { path = "../../packages/dioxus" }
+dioxus-desktop = { path = "../../packages/desktop" }
+dioxus-web = { path = "../../packages/web" }
+dioxus-ssr = { path = "../../packages/ssr" }
+dioxus-router = { path = "../../packages/router" }
+dioxus-tui = { path = "../../packages/tui" }
+fermi = { path = "../../packages/fermi" }
+
+
+# dioxus = { path = "../../packages/dioxus", features = ["desktop", "web", "ssr", "router", "fermi", "tui"] }
 serde = { version = "1.0.138", features=["derive"] }
 reqwest = { version = "0.11.11", features = ["json"] }
-tokio = { version = "1.19.2" , features=[]}
+tokio = { version = "1.19.2" , features=[]}

docs/guide/examples/boolean_attribute.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/component_borrowed_props.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: App

docs/guide/examples/component_children.rs

@@ -3,7 +3,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/component_children_inspect.rs

@@ -3,7 +3,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/component_element_props.rs

@@ -3,7 +3,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/component_owned_props.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: App

docs/guide/examples/component_props_options.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/components.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: App

docs/guide/examples/conditional_rendering.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 pub fn App(cx: Scope) -> Element {

docs/guide/examples/dangerous_inner_html.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/event_click.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/event_handler_prop.rs

@@ -4,7 +4,7 @@ use dioxus::events::MouseEvent;
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/event_nested.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/event_prevent_default.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/hello_world_desktop.rs

@@ -3,7 +3,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: component

docs/guide/examples/hello_world_tui.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::tui::launch(App);
+    dioxus_tui::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/hello_world_tui_no_ctrl_c.rs

@@ -3,16 +3,16 @@
 
 use dioxus::events::{KeyCode, KeyboardEvent};
 use dioxus::prelude::*;
-use dioxus::tui::TuiContext;
+use dioxus_tui::TuiContext;
 
 fn main() {
-    dioxus::tui::launch_cfg(
+    dioxus_tui::launch_cfg(
         App,
-        dioxus::tui::Config::new()
+        dioxus_tui::Config::new()
             .without_ctrl_c_quit()
             // Some older terminals only support 16 colors or ANSI colors
             // If your terminal is one of these, change this to BaseColors or ANSI
-            .with_rendering_mode(dioxus::tui::RenderingMode::Rgb),
+            .with_rendering_mode(dioxus_tui::RenderingMode::Rgb),
     );
 }
 

docs/guide/examples/hello_world_web.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::web::launch(App);
+    dioxus_web::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/hooks_bad.rs

@@ -4,7 +4,7 @@ use dioxus::prelude::*;
 use std::collections::HashMap;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/hooks_counter.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: component

docs/guide/examples/hooks_counter_two_state.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: component

docs/guide/examples/hooks_use_ref.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: component

docs/guide/examples/input_controlled.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: component

docs/guide/examples/input_uncontrolled.rs

@@ -2,7 +2,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: component

docs/guide/examples/meme_editor.rs

@@ -5,7 +5,7 @@ use dioxus::events::FormEvent;
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(MemeEditor);
+    dioxus_desktop::launch(MemeEditor);
 }
 
 // ANCHOR: meme_editor

docs/guide/examples/meme_editor_dark_mode.rs

@@ -5,7 +5,7 @@ use dioxus::events::FormEvent;
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 // ANCHOR: DarkMode_struct

docs/guide/examples/rendering_lists.rs

@@ -3,7 +3,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 #[derive(PartialEq, Clone)]

docs/guide/examples/rsx_overview.rs

@@ -3,7 +3,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 pub fn App(cx: Scope) -> Element {

docs/guide/examples/spawn.rs

@@ -3,7 +3,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/examples/use_future.rs

@@ -3,7 +3,7 @@
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 #[derive(serde::Deserialize, Debug)]

docs/guide/src/en/__unused/advanced-guides/rsx.md

@@ -33,7 +33,7 @@ let name = "jane";
 let pending = false;
 let count = 10;
 
-dioxus::ssr::render_lazy(html! {
+dioxus_ssr::render_lazy(html! {
     <div>
         <p> "Hello, {name}!" </p>
         <p> "Status: {pending}!" </p>
@@ -51,7 +51,7 @@ When helpful, the Dioxus VSCode extension provides a way of converting a selecti
 It's also a bit easier on the eyes than HTML.
 
 ```rust
-dioxus::ssr::render_lazy(rsx! {
+dioxus_ssr::render_lazy(rsx! {
     div {
         p {"Hello, {name}!"}
         p {"Status: {pending}!"}

docs/guide/src/en/__unused/composing.md

@@ -159,7 +159,7 @@ force_render(ScopeId(0));
 
 In our guides, we frequently use the phrase "re-render" to describe updates to our app. You'll often hear this paired with "preventing unnecessary re-renders." But what exactly does this mean?
 
-When we call `dioxus::desktop::launch`, Dioxus will create a new `Scope` object and call the component we gave it. Our `rsx!` calls will create new nodes which we return back to the VirtualDom. Dioxus will then look through these nodes for child components, call their functions, and so on until every component has been "rendered." We consider these nodes "rendered" because they were created because of our explicit actions.
+When we call `dioxus_desktop::launch`, Dioxus will create a new `Scope` object and call the component we gave it. Our `rsx!` calls will create new nodes which we return back to the VirtualDom. Dioxus will then look through these nodes for child components, call their functions, and so on until every component has been "rendered." We consider these nodes "rendered" because they were created because of our explicit actions.
 
 The tree of UI that dioxus creates will roughly look like the tree of components presented earlier:
 

docs/guide/src/en/__unused/event_javascript.rs

@@ -12,7 +12,7 @@ Instead of passing a closure, you can also pass a string to event handlers – t
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::desktop::launch(App);
+    dioxus_desktop::launch(App);
 }
 
 fn App(cx: Scope) -> Element {

docs/guide/src/en/__unused/index.md

@@ -16,7 +16,7 @@ For the simplest of apps, all of your state can enter the app from the root prop
 ```rust
 let all_content = get_all_content().await;
 
-let output = dioxus::ssr::render_lazy(rsx!{
+let output = dioxus_ssr::render_lazy(rsx!{
     div {
         RenderContent { content: all_content }
     }

docs/guide/src/en/getting_started/mobile.md

@@ -24,7 +24,7 @@ cargo install --git https://github.com/BrainiumLLC/cargo-mobile
 And then initialize your app for the right platform. Use the `winit` template for now. Right now, there's no "Dioxus" template in cargo-mobile.
 
 ```shell
-cargo mobile init 
+cargo mobile init
 ```
 
 We're going to completely clear out the `dependencies` it generates for us, swapping out `winit` with `dioxus-mobile`.
@@ -61,7 +61,7 @@ Edit your `lib.rs`:
 use dioxus::prelude::*;
 
 fn main() {
-    dioxus::mobile::launch(app);
+    dioxus_mobile::launch(app);
 }
 
 fn app(cx: Scope) -> Element {

docs/guide/src/en/getting_started/ssr.md

@@ -21,10 +21,10 @@ If you just want to render `rsx!` or a VirtualDom to HTML, check out the API doc
 // We can render VirtualDoms
 let mut vdom = VirtualDom::new(app);
 let _ = vdom.rebuild();
-println!("{}", dioxus::ssr::render_vdom(&vdom));
+println!("{}", dioxus_ssr::render_vdom(&vdom));
 
 // Or we can render rsx! calls directly
-println!( "{}", dioxus::ssr::render_lazy(rsx! { h1 { "Hello, world!" } } );
+println!( "{}", dioxus_ssr::render_lazy(rsx! { h1 { "Hello, world!" } } );
 ```
 
 However, for this guide, we're going to show how to use Dioxus SSR with `Axum`.
@@ -84,7 +84,7 @@ And then add our endpoint. We can either render `rsx!` directly:
 
 ```rust
 async fn app_endpoint() -> Html<String> {
-    Html(dioxus::ssr::render_lazy(rsx! {
+    Html(dioxus_ssr::render_lazy(rsx! {
             h1 { "hello world!" }
     }))
 }
@@ -100,7 +100,7 @@ async fn app_endpoint() -> Html<String> {
     let mut app = VirtualDom::new(app);
     let _ = app.rebuild();
 
-    Html(dioxus::ssr::render_vdom(&app))
+    Html(dioxus_ssr::render_vdom(&app))
 }
 ```
 

docs/guide/src/en/interactivity/index.md

@@ -1,3 +1,3 @@
 # Interactivity
 
-So far, we've learned how to describe the structure and properties of our user interfaces. However, most interfaces need to be interactive in order to be useful. In this chapter, we describe how to make a Dioxus app that responds to the user.
+So far, we've learned how to describe the structure and properties of our user interfaces. However, most interfaces need to be interactive in order to be useful. In this chapter, we describe how to make a Dioxus app that responds to the user.

docs/posts/release.md

@@ -6,7 +6,7 @@
 
 After many months of work, we're very excited to release the first version of Dioxus!
 
-Dioxus is a new library for building interactive user interfaces (GUI) with Rust. It is built around a Virtual DOM, making it portable for the web, desktop, server, mobile, and more. 
+Dioxus is a new library for building interactive user interfaces (GUI) with Rust. It is built around a Virtual DOM, making it portable for the web, desktop, server, mobile, and more.
 
 Dioxus has the following design goals:
 
@@ -24,7 +24,7 @@ To give you an idea of what Dioxus looks like, here's a simple counter app:
 use dioxus::prelude::*;
 
 fn main() {
-	dioxus::desktop::launch(app)
+	dioxus_desktop::launch(app)
 }
 
 fn app(cx: Scope) -> Element {
@@ -187,7 +187,7 @@ We can add our counter from above.
 use dioxus::prelude::*;
 
 fn main() {
-	dioxus::desktop::launch(app)
+	dioxus_desktop::launch(app)
 }
 
 fn app(cx: Scope) -> Element {
@@ -239,7 +239,7 @@ LazyNodes::new(|f| {
 
 The `rsx!` macro generates idiomatic Rust code that uses the factory API — no different than what you'd write by hand yourself.
 
-To make it easier to work with RSX, we've built a small [VSCode extension](https://github.com/DioxusLabs/studio) with useful utilities. This extension provides a command that converts a selected block of HTML into RSX so you can easily reuse existing web templates. 
+To make it easier to work with RSX, we've built a small [VSCode extension](https://github.com/DioxusLabs/studio) with useful utilities. This extension provides a command that converts a selected block of HTML into RSX so you can easily reuse existing web templates.
 
 ## Dioxus prioritizes developer experience
 
@@ -299,7 +299,7 @@ There's *way* more to this story, but hopefully we've convinced you that Dioxus'
 
 ## Dioxus is perfected for the IDE
 
-Note: all IDE-related features have only been tested with [Rust-Analyzer](https://github.com/rust-analyzer/rust-analyzer). 
+Note: all IDE-related features have only been tested with [Rust-Analyzer](https://github.com/rust-analyzer/rust-analyzer).
 
 Dioxus code operates pleasantly with your IDE. For starters, most elements are documented through the Rustdoc system. A quick summary of the MDN docs is always under your finger tips:
 
@@ -337,7 +337,7 @@ Dioxus is humbly built off the work done by [Dodrio](https://github.com/fitzgen/
 
 Dioxus is *substantially* more performant than many of the other Rust DOM-based UI libraries (Yew/Percy) and is *significantly* more performant than React - roughly competitive with InfernoJS. While not as performant as libraries like SolidJS/Sycamore, Dioxus imposes roughly a ~3% overhead over DOM patching, so it's *plenty* fast.
 
-## Works on Desktop and Mobile 
+## Works on Desktop and Mobile
 We’ve mentioned before that Dioxus works practically anywhere that Rust does. When running natively as a desktop or mobile app, your Dioxus code will run on its own thread, not inside of a web runtime. This means you can access hardware, file system, and platform APIs directly without needing to go through a shim layer. In our examples, we feature a [file explorer app](https://github.com/DioxusLabs/example-projects/tree/master/file-explorer) and [WiFi scanner app](https://github.com/DioxusLabs/example-projects/tree/master/wifi-scanner) where platform access occurs inside an asynchronous multithreaded coroutine. This solves the problem faced by React Native and other cross-platform toolkits where JavaScript apps incur a massive performance penalty with substantial maintenance overhead associated with platform API shims.
 
 A desktop app:
@@ -401,7 +401,7 @@ Stay tuned for our next article, which will go over some of the optimization tec
 
 ## Community
 
-The future is bright for Rust frontends! If you'd like to get involved, we have a [Discord server](https://discord.gg/XgGxMSkvUM), [a subreddit](http://reddit.com/r/dioxus), and [GitHub discussion pages](https://github.com/DioxusLabs/dioxus/discussions). 
+The future is bright for Rust frontends! If you'd like to get involved, we have a [Discord server](https://discord.gg/XgGxMSkvUM), [a subreddit](http://reddit.com/r/dioxus), and [GitHub discussion pages](https://github.com/DioxusLabs/dioxus/discussions).
 
 Let us know what you build!
 

docs/router/src/guide/getting-started.md

@@ -46,7 +46,7 @@ use dioxus::prelude::*;
 
 fn main() {
     // Launch Dioxus web app
-    dioxus::web::launch(app);
+    dioxus_web::launch(app);
 }
 
 // Our root component.