Route definitions

Route definitions are the stable source of truth for routing behavior.

import { Route, getResourcePage } from '@plumile/router';

const routes: Route<any, any, any>[] = [
  {
    path: '/',
    resourcePage: getResourcePage('Home', () => import('./pages/Home')),
  },
  {
    path: '/users',
    children: [
      {
        path: '/:id',
        resourcePage: getResourcePage(
          'UserProfile',
          () => import('./pages/UserProfile'),
        ),
        prepare: ({ variables }) => ({ userId: variables.id }),
      },
    ],
  },
];

Keep route definitions close to application routing, not inside shared UI packages. Route preparation should return the data needed by the rendered route without introducing hidden global state.

Nested routes

Children define nested matching. Keep nested route trees readable and prefer clear path ownership over cross-package route mutation.