feat: update version to v0.16.8

Co-authored-by: Marco Pasqualetti <marco.pasqualetti@live.com>

.editorconfig

@@ -0,0 +1,7 @@
+[*]
+charset = utf-8
+insert_final_newline = true
+end_of_line = lf
+indent_style = space
+indent_size = 2
+max_line_length = 80

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -32,55 +32,24 @@ body:
       description: If applicable, add screenshots to help explain your problem.
     validations:
       required: false
-  - type: input
-    id: tuono-version
+  - type: textarea
+    id: system-info
     attributes:
-      label: Tuono version
-      placeholder: '[e.g. 0.4.0]'
+      label: System Info
+      description: Output of `npx envinfo --system --npmPackages 'tuono' --binaries --browsers`
+      render: shell
+      placeholder: System, Binaries, Browsers
     validations:
-      required: false
-  - type: input
-    id: os-version
+      required: true
+  - type: textarea
+    id: system-info-rust
     attributes:
-      label: OS
-      placeholder: '[e.g. MacOS, Windows]'
+      label: System info (Rust)
+      description: Output of `rustc --version && cargo --version && tuono --version`
+      render: shell
+      placeholder: 'rustc, cargo and tuono binary version'
     validations:
-      required: false
-  - type: input
-    id: browser-version
-    attributes:
-      label: Browser
-      placeholder: '[e.g. chrome, safari]'
-    validations:
-      required: false
-  - type: input
-    id: node-version
-    attributes:
-      label: Node version
-      placeholder: '[e.g. 20.0.0]'
-    validations:
-      required: false
-  - type: input
-    id: rust-version
-    attributes:
-      label: Rust version
-      placeholder: '[e.g. 1.79.0]'
-    validations:
-      required: false
-  - type: input
-    id: create-version
-    attributes:
-      label: Crate version
-      placeholder: '[e.g. 1.78.0]'
-    validations:
-      required: false
-  - type: input
-    id: node-package-manager-version
-    attributes:
-      label: Node Package Manger version
-      placeholder: '[e.g. pnpm: 9.5.0] '
-    validations:
-      required: false
+      required: true
   - type: textarea
     id: additional-context
     attributes:

.github/workflows/ci-documentation.yml

@@ -37,7 +37,7 @@ jobs:
         uses: actions-rust-lang/setup-rust-toolchain@v1
 
       - name: Install tuono
-        run: cargo install tuono@0.15.0
+        run: cargo install tuono@0.16.4
 
       - name: Build project
         working-directory: ./apps/documentation

.github/workflows/deploy-documentation.yml

@@ -27,7 +27,7 @@ jobs:
         uses: actions-rust-lang/setup-rust-toolchain@v1
 
       - name: Install tuono
-        run: cargo install tuono@0.15.0
+        run: cargo install tuono@0.16.4
 
       - name: Build project
         working-directory: ./apps/documentation

.gitignore

@@ -8,6 +8,8 @@ dist/
 
 examples/*/pnpm-lock.yaml
 
+vite.config.ts.timestamp*
+
 ## Rust related ignores
 
 # Generated by Cargo

.prettierignore

@@ -1 +1,6 @@
-pnpm-lock.yaml
+pnpm-lock.yaml
+
+dist
+.tuono
+
+packages/tuono-lazy-fn-vite-plugin/tests/sources/*

CODEOWNERS

@@ -0,0 +1,9 @@
+*          @Valerioageno @marcalexiei
+
+# Rust
+/crates/    @Valerioageno
+/Cargo.toml @Valerioageno
+
+# Misc
+/.github/   @marcalexiei
+

README.md

@@ -26,7 +26,7 @@ Some of its features are:
 
 ## 📖 Documentation
 
-The [documentation](https://tuono.dev/documentation) is available on
+The [documentation](https://tuono.dev/) is available on
 [tuono.dev](https://tuono.dev/).
 
 ## Introduction

apps/documentation/Cargo.toml

@@ -8,7 +8,7 @@ name = "tuono"
 path = ".tuono/main.rs"
 
 [dependencies]
-tuono_lib = "0.15.0"
+tuono_lib = "0.16.4"
 glob = "0.3.1"
 time = { version = "0.3", features = ["macros"] }
 serde = { version = "1.0.202", features = ["derive"] }

apps/documentation/package.json

@@ -6,27 +6,27 @@
   "type": "module",
   "scripts": {
     "lint": "eslint .",
-    "format": "prettier -u --write --ignore-unknown './src/**/*'",
-    "format:check": "prettier --check --ignore-unknown './src/**/*'",
+    "format": "prettier --write --ignore-unknown .",
+    "format:check": "prettier --check --ignore-unknown .",
     "types": "tsc --noEmit"
   },
   "dependencies": {
-    "@mantine/code-highlight": "^7.11.2",
-    "@mantine/core": "^7.11.2",
-    "@mantine/hooks": "^7.11.2",
-    "@mdx-js/react": "^3.0.1",
-    "@tabler/icons-react": "^3.11.0",
-    "clsx": "^2.1.1",
+    "@mantine/code-highlight": "7.14.2",
+    "@mantine/core": "7.14.2",
+    "@mantine/hooks": "7.14.2",
+    "@mdx-js/react": "3.1.0",
+    "@tabler/icons-react": "3.22.0",
+    "clsx": "2.1.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "tuono": "npm:tuono@0.15.0"
+    "tuono": "npm:tuono@0.16.4"
   },
   "devDependencies": {
-    "@types/mdx": "^2.0.13",
-    "@types/react": "^18.3.13",
-    "@types/react-dom": "^18.3.0",
-    "postcss": "^8.4.39",
-    "postcss-preset-mantine": "^1.17.0",
-    "postcss-simple-vars": "^7.0.1"
+    "@mdx-js/rollup": "3.1.0",
+    "@types/react": "18.3.13",
+    "@types/react-dom": "18.3.0",
+    "postcss": "8.4.49",
+    "postcss-preset-mantine": "1.17.0",
+    "postcss-simple-vars": "7.0.1"
   }
 }

apps/documentation/public/polyfill-db.json

@@ -0,0 +1,18 @@
+{
+  "polyfills": [
+    {
+      "identifier": "HTMLElement",
+      "import": {
+        "package": "@lit-labs/ssr-dom-shim",
+        "name": "HTMLElement"
+      }
+    },
+    {
+      "identifier": "customElements",
+      "import": {
+        "package": "@lit-labs/ssr-dom-shim",
+        "name": "customElements"
+      }
+    }
+  ]
+}

apps/documentation/public/site.webmanifest

