fix: type checking on tuono package

packages/tuono/package.json

@@ -95,6 +95,9 @@
     "@testing-library/jest-dom": "^6.4.5",
     "@testing-library/react": "^15.0.7",
     "@types/babel-traverse": "^6.25.10",
+    "@types/babel__traverse": "^7.20.6",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
     "jsdom": "^24.0.0",
     "vitest": "^1.5.2"
   },

packages/tuono/src/build/index.ts

@@ -62,13 +62,13 @@ export function buildProd() {
   ;(async () => {
     await build({
       ...BASE_CONFIG,
-      manifest: true,
       build: {
+        manifest: true,
+        emptyOutDir: true,
         outDir: '../out/client',
-      },
-      emptyOutDir: true,
-      rollupOptions: {
-        input: './.tuono/client-main.tsx',
+        rollupOptions: {
+          input: './.tuono/client-main.tsx',
+        },
       },
     })
 

packages/tuono/src/build/tuono-vite-plugin/eliminateUnreferencedIdentifiers.ts

@@ -158,7 +158,7 @@ export const eliminateUnreferencedIdentifiers = (
     programPath.scope.crawl()
 
     programPath.traverse({
-      VariableDeclarator(path) {
+      VariableDeclarator(path: any) {
         if (path.node.id.type === 'Identifier') {
           const local = path.get('id') as NodePath<BabelTypes.Identifier>
           if (shouldBeRemoved(local)) {

packages/tuono/src/hydration/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import ReactDOM from 'react-dom/client'
+import { hydrateRoot } from 'react-dom/client'
 import { RouterProvider, createRouter } from '../router'
 
 type RouteTree = any
@@ -8,10 +8,10 @@ export function hydrate(routeTree: RouteTree): void {
   // Create a new router instance
   const router = createRouter({ routeTree })
 
-  // Render the app
-  const rootElement = document.getElementById('__tuono')
+  // eslint-disable-next-line
+  const rootElement = document.getElementById('__tuono')!
 
-  ReactDOM.hydrateRoot(
+  hydrateRoot(
     rootElement,
     <React.StrictMode>
       <RouterProvider router={router} />

packages/tuono/src/router/components/Link.tsx

@@ -1,3 +1,4 @@
+import * as React from 'react'
 import { useRouterStore } from '../hooks/useRouterStore'
 import type { AnchorHTMLAttributes, MouseEvent } from 'react'
 
@@ -7,7 +8,16 @@ export default function Link(
   const handleTransition = (e: MouseEvent<HTMLAnchorElement>): void => {
     e.preventDefault()
     props.onClick?.(e)
-    useRouterStore.setState({ location: { pathname: props.href || '' } })
+    useRouterStore.setState({
+      // TODO: Refine store update
+      location: {
+        href: props.href || '',
+        pathname: props.href || '',
+        search: undefined,
+        searchStr: '',
+        hash: '',
+      },
+    })
     history.pushState(props.href, '', props.href)
   }
   return (

packages/tuono/src/router/components/Matches.tsx

@@ -1,3 +1,4 @@
+import * as React from 'react'
 import { useRouter } from '../hooks/useRouter'
 import { useRouterStore } from '../hooks/useRouterStore'
 import type { Route } from '../route'

packages/tuono/src/router/components/NotFound.tsx

@@ -1,3 +1,4 @@
+import * as React from 'react'
 import { useRouter } from '../hooks/useRouter'
 import { RouteMatch } from './RouteMatch'
 import Link from './Link'
@@ -9,7 +10,7 @@ export default function NotFound(): JSX.Element {
 
   // Check if exists a custom 404 error page
   if (custom404Route) {
-    return <RouteMatch route={custom404Route} />
+    return <RouteMatch route={custom404Route} serverSideProps={{}} />
   }
 
   return (

packages/tuono/src/router/components/RouterProvider.tsx

@@ -10,6 +10,16 @@ interface RouterContextProviderProps {
   children: ReactNode
 }
 
+interface RouterProviderProps {
+  router: Router
+  serverProps?: ServerProps
+}
+
+interface ServerProps {
+  router: Location
+  props: any
+}
+
 function RouterContextProvider({
   router,
   children,
@@ -21,7 +31,6 @@ function RouterContextProvider({
     ...rest,
     context: {
       ...router.options.context,
-      ...rest.context,
     },
   })
 
@@ -38,16 +47,6 @@ function RouterContextProvider({
   )
 }
 
-interface RouterProviderProps {
-  router: Router
-  serverProps?: ServerProps
-}
-
-interface ServerProps {
-  router: Location
-  props: any
-}
-
 const initRouterStore = (props?: ServerProps): void => {
   const updateLocation = useRouterStore((st) => st.updateLocation)
 

packages/tuono/src/router/index.tsx

@@ -1,4 +1,4 @@
 export { RouterProvider } from './components/RouterProvider'
 export { default as Link } from './components/Link'
 export { createRouter } from './router'
-export { createRoute, createRootRoute, getRouteApi } from './route'
+export { createRoute, createRootRoute } from './route'

packages/tuono/src/router/route.ts

@@ -16,15 +16,15 @@ export const rootRouteId = '__root__'
 
 export class Route {
   parentRoute!: any
-  id: number
+  id?: string
   fullPath!: string
-  path: string
+  path?: string
   options: any
 
   children?: Route[]
   router: RouterType
   isRoot: boolean
-  originalIndex: number
+  originalIndex?: number
   component: () => JSX.Element
 
   constructor(options: RouteOptions) {
@@ -77,7 +77,6 @@ export class Route {
     this.path = path
     this.id = id
     this.fullPath = fullPath
-    this.to = fullPath
   }
 
   addChildren(routes: Route[]): Route {
@@ -92,6 +91,6 @@ export class Route {
   }
 }
 
-export function createRootRoute(options?: RouteOptions): Route {
+export function createRootRoute(options: RouteOptions): Route {
   return new Route({ ...options, isRoot: true })
 }

packages/tuono/src/router/router.ts

@@ -6,7 +6,7 @@ type RouteTree = any
 interface CreateRouter {
   routeTree: RouteTree
   basePath?: string
-  options: RouteOptions
+  options?: RouteOptions
 }
 
 interface RouteOptions {
@@ -14,9 +14,10 @@ interface RouteOptions {
   hasHandler?: boolean
   routeTree?: RouteTree
 }
+
 export type RouterType = any
 
-export function createRouter(options: CreateRouterArgs): Router {
+export function createRouter(options: CreateRouter): Router {
   return new Router(options)
 }
 
@@ -49,32 +50,18 @@ export class Router {
 
     this.#updateBasePath(newOptions.basePath)
 
-    // NOTE: next iteration
-    this.#historyUpdate()
-
-    // NOTE: next iteration
-    this.#storeUpdate()
-
     if (this.options.routeTree !== this.routeTree) {
       this.routeTree = this.options.routeTree
       this.#buildRouteTree()
     }
   }
 
-  #historyUpdate = (): void => {
-    // TODO: update history
-  }
-
-  #storeUpdate = (): void => {
-    // TODO: update store
-  }
-
   #buildRouteTree = (): void => {
     const recurseRoutes = (childRoutes: Route[]): void => {
       childRoutes.forEach((route: Route, i: number) => {
         route.init(i)
 
-        this.routesById[route.id] = route
+        this.routesById[route.id || ''] = route
 
         if (!route.isRoot && route.options.path) {
           const trimmedFullPath = trimPathRight(route.fullPath)

packages/tuono/tsconfig.json

@@ -3,5 +3,6 @@
   "compilerOptions": {
     "jsx": "react"
   },
-  "include": ["src", "tests", "vite.config.ts"]
+  "include": ["src", "tests", "vite.config.ts"],
+  "exclude": ["vite.config.ts"],
 }