1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
//! # Native Router
//!
//! Even though Freya supports [Dioxus Router](dioxus_router), there are certain integrations that it does not provide, such as as back and forward navigation with the mouse buttons.
//! For things like this exists [`NativeRouter`](crate::components::NativeRouter), a thin wrapper component that adds these missing integrations.
//!
//! You simply need to wrap your `Router` content inside the [`NativeRouter`](crate::components::NativeRouter) component.
//!
//! Example (based on the example from [router](crate::_docs::router)):
//! ```rust, no_run
//! # use freya::prelude::*;
//! # use dioxus_router::prelude::*;
//! # use freya_components::Link;
//! # #[allow(non_snake_case)]
//! fn AppSidebar() -> Element {
//! rsx!(
//! NativeRouter {
//! Body {
//! Link {
//! to: Route::Home,
//! label {
//! "Home"
//! }
//! },
//! Link {
//! to: Route::Other,
//! label {
//! "Other"
//! }
//! },
//! // Rest of app
//! }
//! }
//! )
//! }
//! # #[rustfmt::skip]
//! # #[derive(Routable, Clone, PartialEq)]
//! # pub enum Route {
//! # #[layout(AppSidebar)]
//! # #[route("/")]
//! # Home,
//! # #[route("/other")]
//! # Other,
//! # #[end_layout]
//! # #[route("/..route")]
//! # PageNotFound { }, // Handle 404 routes.
//! # }
//! #
//! # #[component]
//! # fn Home() -> Element {
//! # rsx!(
//! # label {
//! # "Home Page"
//! # }
//! # )
//! # }
//! #
//! # #[component]
//! # fn Other() -> Element {
//! # rsx!(
//! # label {
//! # "Other Page"
//! # }
//! # )
//! # }
//! #
//! # #[component]
//! # fn PageNotFound() -> Element {
//! # rsx!(
//! # label {
//! # "404"
//! # }
//! # )
//! # }
//! ```