Layout general

Puede aplicar un layout común a todas tus rutas:

import { RouterProvider, Link } from "@arielgonzaguer/michi-router";

// ejemplo de un componente Layout
function MainLayout({ children }) {
  return (
    <div className="layout">
      <header>
        <nav>
          <Link to="/">Home</Link>
          <Link to="/felinos-ferales">Ferales</Link>
        </nav>
      </header>
      <main>{children}</main>
      <footer>Michi-router 😸</footer>
    </div>
  );
}

// definición de rutas
const routes = [
  { path: "/", component: <Home /> },
  { path: "/felinos-ferales", component: <Ferales /> },
];

// uso del layout en el RouterProvider
export default function App() {
  return (
    <RouterProvider routes={routes} layout={MainLayout}>
      <div>404: Un gato se llevó esta página</div>
    </RouterProvider>
  );
}