Type safe routing/params/query in the library/client side of react-router

[dy0gu]

I'm not very familiar with the codebase for the client side of react-router so forgive me if I'm overstepping, but would it not be possible to have type safety on URL parameters and queries using TypeScript manipulation, something close to what Elysia or TSR do WITHOUT code gen?

Maybe declaring the respective information for each route along with the path and element in the createBrowserRouter() API, like so:

const router = createBrowserRouter([
    {
        path: '/',
        element: Landing(),
        params: ...,
        query: ...,
    },
]);

Since the <RouterProvider router={router} /> is the highest in the render tree I'm assuming it would be possible for the <Link/> and <NavLink/> components to be aware of it's context/options and throw a TypeScript error when <Link to="path"/> points to a "path" that does not exist in the router passed to the provider. Similar logic would follow for params and query, although in the case of query I could see the syntax becoming a bit verbose depending on how it's done.