= {}
56 |
57 | normalizedRouteUrl.forEach((segment, index) => {
58 | if (segment.startsWith(":")) {
59 | params[segment.slice(1)] = normalizedUrl[index]
60 | }
61 | })
62 |
63 | return params
64 | }
65 |
--------------------------------------------------------------------------------
/src/router/router.ts:
--------------------------------------------------------------------------------
1 | import { ReactNode } from "react"
2 | import { z } from "zod"
3 |
4 | export type Route<
5 | Path extends string,
6 | P extends z.AnyZodObject = z.AnyZodObject,
7 | R = unknown
8 | > = {
9 | path: Path
10 | component?: ReactNode
11 | params?: P
12 | loader?: P extends z.AnyZodObject
13 | ? (params: z.infer) => Promise
14 | : undefined
15 | }
16 |
17 | export type ParsedRoute = {
18 | component: ReactNode
19 | params?: z.AnyZodObject
20 | }
21 |
--------------------------------------------------------------------------------
/src/router/types.ts:
--------------------------------------------------------------------------------
1 | import { ComponentType } from "react"
2 | import { Register } from "./my-router"
3 | import { z } from "zod"
4 |
5 | export type RegisteredRoutes = Register extends { routes: infer R }
6 | ? R extends readonly (infer Route)[]
7 | ? Route
8 | : never
9 | : DefinedRoute[]
10 |
11 | export type NavigableRoutes = Exclude
12 |
13 | export type DynamicRoute = `${string}/:${string}`
14 |
15 | export type RouteWithParams<
16 | Params extends z.AnyZodObject,
17 | Loader,
18 | Layout extends boolean = false
19 | > = BaseRoute & {
20 | path: DynamicRoute
21 | params: Params
22 | loader?: (params: z.infer) => Promise
23 | }
24 |
25 | export type RouteWithNoParams<
26 | Loader,
27 | Layout extends boolean = false
28 | > = BaseRoute & {
29 | path: string
30 | loader?: () => Promise
31 | }
32 |
33 | export type ParamsForPath =
34 | Path extends DynamicRoute
35 | ? Extract extends { params: infer P }
36 | ? P extends z.AnyZodObject
37 | ? z.infer
38 | : never
39 | : never
40 | : never
41 |
42 | export function isDynamicRoute<
43 | Params extends z.AnyZodObject,
44 | Loader,
45 | Layout extends boolean = false
46 | >(
47 | route:
48 | | Omit, "path">
49 | | DefinedRoute
50 | ): route is RouteWithParams {
51 | return (route as RouteWithParams).params != null
52 | }
53 |
54 | type BaseRoute = {
55 | component: ComponentType
56 | layout?: Layout
57 | }
58 |
59 | type DefinedRoute<
60 | Params extends z.AnyZodObject,
61 | Loader,
62 | Layout extends boolean = false
63 | > = RouteWithParams | RouteWithNoParams
64 |
--------------------------------------------------------------------------------
/src/routes.tsx:
--------------------------------------------------------------------------------
1 | import { homeLayoutRoute } from "./pages/layout"
2 | import { homeRoute } from "./pages/home"
3 | import { aboutRoute } from "./pages/about/[id]"
4 | import { aboutChildRoute } from "./pages/about/child"
5 | import { aboutLayoutRoute } from "./pages/about/layout"
6 | import { contactDetailsRoute } from "./pages/contact/details"
7 |
8 | export const routes = [
9 | homeLayoutRoute,
10 | homeRoute,
11 | aboutRoute,
12 | aboutChildRoute,
13 | aboutLayoutRoute,
14 | contactDetailsRoute,
15 | ] as const
16 |
17 | declare module "./router/my-router" {
18 | interface Register {
19 | routes: typeof routes
20 | }
21 | }
22 |
--------------------------------------------------------------------------------
/src/vite-env.d.ts:
--------------------------------------------------------------------------------
1 | ///
2 |
--------------------------------------------------------------------------------
/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
4 | "target": "es2022",
5 | "useDefineForClassFields": true,
6 | "lib": ["es2022", "DOM", "DOM.Iterable"],
7 | "module": "ESNext",
8 | "skipLibCheck": true,
9 |
10 | /* Bundler mode */
11 | "moduleResolution": "bundler",
12 | "allowImportingTsExtensions": true,
13 | "isolatedModules": true,
14 | "moduleDetection": "force",
15 | "noEmit": true,
16 | "jsx": "react-jsx",
17 |
18 | /* Linting */
19 | "strict": true,
20 | "noUnusedLocals": true,
21 | "noUnusedParameters": true,
22 | "noFallthroughCasesInSwitch": true,
23 | "noUncheckedSideEffectImports": true
24 | },
25 | "include": ["src"]
26 | }
27 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "typeRoots": ["./node_modules/@types", "./src/router/my-router.d.ts"]
4 | },
5 | "files": [],
6 | "references": [
7 | { "path": "./tsconfig.app.json" },
8 | { "path": "./tsconfig.node.json" }
9 | ]
10 | }
11 |
--------------------------------------------------------------------------------
/tsconfig.node.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
4 | "target": "ES2022",
5 | "lib": ["ES2023"],
6 | "module": "ESNext",
7 | "skipLibCheck": true,
8 |
9 | /* Bundler mode */
10 | "moduleResolution": "bundler",
11 | "allowImportingTsExtensions": true,
12 | "isolatedModules": true,
13 | "moduleDetection": "force",
14 | "noEmit": true,
15 |
16 | /* Linting */
17 | "strict": true,
18 | "noUnusedLocals": true,
19 | "noUnusedParameters": true,
20 | "noFallthroughCasesInSwitch": true,
21 | "noUncheckedSideEffectImports": true
22 | },
23 | "include": ["vite.config.ts"]
24 | }
25 |
--------------------------------------------------------------------------------
/vite.config.ts:
--------------------------------------------------------------------------------
1 | import { defineConfig } from 'vite'
2 | import react from '@vitejs/plugin-react-swc'
3 |
4 | // https://vite.dev/config/
5 | export default defineConfig({
6 | plugins: [react()],
7 | })
8 |
--------------------------------------------------------------------------------