jotai-iten 0.4.2 → 0.5.0

package/README.md

@@ -67,9 +67,7 @@ The current route stays mounted until the target route is ready. Loader failures
 // router.ts
 import {
   createRouter,
-  createRoute,
   defineRoutes,
-  type InferRoutes,
   route,
 } from 'jotai-iten'
 
@@ -79,12 +77,9 @@ const routes = defineRoutes({
   settings: route(),
 })
 
-type Routes = InferRoutes<typeof routes>
-
-export const toRoute = createRoute(routes)
-
-export const router = createRouter<Routes, unknown>({
-  initial: toRoute({ name: 'home' }),
+export const router = createRouter({
+  routes,
+  initial: { name: 'home' },
 })
 
 export const {
@@ -100,7 +95,7 @@ export const {
 
 ```tsx
 // App.tsx
-import { Navigate, Route, Switch, toRoute } from './router'
+import { Navigate, Route, Switch, router } from './router'
 
 export function App() {
   return (
@@ -108,7 +103,7 @@ export function App() {
       <Route name="home">{() => <HomeView />}</Route>
       <Route name="detail">{({ id }) => <DetailView id={id} />}</Route>
       <Route name="settings">{() => <SettingsView />}</Route>
-      <Navigate to={toRoute({ name: 'home' })} />
+      <Navigate to={router.to({ name: 'home' })} />
     </Switch>
   )
 }
@@ -125,9 +120,7 @@ Use `jotai-iten/headless` when you want atoms and hooks but do not need `Route`,
 ```ts
 import {
   createHeadlessRouter,
-  createRoute,
   defineRoutes,
-  type InferRoutes,
   route,
 } from 'jotai-iten/headless'
 
@@ -136,12 +129,9 @@ const routes = defineRoutes({
   detail: route<{ id: string }>(),
 })
 
-type Routes = InferRoutes<typeof routes>
-
-export const toRoute = createRoute(routes)
-
-export const router = createHeadlessRouter<Routes, unknown>({
-  initial: toRoute({ name: 'home' }),
+export const router = createHeadlessRouter({
+  routes,
+  initial: { name: 'home' },
 })
 
 export const { atoms, useNavigate, useRoute, useCurrentRoute } = router
@@ -153,11 +143,18 @@ export const { atoms, useNavigate, useRoute, useCurrentRoute } = router
 
 ## Creating Routes
 
-Use `defineRoutes` plus `createRoute` instead of hand-written object literals. The `routes` object is the runtime source of truth for names, and `InferRoutes` derives the router type.
+Use `defineRoutes` with `createRouter` or `createHeadlessRouter` for inferred route maps. The returned router exposes `router.to(...)` for typed route targets.
 
 ```ts
-const toRoute = createRoute(routes)
+router.to({ name: 'home' })
+router.to({ name: 'detail', params: { id: '42' } })
+```
+
+Use `InferRoutes` plus `createRoute` when route types or factories need to live independently from a router instance.
 
+```ts
+type Routes = InferRoutes<typeof routes>
+const toRoute = createRoute(routes)
 toRoute({ name: 'home' })
 toRoute({ name: 'detail', params: { id: '42' } })
 ```
@@ -171,8 +168,9 @@ For no-param routes, call `route()` without a type argument. Avoid `route<Record
 Loaders run before the target route commits.
 
 ```ts
-export const router = createRouter<Routes, unknown>({
-  initial: toRoute({ name: 'home' }),
+export const router = createRouter({
+  routes,
+  initial: { name: 'home' },
   queryClient,
   routeConfig: {
     detail: {
@@ -205,12 +203,13 @@ The `queryClient` only needs an `ensureQueryData` method. TanStack Query works,
 ```ts
 import { authAtom } from './atoms'
 
-const router = createRouter<Routes, unknown>({
-  initial: toRoute({ name: 'home' }),
+const router = createRouter({
+  routes,
+  initial: { name: 'home' },
   routeConfig: {
     detail: {
-      beforeLoad: ({ get }) => {
-        if (!get(authAtom).userId) return toRoute({ name: 'home' })
+      beforeLoad: ({ get, to }) => {
+        if (!get(authAtom).userId) return to({ name: 'home' })
       },
       loader: async ({ params, queryClient }) => {
         await queryClient.ensureQueryData(detailQuery(params.id))
@@ -229,8 +228,9 @@ Redirect loops are capped by `iten-core` and become retryable errors instead of
 Use `context` to compute shared values once per navigation. It can be a static object or a function that reads atoms.
 
 ```ts
-const router = createRouter<Routes, { userId: string | null }>({
-  initial: toRoute({ name: 'home' }),
+const router = createRouter({
+  routes,
+  initial: { name: 'home' },
   context: ({ get }) => ({ userId: get(authAtom).userId }),
   routeConfig: {
     detail: {
@@ -284,7 +284,7 @@ Renders the first matching child. Use `<Navigate>` as a fallback.
 <Switch>
   <Route name="home">{() => <HomeView />}</Route>
   <Route name="detail">{({ id }) => <DetailView id={id} />}</Route>
-  <Navigate to={toRoute({ name: 'home' })} />
+  <Navigate to={router.to({ name: 'home' })} />
 </Switch>
 ```
 
@@ -293,7 +293,7 @@ Renders the first matching child. Use `<Navigate>` as a fallback.
 Typed navigation with route-specific loading state.
 
 ```tsx
-<Link to={toRoute({ name: 'detail', params: { id: item.id } })}>
+<Link to={router.to({ name: 'detail', params: { id: item.id } })}>
   {({ isLoading }) => (isLoading ? 'Loading...' : 'Open')}
 </Link>
 ```
@@ -303,7 +303,7 @@ Typed navigation with route-specific loading state.
 Redirects on mount.
 
 ```tsx
-{!isAuthenticated && <Navigate to={toRoute({ name: 'home' })} />}
+{!isAuthenticated && <Navigate to={router.to({ name: 'home' })} />}
 ```
 
 ---
@@ -333,7 +333,7 @@ function Header() {
     <button
       type="button"
       aria-current={isActive ? 'page' : undefined}
-      onClick={() => void navigate({ target: toRoute({ name: 'settings' }) })}
+      onClick={() => void navigate({ target: router.to({ name: 'settings' }) })}
     >
       {isLoading ? 'Loading...' : 'Settings'}
     </button>
@@ -428,11 +428,8 @@ const modals = defineRoutes({
   imagePicker: route<{ onSelect: (uri: string) => void }>(),
 })
 
-type Modals = InferRoutes<typeof modals>
-
-export const modalRoute = createRoute(modals)
-
-export const modalRouter = createRouter<Modals, unknown>({
+export const modalRouter = createRouter({
+  routes: modals,
   initial: null,
 })
 ```
@@ -490,7 +487,7 @@ const urlSync = createUrlSync<Routes>({
   router,
   parse: ({ url }) => {
     const id = url.searchParams.get('id')
-    return id ? toRoute({ name: 'detail', params: { id } }) : toRoute({ name: 'home' })
+    return id ? router.to({ name: 'detail', params: { id } }) : router.to({ name: 'home' })
   },
   format: ({ route, url }) => {
     const next = new URL(url)

package/dist/create-router.d.cts

@@ -4,7 +4,7 @@ import { LinkComponent } from "./components/Link.cjs";
 import { NavigateComponent } from "./components/Navigate.cjs";
 import { RouteComponent } from "./components/Route.cjs";
 import { SwitchComponent } from "./components/Switch.cjs";
-import { RouteMapDef } from "iten-core";
+import { InferRoutes, RouteDefinitions, RouteMapDef } from "iten-core";
 
 //#region src/create-router.d.ts
 type JotaiRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessJotaiRouter<M> & {
@@ -13,6 +13,9 @@ type JotaiRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessJotaiRouter<M>
   Link: LinkComponent<M>;
   Navigate: NavigateComponent<M>;
 };
+declare function createRouter<const Defs extends RouteDefinitions, Ctx = unknown>(config: JotaiRouterConfig<InferRoutes<Defs>, Ctx> & {
+  routes: Defs;
+}): JotaiRouter<InferRoutes<Defs>, Ctx>;
 declare function createRouter<M extends RouteMapDef, Ctx = unknown>(config: JotaiRouterConfig<M, Ctx>): JotaiRouter<M, Ctx>;
 //#endregion
 export { JotaiRouter, createRouter };

package/dist/create-router.d.ts

@@ -4,7 +4,7 @@ import { LinkComponent } from "./components/Link.js";
 import { NavigateComponent } from "./components/Navigate.js";
 import { RouteComponent } from "./components/Route.js";
 import { SwitchComponent } from "./components/Switch.js";
-import { RouteMapDef } from "iten-core";
+import { InferRoutes, RouteDefinitions, RouteMapDef } from "iten-core";
 
 //#region src/create-router.d.ts
 type JotaiRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessJotaiRouter<M> & {
@@ -13,6 +13,9 @@ type JotaiRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessJotaiRouter<M>
   Link: LinkComponent<M>;
   Navigate: NavigateComponent<M>;
 };
+declare function createRouter<const Defs extends RouteDefinitions, Ctx = unknown>(config: JotaiRouterConfig<InferRoutes<Defs>, Ctx> & {
+  routes: Defs;
+}): JotaiRouter<InferRoutes<Defs>, Ctx>;
 declare function createRouter<M extends RouteMapDef, Ctx = unknown>(config: JotaiRouterConfig<M, Ctx>): JotaiRouter<M, Ctx>;
 //#endregion
 export { JotaiRouter, createRouter };

package/dist/headless-core.cjs

@@ -16,7 +16,8 @@ function createHeadlessRouter(config) {
 		const wrapped = beforeLoad ? (input) => beforeLoad({
 			params: input.params,
 			get: _currentGet,
-			context: input.context
+			context: input.context,
+			to: input.to
 		}) : void 0;
 		return [key, {
 			...rest,
@@ -25,6 +26,7 @@ function createHeadlessRouter(config) {
 	})) : void 0;
 	const core = (0, iten_core.createItenCore)({
 		initial: config.initial,
+		routes: config.routes,
 		routeConfig: coreRouteConfig,
 		maxHistoryLength: config.maxHistoryLength,
 		queryClient: config.queryClient,
@@ -47,6 +49,7 @@ function createHeadlessRouter(config) {
 	};
 	return {
 		atoms,
+		to: core.to,
 		...require_hooks.makeHooks(atoms)
 	};
 }

package/dist/headless-core.d.cts

@@ -1,6 +1,6 @@
 import { JotaiRouteConfig, JotaiRouterConfig, NoParams, QueryClientLike, RouteConfigMap, RouteMap as RouteMap$1, RouteMapDef as RouteMapDef$1, RouteMatcher, RouteName, RouteOf, RouteParams, RouteUnion as RouteUnion$1, RouterError as RouterError$1, RouterState as RouterState$1, UseRouteResult } from "./types.cjs";
 import { HookBundle } from "./hooks.cjs";
-import { NavigateInput, RouteMapDef, RouterState } from "iten-core";
+import { InferRoutes, NavigateInput, RouteDefinitions, RouteFactory, RouteMapDef, RouterState } from "iten-core";
 import { Atom, WritableAtom } from "jotai";
 
 //#region src/headless-core.d.ts
@@ -11,7 +11,11 @@ type RouterAtoms<M extends RouteMapDef> = {
 };
 type HeadlessJotaiRouter<M extends RouteMapDef> = HookBundle<M> & {
   atoms: RouterAtoms<M>;
+  to: RouteFactory<M>;
 };
+declare function createHeadlessRouter<const Defs extends RouteDefinitions, Ctx = unknown>(config: JotaiRouterConfig<InferRoutes<Defs>, Ctx> & {
+  routes: Defs;
+}): HeadlessJotaiRouter<InferRoutes<Defs>>;
 declare function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(config: JotaiRouterConfig<M, Ctx>): HeadlessJotaiRouter<M>;
 //#endregion
 export { HeadlessJotaiRouter, RouterAtoms, createHeadlessRouter };

package/dist/headless-core.d.ts

@@ -1,6 +1,6 @@
 import { JotaiRouteConfig, JotaiRouterConfig, NoParams, QueryClientLike, RouteConfigMap, RouteMap as RouteMap$1, RouteMapDef as RouteMapDef$1, RouteMatcher, RouteName, RouteOf, RouteParams, RouteUnion as RouteUnion$1, RouterError as RouterError$1, RouterState as RouterState$1, UseRouteResult } from "./types.js";
 import { HookBundle } from "./hooks.js";
-import { NavigateInput, RouteMapDef, RouterState } from "iten-core";
+import { InferRoutes, NavigateInput, RouteDefinitions, RouteFactory, RouteMapDef, RouterState } from "iten-core";
 import { Atom, WritableAtom } from "jotai";
 
 //#region src/headless-core.d.ts
@@ -11,7 +11,11 @@ type RouterAtoms<M extends RouteMapDef> = {
 };
 type HeadlessJotaiRouter<M extends RouteMapDef> = HookBundle<M> & {
   atoms: RouterAtoms<M>;
+  to: RouteFactory<M>;
 };
+declare function createHeadlessRouter<const Defs extends RouteDefinitions, Ctx = unknown>(config: JotaiRouterConfig<InferRoutes<Defs>, Ctx> & {
+  routes: Defs;
+}): HeadlessJotaiRouter<InferRoutes<Defs>>;
 declare function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(config: JotaiRouterConfig<M, Ctx>): HeadlessJotaiRouter<M>;
 //#endregion
 export { HeadlessJotaiRouter, RouterAtoms, createHeadlessRouter };

package/dist/headless-core.mjs

@@ -16,7 +16,8 @@ function createHeadlessRouter(config) {
 		const wrapped = beforeLoad ? (input) => beforeLoad({
 			params: input.params,
 			get: _currentGet,
-			context: input.context
+			context: input.context,
+			to: input.to
 		}) : void 0;
 		return [key, {
 			...rest,
@@ -25,6 +26,7 @@ function createHeadlessRouter(config) {
 	})) : void 0;
 	const core = createItenCore({
 		initial: config.initial,
+		routes: config.routes,
 		routeConfig: coreRouteConfig,
 		maxHistoryLength: config.maxHistoryLength,
 		queryClient: config.queryClient,
@@ -47,6 +49,7 @@ function createHeadlessRouter(config) {
 	};
 	return {
 		atoms,
+		to: core.to,
 		...makeHooks(atoms)
 	};
 }

package/dist/types.d.cts

@@ -1,4 +1,4 @@
-import { InferRoutes, NoParams, QueryClientLike, RouteConfig, RouteConfigMap, RouteDefinition, RouteDefinitions, RouteMap as RouteMap$1, RouteMapDef as RouteMapDef$1, RouteMatcher, RouteName, RouteOf, RouteParams, RouteUnion as RouteUnion$1, RouterError as RouterError$1, RouterState as RouterState$1 } from "iten-core";
+import { InferRoutes as InferRoutes$1, NoParams, QueryClientLike, RouteConfig, RouteConfigMap, RouteDefinition, RouteDefinitions as RouteDefinitions$1, RouteFactory as RouteFactory$1, RouteMap as RouteMap$1, RouteMapDef as RouteMapDef$1, RouteMatcher, RouteName, RouteOf, RouteParams, RouteUnion as RouteUnion$1, RouterError as RouterError$1, RouterState as RouterState$1 } from "iten-core";
 import { Getter } from "jotai";
 
 //#region src/types.d.ts
@@ -8,10 +8,12 @@ type JotaiRouteConfig<M extends RouteMapDef$1, K extends keyof M, Ctx = unknown>
     params: M[K];
     get: Getter;
     context: Ctx;
+    to: RouteFactory$1<M>;
   }) => RouteUnion$1<M> | undefined | Promise<RouteUnion$1<M> | undefined>;
 }>;
 type JotaiRouterConfig<M extends RouteMapDef$1, Ctx = unknown> = {
   initial: RouteUnion$1<M> | null;
+  routes?: RouteDefinitions$1 | undefined;
   routeConfig?: { [K in keyof M]?: JotaiRouteConfig<M, K, Ctx> };
   maxHistoryLength?: number | undefined;
   context?: Ctx | ((input: {
@@ -27,4 +29,4 @@ type UseRouteResult<M extends RouteMapDef$1, K extends keyof M> = {
   params: null;
 };
 //#endregion
-export { type InferRoutes, JotaiRouteConfig, JotaiRouterConfig, type NoParams, type QueryClientLike, type RouteConfigMap, type RouteDefinition, type RouteDefinitions, type RouteMap$1 as RouteMap, type RouteMapDef$1 as RouteMapDef, type RouteMatcher, type RouteName, type RouteOf, type RouteParams, type RouteUnion$1 as RouteUnion, type RouterError$1 as RouterError, type RouterState$1 as RouterState, UseRouteResult };
+export { type InferRoutes$1 as InferRoutes, JotaiRouteConfig, JotaiRouterConfig, type NoParams, type QueryClientLike, type RouteConfigMap, type RouteDefinition, type RouteDefinitions$1 as RouteDefinitions, type RouteMap$1 as RouteMap, type RouteMapDef$1 as RouteMapDef, type RouteMatcher, type RouteName, type RouteOf, type RouteParams, type RouteUnion$1 as RouteUnion, type RouterError$1 as RouterError, type RouterState$1 as RouterState, UseRouteResult };

package/dist/types.d.ts

@@ -1,4 +1,4 @@
-import { InferRoutes, NoParams, QueryClientLike, RouteConfig, RouteConfigMap, RouteDefinition, RouteDefinitions, RouteMap as RouteMap$1, RouteMapDef as RouteMapDef$1, RouteMatcher, RouteName, RouteOf, RouteParams, RouteUnion as RouteUnion$1, RouterError as RouterError$1, RouterState as RouterState$1 } from "iten-core";
+import { InferRoutes as InferRoutes$1, NoParams, QueryClientLike, RouteConfig, RouteConfigMap, RouteDefinition, RouteDefinitions as RouteDefinitions$1, RouteFactory as RouteFactory$1, RouteMap as RouteMap$1, RouteMapDef as RouteMapDef$1, RouteMatcher, RouteName, RouteOf, RouteParams, RouteUnion as RouteUnion$1, RouterError as RouterError$1, RouterState as RouterState$1 } from "iten-core";
 import { Getter } from "jotai";
 
 //#region src/types.d.ts
@@ -8,10 +8,12 @@ type JotaiRouteConfig<M extends RouteMapDef$1, K extends keyof M, Ctx = unknown>
     params: M[K];
     get: Getter;
     context: Ctx;
+    to: RouteFactory$1<M>;
   }) => RouteUnion$1<M> | undefined | Promise<RouteUnion$1<M> | undefined>;
 }>;
 type JotaiRouterConfig<M extends RouteMapDef$1, Ctx = unknown> = {
   initial: RouteUnion$1<M> | null;
+  routes?: RouteDefinitions$1 | undefined;
   routeConfig?: { [K in keyof M]?: JotaiRouteConfig<M, K, Ctx> };
   maxHistoryLength?: number | undefined;
   context?: Ctx | ((input: {
@@ -27,4 +29,4 @@ type UseRouteResult<M extends RouteMapDef$1, K extends keyof M> = {
   params: null;
 };
 //#endregion
-export { type InferRoutes, JotaiRouteConfig, JotaiRouterConfig, type NoParams, type QueryClientLike, type RouteConfigMap, type RouteDefinition, type RouteDefinitions, type RouteMap$1 as RouteMap, type RouteMapDef$1 as RouteMapDef, type RouteMatcher, type RouteName, type RouteOf, type RouteParams, type RouteUnion$1 as RouteUnion, type RouterError$1 as RouterError, type RouterState$1 as RouterState, UseRouteResult };
+export { type InferRoutes$1 as InferRoutes, JotaiRouteConfig, JotaiRouterConfig, type NoParams, type QueryClientLike, type RouteConfigMap, type RouteDefinition, type RouteDefinitions$1 as RouteDefinitions, type RouteMap$1 as RouteMap, type RouteMapDef$1 as RouteMapDef, type RouteMatcher, type RouteName, type RouteOf, type RouteParams, type RouteUnion$1 as RouteUnion, type RouterError$1 as RouterError, type RouterState$1 as RouterState, UseRouteResult };

package/dist/url.cjs

@@ -5,6 +5,7 @@ let iten_core_url = require("iten-core/url");
 function createUrlSync({ router, store = (0, jotai.getDefaultStore)(), ...input }) {
 	const coreLike = {
 		getState: () => store.get(router.atoms.state),
+		to: router.to,
 		navigate: (navigateInput) => store.set(router.atoms.navigate, navigateInput),
 		goBack: () => {
 			store.set(router.atoms.goBack);

package/dist/url.mjs

@@ -4,6 +4,7 @@ import { createUrlSync as createUrlSync$1 } from "iten-core/url";
 function createUrlSync({ router, store = getDefaultStore(), ...input }) {
 	const coreLike = {
 		getState: () => store.get(router.atoms.state),
+		to: router.to,
 		navigate: (navigateInput) => store.set(router.atoms.navigate, navigateInput),
 		goBack: () => {
 			store.set(router.atoms.goBack);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jotai-iten",
-  "version": "0.4.2",
+  "version": "0.5.0",
   "description": "Jotai adapter for iten — ultralight in-memory router for embedded JS apps",
   "keywords": [
     "jotai",
@@ -108,7 +108,7 @@
     }
   },
   "dependencies": {
-    "iten-core": "^0.4.2"
+    "iten-core": "^0.5.0"
   },
   "publishConfig": {
     "access": "public",

package/src/create-router.ts

@@ -1,4 +1,4 @@
-import type { RouteMapDef } from 'iten-core'
+import type { InferRoutes, RouteDefinitions, RouteMapDef } from 'iten-core'
 import type { LinkComponent } from './components/Link.tsx'
 import { makeLink } from './components/Link.tsx'
 import type { NavigateComponent } from './components/Navigate.tsx'
@@ -18,6 +18,12 @@ export type JotaiRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessJotaiRo
   Navigate: NavigateComponent<M>
 }
 
+export function createRouter<const Defs extends RouteDefinitions, Ctx = unknown>(
+  config: JotaiRouterConfig<InferRoutes<Defs>, Ctx> & { routes: Defs },
+): JotaiRouter<InferRoutes<Defs>, Ctx>
+export function createRouter<M extends RouteMapDef, Ctx = unknown>(
+  config: JotaiRouterConfig<M, Ctx>,
+): JotaiRouter<M, Ctx>
 export function createRouter<M extends RouteMapDef, Ctx = unknown>(
   config: JotaiRouterConfig<M, Ctx>,
 ): JotaiRouter<M, Ctx> {

package/src/headless-core.ts

@@ -1,4 +1,13 @@
-import type { NavigateInput, RouteConfigMap, RouteMapDef, RouterState, RouteUnion } from 'iten-core'
+import type {
+  InferRoutes,
+  NavigateInput,
+  RouteConfigMap,
+  RouteDefinitions,
+  RouteFactory,
+  RouteMapDef,
+  RouterState,
+  RouteUnion,
+} from 'iten-core'
 import { createItenCore } from 'iten-core'
 import type { Atom, Getter, WritableAtom } from 'jotai'
 import { atom } from 'jotai'
@@ -40,8 +49,15 @@ export type RouterAtoms<M extends RouteMapDef> = {
 
 export type HeadlessJotaiRouter<M extends RouteMapDef> = HookBundle<M> & {
   atoms: RouterAtoms<M>
+  to: RouteFactory<M>
 }
 
+export function createHeadlessRouter<const Defs extends RouteDefinitions, Ctx = unknown>(
+  config: JotaiRouterConfig<InferRoutes<Defs>, Ctx> & { routes: Defs },
+): HeadlessJotaiRouter<InferRoutes<Defs>>
+export function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(
+  config: JotaiRouterConfig<M, Ctx>,
+): HeadlessJotaiRouter<M>
 export function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(
   config: JotaiRouterConfig<M, Ctx>,
 ): HeadlessJotaiRouter<M> {
@@ -64,17 +80,19 @@ export function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(
           if (!route) return [key, route]
           const { beforeLoad, ...rest } = route as JotaiRouteConfig<M, keyof M, Ctx>
           const wrapped = beforeLoad
-            ? (input: { params: M[keyof M]; context: Ctx }) =>
+            ? (input: { params: M[keyof M]; context: Ctx; to: RouteFactory<M> }) =>
                 (
                   beforeLoad as (input: {
                     params: M[keyof M]
                     get: Getter
                     context: Ctx
+                    to: RouteFactory<M>
                   }) => RouteUnion<M> | undefined | Promise<RouteUnion<M> | undefined>
                 )({
                   params: input.params,
                   get: _currentGet,
                   context: input.context,
+                  to: input.to,
                 })
             : undefined
           return [key, { ...rest, beforeLoad: wrapped }]
@@ -84,6 +102,7 @@ export function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(
 
   const core = createItenCore<M, Ctx>({
     initial: config.initial,
+    routes: config.routes,
     routeConfig: coreRouteConfig,
     maxHistoryLength: config.maxHistoryLength,
     queryClient: config.queryClient,
@@ -121,6 +140,7 @@ export function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(
 
   return {
     atoms,
+    to: core.to,
     ...makeHooks<M>(atoms),
   }
 }

package/src/types.ts

@@ -6,6 +6,7 @@ import type {
   RouteConfigMap,
   RouteDefinition,
   RouteDefinitions,
+  RouteFactory,
   RouteMap,
   RouteMapDef,
   RouteMatcher,
@@ -25,6 +26,7 @@ export type {
   RouteConfigMap,
   RouteDefinition,
   RouteDefinitions,
+  RouteFactory,
   RouteMap,
   RouteMapDef,
   RouteMatcher,
@@ -44,12 +46,14 @@ export type JotaiRouteConfig<M extends RouteMapDef, K extends keyof M, Ctx = unk
       params: M[K]
       get: Getter
       context: Ctx
+      to: RouteFactory<M>
     }) => RouteUnion<M> | undefined | Promise<RouteUnion<M> | undefined>
   }
 >
 
 export type JotaiRouterConfig<M extends RouteMapDef, Ctx = unknown> = {
   initial: RouteUnion<M> | null
+  routes?: RouteDefinitions | undefined
   routeConfig?: { [K in keyof M]?: JotaiRouteConfig<M, K, Ctx> }
   maxHistoryLength?: number | undefined
   context?: Ctx | ((input: { get: Getter }) => Ctx)

package/src/url.ts

@@ -36,6 +36,7 @@ export function createUrlSync<M extends RouteMapDef>({
 }: CreateUrlSyncInput<M>): UrlSync<M> {
   const coreLike: ItenCore<M> = {
     getState: () => store.get(router.atoms.state) as RouterState<M>,
+    to: router.to,
     navigate: (navigateInput: NavigateInput<M>) => store.set(router.atoms.navigate, navigateInput),
     goBack: () => {
       void store.set(router.atoms.goBack)