@@ -1 +1,19 @@
-{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
+{
+  "name": "",
+  "short_name": "",
+  "icons": [
+    {
+      "src": "/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}

apps/documentation/src/components/mdx-provider/mdx-title/mdx-title.tsx

@@ -16,6 +16,12 @@ export default function MdxTitle(props: TitleProps): JSX.Element {
   )
 }
 
-export const h =
-  (order: 1 | 2 | 3 | 4 | 5 | 6) =>
-  (props: TitleProps): JSX.Element => <MdxTitle order={order} {...props} />
+export const h = (
+  order: 1 | 2 | 3 | 4 | 5 | 6,
+): React.ElementType<TitleProps> => {
+  function render(props: TitleProps): JSX.Element {
+    return <MdxTitle order={order} {...props} />
+  }
+  render.displayName = 'H'
+  return render
+}

apps/documentation/src/components/sidebar/config.ts

@@ -111,6 +111,11 @@ export const sidebarElements: Array<SidebarElement> = [
         label: 'Defining routes',
         href: '/documentation/routing/defining-routes',
       },
+      {
+        type: 'element',
+        label: 'Dynamic routes',
+        href: '/documentation/routing/dynamic-routes',
+      },
       {
         type: 'element',
         label: 'Link and navigation',
@@ -126,11 +131,6 @@ export const sidebarElements: Array<SidebarElement> = [
         label: 'Loading state',
         href: '/documentation/routing/loading-state',
       },
-      {
-        type: 'element',
-        label: 'Dynamic routes',
-        href: '/documentation/routing/dynamic-routes',
-      },
       {
         type: 'element',
         label: 'Layouts',

apps/documentation/src/components/sidebar/sidebar.tsx

@@ -50,26 +50,30 @@ function SidebarElements({ close }: SidebarProps): JSX.Element {
     <AppShell.Section component={ScrollArea}>
       {sidebarElements.map((el, i) => {
         if (el.type === 'divider') {
-          return <Divider my="md" mx={10} />
+          return <Divider key={`${el.type}-${i}`} my="md" mx={10} />
         }
+
         if (el.type === 'title') {
           return (
             <Text
+              key={`${el.type}-${i}`}
               size="xs"
               fw={700}
               fz={12}
               pl={12}
               py={5}
-              children={el.label}
-            />
+            >
+              {el.label}
+            </Text>
           )
         }
+
         if (el.children?.length) {
           return (
             <SidebarLink
+              key={`${el.type}-${i}`}
               href={el.href}
               label={el.label}
-              key={i}
               leftSection={el.leftIcon}
             >
               {el.children.map((child, index) => (
@@ -83,12 +87,13 @@ function SidebarElements({ close }: SidebarProps): JSX.Element {
             </SidebarLink>
           )
         }
+
         return (
           <SidebarLink
+            key={`${el.type}-${i}`}
             href={el.href}
             label={el.label}
             onClick={close}
-            key={i}
           />
         )
       })}

apps/documentation/src/components/table-of-content/table-of-content.tsx

@@ -64,7 +64,9 @@ export function TableOfContents({
       ),
     )
     window.addEventListener('scroll', handleScroll)
-    return (): void => window.removeEventListener('scroll', handleScroll)
+    return (): void => {
+      window.removeEventListener('scroll', handleScroll)
+    }
   }, [router.pathname])
 
   if (filteredHeadings.length === 0) {

apps/documentation/src/components/theme-btn/theme-btn.tsx

@@ -17,9 +17,9 @@ export default function ThemeBtn(): JSX.Element {
 
   return (
     <ActionIcon
-      onClick={() =>
+      onClick={() => {
         setColorScheme(computedColorScheme === 'light' ? 'dark' : 'light')
-      }
+      }}
       variant="default"
       size="lg"
       aria-label="Toggle color scheme"

apps/documentation/src/routes/documentation/routing/defining-routes.mdx

@@ -71,7 +71,7 @@ export default function RootLayout({ children }) {
 
 ### Layout component for specific routes
 
-A file created in this location will wrap **only** the routes defined within the `src/routes/posts` folder.
+A file created in this location will wrap only the routes defined within the `src/routes/posts` folder.
 
 ```tsx
 // src/routes/posts/__root.tsx

apps/documentation/src/routes/documentation/routing/dynamic-routes.mdx

@@ -9,6 +9,53 @@ import Breadcrumbs, { Element } from '@/components/breadcrumbs'
 
 <Breadcrumbs breadcrumbs={[{ label: 'Dynamic routes' }]} />
 
-# Loading state
+# Dynamic routes
 
-Todo
+> 🚧 Only available for SSR apps. This feature will be soon available also for static generated apps.
+
+When the exact segment names are not known in advance and you need to generate routes from dynamic data,
+you can use dynamic segments, which are populated at request time.
+
+## Convention
+
+A dynamic segment can be created by wrapping a
+file or a folder name in square brackets: `[segmentName]`.
+
+The dynamic segment can be used in folders as well as file names:
+
+- `src/routes/blog/[slug].tsx`
+- `src/routes/blog/[slug]/index.tsx`
+
+A path can contain multiple dynamic segments, allowing for more flexible routing:
+
+- `src/routes/blog/[post]/[comment].tsx`
+
+### Example
+
+Assuming you're working on a blog with multiple posts,
+you can use a dynamic segment to define the post page: `src/routes/blog/[slug].tsx`.
+
+The `[slug]` is the dynamic segment which will be used to identify individual blog posts.
+
+```tsx
+import { useRouter } from 'tuono'
+
+export default function Page() {
+  const router = useRouter()
+  return <p>Post: {router.pathname}</p>
+}
+```
+
+## Catch all segments
+
+Dynamic Segments can be extended to catch-all subsequent segments by adding
+an ellipsis inside the brackets `[...segmentName]`.
+
+Given the following `src/routes/shop/[...slug].tsx`,
+the following paths will be matched:
+
+- `/shop/clothes`
+- `/shop/clothes/tops`
+- `/shop`
+- `/shop/clothes/tops/t-shirts`
+- and so on.

apps/documentation/tsconfig.json

@@ -32,6 +32,5 @@
     // Completeness
     "skipLibCheck": true
   },
-  "include": ["src", "tuono.config.ts", "postcss.config.js"],
-  "references": [{ "path": "./tsconfig.node.json" }]
+  "include": ["src", "tuono.config.ts", "postcss.config.js"]
 }

apps/documentation/tsconfig.node.json

@@ -1,11 +0,0 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "skipLibCheck": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true,
-    "strict": true
-  },
-  "include": ["vite.config.ts"]
-}

apps/documentation/tuono.config.ts

@@ -1,12 +1,16 @@
 import type { TuonoConfig } from 'tuono/config'
+import mdx from '@mdx-js/rollup'
 
 const config: TuonoConfig = {
-	vite: {
-		alias: {
-			'@': 'src',
-			'@tabler/icons-react': '@tabler/icons-react/dist/esm/icons/index.mjs',
-		},
-	},
+  vite: {
+    alias: {
+      '@': 'src',
+      '@tabler/icons-react': '@tabler/icons-react/dist/esm/icons/index.mjs',
+    },
+    plugins: [
+      { enforce: 'pre', ...mdx({ providerImportSource: '@mdx-js/react' }) },
+    ],
+  },
 }
 
 export default config

crates/tuono/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "tuono"
-version = "0.16.0"
+version = "0.16.8"
 edition = "2021"
 authors = ["V. Ageno <valerioageno@yahoo.it>"]
 description = "Superfast React fullstack framework"

crates/tuono/src/lib.rs

@@ -1,3 +1,8 @@
+//! ## Tuono
+//! Tuono is a full-stack web framework for building React applications using Rust as the backend with a strong focus on usability and performance.
+//!
+//! You can find the full documentation at [tuono.dev](https://tuono.dev/)
+
 mod app;
 pub mod cli;
 mod mode;

crates/tuono/src/route.rs

@@ -22,12 +22,12 @@ pub struct AxumInfo {
 }
 
 impl AxumInfo {
-    pub fn new(path: String) -> Self {
+    pub fn new(route: &Route) -> Self {
         // Remove first slash
-        let mut module = path.chars();
+        let mut module = route.path.chars();
         module.next();
 
-        let axum_route = path.replace("/index", "");
+        let axum_route = route.path.replace("/index", "");
 
         let module_import = module
             .as_str()
@@ -44,7 +44,7 @@ impl AxumInfo {
             };
         }
 
-        if has_dynamic_path(&path) {
+        if route.is_dynamic {
             return AxumInfo {
                 module_import: module
                     .as_str()
@@ -52,8 +52,12 @@ impl AxumInfo {
                     .replace('/', "_")
                     .replace('-', "_hyphen_")
                     .replace('[', "dyn_")
+                    .replace("...", "catch_all_")
+                    .replace(']', ""),
+                axum_route: axum_route
+                    .replace("[...", "*")
+                    .replace('[', ":")
                     .replace(']', ""),
-                axum_route: axum_route.replace('[', ":").replace(']', ""),
             };
         }
 
@@ -134,7 +138,7 @@ impl Route {
     }
 
     pub fn update_axum_info(&mut self) {
-        self.axum_info = Some(AxumInfo::new(self.path.clone()))
+        self.axum_info = Some(AxumInfo::new(self))
     }
 
     pub fn save_ssg_file(&self, reqwest: &Client) {
@@ -159,8 +163,7 @@ impl Route {
 
         // Saving also the server response
         if self.axum_info.is_some() {
-            let data_file_path =
-                PathBuf::from(&format!("out/static/__tuono/data{}/data.json", path));
+            let data_file_path = PathBuf::from(&format!("out/static/__tuono/data{path}"));
 
             let data_parent_dir = data_file_path.parent().unwrap();
 
@@ -169,11 +172,11 @@ impl Route {
                     .expect("Failed to create data parent directories");
             }
 
-            let base = Url::parse("http://localhost:3000/__tuono/data/data.json").unwrap();
+            let base = Url::parse("http://localhost:3000/__tuono/data").unwrap();
 
             let path = if path == "/" { "" } else { path };
 
-            let pathname = &format!("/__tuono/data{path}/data.json");
+            let pathname = &format!("/__tuono/data{path}");
 
             let url = base
                 .join(pathname)
@@ -229,12 +232,12 @@ mod tests {
 
     #[test]
     fn should_correctly_create_the_axum_infos() {
-        let info = AxumInfo::new("/index".to_string());
+        let info = AxumInfo::new(&Route::new("/index".to_string()));
 
         assert_eq!(info.axum_route, "/");
         assert_eq!(info.module_import, "index");
 
-        let dyn_info = AxumInfo::new("/[posts]".to_string());
+        let dyn_info = AxumInfo::new(&Route::new("/[posts]".to_string()));
 
         assert_eq!(dyn_info.axum_route, "/:posts");
         assert_eq!(dyn_info.module_import, "dyn_posts");

crates/tuono/src/source_builder.rs

@@ -84,12 +84,11 @@ fn create_routes_declaration(routes: &HashMap<String, Route>) -> String {
 
             if !route.is_api() {
                 route_declarations.push_str(&format!(
-                    r#".route("{axum_route}", get({module_import}::route))"#
+                    r#".route("{axum_route}", get({module_import}::tuono__internal__route))"#
                 ));
-                let slash = if axum_route.ends_with('/') { "" } else { "/" };
 
                 route_declarations.push_str(&format!(
-                        r#".route("/__tuono/data{axum_route}{slash}data.json", get({module_import}::api))"#
+                    r#".route("/__tuono/data{axum_route}", get({module_import}::tuono__internal__api))"#
                 ));
             } else {
                 for method in route.api_data.as_ref().unwrap().methods.clone() {

crates/tuono/tests/cli_tests.rs

@@ -29,9 +29,8 @@ fn it_successfully_create_the_index_route() {
     assert!(temp_main_rs_content.contains(r#"#[path="../src/routes/index.rs"]"#));
     assert!(temp_main_rs_content.contains("mod index;"));
 
-    assert!(temp_main_rs_content.contains(
-        r#".route("/", get(index::route)).route("/__tuono/data/data.json", get(index::api))"#
-    ));
+    assert!(temp_main_rs_content
+        .contains(r#".route("/", get(index::tuono__internal__route)).route("/__tuono/data/", get(index::tuono__internal__api))"#));
 }
 
 #[test]
@@ -95,3 +94,49 @@ fn it_successfully_create_multiple_api_for_the_same_file() {
         r#".route("/api/health_check", get(api_health_check::get__tuono_internal_api))"#
     ));
 }
+
+#[test]
+#[serial]
+fn it_successfully_create_catch_all_routes() {
+    let temp_tuono_project = TempTuonoProject::new();
+
+    temp_tuono_project.add_route("./src/routes/[...all_routes].rs");
+
+    temp_tuono_project.add_api(
+        "./src/routes/api/[...all_apis].rs",
+        &format!("{POST_API_FILE}"),
+    );
+
+    let mut test_tuono_build = Command::cargo_bin("tuono").unwrap();
+    test_tuono_build
+        .arg("build")
+        .arg("--no-js-emit")
+        .assert()
+        .success();
+
+    let temp_main_rs_path = temp_tuono_project.path().join(".tuono/main.rs");
+
+    let temp_main_rs_content =
+        fs::read_to_string(&temp_main_rs_path).expect("Failed to read '.tuono/main.rs' content.");
+
+    assert!(temp_main_rs_content.contains(r#"#[path="../src/routes/api/[...all_apis].rs"]"#));
+    assert!(temp_main_rs_content.contains("mod api_dyn_catch_all_all_apis;"));
+
+    assert!(temp_main_rs_content.contains(r#"#[path="../src/routes/[...all_routes].rs"]"#));
+    assert!(temp_main_rs_content.contains("mod dyn_catch_all_all_routes;"));
+
+    assert!(temp_main_rs_content.contains(
+        r#".route("/api/*all_apis", post(api_dyn_catch_all_all_apis::post__tuono_internal_api))"#
+    ));
+
+    assert!(temp_main_rs_content.contains(
+        r#".route("/*all_routes", get(dyn_catch_all_all_routes::tuono__internal__route))"#
+    ));
+
+    assert!(temp_main_rs_content.contains(
+        r#".route("/*all_routes", get(dyn_catch_all_all_routes::tuono__internal__route))"#
+    ));
+
+    assert!(temp_main_rs_content
+        .contains(r#".route("/__tuono/data/*all_routes", get(dyn_catch_all_all_routes::tuono__internal__api))"#));
+}

crates/tuono_lib/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "tuono_lib"
-version = "0.16.0"
+version = "0.16.8"
 edition = "2021"
 authors = ["V. Ageno <valerioageno@yahoo.it>"]
 description = "Superfast React fullstack framework"
@@ -32,7 +32,7 @@ either = "1.13.0"
 tower-http = {version = "0.6.0", features = ["fs"]}
 colored = "2.1.0"
 
-tuono_lib_macros = {path = "../tuono_lib_macros", version = "0.16.0"}
+tuono_lib_macros = {path = "../tuono_lib_macros", version = "0.16.8"}
 # Match the same version used by axum
 tokio-tungstenite = "0.24.0"
 futures-util = { version = "0.3", default-features = false, features = ["sink", "std"] }

crates/tuono_lib/src/lib.rs

@@ -1,3 +1,8 @@
+//! ## Tuono
+//! Tuono is a full-stack web framework for building React applications using Rust as the backend with a strong focus on usability and performance.
+//!
+//! You can find the full documentation at [tuono.dev](https://tuono.dev/)
+
 mod catch_all;
 mod logger;
 mod manifest;

crates/tuono_lib/src/payload.rs

@@ -84,7 +84,7 @@ impl<'a> Payload<'a> {
                     .filter(|path| !path.is_empty())
                     .collect::<Vec<&str>>();
 
-                for dyn_route in dynamic_routes.iter() {
+                '_dynamic_routes_loop: for dyn_route in dynamic_routes.iter() {
                     let dyn_route_segments = dyn_route
                         .split('/')
                         .filter(|path| !path.is_empty())
@@ -93,6 +93,20 @@ impl<'a> Payload<'a> {
                     let mut route_segments_collector: Vec<&str> = vec![];
 
                     for i in 0..dyn_route_segments.len() {
+                        if dyn_route_segments[i].starts_with("[...") {
+                            route_segments_collector.push(dyn_route_segments[i]);
+
+                            let manifest_key = route_segments_collector.join("/");
+
+                            let route_data = manifest.get(&format!("/{manifest_key}"));
+                            if let Some(data) = route_data {
+                                js_bundles_sources.push(&data.file);
+                                data.css
+                                    .iter()
+                                    .for_each(|source| css_bundles_sources.push(source))
+                            }
+                            break '_dynamic_routes_loop;
+                        }
                         if path_segments.len() == i {
                             break;
                         }
@@ -168,6 +182,14 @@ mod tests {
                 css: vec!["assets/posts/[post]/[comment].css".to_string()],
             },
         );
+        manifest_mock.insert(
+            "/pokemons/[...catch_all]".to_string(),
+            BundleInfo {
+                file: "assets/catch_all.js".to_string(),
+                css: vec!["assets/catch_all.css".to_string()],
+            },
+        );
+
         manifest_mock.insert(
             "/posts/custom-post".to_string(),
             BundleInfo {
@@ -274,6 +296,28 @@ mod tests {
         );
     }
 
+    #[test]
+    fn should_load_the_correct_catch_all_bundles() {
+        let mut payload = prepare_payload(
+            Some("http://localhost:3000/pokemons/a-poke/a-poke"),
+            Mode::Prod,
+        );
+        let _ = payload.client_payload();
+        assert_eq!(
+            payload.js_bundles,
+            Some(vec![
+                &"assets/bundled-file.js".to_string(),
+                &"assets/catch_all.js".to_string()
+            ])
+        );
+        assert_eq!(
+            payload.css_bundles,
+            Some(vec![
+                &"assets/bundled-file.css".to_string(),
+                &"assets/catch_all.css".to_string()
+            ])
+        );
+    }
     #[test]
     fn should_load_the_defined_path_bundles() {
         let mut payload = prepare_payload(Some("http://localhost:3000/about"), Mode::Prod);

crates/tuono_lib_macros/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "tuono_lib_macros"
-version = "0.16.0"
+version = "0.16.8"
 edition = "2021"
 description = "Superfast React fullstack framework"
 homepage = "https://tuono.dev"

crates/tuono_lib_macros/src/handler.rs

@@ -45,7 +45,7 @@ pub fn handler_core(_args: TokenStream, item: TokenStream) -> TokenStream {
 
         #item
 
-        pub async fn route(
+        pub async fn tuono__internal__route(
             #axum_arguments
         ) -> impl tuono_lib::axum::response::IntoResponse {
 
@@ -59,7 +59,7 @@ pub fn handler_core(_args: TokenStream, item: TokenStream) -> TokenStream {
            #fn_name(req.clone(), #argument_names).await.render_to_string(req)
         }
 
-        pub async fn api(
+        pub async fn tuono__internal__api(
             #axum_arguments
         ) -> impl tuono_lib::axum::response::IntoResponse {
 

crates/tuono_lib_macros/src/lib.rs

@@ -1,3 +1,8 @@
+//! ## Tuono
+//! Tuono is a full-stack web framework for building React applications using Rust as the backend with a strong focus on usability and performance.
+//!
+//! You can find the full documentation at [tuono.dev](https://tuono.dev/)
+
 extern crate proc_macro;
 use proc_macro::TokenStream;
 

eslint.config.js

@@ -2,6 +2,9 @@ import eslint from '@eslint/js'
 import tseslint from 'typescript-eslint'
 // @ts-expect-error no types are available for this plugin
 import eslintPluginImport from 'eslint-plugin-import'
+import eslintPluginReact from 'eslint-plugin-react'
+// @ts-expect-error no types are available for this plugin
+import eslintPluginReactHooks from 'eslint-plugin-react-hooks'
 
 export default tseslint.config(
   {
@@ -13,7 +16,8 @@ export default tseslint.config(
       // #endregion shared
 
       // #region package-specific
-      'packages/fs-router-vite-plugin/tests/generator/**',
+      'packages/tuono-fs-router-vite-plugin/tests/generator/**',
+      'packages/tuono-lazy-fn-vite-plugin/tests/sources/**',
 
       'packages/tuono/bin/**',
       // #endregion package-specific
@@ -24,10 +28,34 @@ export default tseslint.config(
       reportUnusedDisableDirectives: 'error',
     },
   },
+
   eslint.configs.recommended,
+
+  /* eslint-disable @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-unsafe-member-access */
   eslintPluginImport.flatConfigs.recommended,
   eslintPluginImport.flatConfigs.typescript,
-  tseslint.configs.recommendedTypeChecked,
+  /* eslint-enable @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-unsafe-member-access */
+
+  // eslint-disable-next-line import/no-named-as-default-member
+  tseslint.configs.strictTypeChecked,
+
+  // @ts-expect-error flat is optional but always defined on runtime
+  eslintPluginReact.configs.flat.recommended,
+  // @ts-expect-error flat is optional but always defined on runtime
+  eslintPluginReact.configs.flat['jsx-runtime'],
+
+  {
+    files: ['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'],
+    plugins: {
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+      'react-hooks': eslintPluginReactHooks,
+    },
+    rules: {
+      'react-hooks/rules-of-hooks': 'error',
+      'react-hooks/exhaustive-deps': 'error',
+    },
+  },
+
   {
     languageOptions: {
       parserOptions: {
@@ -49,16 +77,13 @@ export default tseslint.config(
     rules: {
       // #region @typescript-eslint
       '@typescript-eslint/array-type': ['error', { default: 'generic' }],
-      '@typescript-eslint/no-wrapper-object-types': 'error',
-      '@typescript-eslint/no-empty-object-type': 'error',
-      '@typescript-eslint/no-unsafe-function-type': 'error',
-      '@typescript-eslint/ban-ts-comment': 'error',
       '@typescript-eslint/consistent-type-definitions': 'error',
       '@typescript-eslint/consistent-type-imports': [
         'error',
         { prefer: 'type-imports' },
       ],
       '@typescript-eslint/explicit-module-boundary-types': 'error',
+      '@typescript-eslint/explicit-function-return-type': 'error',
       '@typescript-eslint/method-signature-style': ['error', 'property'],
       '@typescript-eslint/naming-convention': [
         'error',
@@ -73,19 +98,24 @@ export default tseslint.config(
           },
         },
       ],
-      '@typescript-eslint/no-deprecated': 'error',
       '@typescript-eslint/no-empty-function': 'error',
       '@typescript-eslint/no-empty-interface': 'error',
-      '@typescript-eslint/no-explicit-any': 'off',
-      '@typescript-eslint/no-non-null-assertion': 'error',
-      '@typescript-eslint/no-unnecessary-condition': 'error',
-      '@typescript-eslint/no-unnecessary-type-assertion': 'error',
-      '@typescript-eslint/no-unused-vars': 'error',
-      '@typescript-eslint/explicit-function-return-type': 'error',
+
       '@typescript-eslint/no-inferrable-types': [
         'error',
         { ignoreParameters: true },
       ],
+      '@typescript-eslint/restrict-template-expressions': [
+        'error',
+        {
+          allowAny: false,
+          allowBoolean: false,
+          allowNever: false,
+          allowNullish: false,
+          allowNumber: true,
+          allowRegExp: false,
+        },
+      ],
       // #endregion @typescript-eslint
 
       // #region import
@@ -126,8 +156,10 @@ export default tseslint.config(
       'no-shadow': 'error',
       'no-undef': 'off',
       'sort-imports': 'off',
+      // #endregion misc
     },
   },
+
   {
     files: ['apps/documentation/**'],
     settings: {

examples/tuono-app/tsconfig.json

@@ -20,6 +20,5 @@
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true
   },
-  "include": ["src", "tuono.config.ts"],
-  "references": [{ "path": "./tsconfig.node.json" }]
+  "include": ["src", "tuono.config.ts"]
 }

examples/tuono-app/tsconfig.node.json

@@ -1,11 +0,0 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "skipLibCheck": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true,
-    "strict": true
-  },
-  "include": ["vite.config.ts"]
-}

examples/tuono-tutorial/tsconfig.json

@@ -23,6 +23,5 @@
       "@/*": ["./src/*"]
     }
   },
-  "include": ["src", "tuono.config.ts"],
-  "references": [{ "path": "./tsconfig.node.json" }]
+  "include": ["src", "tuono.config.ts"]
 }

examples/tuono-tutorial/tsconfig.node.json

@@ -1,11 +0,0 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "skipLibCheck": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true,
-    "strict": true
-  },
-  "include": ["vite.config.ts"]
-}

examples/with-mdx/tsconfig.json

@@ -20,6 +20,5 @@
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true
   },
-  "include": ["src", "tuono.config.ts"],
-  "references": [{ "path": "./tsconfig.node.json" }]
+  "include": ["src", "tuono.config.ts"]
 }

examples/with-mdx/tsconfig.node.json

@@ -1,11 +0,0 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "skipLibCheck": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true,
-    "strict": true
-  },
-  "include": ["vite.config.ts"]
-}

package.json

@@ -24,20 +24,15 @@
   "license": "MIT",
   "devDependencies": {
     "@eslint/js": "9.15.0",
-    "@tanstack/config": "^0.7.0",
-    "@types/node": "^22.0.0",
-    "@types/react": "^18.3.13",
-    "@vitejs/plugin-react": "^4.2.1",
-    "eslint": "^9.15.0",
-    "eslint-import-resolver-typescript": "^3.6.1",
-    "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-react": "^7.33.2",
-    "eslint-plugin-react-hooks": "^5.0.0",
-    "prettier": "^3.2.4",
-    "turbo": "^2.2.3",
+    "@types/node": "22.10.0",
+    "eslint": "9.15.0",
+    "eslint-import-resolver-typescript": "3.6.3",
+    "eslint-plugin-import": "2.31.0",
+    "eslint-plugin-react": "7.37.2",
+    "eslint-plugin-react-hooks": "5.1.0",
+    "prettier": "3.4.1",
+    "turbo": "2.2.3",
     "typescript": "5.6.3",
-    "typescript-eslint": "8.15.0",
-    "vite": "^5.2.11",
-    "vitest": "^2.0.0"
+    "typescript-eslint": "8.15.0"
   }
 }

packages/lazy-fn-vite-plugin/.prettierignore

@@ -1,2 +0,0 @@
-dist
-pnpm-lock.yaml

packages/lazy-fn-vite-plugin/src/index.ts

@@ -1,119 +0,0 @@
-import * as babel from '@babel/core'
-import * as t from '@babel/types'
-import type { Plugin } from 'vite'
-import type { PluginItem } from '@babel/core'
-import type {
-  Identifier,
-  CallExpression,
-  ArrowFunctionExpression,
-  StringLiteral,
-} from '@babel/types'
-
-import {
-  TUONO_MAIN_PACKAGE,
-  TUONO_DYNAMIC_FN_ID,
-  TUONO_LAZY_FN_ID,
-} from './constants'
-import { isTuonoDynamicFnImported } from './utils'
-
-/**
- * [SERVER build]
- * This plugin just removes the `dynamic` imported function from any tuono import
- */
-const RemoveTuonoLazyImport: PluginItem = {
-  name: 'remove-tuono-lazy-import-plugin',
-  visitor: {
-    ImportSpecifier: (path) => {
-      if (isTuonoDynamicFnImported(path)) {
-        path.remove()
-      }
-    },
-  },
-}
-
-/**
- * [CLIENT build]
- * This plugin replace the `dynamic` function with the `lazyLoadComponent` one
- */
-const ReplaceTuonoLazyImport: PluginItem = {
-  name: 'remove-tuono-lazy-import-plugin',
-  visitor: {
-    ImportSpecifier: (path) => {
-      if (isTuonoDynamicFnImported(path)) {
-        ;(path.node.imported as Identifier).name = TUONO_LAZY_FN_ID
-      }
-    },
-  },
-}
-
-const turnLazyIntoStatic = {
-  VariableDeclaration: (path: babel.NodePath<t.VariableDeclaration>): void => {
-    path.node.declarations.forEach((el) => {
-      const init = el.init as CallExpression
-      if ((init.callee as Identifier).name === TUONO_DYNAMIC_FN_ID) {
-        const importName = (el.id as Identifier).name
-        const importPath = (
-          (
-            (init.arguments[0] as ArrowFunctionExpression)
-              .body as CallExpression
-          ).arguments[0] as StringLiteral
-        ).value
-
-        if (importName && importPath) {
-          const importDeclaration = t.importDeclaration(
-            [t.importDefaultSpecifier(t.identifier(importName))],
-            t.stringLiteral(importPath),
-          )
-
-          path.replaceWith(importDeclaration)
-        }
-      }
-    })
-  },
-}
-
-/**
- * [SERVER build]
- * This plugin statically imports the lazy loaded components
- */
-const TurnLazyIntoStaticImport: PluginItem = {
-  name: 'turn-lazy-into-static-import-plugin',
-  visitor: {
-    Program: (path) => {
-      path.traverse({
-        ImportSpecifier: (subPath) => {
-          if (isTuonoDynamicFnImported(subPath)) {
-            path.traverse(turnLazyIntoStatic)
-          }
-        },
-      })
-    },
-  },
-}
-
-export function LazyLoadingPlugin(): Plugin {
-  return {
-    name: 'vite-plugin-tuono-lazy-loading',
-    enforce: 'pre',
-    transform(code, _id, opts): string | undefined | null {
-      if (
-        code.includes(TUONO_DYNAMIC_FN_ID) &&
-        code.includes(TUONO_MAIN_PACKAGE)
-      ) {
-        const res = babel.transformSync(code, {
-          plugins: [
-            ['@babel/plugin-syntax-jsx', {}],
-            ['@babel/plugin-syntax-typescript', { isTSX: true }],
-            [!opts?.ssr ? ReplaceTuonoLazyImport : []],
-            [opts?.ssr ? RemoveTuonoLazyImport : []],
-            [opts?.ssr ? TurnLazyIntoStaticImport : []],
-          ],
-          sourceMaps: true,
-        })
-
-        return res?.code
-      }
-      return code
-    },
-  }
-}

packages/lazy-fn-vite-plugin/src/utils.ts

@@ -1,22 +0,0 @@
-import type {
-  Identifier,
-  ImportDeclaration,
-  ImportSpecifier,
-} from '@babel/types'
-
-import { TUONO_MAIN_PACKAGE, TUONO_DYNAMIC_FN_ID } from './constants'
-
-export const isTuonoDynamicFnImported = (
-  path: babel.NodePath<ImportSpecifier>,
-): boolean => {
-  if ((path.node.imported as Identifier).name !== TUONO_DYNAMIC_FN_ID) {
-    return false
-  }
-  if (
-    (path.parentPath.node as ImportDeclaration).source.value !==
-    TUONO_MAIN_PACKAGE
-  ) {
-    return false
-  }
-  return true
-}

packages/lazy-fn-vite-plugin/tests/transpileSource.test.ts

@@ -1,77 +0,0 @@
-import { it, expect, describe } from 'vitest'
-import type { Plugin } from 'vite'
-
-import { LazyLoadingPlugin } from '../src'
-
-const SOURCE_CODE = `
-import { createRoute, dynamic } from 'tuono'
-
-const IndexImport = dynamic(() => import('./../src/routes/index'))
-const PokemonspokemonImport = dynamic(
-  () => import('./../src/routes/pokemons/[pokemon]'),
-)
-`
-
-const NON_DYNAMIC_SOURCE = `
-import { createRoute } from 'tuono'
-import {dynamic} from 'external-lib'
-
-const IndexImport = dynamic(() => import('./../src/routes/index'))
-const PokemonspokemonImport = dynamic(
-  () => import('./../src/routes/pokemons/[pokemon]'),
-)
-`
-
-type ViteTransformHandler = Exclude<
-  Plugin['transform'],
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
-  Function | undefined
->['handler']
-
-// Create a type-safe transform method
-function getTransform(): (...args: Parameters<ViteTransformHandler>) => string {
-  return LazyLoadingPlugin().transform as never
-}
-
-describe('Transpile tuono source', () => {
-  it('Into the client bundle', () => {
-    const pluginTransform = getTransform()
-    const bundle = pluginTransform(SOURCE_CODE, 'id')
-    expect(bundle)
-      .toBe(`import { createRoute, lazyLoadComponent as dynamic } from 'tuono';
-const IndexImport = dynamic(() => import('./../src/routes/index'));
-const PokemonspokemonImport = dynamic(() => import('./../src/routes/pokemons/[pokemon]'));`)
-  })
-
-  it('Into the server bundle', () => {
-    const pluginTransform = getTransform()
-    const bundle = pluginTransform(SOURCE_CODE, 'id', {
-      ssr: true,
-    })
-    expect(bundle).toBe(`import { createRoute } from 'tuono';
-import IndexImport from "./../src/routes/index";
-import PokemonspokemonImport from "./../src/routes/pokemons/[pokemon]";`)
-  })
-})
-
-describe('Non tuono dynamic function', () => {
-  it('Into the client bundle', () => {
-    const pluginTransform = getTransform()
-    const bundle = pluginTransform(NON_DYNAMIC_SOURCE, 'id')
-    expect(bundle).toBe(`import { createRoute } from 'tuono';
-import { dynamic } from 'external-lib';
-const IndexImport = dynamic(() => import('./../src/routes/index'));
-const PokemonspokemonImport = dynamic(() => import('./../src/routes/pokemons/[pokemon]'));`)
-  })
-
-  it('Into the server bundle', () => {
-    const pluginTransform = getTransform()
-    const bundle = pluginTransform(NON_DYNAMIC_SOURCE, 'id', {
-      ssr: true,
-    })
-    expect(bundle).toBe(`import { createRoute } from 'tuono';
-import { dynamic } from 'external-lib';
-const IndexImport = dynamic(() => import('./../src/routes/index'));
-const PokemonspokemonImport = dynamic(() => import('./../src/routes/pokemons/[pokemon]'));`)
-  })
-})

packages/lazy-fn-vite-plugin/tsconfig.json

@@ -1,4 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-  "include": ["src", "tests", "vite.config.ts"]
-}

packages/router/.prettierignore

@@ -1,2 +0,0 @@
-dist
-pnpm-lock.yaml

packages/router/src/components/RouterContext.tsx

@@ -1,22 +0,0 @@
-import React from 'react'
-
-import type { Router } from '../router'
-
-// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-const routerContext = React.createContext<Router>(null!)
-
-const TUONO_CONTEXT_GLOBAL_NAME = '__TUONO_CONTEXT__'
-
-export function getRouterContext(): React.Context<Router> {
-  if (typeof document === 'undefined') {
-    return routerContext
-  }
-
-  if (window[TUONO_CONTEXT_GLOBAL_NAME]) {
-    return window[TUONO_CONTEXT_GLOBAL_NAME]
-  }
-
-  window[TUONO_CONTEXT_GLOBAL_NAME] = routerContext
-
-  return routerContext
-}

packages/router/src/components/RouterProvider.tsx

@@ -1,51 +0,0 @@
-import React from 'react'
-import type { ReactNode, JSX } from 'react'
-
-import { useListenBrowserUrlUpdates } from '../hooks/useListenBrowserUrlUpdates'
-import { initRouterStore } from '../hooks/useRouterStore'
-import type { ServerProps } from '../types'
-import type { Router } from '../router'
-
-import { getRouterContext } from './RouterContext'
-import { Matches } from './Matches'
-
-interface RouterContextProviderProps {
-  router: Router
-  children: ReactNode
-}
-
-function RouterContextProvider({
-  router,
-  children,
-}: RouterContextProviderProps): JSX.Element {
-  // Allow the router to update options on the router instance
-  router.update({ ...router.options } as Parameters<typeof router.update>[0])
-
-  const routerContext = getRouterContext()
-
-  return (
-    <React.Suspense>
-      <routerContext.Provider value={router}>{children}</routerContext.Provider>
-    </React.Suspense>
-  )
-}
-
-interface RouterProviderProps {
-  router: Router
-  serverProps?: ServerProps
-}
-
-export function RouterProvider({
-  router,
-  serverProps,
-}: RouterProviderProps): JSX.Element {
-  initRouterStore(serverProps)
-
-  useListenBrowserUrlUpdates()
-
-  return (
-    <RouterContextProvider router={router}>
-      <Matches serverSideProps={serverProps?.props} />
-    </RouterContextProvider>
-  )
-}

packages/router/src/hooks/useInternalRouter.tsx

@@ -1,8 +0,0 @@
-import * as React from 'react'
-
-import { getRouterContext } from '../components/RouterContext'
-import type { Router } from '../router'
-
-export function useInternalRouter(): Router {
-  return React.useContext(getRouterContext())
-}

packages/router/src/hooks/useListenBrowserUrlUpdates.tsx

@@ -1,31 +0,0 @@
-import { useEffect } from 'react'
-
-import { useRouterStore } from './useRouterStore'
-
-/**
- * This hook is meant to handle just browser related location updates
- * like the back and forward buttons.
- */
-export const useListenBrowserUrlUpdates = (): void => {
-  const updateLocation = useRouterStore((st) => st.updateLocation)
-
-  const updateLocationOnPopStateChange = ({ target }: PopStateEvent): void => {
-    const { pathname, hash, href, search } = (target as typeof window).location
-
-    updateLocation({
-      pathname,
-      hash,
-      href,
-      searchStr: search,
-      search: Object.fromEntries(new URLSearchParams(search)),
-    })
-  }
-
-  useEffect(() => {
-    window.addEventListener('popstate', updateLocationOnPopStateChange)
-
-    return (): void => {
-      window.removeEventListener('popstate', updateLocationOnPopStateChange)
-    }
-  }, [])
-}

packages/router/src/hooks/useRoute.spec.tsx

@@ -1,35 +0,0 @@
-import { afterEach, describe, expect, test, vi } from 'vitest'
-import { cleanup } from '@testing-library/react'
-
-import useRoute from './useRoute'
-
-describe('Test useRoute fn', () => {
-  afterEach(cleanup)
-
-  test('match routes by ids', () => {
-    vi.mock('./useInternalRouter.tsx', () => ({
-      useInternalRouter: (): { routesById: Record<string, any> } => {
-        return {
-          routesById: {
-            '/': { id: '/' },
-            '/about': { id: '/about' },
-            '/posts': { id: '/posts' }, // posts/index
-            '/posts/[post]': { id: '/posts/[post]' },
-            '/posts/defined-post': { id: '/posts/defined-post' },
-            '/posts/[post]/[comment]': { id: '/posts/[post]/[comment]' },
-          },
-        }
-      },
-    }))
-
-    expect(useRoute('/')?.id).toBe('/')
-    expect(useRoute('/not-found')?.id).toBe(undefined)
-    expect(useRoute('/about')?.id).toBe('/about')
-    expect(useRoute('/posts/')?.id).toBe('/posts')
-    expect(useRoute('/posts/dynamic-post')?.id).toBe('/posts/[post]')
-    expect(useRoute('/posts/defined-post')?.id).toBe('/posts/defined-post')
-    expect(useRoute('/posts/dynamic-post/dynamic-comment')?.id).toBe(
-      '/posts/[post]/[comment]',
-    )
-  })
-})

packages/router/src/hooks/useRouter.tsx

@@ -1,56 +0,0 @@
-import { useRouterStore } from './useRouterStore'
-
-interface PushOptions {
-  /**
-   * If "false" the scroll offset will be kept across page navigation. Default "true"
-   */
-  scroll?: boolean
-}
-
-interface UseRouterHook {
-  /**
-   * Redirects to the path passed as argument updating the browser history.
-   */
-  push: (path: string, opt?: PushOptions) => void
-
-  /**
-   * This object contains all the query params of the current route
-   */
-  query: Record<string, any>
-
-  /**
-   * Returns the current pathname
-   */
-  pathname: string
-}
-
-export const useRouter = (): UseRouterHook => {
-  const [location, updateLocation] = useRouterStore((st) => [
-    st.location,
-    st.updateLocation,
-  ])
-
-  const push = (path: string, opt?: PushOptions): void => {
-    const { scroll = true } = opt || {}
-    const url = new URL(path, window.location.origin)
-
-    updateLocation({
-      href: url.href,
-      pathname: url.pathname,
-      search: Object.fromEntries(url.searchParams),
-      searchStr: url.search,
-      hash: url.hash,
-    })
-    history.pushState(path, '', path)
-
-    if (scroll) {
-      window.scroll(0, 0)
-    }
-  }
-
-  return {
-    push,
-    query: location.search,
-    pathname: location.pathname,
-  }
-}

packages/router/src/hooks/useRouterStore.tsx

@@ -1,71 +0,0 @@
-import { create } from 'zustand'
-import { useLayoutEffect } from 'react'
-
-import type { ServerProps } from '../types'
-
-export interface ParsedLocation {
-  href: string
-  pathname: string
-  search: Record<string, string>
-  searchStr: string
-  hash: string
-}
-
-interface RouterState {
-  isLoading: boolean
-  isTransitioning: boolean
-  status: 'idle'
-  location: ParsedLocation
-  matches: Array<string>
-  pendingMatches: Array<string>
-  cachedMatches: Array<string>
-  statusCode: 200
-  updateLocation: (loc: ParsedLocation) => void
-}
-
-export const initRouterStore = (props?: ServerProps): void => {
-  const updateLocation = useRouterStore((st) => st.updateLocation)
-
-  // Init the store in the server in order to correctly
-  // SSR the components that depend on the router.
-  if (typeof window === 'undefined') {
-    updateLocation({
-      pathname: props?.router.pathname || '',
-      hash: '',
-      href: props?.router.href || '',
-      searchStr: props?.router.searchStr || '',
-      search: {},
-    })
-  }
-
-  // Update the store on the client side before the first
-  // rendering
-  useLayoutEffect(() => {
-    const { pathname, hash, href, search } = window.location
-    updateLocation({
-      pathname,
-      hash,
-      href,
-      searchStr: search,
-      search: Object.fromEntries(new URLSearchParams(search)),
-    })
-  }, [])
-}
-
-export const useRouterStore = create<RouterState>()((set) => ({
-  isLoading: false,
-  isTransitioning: false,
-  status: 'idle',
-  location: {
-    href: '',
-    pathname: '',
-    search: {},
-    searchStr: '',
-    hash: '',
-  },
-  matches: [],
-  pendingMatches: [],
-  cachedMatches: [],
-  statusCode: 200,
-  updateLocation: (location: ParsedLocation): void => set({ location }),
-}))

packages/tuono-fs-router-vite-plugin/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tuono-fs-router-vite-plugin",
-  "version": "0.16.0",
+  "version": "0.16.8",
   "description": "Plugin for the tuono's file system router. Tuono is the react/rust fullstack framework",
   "homepage": "https://tuono.dev",
   "scripts": {
@@ -16,7 +16,7 @@
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tuono-labs/tuono.git",
-    "directory": "packages/fs-router-vite-plugin"
+    "directory": "packages/tuono-fs-router-vite-plugin"
   },
   "keywords": [],
   "author": "Valerio Ageno",
@@ -50,7 +50,7 @@
     "vite": "^5.2.11"
   },
   "devDependencies": {
-    "@tanstack/config": "^0.7.11",
+    "@tanstack/config": "0.7.13",
     "@types/babel__core": "^7.20.5",
     "vitest": "^2.0.0"
   }

packages/tuono-fs-router-vite-plugin/src/build-route-config.spec.ts

@@ -6,13 +6,13 @@ const routes = [
   {
     filePath: 'posts/my-post.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/my-post.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/my-post.tsx',
     routePath: '/posts/my-post',
     variableName: 'PostsMyPost',
     parent: {
       filePath: 'posts/__root.tsx',
       fullPath:
-        '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
+        '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
       routePath: '/posts/__root',
       variableName: 'Postsroot',
       path: '/posts/__root',
@@ -25,13 +25,13 @@ const routes = [
   {
     filePath: 'posts/index.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/index.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/index.tsx',
     routePath: '/posts/',
     variableName: 'PostsIndex',
     parent: {
       filePath: 'posts/__root.tsx',
       fullPath:
-        '/home/valerio/Documents/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
+        '/home/valerio/Documents/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
       routePath: '/posts/__root',
       variableName: 'Postsroot',
       path: '/posts/__root',
@@ -44,13 +44,13 @@ const routes = [
   {
     filePath: 'posts/[post].tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/index.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/index.tsx',
     routePath: '/posts/',
     variableName: 'PostspostIndex',
     parent: {
       filePath: 'posts/__root.tsx',
       fullPath:
-        '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
+        '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
       routePath: '/posts/__root',
       variableName: 'Postsroot',
       path: '/posts/__root',

packages/tuono-fs-router-vite-plugin/src/build-route-config.ts

@@ -3,7 +3,7 @@ import type { RouteNode } from './types'
 
 export function buildRouteConfig(nodes: Array<RouteNode>, depth = 1): string {
   const children = nodes.map((node) => {
-    const route = `${node.variableName}Route`
+    const route = `${node.variableName as string}Route`
 
     if (node.children?.length) {
       const childConfigs = buildRouteConfig(node.children, depth + 1)

packages/tuono-fs-router-vite-plugin/src/generator.ts

@@ -15,7 +15,6 @@ import {
   removeGroups,
   removeLastSlash,
   removeUnderscores,
-  removeLayoutSegments,
 } from './utils'
 
 import type { Config, RouteNode } from './types'
@@ -61,8 +60,7 @@ async function getRouteNodes(
           }
           const filePath = replaceBackslash(path.join(dir, dirent.name))
           const filePathNoExt = removeExt(filePath)
-          let routePath =
-            cleanPath(`/${filePathNoExt.split('.').join('/')}`) || ''
+          let routePath = cleanPath(`/${filePathNoExt}`) || ''
 
           const variableName = routePathToVariable(routePath)
 
@@ -139,7 +137,7 @@ export async function routeGenerator(config = defaultConfig): Promise<void> {
     node.path = determineNodePath(node)
 
     node.cleanedPath = removeLastSlash(
-      removeGroups(removeUnderscores(removeLayoutSegments(node.path)) ?? ''),
+      removeGroups(removeUnderscores(node.path) ?? ''),
     )
 
     if (node.parent) {
@@ -159,14 +157,14 @@ export async function routeGenerator(config = defaultConfig): Promise<void> {
     (d): number => (d.routePath.includes(`/${ROOT_PATH_ID}`) ? -1 : 1),
     (d): number => d.routePath.split('/').length,
     (d): number => (d.routePath.endsWith("index'") ? -1 : 1),
-    (d): any => d,
+    (d): RouteNode => d,
   ])
 
   const imports = [
     ...sortedRouteNodes.map((node) => {
       const extension = node.filePath.endsWith('mdx') ? '.mdx' : ''
       return `const ${
-        node.variableName
+        node.variableName as string
       }Import = dynamic(() => import('./${replaceBackslash(
         removeExt(
           path.relative(
@@ -183,18 +181,21 @@ export async function routeGenerator(config = defaultConfig): Promise<void> {
     ...sortedRouteNodes.map((node) => {
       const isRoot = node.routePath.endsWith(ROOT_PATH_ID)
       const rootDeclaration = isRoot ? ', isRoot: true' : ''
+      const variableName = node.variableName as string
 
-      return `const ${node.variableName} = createRoute({ component: ${node.variableName}Import${rootDeclaration} })`
+      return `const ${variableName} = createRoute({ component: ${variableName}Import${rootDeclaration} })`
     }),
   ].join('\n')
 
   const createRouteUpdates = [
     sortedRouteNodes
       .map((node) => {
+        const variableName = node.variableName as string
+        const cleanedPath = node.cleanedPath as string
         return [
-          `const ${node.variableName}Route = ${node.variableName}.update({
+          `const ${variableName}Route = ${variableName}.update({
           ${[
-            !node.path?.endsWith(ROOT_PATH_ID) && `path: '${node.cleanedPath}'`,
+            !node.path?.endsWith(ROOT_PATH_ID) && `path: '${cleanedPath}'`,
             `getParentRoute: () => ${node.parent?.variableName ?? 'root'}Route`,
             rustHandlersNodes.includes(node.path || '')
               ? 'hasHandler: true'
@@ -238,7 +239,7 @@ export async function routeGenerator(config = defaultConfig): Promise<void> {
 
   const routeTreeContent = await fsp
     .readFile(path.resolve(config.generatedRouteTree), 'utf-8')
-    .catch((e) => {
+    .catch((e: unknown) => {
       const err = e as Error & { code?: string }
       if (err.code === 'ENOENT') {
         return undefined

packages/tuono-fs-router-vite-plugin/src/has-parent-route.spec.ts

@@ -6,7 +6,7 @@ const routes = [
   {
     filePath: 'posts/[post].tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/[post].tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/[post].tsx',
     routePath: '/posts/[post]',
     variableName: 'Postspost',
     path: '/posts/[post]',
@@ -15,7 +15,7 @@ const routes = [
   {
     filePath: 'posts/__root.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/__root.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/__root.tsx',
     routePath: '/posts/__root',
     variableName: 'Postsroot',
     path: '/posts/__root',
@@ -24,7 +24,7 @@ const routes = [
   {
     filePath: 'index.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root/routes/index.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root/routes/index.tsx',
     routePath: '/',
     variableName: 'Index',
     path: '/',
@@ -33,7 +33,7 @@ const routes = [
   {
     filePath: 'posts/my-post.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/my-post.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/my-post.tsx',
     routePath: '/posts/my-post',
     variableName: 'PostsMyPost',
     path: '/posts/my-post',
@@ -44,7 +44,7 @@ const routes = [
 const parent = {
   filePath: 'posts/__root.tsx',
   fullPath:
-    '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/__root.tsx',
+    '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/__root.tsx',
   routePath: '/posts/__root',
   variableName: 'Postsroot',
   path: '/posts/__root',
@@ -54,7 +54,7 @@ const parent = {
 const myPost = {
   filePath: 'posts/my-post.tsx',
   fullPath:
-    '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/my-post.tsx',
+    '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/my-post.tsx',
   routePath: '/posts/my-post',
   variableName: 'PostsMyPost',
   path: '/posts/my-post',
@@ -64,7 +64,7 @@ const myPost = {
 const dynamicRoute = {
   filePath: 'posts/[post].tsx',
   fullPath:
-    '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/[post].tsx',
+    '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root/routes/posts/[post].tsx',
   routePath: '/posts/[post]',
   variableName: 'Postspost',
   path: '/posts/[post]',

packages/tuono-fs-router-vite-plugin/src/index.ts

@@ -8,7 +8,7 @@ const ROUTES_DIRECTORY_PATH = './src/routes'
 
 let lock = false
 
-export default function RouterGenerator(): Plugin {
+export function TuonoFsRouterPlugin(): Plugin {
   const generate = async (): Promise<void> => {
     if (lock) return
     lock = true

packages/tuono-fs-router-vite-plugin/src/sort-route-nodes.spec.ts

@@ -6,7 +6,7 @@ const routes = [
   {
     filePath: 'index.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/index.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/index.tsx',
     routePath: '/',
     variableName: 'Index',
     path: '/',
@@ -15,7 +15,7 @@ const routes = [
   {
     filePath: 'about.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/about.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/about.tsx',
     routePath: '/about',
     variableName: 'About',
     path: '/about',
@@ -24,35 +24,35 @@ const routes = [
   {
     filePath: '__root.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/__root.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/__root.tsx',
     routePath: '/__root',
     variableName: 'root',
   },
   {
     filePath: 'posts/[post].tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/[post].tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/[post].tsx',
     routePath: '/posts/[post]',
     variableName: 'Postspost',
   },
   {
     filePath: 'posts/my-post.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/my-post.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/my-post.tsx',
     routePath: '/posts/my-post',
     variableName: 'PostsMyPost',
   },
   {
     filePath: 'posts/index.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/index.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/index.tsx',
     routePath: '/posts/',
     variableName: 'PostsIndex',
   },
   {
     filePath: 'posts/__root.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
     routePath: '/posts/__root',
     variableName: 'Postsroot',
   },
@@ -62,7 +62,7 @@ const expectedSorting = [
   {
     filePath: 'index.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/index.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/index.tsx',
     routePath: '/',
     variableName: 'Index',
     path: '/',
@@ -71,7 +71,7 @@ const expectedSorting = [
   {
     filePath: 'about.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/about.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/about.tsx',
     routePath: '/about',
     variableName: 'About',
     path: '/about',
@@ -80,28 +80,28 @@ const expectedSorting = [
   {
     filePath: 'posts/__root.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/__root.tsx',
     routePath: '/posts/__root',
     variableName: 'Postsroot',
   },
   {
     filePath: 'posts/my-post.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/my-post.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/my-post.tsx',
     routePath: '/posts/my-post',
     variableName: 'PostsMyPost',
   },
   {
     filePath: 'posts/index.tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/index.tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/index.tsx',
     routePath: '/posts/',
     variableName: 'PostsIndex',
   },
   {
     filePath: 'posts/[post].tsx',
     fullPath:
-      '/tuono/packages/fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/[post].tsx',
+      '/tuono/packages/tuono-fs-router-vite-plugin/tests/generator/multi-level-root-dynamic/routes/posts/[post].tsx',
     routePath: '/posts/[post]',
     variableName: 'Postspost',
   },

packages/tuono-fs-router-vite-plugin/src/utils.ts

@@ -1,7 +1,5 @@
 import type { RouteNode } from './types'
 
-const ROUTE_GROUP_PATTERN_REGEX = /\(.+\)/g
-
 export function removeExt(d: string, keepExtension: boolean = false): string {
   return keepExtension ? d : d.substring(0, d.lastIndexOf('.')) || d
 }
@@ -78,22 +76,8 @@ export function removeTrailingUnderscores(s?: string): string | undefined {
   return s?.replaceAll(/(_$)/gi, '').replaceAll(/(_\/)/gi, '/')
 }
 
-/**
- * Removes all segments from a given path that start with an underscore ('_').
- *
- * @param routePath - The path from which to remove segments. Defaults to '/'.
- * @returns The path with all underscore-prefixed segments removed.
- * @example
- * removeLayoutSegments('/workspace/_auth/foo') // '/workspace/foo'
- */
-export function removeLayoutSegments(routePath: string = '/'): string {
-  const segments = routePath.split('/')
-  const newSegments = segments.filter((segment) => !segment.startsWith('_'))
-  return newSegments.join('/')
-}
-
 export function removeGroups(s: string): string {
-  return s.replaceAll(ROUTE_GROUP_PATTERN_REGEX, '').replaceAll('//', '/')
+  return s.replaceAll('//', '/')
 }
 
 export function trimPathLeft(pathToTrim: string): string {

packages/tuono-fs-router-vite-plugin/tests/generator.spec.ts

@@ -5,7 +5,7 @@ import { describe, it, expect } from 'vitest'
 import { routeGenerator } from '../src/generator'
 
 describe('generator works', async () => {
-  const folderNames = await fs.readdir(process.cwd() + '/tests/generator')
+  const folderNames = await fs.readdir(`${process.cwd()}/tests/generator`)
 
   it.each(folderNames)(
     'should wire-up the routes for a "%s" tree',

packages/tuono-fs-router-vite-plugin/tests/generator/catch_all/routeTree.expected.ts

@@ -0,0 +1,31 @@
+// This file is auto-generated by Tuono
+
+import { createRoute, dynamic } from 'tuono'
+
+import RootImport from './routes/__root'
+
+const IndexImport = dynamic(() => import('./routes/index'))
+const PostscatchallImport = dynamic(
+  () => import('./routes/posts/[...catch_all]'),
+)
+
+const rootRoute = createRoute({ isRoot: true, component: RootImport })
+
+const Index = createRoute({ component: IndexImport })
+const Postscatchall = createRoute({ component: PostscatchallImport })
+
+// Create/Update Routes
+
+const IndexRoute = Index.update({
+  path: '/',
+  getParentRoute: () => rootRoute,
+})
+
+const PostscatchallRoute = Postscatchall.update({
+  path: '/posts/[...catch_all]',
+  getParentRoute: () => rootRoute,
+})
+
+// Create and export the route tree
+
+export const routeTree = rootRoute.addChildren([IndexRoute, PostscatchallRoute])

packages/tuono-fs-router-vite-plugin/tests/generator/single-level/routes/about.tsx

@@ -0,0 +1 @@
+/** export default */