react-iten 0.4.2 → 0.5.0

package/README.md

@@ -16,10 +16,8 @@ npm install react-iten react
 
 ```tsx
 import {
-  createRoute,
   createRouter,
   defineRoutes,
-  type InferRoutes,
   route,
 } from 'react-iten'
 
@@ -29,12 +27,9 @@ const routes = defineRoutes({
   settings: route(),
 })
 
-type Routes = InferRoutes<typeof routes>
-
-const toRoute = createRoute(routes)
-
-const router = createRouter<Routes>({
-  initial: toRoute({ name: 'home' }),
+const router = createRouter({
+  routes,
+  initial: { name: 'home' },
 })
 
 export const { Link, Navigate, Route, Switch, useNavigate, useRoute } = router
@@ -45,7 +40,7 @@ export const { Link, Navigate, Route, Switch, useNavigate, useRoute } = router
   <Route name="home">{() => <Home />}</Route>
   <Route name="project">{({ id }) => <Project id={id} />}</Route>
   <Route name="settings">{() => <Settings />}</Route>
-  <Navigate to={toRoute({ name: 'home' })} />
+  <Navigate to={router.to({ name: 'home' })} />
 </Switch>
 ```
 
@@ -54,12 +49,13 @@ export const { Link, Navigate, Route, Switch, useNavigate, useRoute } = router
 ```ts
 import { createHeadlessRouter } from 'react-iten/headless'
 
-const router = createHeadlessRouter<Routes>({
-  initial: toRoute({ name: 'home' }),
+const router = createHeadlessRouter({
+  routes,
+  initial: { name: 'home' },
 })
 
 router.store.getState()
-await router.store.navigate({ target: toRoute({ name: 'settings' }) })
+await router.store.navigate({ target: router.to({ name: 'settings' }) })
 ```
 
 The store is scoped to the router instance and uses `useSyncExternalStore` for React subscriptions.

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 ReactRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessReactRouter<M> & {
@@ -13,6 +13,9 @@ type ReactRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessReactRouter<M>
   Link: LinkComponent<M>;
   Navigate: NavigateComponent<M>;
 };
