kdu-router 3.4.0-beta.0 → 3.5.4

package/dist/kdu-router.js

@@ -1,12 +1,12 @@
 /*!
-  * kdu-router v3.4.0-beta.0
+  * kdu-router v3.5.4
   * (c) 2022 NKDuy
   * @license MIT
   */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
   typeof define === 'function' && define.amd ? define(factory) :
-  (global = global || self, global.KduRouter = factory());
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.KduRouter = factory());
 }(this, (function () { 'use strict';
 
   /*  */
@@ -18,7 +18,7 @@
   }
 
   function warn (condition, message) {
-    if ( !condition) {
+    if (!condition) {
       typeof console !== 'undefined' && console.warn(("[kdu-router] " + message));
     }
   }
@@ -30,158 +30,6 @@
     return a
   }
 
-  var View = {
-    name: 'RouterView',
-    functional: true,
-    props: {
-      name: {
-        type: String,
-        default: 'default'
-      }
-    },
-    render: function render (_, ref) {
-      var props = ref.props;
-      var children = ref.children;
-      var parent = ref.parent;
-      var data = ref.data;
-
-      // used by devtools to display a router-view badge
-      data.routerView = true;
-
-      // directly use parent context's createElement() function
-      // so that components rendered by router-view can resolve named slots
-      var h = parent.$createElement;
-      var name = props.name;
-      var route = parent.$route;
-      var cache = parent._routerViewCache || (parent._routerViewCache = {});
-
-      // determine current view depth, also check to see if the tree
-      // has been toggled inactive but kept-alive.
-      var depth = 0;
-      var inactive = false;
-      while (parent && parent._routerRoot !== parent) {
-        var knodeData = parent.$knode ? parent.$knode.data : {};
-        if (knodeData.routerView) {
-          depth++;
-        }
-        if (knodeData.keepAlive && parent._directInactive && parent._inactive) {
-          inactive = true;
-        }
-        parent = parent.$parent;
-      }
-      data.routerViewDepth = depth;
-
-      // render previous view if the tree is inactive and kept-alive
-      if (inactive) {
-        var cachedData = cache[name];
-        var cachedComponent = cachedData && cachedData.component;
-        if (cachedComponent) {
-          // #2301
-          // pass props
-          if (cachedData.configProps) {
-            fillPropsinData(cachedComponent, data, cachedData.route, cachedData.configProps);
-          }
-          return h(cachedComponent, data, children)
-        } else {
-          // render previous empty view
-          return h()
-        }
-      }
-
-      var matched = route.matched[depth];
-      var component = matched && matched.components[name];
-
-      // render empty node if no matched route or no config component
-      if (!matched || !component) {
-        cache[name] = null;
-        return h()
-      }
-
-      // cache component
-      cache[name] = { component: component };
-
-      // attach instance registration hook
-      // this will be called in the instance's injected lifecycle hooks
-      data.registerRouteInstance = function (vm, val) {
-        // val could be undefined for unregistration
-        var current = matched.instances[name];
-        if (
-          (val && current !== vm) ||
-          (!val && current === vm)
-        ) {
-          matched.instances[name] = val;
-        }
-      }
-
-      // also register instance in prepatch hook
-      // in case the same component instance is reused across different routes
-      ;(data.hook || (data.hook = {})).prepatch = function (_, knode) {
-        matched.instances[name] = knode.componentInstance;
-      };
-
-      // register instance in init hook
-      // in case kept-alive component be actived when routes changed
-      data.hook.init = function (knode) {
-        if (knode.data.keepAlive &&
-          knode.componentInstance &&
-          knode.componentInstance !== matched.instances[name]
-        ) {
-          matched.instances[name] = knode.componentInstance;
-        }
-      };
-
-      var configProps = matched.props && matched.props[name];
-      // save route and configProps in cache
-      if (configProps) {
-        extend(cache[name], {
-          route: route,
-          configProps: configProps
-        });
-        fillPropsinData(component, data, route, configProps);
-      }
-
-      return h(component, data, children)
-    }
-  };
-
-  function fillPropsinData (component, data, route, configProps) {
-    // resolve props
-    var propsToPass = data.props = resolveProps(route, configProps);
-    if (propsToPass) {
-      // clone to prevent mutation
-      propsToPass = data.props = extend({}, propsToPass);
-      // pass non-declared props as attrs
-      var attrs = data.attrs = data.attrs || {};
-      for (var key in propsToPass) {
-        if (!component.props || !(key in component.props)) {
-          attrs[key] = propsToPass[key];
-          delete propsToPass[key];
-        }
-      }
-    }
-  }
-
-  function resolveProps (route, config) {
-    switch (typeof config) {
-      case 'undefined':
-        return
-      case 'object':
-        return config
-      case 'function':
-        return config(route)
-      case 'boolean':
-        return config ? route.params : undefined
-      default:
-        {
-          warn(
-            false,
-            "props in \"" + (route.path) + "\" is a " + (typeof config) + ", " +
-            "expecting an object, function or boolean."
-          );
-        }
-    }
-  }
-
   /*  */
 
   var encodeReserveRE = /[!'()*]/g;
@@ -192,10 +40,19 @@
   // - escapes [!'()*]
   // - preserve commas
   var encode = function (str) { return encodeURIComponent(str)
-    .replace(encodeReserveRE, encodeReserveReplacer)
-    .replace(commaRE, ','); };
+      .replace(encodeReserveRE, encodeReserveReplacer)
+      .replace(commaRE, ','); };
 
-  var decode = decodeURIComponent;
+  function decode (str) {
+    try {
+      return decodeURIComponent(str)
+    } catch (err) {
+      {
+        warn(false, ("Error decoding \"" + str + "\". Leaving it intact."));
+      }
+    }
+    return str
+  }
 
   function resolveQuery (
     query,
@@ -209,16 +66,20 @@
     try {
       parsedQuery = parse(query || '');
     } catch (e) {
-       warn(false, e.message);
+      warn(false, e.message);
       parsedQuery = {};
     }
     for (var key in extraQuery) {
       var value = extraQuery[key];
-      parsedQuery[key] = Array.isArray(value) ? value.map(function (v) { return '' + v; }) : '' + value;
+      parsedQuery[key] = Array.isArray(value)
+        ? value.map(castQueryParamValue)
+        : castQueryParamValue(value);
     }
     return parsedQuery
   }
 
+  var castQueryParamValue = function (value) { return (value == null || typeof value === 'object' ? value : String(value)); };
+
   function parseQuery (query) {
     var res = {};
 
@@ -231,9 +92,7 @@
     query.split('&').forEach(function (param) {
       var parts = param.replace(/\+/g, ' ').split('=');
       var key = decode(parts.shift());
-      var val = parts.length > 0
-        ? decode(parts.join('='))
-        : null;
+      var val = parts.length > 0 ? decode(parts.join('=')) : null;
 
       if (res[key] === undefined) {
         res[key] = val;
@@ -248,34 +107,39 @@
   }
 
   function stringifyQuery (obj) {
-    var res = obj ? Object.keys(obj).map(function (key) {
-      var val = obj[key];
-
-      if (val === undefined) {
-        return ''
-      }
+    var res = obj
+      ? Object.keys(obj)
+        .map(function (key) {
+          var val = obj[key];
 
-      if (val === null) {
-        return encode(key)
-      }
+          if (val === undefined) {
+            return ''
+          }
 
-      if (Array.isArray(val)) {
-        var result = [];
-        val.forEach(function (val2) {
-          if (val2 === undefined) {
-            return
+          if (val === null) {
+            return encode(key)
           }
-          if (val2 === null) {
-            result.push(encode(key));
-          } else {
-            result.push(encode(key) + '=' + encode(val2));
+
+          if (Array.isArray(val)) {
+            var result = [];
+            val.forEach(function (val2) {
+              if (val2 === undefined) {
+                return
+              }
+              if (val2 === null) {
+                result.push(encode(key));
+              } else {
+                result.push(encode(key) + '=' + encode(val2));
+              }
+            });
+            return result.join('&')
           }
-        });
-        return result.join('&')
-      }
 
-      return encode(key) + '=' + encode(val)
-    }).filter(function (x) { return x.length > 0; }).join('&') : null;
+          return encode(key) + '=' + encode(val)
+        })
+        .filter(function (x) { return x.length > 0; })
+        .join('&')
+      : null;
     return res ? ("?" + res) : ''
   }
 
@@ -352,23 +216,23 @@
     return (path || '/') + stringify(query) + hash
   }
 
-  function isSameRoute (a, b) {
+  function isSameRoute (a, b, onlyPath) {
     if (b === START) {
       return a === b
     } else if (!b) {
       return false
     } else if (a.path && b.path) {
-      return (
-        a.path.replace(trailingSlashRE, '') === b.path.replace(trailingSlashRE, '') &&
+      return a.path.replace(trailingSlashRE, '') === b.path.replace(trailingSlashRE, '') && (onlyPath ||
         a.hash === b.hash &&
-        isObjectEqual(a.query, b.query)
-      )
+        isObjectEqual(a.query, b.query))
     } else if (a.name && b.name) {
       return (
         a.name === b.name &&
-        a.hash === b.hash &&
+        (onlyPath || (
+          a.hash === b.hash &&
         isObjectEqual(a.query, b.query) &&
-        isObjectEqual(a.params, b.params)
+        isObjectEqual(a.params, b.params))
+        )
       )
     } else {
       return false
@@ -381,14 +245,18 @@
 
     // handle null value #1566
     if (!a || !b) { return a === b }
-    var aKeys = Object.keys(a);
-    var bKeys = Object.keys(b);
+    var aKeys = Object.keys(a).sort();
+    var bKeys = Object.keys(b).sort();
     if (aKeys.length !== bKeys.length) {
       return false
     }
-    return aKeys.every(function (key) {
+    return aKeys.every(function (key, i) {
       var aVal = a[key];
+      var bKey = bKeys[i];
+      if (bKey !== key) { return false }
       var bVal = b[key];
+      // query values can be null and undefined
+      if (aVal == null || bVal == null) { return aVal === bVal }
       // check nested equality
       if (typeof aVal === 'object' && typeof bVal === 'object') {
         return isObjectEqual(aVal, bVal)
@@ -416,6 +284,178 @@
     return true
   }
 
+  function handleRouteEntered (route) {
+    for (var i = 0; i < route.matched.length; i++) {
+      var record = route.matched[i];
+      for (var name in record.instances) {
+        var instance = record.instances[name];
+        var cbs = record.enteredCbs[name];
+        if (!instance || !cbs) { continue }
+        delete record.enteredCbs[name];
+        for (var i$1 = 0; i$1 < cbs.length; i$1++) {
+          if (!instance._isBeingDestroyed) { cbs[i$1](instance); }
+        }
+      }
+    }
+  }
+
+  var View = {
+    name: 'RouterView',
+    functional: true,
+    props: {
+      name: {
+        type: String,
+        default: 'default'
+      }
+    },
+    render: function render (_, ref) {
+      var props = ref.props;
+      var children = ref.children;
+      var parent = ref.parent;
+      var data = ref.data;
+
+      // used by devtools to display a router-view badge
+      data.routerView = true;
+
+      // directly use parent context's createElement() function
+      // so that components rendered by router-view can resolve named slots
+      var h = parent.$createElement;
+      var name = props.name;
+      var route = parent.$route;
+      var cache = parent._routerViewCache || (parent._routerViewCache = {});
+
+      // determine current view depth, also check to see if the tree
+      // has been toggled inactive but kept-alive.
+      var depth = 0;
+      var inactive = false;
+      while (parent && parent._routerRoot !== parent) {
+        var knodeData = parent.$knode ? parent.$knode.data : {};
+        if (knodeData.routerView) {
+          depth++;
+        }
+        if (knodeData.keepAlive && parent._directInactive && parent._inactive) {
+          inactive = true;
+        }
+        parent = parent.$parent;
+      }
+      data.routerViewDepth = depth;
+
+      // render previous view if the tree is inactive and kept-alive
+      if (inactive) {
+        var cachedData = cache[name];
+        var cachedComponent = cachedData && cachedData.component;
+        if (cachedComponent) {
+          // #2301
+          // pass props
+          if (cachedData.configProps) {
+            fillPropsinData(cachedComponent, data, cachedData.route, cachedData.configProps);
+          }
+          return h(cachedComponent, data, children)
+        } else {
+          // render previous empty view
+          return h()
+        }
+      }
+
+      var matched = route.matched[depth];
+      var component = matched && matched.components[name];
+
+      // render empty node if no matched route or no config component
+      if (!matched || !component) {
+        cache[name] = null;
+        return h()
+      }
+
+      // cache component
+      cache[name] = { component: component };
+
+      // attach instance registration hook
+      // this will be called in the instance's injected lifecycle hooks
+      data.registerRouteInstance = function (vm, val) {
+        // val could be undefined for unregistration
+        var current = matched.instances[name];
+        if (
+          (val && current !== vm) ||
+          (!val && current === vm)
+        ) {
+          matched.instances[name] = val;
+        }
+      }
+
+      // also register instance in prepatch hook
+      // in case the same component instance is reused across different routes
+      ;(data.hook || (data.hook = {})).prepatch = function (_, knode) {
+        matched.instances[name] = knode.componentInstance;
+      };
+
+      // register instance in init hook
+      // in case kept-alive component be actived when routes changed
+      data.hook.init = function (knode) {
+        if (knode.data.keepAlive &&
+          knode.componentInstance &&
+          knode.componentInstance !== matched.instances[name]
+        ) {
+          matched.instances[name] = knode.componentInstance;
+        }
+
+        // if the route transition has already been confirmed then we weren't
+        // able to call the cbs during confirmation as the component was not
+        // registered yet, so we call it here.
+        handleRouteEntered(route);
+      };
+
+      var configProps = matched.props && matched.props[name];
+      // save route and configProps in cache
+      if (configProps) {
+        extend(cache[name], {
+          route: route,
+          configProps: configProps
+        });
+        fillPropsinData(component, data, route, configProps);
+      }
+
+      return h(component, data, children)
+    }
+  };
+
+  function fillPropsinData (component, data, route, configProps) {
+    // resolve props
+    var propsToPass = data.props = resolveProps(route, configProps);
+    if (propsToPass) {
+      // clone to prevent mutation
+      propsToPass = data.props = extend({}, propsToPass);
+      // pass non-declared props as attrs
+      var attrs = data.attrs = data.attrs || {};
+      for (var key in propsToPass) {
+        if (!component.props || !(key in component.props)) {
+          attrs[key] = propsToPass[key];
+          delete propsToPass[key];
+        }
+      }
+    }
+  }
+
+  function resolveProps (route, config) {
+    switch (typeof config) {
+      case 'undefined':
+        return
+      case 'object':
+        return config
+      case 'function':
+        return config(route)
+      case 'boolean':
+        return config ? route.params : undefined
+      default:
+        {
+          warn(
+            false,
+            "props in \"" + (route.path) + "\" is a " + (typeof config) + ", " +
+            "expecting an object, function or boolean."
+          );
+        }
+    }
+  }
+
   /*  */
 
   function resolvePath (
@@ -484,7 +524,7 @@
   }
 
   function cleanPath (path) {
-    return path.replace(/\/\//g, '/')
+    return path.replace(/\/(?:\s*\/)+/g, '/')
   }
 
   var isarray = Array.isArray || function (arr) {
@@ -1024,6 +1064,10 @@
 
   var noop = function () {};
 
+  var warnedCustomSlot;
+  var warnedTagProp;
+  var warnedEventProp;
+
   var Link = {
     name: 'RouterLink',
     props: {
@@ -1035,7 +1079,9 @@
         type: String,
         default: 'a'
       },
+      custom: Boolean,
       exact: Boolean,
+      exactPath: Boolean,
       append: Boolean,
       replace: Boolean,
       activeClass: String,
@@ -1084,8 +1130,8 @@
         ? createRoute(null, normalizeLocation(route.redirectedFrom), null, router)
         : route;
 
-      classes[exactActiveClass] = isSameRoute(current, compareTarget);
-      classes[activeClass] = this.exact
+      classes[exactActiveClass] = isSameRoute(current, compareTarget, this.exactPath);
+      classes[activeClass] = this.exact || this.exactPath
         ? classes[exactActiveClass]
         : isIncludedRoute(current, compareTarget);
 
@@ -1124,19 +1170,40 @@
         });
 
       if (scopedSlot) {
+        if (!this.custom) {
+          !warnedCustomSlot && warn(false, 'In Kdu Router 4, the k-slot API will by default wrap its content with an <a> element. Use the custom prop to remove this warning:\n<router-link k-slot="{ navigate, href }" custom></router-link>\n');
+          warnedCustomSlot = true;
+        }
         if (scopedSlot.length === 1) {
           return scopedSlot[0]
         } else if (scopedSlot.length > 1 || !scopedSlot.length) {
           {
             warn(
               false,
-              ("RouterLink with to=\"" + (this.to) + "\" is trying to use a scoped slot but it didn't provide exactly one child. Wrapping the content with a span element.")
+              ("<router-link> with to=\"" + (this.to) + "\" is trying to use a scoped slot but it didn't provide exactly one child. Wrapping the content with a span element.")
             );
           }
           return scopedSlot.length === 0 ? h() : h('span', {}, scopedSlot)
         }
       }
 
+      {
+        if ('tag' in this.$options.propsData && !warnedTagProp) {
+          warn(
+            false,
+            "<router-link>'s tag prop is deprecated and has been removed in Kdu Router 4. Use the k-slot API to remove this warning: https://kdujs-router.web.app/guide/migration/#removal-of-event-and-tag-props-in-router-link."
+          );
+          warnedTagProp = true;
+        }
+        if ('event' in this.$options.propsData && !warnedEventProp) {
+          warn(
+            false,
+            "<router-link>'s event prop is deprecated and has been removed in Kdu Router 4. Use the k-slot API to remove this warning: https://kdujs-router.web.app/guide/migration/#removal-of-event-and-tag-props-in-router-link."
+          );
+          warnedEventProp = true;
+        }
+      }
+
       if (this.tag === 'a') {
         data.on = on;
         data.attrs = { href: href, 'aria-current': ariaCurrentValue };
@@ -1272,7 +1339,8 @@
     routes,
     oldPathList,
     oldPathMap,
-    oldNameMap
+    oldNameMap,
+    parentRoute
   ) {
     // the path list is used to control path matching priority
     var pathList = oldPathList || [];
@@ -1282,7 +1350,7 @@
     var nameMap = oldNameMap || Object.create(null);
 
     routes.forEach(function (route) {
-      addRouteRecord(pathList, pathMap, nameMap, route);
+      addRouteRecord(pathList, pathMap, nameMap, route, parentRoute);
     });
 
     // ensure wildcard routes are always at the end
@@ -1331,6 +1399,14 @@
           path || name
         )) + " cannot be a " + "string id. Use an actual component instead."
       );
+
+      warn(
+        // eslint-disable-next-line no-control-regex
+        !/[^\u0000-\u007F]+/.test(path),
+        "Route with path \"" + path + "\" contains unencoded characters, make sure " +
+          "your path is correctly encoded before passing it to the router. Use " +
+          "encodeURI to encode static segments of your path."
+      );
     }
 
     var pathToRegexpOptions =
@@ -1345,7 +1421,13 @@
       path: normalizedPath,
       regex: compileRouteRegex(normalizedPath, pathToRegexpOptions),
       components: route.components || { default: route.component },
+      alias: route.alias
+        ? typeof route.alias === 'string'
+          ? [route.alias]
+          : route.alias
+        : [],
       instances: {},
+      enteredCbs: {},
       name: name,
       parent: parent,
       matchAs: matchAs,
@@ -1373,7 +1455,7 @@
           warn(
             false,
             "Named Route '" + (route.name) + "' has a default child route. " +
-              "When navigating to this named route (:to=\"{name: '" + (route.name) + "'\"), " +
+              "When navigating to this named route (:to=\"{name: '" + (route.name) + "'}\"), " +
               "the default child route will not be rendered. Remove the name from " +
               "this route and use the name of the default child route for named " +
               "links instead."
@@ -1397,7 +1479,7 @@
       var aliases = Array.isArray(route.alias) ? route.alias : [route.alias];
       for (var i = 0; i < aliases.length; ++i) {
         var alias = aliases[i];
-        if ( alias === path) {
+        if (alias === path) {
           warn(
             false,
             ("Found an alias with the same value as the path: \"" + path + "\". You have to remove that alias. It will be ignored in development.")
@@ -1424,7 +1506,7 @@
     if (name) {
       if (!nameMap[name]) {
         nameMap[name] = record;
-      } else if ( !matchAs) {
+      } else if (!matchAs) {
         warn(
           false,
           "Duplicate named routes definition: " +
@@ -1480,6 +1562,28 @@
       createRouteMap(routes, pathList, pathMap, nameMap);
     }
 
+    function addRoute (parentOrRoute, route) {
+      var parent = (typeof parentOrRoute !== 'object') ? nameMap[parentOrRoute] : undefined;
+      // $flow-disable-line
+      createRouteMap([route || parentOrRoute], pathList, pathMap, nameMap, parent);
+
+      // add aliases of parent
+      if (parent && parent.alias.length) {
+        createRouteMap(
+          // $flow-disable-line route is defined if parent is
+          parent.alias.map(function (alias) { return ({ path: alias, children: [route] }); }),
+          pathList,
+          pathMap,
+          nameMap,
+          parent
+        );
+      }
+    }
+
+    function getRoutes () {
+      return pathList.map(function (path) { return pathMap[path]; })
+    }
+
     function match (
       raw,
       currentRoute,
@@ -1626,6 +1730,8 @@
 
     return {
       match: match,
+      addRoute: addRoute,
+      getRoutes: getRoutes,
       addRoutes: addRoutes
     }
   }
@@ -1645,10 +1751,9 @@
 
     for (var i = 1, len = m.length; i < len; ++i) {
       var key = regex.keys[i - 1];
-      var val = typeof m[i] === 'string' ? decodeURIComponent(m[i]) : m[i];
       if (key) {
         // Fix #1994: using * with props: true generates a param named 0
-        params[key.name || 'pathMatch'] = val;
+        params[key.name || 'pathMatch'] = typeof m[i] === 'string' ? decode(m[i]) : m[i];
       }
     }
 
@@ -1838,7 +1943,17 @@
     }
 
     if (position) {
-      window.scrollTo(position.x, position.y);
+      // $flow-disable-line
+      if ('scrollBehavior' in document.documentElement.style) {
+        window.scrollTo({
+          left: position.x,
+          top: position.y,
+          // $flow-disable-line
+          behavior: shouldScroll.behavior
+        });
+      } else {
+        window.scrollTo(position.x, position.y);
+      }
     }
   }
 
@@ -1903,6 +2018,7 @@
     step(0);
   }
 
+  // When changing thing, also edit router.d.ts
   var NavigationFailureType = {
     redirected: 2,
     aborted: 4,
@@ -2020,7 +2136,7 @@
 
           var reject = once(function (reason) {
             var msg = "Failed to resolve async component " + key + ": " + reason;
-             warn(false, msg);
+            warn(false, msg);
             if (!error) {
               error = isError(reason)
                 ? reason
@@ -2136,6 +2252,7 @@
       var this$1 = this;
 
     var route;
+    // catch redirect option
     try {
       route = this.router.match(location, this.current);
     } catch (e) {
@@ -2145,10 +2262,10 @@
       // Exception should still be thrown
       throw e
     }
+    var prev = this.current;
     this.confirmTransition(
       route,
       function () {
-        var prev = this$1.current;
         this$1.updateRoute(route);
         onComplete && onComplete(route);
         this$1.ensureURL();
@@ -2169,16 +2286,13 @@
           onAbort(err);
         }
         if (err && !this$1.ready) {
-          this$1.ready = true;
-          // Initial redirection should still trigger the onReady onSuccess
-          if (!isNavigationFailure(err, NavigationFailureType.redirected)) {
+          // Initial redirection should not mark the history as ready yet
+          // because it's triggered by the redirection instead
+          if (!isNavigationFailure(err, NavigationFailureType.redirected) || prev !== START) {
+            this$1.ready = true;
             this$1.readyErrorCbs.forEach(function (cb) {
               cb(err);
             });
-          } else {
-            this$1.readyCbs.forEach(function (cb) {
-              cb(route);
-            });
           }
         }
       }
@@ -2189,16 +2303,19 @@
       var this$1 = this;
 
     var current = this.current;
+    this.pending = route;
     var abort = function (err) {
-      // changed after adding errors before that change,
-      // redirect and aborted navigation would produce an err == null
+      // changed after adding errors
+      // before that change, redirect and aborted navigation would produce an err == null
       if (!isNavigationFailure(err) && isError(err)) {
         if (this$1.errorCbs.length) {
           this$1.errorCbs.forEach(function (cb) {
             cb(err);
           });
         } else {
-          warn(false, 'uncaught error during route navigation:');
+          {
+            warn(false, 'uncaught error during route navigation:');
+          }
           console.error(err);
         }
       }
@@ -2213,6 +2330,9 @@
       route.matched[lastRouteIndex] === current.matched[lastCurrentIndex]
     ) {
       this.ensureURL();
+      if (route.hash) {
+        handleScroll(this.router, current, route, false);
+      }
       return abort(createNavigationDuplicatedError(current, route))
     }
 
@@ -2237,7 +2357,6 @@
       resolveAsyncComponents(activated)
     );
 
-    this.pending = route;
     var iterator = function (hook, next) {
       if (this$1.pending !== route) {
         return abort(createNavigationCancelledError(current, route))
@@ -2274,11 +2393,9 @@
     };
 
     runQueue(queue, iterator, function () {
-      var postEnterCbs = [];
-      var isValid = function () { return this$1.current === route; };
       // wait until async components are resolved before
       // extracting in-component enter guards
-      var enterGuards = extractEnterGuards(activated, postEnterCbs, isValid);
+      var enterGuards = extractEnterGuards(activated);
       var queue = enterGuards.concat(this$1.router.resolveHooks);
       runQueue(queue, iterator, function () {
         if (this$1.pending !== route) {
@@ -2288,9 +2405,7 @@
         onComplete(route);
         if (this$1.router.app) {
           this$1.router.app.$nextTick(function () {
-            postEnterCbs.forEach(function (cb) {
-              cb();
-            });
+            handleRouteEntered(route);
           });
         }
       });
@@ -2306,11 +2421,16 @@
     // Default implementation is empty
   };
 
-  History.prototype.teardownListeners = function teardownListeners () {
+  History.prototype.teardown = function teardown () {
+    // clean up event listeners
     this.listeners.forEach(function (cleanupListener) {
       cleanupListener();
     });
     this.listeners = [];
+
+    // reset current history route
+    this.current = START;
+    this.pending = null;
   };
 
   function normalizeBase (base) {
@@ -2396,15 +2516,13 @@
   }
 
   function extractEnterGuards (
-    activated,
-    cbs,
-    isValid
+    activated
   ) {
     return extractGuards(
       activated,
       'beforeRouteEnter',
       function (guard, _, match, key) {
-        return bindEnterGuard(guard, match, key, cbs, isValid)
+        return bindEnterGuard(guard, match, key)
       }
     )
   }
@@ -2412,45 +2530,21 @@
   function bindEnterGuard (
     guard,
     match,
-    key,
-    cbs,
-    isValid
+    key
   ) {
     return function routeEnterGuard (to, from, next) {
       return guard(to, from, function (cb) {
         if (typeof cb === 'function') {
-          cbs.push(function () {
-            // #750
-            // if a router-view is wrapped with an out-in transition,
-            // the instance may not have been registered at this time.
-            // we will need to poll for registration until current route
-            // is no longer valid.
-            poll(cb, match.instances, key, isValid);
-          });
+          if (!match.enteredCbs[key]) {
+            match.enteredCbs[key] = [];
+          }
+          match.enteredCbs[key].push(cb);
         }
         next(cb);
       })
     }
   }
 
-  function poll (
-    cb, // somehow flow cannot infer this is a function
-    instances,
-    key,
-    isValid
-  ) {
-    if (
-      instances[key] &&
-      !instances[key]._isBeingDestroyed // do not reuse being destroyed instance
-    ) {
-      cb(instances[key]);
-    } else if (isValid()) {
-      setTimeout(function () {
-        poll(cb, instances, key, isValid);
-      }, 16);
-    }
-  }
-
   /*  */
 
   var HTML5History = /*@__PURE__*/(function (History) {
@@ -2544,8 +2638,13 @@
   }(History));
 
   function getLocation (base) {
-    var path = decodeURI(window.location.pathname);
-    if (base && path.toLowerCase().indexOf(base.toLowerCase()) === 0) {
+    var path = window.location.pathname;
+    var pathLowerCase = path.toLowerCase();
+    var baseLowerCase = base.toLowerCase();
+    // base="/a" shouldn't turn path="/app" into "/a/pp"
+    // so we ensure the trailing slash in the base
+    if (base && ((pathLowerCase === baseLowerCase) ||
+      (pathLowerCase.indexOf(cleanPath(baseLowerCase + '/')) === 0))) {
       path = path.slice(base.length);
     }
     return (path || '/') + window.location.search + window.location.hash
@@ -2684,17 +2783,6 @@
     if (index < 0) { return '' }
 
     href = href.slice(index + 1);
-    // decode the hash but not the search or hash
-    // as search(query) is already decoded
-    var searchIndex = href.indexOf('?');
-    if (searchIndex < 0) {
-      var hashIndex = href.indexOf('#');
-      if (hashIndex > -1) {
-        href = decodeURI(href.slice(0, hashIndex)) + href.slice(hashIndex);
-      } else { href = decodeURI(href); }
-    } else {
-      href = decodeURI(href.slice(0, searchIndex)) + href.slice(searchIndex);
-    }
 
     return href
   }
@@ -2773,8 +2861,12 @@
       this.confirmTransition(
         route,
         function () {
+          var prev = this$1.current;
           this$1.index = targetIndex;
           this$1.updateRoute(route);
+          this$1.router.afterHooks.forEach(function (hook) {
+            hook && hook(route, prev);
+          });
         },
         function (err) {
           if (isNavigationFailure(err, NavigationFailureType.duplicated)) {
@@ -2801,6 +2893,9 @@
   var KduRouter = function KduRouter (options) {
     if ( options === void 0 ) options = {};
 
+    {
+      warn(this instanceof KduRouter, "Router must be called with the new operator.");
+    }
     this.app = null;
     this.apps = [];
     this.options = options;
@@ -2850,8 +2945,7 @@
   KduRouter.prototype.init = function init (app /* Kdu component instance */) {
       var this$1 = this;
 
-    
-      assert(
+    assert(
         install.installed,
         "not installed. Make sure to call `Kdu.use(KduRouter)` " +
           "before creating root instance."
@@ -2868,10 +2962,7 @@
       // we do not release the router so it can be reused
       if (this$1.app === app) { this$1.app = this$1.apps[0] || null; }
 
-      if (!this$1.app) {
-        // clean up event listeners
-        this$1.history.teardownListeners();
-      }
+      if (!this$1.app) { this$1.history.teardown(); }
     });
 
     // main app previously initialized
@@ -3010,7 +3101,21 @@
     }
   };
 
+  KduRouter.prototype.getRoutes = function getRoutes () {
+    return this.matcher.getRoutes()
+  };
+
+  KduRouter.prototype.addRoute = function addRoute (parentOrRoute, route) {
+    this.matcher.addRoute(parentOrRoute, route);
+    if (this.history.current !== START) {
+      this.history.transitionTo(this.history.getCurrentLocation());
+    }
+  };
+
   KduRouter.prototype.addRoutes = function addRoutes (routes) {
+    {
+      warn(false, 'router.addRoutes() is deprecated and has been removed in Kdu Router 4. Use router.addRoute() instead.');
+    }
     this.matcher.addRoutes(routes);
     if (this.history.current !== START) {
       this.history.transitionTo(this.history.getCurrentLocation());
@@ -3033,9 +3138,10 @@
   }
 
   KduRouter.install = install;
-  KduRouter.version = '3.4.0-beta.0';
+  KduRouter.version = '3.5.4';
   KduRouter.isNavigationFailure = isNavigationFailure;
   KduRouter.NavigationFailureType = NavigationFailureType;
+  KduRouter.START_LOCATION = START;
 
   if (inBrowser && window.Kdu) {
     window.Kdu.use(KduRouter);