Lit Routing 🔥

A lightweight wrapper for routing in lit-html apps.
This library works with any routing library, if you provide a corresponding _connector_.
A connector for the lightweight router Navigo is already provided.

Installing

Using npm:
npm i -S lit-routing

Using yarn:
yarn add lit-routing

Additionally, you need to install the routing library of your choice, e.g.:
npm i -S navigo
yarn add navigo

Usage

This library consists of a global _Router_ object and a _LitRouter_ component. First, you need to configure the router.

``typescript
import {html} from 'lit-html';
import {Router, RouteConfig} from 'lit-routing';
import {NavigoConnector} from 'lit-routing/lib/connectors/navigo';

const routes: RouteConfig[] = [
{path: '', template: document.createElement('button')},
{path: '/settings', template: new SettingsPage()}, // <- suppose this is a LitElement / web component
{path: '**', template: html404 - not found},
];

Router.initialize(NavigoConnector, routes, {useHash: true})
`

A route template can either be a lit-html template literal or a HTML element / web component. In order to provide
a fallback route, a route with path '**' can be added as the last route.

Afterwards, you only need to use the ` element, where you want your routes to be displayed.