keep history state

diff --git a/explorations/html5.ts b/explorations/html5.ts
index 6ed6090683b7b33952b1c614cf383b7426ee9fcb..9d5983d292d91ba1607ebe02ab9f19f8337b5b11 100644 (file)
--- a/explorations/html5.ts
+++ b/explorations/html5.ts
@@ -8,7 +8,7 @@ const r = new Router({
   routes: [
     { path: '/', component },
     { path: '/users/:id', name: 'user', component },
-    { path: /^\/about\/?$/, component },
+    // { path: /^\/about\/?$/, component },
   ],
 })
 
@@ -19,9 +19,15 @@ window.h = h
 window.r = r
 
 h.listen((to, from) => {
-  console.log({ to, from })
+  console.log('popstate', { to, from })
 })
 
+// h.push('/hey')
+// h.push('/hey?lol')
+// h.push('/foo')
+// h.push('/replace-me')
+// h.replace('/bar')
+
 r.push('/about')
 r.push({
   path: '/',

diff --git a/src/index.ts b/src/index.ts
index 14b7c8b24c0ea03a4cfd6df7843159ae63fb64fb..68c0efe0f7e0003362a8af9ddbcd9e62211594b0 100644 (file)
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,6 +1,6 @@
 import BaseHistory from './history/base'
 import pathToRegexp from 'path-to-regexp'
-import { Location, RouteRecord } from './types/index'
+import { Location, RouteRecord, ParamsType } from './types/index'
 
 interface RouterOptions {
   history: BaseHistory
@@ -9,6 +9,7 @@ interface RouterOptions {
 
 interface RouteMatcher {
   re: RegExp
+  resolve: (params: ParamsType) => string
   record: RouteRecord
   keys: string[]
 }
@@ -25,7 +26,12 @@ export class Router {
       const keys: pathToRegexp.Key[] = []
       // TODO: if children use option end: false ?
       const re = pathToRegexp(record.path, keys)
-      return { re, keys: keys.map(k => '' + k.name), record }
+      return {
+        re,
+        resolve: pathToRegexp.compile(record.path),
+        keys: keys.map(k => '' + k.name),
+        record,
+      }
     })
   }
 
@@ -57,15 +63,13 @@ export class Router {
     if (!('name' in location)) {
       // TODO: use current location
       // location = {...location, name: this.}
-      return '/heeey'
+      return '/using current location'
     }
     const matcher = this.routes.find(r => r.record.name === location.name)
     if (!matcher) {
       // TODO: error
       throw new Error('No match for' + location)
     }
-    matcher.re
-    return '/TODO'
-    // this.matcher.match(location)
+    return matcher.resolve(location.params || {})
   }
 }

diff --git a/src/types/index.ts b/src/types/index.ts
index 39a941944c30ad571917d95379f2b354e83e13c5..928202832fbce7ad6865cde02453c1bf1aabd231 100644 (file)
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -17,7 +17,7 @@ export type ParamsType = Record<string, string | string[]>
 // and I don't thin it's possible to filter out the route
 // by any means
 export interface RouteRecord {
-  path: string | RegExp
+  path: string // | RegExp
   component: TODO
   name?: string
   // props: PT
@@ -33,6 +33,13 @@ export type Location =
       name: string
       params?: Record<string, string>
     }
+
 export type HistoryLocation = string
 
 export const START: HistoryLocation = '/'
+
+export interface NavigationCallback {
+  (to: HistoryLocation, from: HistoryLocation): void
+}
+
+export type RemoveListener = () => void