+declare function createRouter<const Defs extends RouteDefinitions, Ctx = unknown>(config: ReactRouterConfig<InferRoutes<Defs>, Ctx> & {
+  routes: Defs;
+}): ReactRouter<InferRoutes<Defs>, Ctx>;
 declare function createRouter<M extends RouteMapDef, Ctx = unknown>(config: ReactRouterConfig<M, Ctx>): ReactRouter<M, Ctx>;
 //#endregion
 export { ReactRouter, 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 ReactRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessReactRouter<M> & {
@@ -13,6 +13,9 @@ type ReactRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessReactRouter<M>
   Link: LinkComponent<M>;
   Navigate: NavigateComponent<M>;
 };
+declare function createRouter<const Defs extends RouteDefinitions, Ctx = unknown>(config: ReactRouterConfig<InferRoutes<Defs>, Ctx> & {
+  routes: Defs;
+}): ReactRouter<InferRoutes<Defs>, Ctx>;
 declare function createRouter<M extends RouteMapDef, Ctx = unknown>(config: ReactRouterConfig<M, Ctx>): ReactRouter<M, Ctx>;
 //#endregion
 export { ReactRouter, createRouter };

package/dist/headless.cjs

@@ -9,6 +9,7 @@ function createHeadlessRouter(config) {
 	};
 	const core = (0, iten_core.createItenCore)({
 		initial: config.initial,
+		routes: config.routes,
 		routeConfig: config.routeConfig,
 		maxHistoryLength: config.maxHistoryLength,
 		queryClient: config.queryClient,
@@ -34,6 +35,7 @@ function createHeadlessRouter(config) {
 	return {
 		store,
 		core,
+		to: core.to,
 		...require_hooks.makeHooks(store)
 	};
 }

package/dist/headless.d.cts

@@ -1,6 +1,6 @@
 import { InferRoutes, NoParams, QueryClientLike, ReactRouterConfig, RouteConfigMap, RouteMap, RouteMapDef, RouteMatcher, RouteName, RouteOf, RouteParams, RouteUnion, RouterError, RouterState, UseRouteResult } from "./types.cjs";
 import { HookBundle } from "./hooks.cjs";
-import { ItenCore, NavigateInput, RouteMapDef as RouteMapDef$1, RouterState as RouterState$1, createRoute, defineRouteConfig, defineRoutes, isRoute, isRouteName, matchRoute, route } from "iten-core";
+import { InferRoutes as InferRoutes$1, ItenCore, NavigateInput, RouteDefinitions, RouteFactory, RouteMapDef as RouteMapDef$1, RouterState as RouterState$1, createRoute, defineRouteConfig, defineRoutes, isRoute, isRouteName, matchRoute, route } from "iten-core";
 
 //#region src/headless.d.ts
 type ReactRouterStore<M extends RouteMapDef$1> = {
@@ -15,7 +15,11 @@ type ReactRouterStore<M extends RouteMapDef$1> = {
 type HeadlessReactRouter<M extends RouteMapDef$1> = HookBundle<M> & {
   store: ReactRouterStore<M>;
   core: ItenCore<M>;
+  to: RouteFactory<M>;
 };
+declare function createHeadlessRouter<const Defs extends RouteDefinitions, Ctx = unknown>(config: ReactRouterConfig<InferRoutes$1<Defs>, Ctx> & {
+  routes: Defs;
+}): HeadlessReactRouter<InferRoutes$1<Defs>>;
 declare function createHeadlessRouter<M extends RouteMapDef$1, Ctx = unknown>(config: ReactRouterConfig<M, Ctx>): HeadlessReactRouter<M>;
 //#endregion
 export { HeadlessReactRouter, type InferRoutes, type NoParams, type QueryClientLike, ReactRouterStore, type RouteConfigMap, type RouteMap, type RouteMapDef, type RouteMatcher, type RouteName, type RouteOf, type RouteParams, type RouteUnion, type RouterError, type RouterState, type UseRouteResult, createHeadlessRouter, createRoute, defineRouteConfig, defineRoutes, isRoute, isRouteName, matchRoute, route };

package/dist/headless.d.ts

@@ -1,6 +1,6 @@
 import { InferRoutes, NoParams, QueryClientLike, ReactRouterConfig, RouteConfigMap, RouteMap, RouteMapDef, RouteMatcher, RouteName, RouteOf, RouteParams, RouteUnion, RouterError, RouterState, UseRouteResult } from "./types.js";
 import { HookBundle } from "./hooks.js";
-import { ItenCore, NavigateInput, RouteMapDef as RouteMapDef$1, RouterState as RouterState$1, createRoute, defineRouteConfig, defineRoutes, isRoute, isRouteName, matchRoute, route } from "iten-core";
+import { InferRoutes as InferRoutes$1, ItenCore, NavigateInput, RouteDefinitions, RouteFactory, RouteMapDef as RouteMapDef$1, RouterState as RouterState$1, createRoute, defineRouteConfig, defineRoutes, isRoute, isRouteName, matchRoute, route } from "iten-core";
 
 //#region src/headless.d.ts
 type ReactRouterStore<M extends RouteMapDef$1> = {
@@ -15,7 +15,11 @@ type ReactRouterStore<M extends RouteMapDef$1> = {
 type HeadlessReactRouter<M extends RouteMapDef$1> = HookBundle<M> & {
   store: ReactRouterStore<M>;
   core: ItenCore<M>;
+  to: RouteFactory<M>;
 };
+declare function createHeadlessRouter<const Defs extends RouteDefinitions, Ctx = unknown>(config: ReactRouterConfig<InferRoutes$1<Defs>, Ctx> & {
+  routes: Defs;
+}): HeadlessReactRouter<InferRoutes$1<Defs>>;
 declare function createHeadlessRouter<M extends RouteMapDef$1, Ctx = unknown>(config: ReactRouterConfig<M, Ctx>): HeadlessReactRouter<M>;
 //#endregion
 export { HeadlessReactRouter, type InferRoutes, type NoParams, type QueryClientLike, ReactRouterStore, type RouteConfigMap, type RouteMap, type RouteMapDef, type RouteMatcher, type RouteName, type RouteOf, type RouteParams, type RouteUnion, type RouterError, type RouterState, type UseRouteResult, createHeadlessRouter, createRoute, defineRouteConfig, defineRoutes, isRoute, isRouteName, matchRoute, route };

package/dist/headless.mjs

@@ -8,6 +8,7 @@ function createHeadlessRouter(config) {
 	};
 	const core = createItenCore({
 		initial: config.initial,
+		routes: config.routes,
 		routeConfig: config.routeConfig,
 		maxHistoryLength: config.maxHistoryLength,
 		queryClient: config.queryClient,
@@ -33,6 +34,7 @@ function createHeadlessRouter(config) {
 	return {
 		store,
 		core,
+		to: core.to,
 		...makeHooks(store)
 	};
 }

package/dist/types.d.cts

@@ -1,8 +1,9 @@
-import { InferRoutes, NoParams, QueryClientLike, 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, RouteConfigMap, RouteDefinition, RouteDefinitions as RouteDefinitions$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";
 
 //#region src/types.d.ts
 type ReactRouterConfig<M extends RouteMapDef$1, Ctx = unknown> = {
   initial: RouteUnion$1<M> | null;
+  routes?: RouteDefinitions$1 | undefined;
   routeConfig?: RouteConfigMap<M, Ctx> | undefined;
   maxHistoryLength?: number | undefined;
   context?: Ctx | (() => Ctx) | undefined;
@@ -16,4 +17,4 @@ type UseRouteResult<M extends RouteMapDef$1, K extends keyof M> = {
   params: null;
 };
 //#endregion
-export { type InferRoutes, type NoParams, type QueryClientLike, ReactRouterConfig, 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, type NoParams, type QueryClientLike, ReactRouterConfig, 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,8 +1,9 @@
-import { InferRoutes, NoParams, QueryClientLike, 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, RouteConfigMap, RouteDefinition, RouteDefinitions as RouteDefinitions$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";
 
 //#region src/types.d.ts
 type ReactRouterConfig<M extends RouteMapDef$1, Ctx = unknown> = {
   initial: RouteUnion$1<M> | null;
+  routes?: RouteDefinitions$1 | undefined;
   routeConfig?: RouteConfigMap<M, Ctx> | undefined;
   maxHistoryLength?: number | undefined;
   context?: Ctx | (() => Ctx) | undefined;
@@ -16,4 +17,4 @@ type UseRouteResult<M extends RouteMapDef$1, K extends keyof M> = {
   params: null;
 };
 //#endregion
-export { type InferRoutes, type NoParams, type QueryClientLike, ReactRouterConfig, 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, type NoParams, type QueryClientLike, ReactRouterConfig, 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

@@ -4,6 +4,7 @@ let iten_core_url = require("iten-core/url");
 function createUrlSync({ router, ...input }) {
 	const coreLike = {
 		getState: () => router.store.getState(),
+		to: router.to,
 		navigate: (navigateInput) => router.store.navigate(navigateInput),
 		goBack: () => router.store.goBack(),
 		subscribe: ({ listener }) => router.store.subscribe({ listener: () => {

package/dist/url.mjs

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-iten",
-  "version": "0.4.2",
+  "version": "0.5.0",
   "description": "React adapter for iten — ultralight in-memory router for embedded JS apps",
   "keywords": [
     "react",
@@ -104,7 +104,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 ReactRouter<M extends RouteMapDef, _Ctx = unknown> = HeadlessReactRo
   Navigate: NavigateComponent<M>
 }
 
+export function createRouter<const Defs extends RouteDefinitions, Ctx = unknown>(
+  config: ReactRouterConfig<InferRoutes<Defs>, Ctx> & { routes: Defs },
+): ReactRouter<InferRoutes<Defs>, Ctx>
+export function createRouter<M extends RouteMapDef, Ctx = unknown>(
+  config: ReactRouterConfig<M, Ctx>,
+): ReactRouter<M, Ctx>
 export function createRouter<M extends RouteMapDef, Ctx = unknown>(
   config: ReactRouterConfig<M, Ctx>,
 ): ReactRouter<M, Ctx> {

package/src/headless.ts

@@ -1,4 +1,12 @@
-import type { ItenCore, NavigateInput, RouteMapDef, RouterState } from 'iten-core'
+import type {
+  InferRoutes,
+  ItenCore,
+  NavigateInput,
+  RouteDefinitions,
+  RouteFactory,
+  RouteMapDef,
+  RouterState,
+} from 'iten-core'
 import { createItenCore } from 'iten-core'
 import type { HookBundle } from './hooks.ts'
 import { makeHooks } from './hooks.ts'
@@ -41,8 +49,15 @@ export type ReactRouterStore<M extends RouteMapDef> = {
 export type HeadlessReactRouter<M extends RouteMapDef> = HookBundle<M> & {
   store: ReactRouterStore<M>
   core: ItenCore<M>
+  to: RouteFactory<M>
 }
 
+export function createHeadlessRouter<const Defs extends RouteDefinitions, Ctx = unknown>(
+  config: ReactRouterConfig<InferRoutes<Defs>, Ctx> & { routes: Defs },
+): HeadlessReactRouter<InferRoutes<Defs>>
+export function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(
+  config: ReactRouterConfig<M, Ctx>,
+): HeadlessReactRouter<M>
 export function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(
   config: ReactRouterConfig<M, Ctx>,
 ): HeadlessReactRouter<M> {
@@ -55,6 +70,7 @@ export function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(
 
   const core = createItenCore<M, Ctx>({
     initial: config.initial,
+    routes: config.routes,
     routeConfig: config.routeConfig,
     maxHistoryLength: config.maxHistoryLength,
     queryClient: config.queryClient,
@@ -86,6 +102,7 @@ export function createHeadlessRouter<M extends RouteMapDef, Ctx = unknown>(
   return {
     store,
     core,
+    to: core.to,
     ...makeHooks<M>(store),
   }
 }

package/src/types.ts

@@ -5,6 +5,7 @@ import type {
   RouteConfigMap,
   RouteDefinition,
   RouteDefinitions,
+  RouteFactory,
   RouteMap,
   RouteMapDef,
   RouteMatcher,
@@ -23,6 +24,7 @@ export type {
   RouteConfigMap,
   RouteDefinition,
   RouteDefinitions,
+  RouteFactory,
   RouteMap,
   RouteMapDef,
   RouteMatcher,
@@ -36,6 +38,7 @@ export type {
 
 export type ReactRouterConfig<M extends RouteMapDef, Ctx = unknown> = {
   initial: RouteUnion<M> | null
+  routes?: RouteDefinitions | undefined
   routeConfig?: RouteConfigMap<M, Ctx> | undefined
   maxHistoryLength?: number | undefined
   context?: Ctx | (() => Ctx) | undefined

package/src/url.ts

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