Skip to content
XMachines

Function: createRouter()

API / @xmachines/play-dom-router / createRouter

function createRouter<History>(options): DisposableVanillaRouter<History>;

Defined in: play-dom-router/src/create-router.ts:101

Creates the vanilla router for a framework-agnostic routing.

Architecture:

  • The router wraps a history and a routeTree, and it does nothing more
  • It does NOT hold the routeMap, because a provider needs the routeMap as a prop
  • It manages the history only, and it knows no framework

The reason for no routeMap:

  • The router knows nothing about a state ID, because a state ID belongs to Play
  • The RouteMap is the bridge between the router and the actor
  • The provider receives the routeMap as a prop, and it resolves a path to a state ID

Use, parallel to the TanStack mode:

// Both modes: the same setup
const routeTree = extractMachineRoutes(machine);
const routeMap = createRouteMapFromTree(routeTree);
const history = createBrowserHistory({ window });


// The vanilla router
const router = createRouter({ routeTree, history });


// Connect the router to the actor. This does all the work in both directions
const disconnect = connectRouter({ actor, router, routeMap });


// Later: clean up
disconnect();
router.destroy();

Or let a scope do it, which releases the history on an exception too:

using router = createRouter({ routeTree, history });

Type Parameters

Type Parameter
History extends BrowserHistory

Parameters

ParameterType
options{ history: History; routeTree: RouteTree; }
options.historyHistory
options.routeTreeRouteTree

Returns

DisposableVanillaRouter<History>