A pure and functional router using classic FRP. Written in TypeScript. Experimental.
npm install --save @funkia/rudolph @funkia/hareactive
type Router = {
prefixPath: string;
path: Behavior<string>;
useHash: boolean;
};
Takes a configuration Object describing how to handle the routing:
useHash: boolean
- whether to use hash-routingpath: Behavior<string>
- defaults tolocationHashB
orlocationB
It errors if useHash = true
but hash-routing is unsupported in that browser, or if there is no support for the history API.
The returned Router object is identical to its input, augmented with prefixPath: ""
, which is used to nest routers.
Usage:
const router = createRouter({
useHash: false
});
runComponent("#mount", main({ router }));
navigate(router: Router, pathStream: Stream<string>): Now<Stream<any>>
navigate
takes a stream of paths. Whenever the stream has an occurence, it is navigated to.
Usage:
const navs: Stream<string> = userIds
.map(prefix("/user/"))
.combine(on.homeClicks.mapTo("/"));
start(navigate(props.router, navs));
routePath<A>(routes: Routes<A>, router: Router): Behavior<A>
Takes a description of the routes and a router, and returns a behavior with the result of parsing the router's location according to the routes' pattern.
The first parameter, routes: Routes
, is a description of the routes, in the form:
{"/route/:urlParam"; (restUrl, params) => result}
Usage:
E.section(
routePath(
{
"/user/:userId": (_subrouter, { userId }) => user(userId),
"/": () => home,
"*": () => notFound,
},
props.router
)
)
type Routes<A> = Record<string, RouteHandler<A>>
Example:
{
"/user/:userId": (_subrouter, { userId }) => user(userId),
"/": () => home,
"*": () => notFound,
}
type RouteHandler<A> = (
router: Router,
params: Record<string, string>
) => A;
locationHashB: Behavior<string>
represents the current values of the URL hash.
locationHashB: Behavior<string>
represents the current values of the URL pathname.
navigateHashIO: (path: string) => IO<void>
is an IO
effect that updates the URL hash to the supplied argument.
navigateIO: (path: string) => IO<void>
is an IO
effect that updates the URL pathname to the supplied argument.
Takes a behavior of a boolean, if true the user will have to confirm before unloading page.