@mxweb/router

A lightweight router for Next.js App Router adhoc features. Supports both built-in browser navigation and Next.js navigation for seamless routing within embedded applications.

Installation

npm install @mxweb/router
# or
yarn add @mxweb/router
# or
pnpm add @mxweb/router

Quick Start

import { Router, Route, Link, useRouter } from '@mxweb/router';
import { useRouter as useNextRouter } from 'next/navigation';

function MyAdhocFeature() {
  const nextRouter = useNextRouter();

  return (
    <Router basename="/my-feature" adapter={nextRouter}>
      <nav>
        <Link href="/">Home</Link>
        <Link href="/settings">Settings</Link>
      </nav>
      
      <Route index element={HomePage} />
      <Route path="settings" element={SettingsPage} />
    </Router>
  );
}

function HomePage({ navigation }) {
  return <button onClick={() => navigation.push('/settings')}>Go to Settings</button>;
}

function SettingsPage({ navigation }) {
  return <button onClick={() => navigation.pop()}>Go Back</button>;
}

Documentation

For full documentation, visit docs.mxweb.io/router

License

MIT © MxWeb