add Outlet component

packages/router/src/components/outlet.rs

@@ -0,0 +1,57 @@
+use dioxus::prelude::*;
+use dioxus_router_core::{Name, OutletData};
+use log::error;
+
+use crate::utils::use_router_internal::use_router_internal;
+
+#[derive(Debug, Eq, PartialEq, Props)]
+pub struct OutletProps {
+    pub depth: Option<usize>,
+    pub name: Option<Name>,
+}
+
+#[allow(non_snake_case)]
+pub fn Outlet(cx: Scope<OutletProps>) -> Element {
+    let OutletProps { depth, name } = cx.props;
+
+    // hook up to router
+    let router = match use_router_internal(&cx) {
+        Some(r) => r,
+        None => {
+            error!("`Outlet` must have access to a parent router, will be inactive");
+            #[cfg(debug_assertions)]
+            panic!("`Outlet` must have access to a parent router");
+            #[cfg(not(debug_assertions))]
+            return None;
+        }
+    };
+    let state = loop {
+        if let Some(state) = router.state.try_read() {
+            break state;
+        }
+    };
+
+    // do depth calculation and propagation
+    let depth = cx.use_hook(|| {
+        let mut context = cx.consume_context::<OutletData>().unwrap_or_default();
+        let depth = depth
+            .or_else(|| context.depth(name))
+            .map(|d| d + 1)
+            .unwrap_or_default();
+        context.set_depth(name, depth);
+        cx.provide_context(context);
+        depth
+    });
+
+    // get content
+    let X: Component = match name {
+        None => state.content.get(*depth),
+        Some(n) => state.named_content.get(n).and_then(|n| n.get(*depth)),
+    }?
+    .0
+    .clone();
+
+    render! {
+        X { }
+    }
+}

packages/router/src/lib.rs

@@ -1,4 +1,9 @@
-pub(crate) mod contexts {
+pub mod components {
+    mod outlet;
+    pub use outlet::*;
+}
+
+mod contexts {
     pub(crate) mod router;
 }
 
@@ -10,3 +15,7 @@ pub mod hooks {
 pub mod prelude {
     pub use dioxus_router_core::prelude::*;
 }
+
+mod utils {
+    pub(crate) mod use_router_internal;
+}

packages/router/src/utils/use_router_internal.rs

@@ -0,0 +1,30 @@
+use std::sync::Arc;
+
+use dioxus::prelude::ScopeState;
+use dioxus_router_core::RouterMessage;
+
+use crate::contexts::router::RouterContext;
+
+/// A private hook to subscribe to the router.
+///
+/// Used to reduce redundancy within other components/hooks. Safe to call multiple times for a
+/// single component, but not recommended. Multiple subscriptions will be discarded.
+///
+/// # Return values
+/// - [`None`], when the current component isn't a descendant of a [`use_router`] component.
+/// - Otherwise [`Some`].
+///
+/// [`use_router`]: crate::hooks::use_router
+pub(crate) fn use_router_internal<'a>(cx: &'a ScopeState) -> &'a mut Option<RouterContext> {
+    let id = cx.use_hook(|| Arc::new(cx.scope_id()));
+
+    cx.use_hook(|| {
+        let router = cx.consume_context::<RouterContext>()?;
+
+        let _ = router
+            .sender
+            .unbounded_send(RouterMessage::Subscribe(id.clone()));
+
+        Some(router)
+    })
+}