fix(router): accepts root direction

core/src/components/anchor/anchor.tsx

@@ -1,5 +1,5 @@
 import { Component, Prop } from '@stencil/core';
-import { openURL } from '../../utils/theme';
+import { RouterDirection, openURL } from '../../utils/theme';
 
 
 @Component({
@@ -19,7 +19,7 @@ export class Anchor {
    * When using a router, it specifies the transition direction when navigating to
    * another page using `href`.
    */
-  @Prop() routerDirection?: 'forward' | 'back';
+  @Prop() routerDirection?: RouterDirection;
 
   render() {
     return <a

core/src/components/button/button.tsx

@@ -1,6 +1,6 @@
 import { Component, Element, Event, EventEmitter, Prop, State } from '@stencil/core';
 import { CssClassMap, Mode } from '../../interface';
-import { getButtonClassMap, getElementClassMap, openURL } from '../../utils/theme';
+import { RouterDirection, getButtonClassMap, getElementClassMap, openURL } from '../../utils/theme';
 
 
 @Component({
@@ -59,7 +59,7 @@ export class Button {
    * When using a router, it specifies the transition direction when navigating to
    * another page using `href`.
    */
-  @Prop() routerDirection?: 'forward' | 'back';
+  @Prop() routerDirection?: RouterDirection;
 
   /**
    * Contains a URL or a URL fragment that the hyperlink points to.

core/src/components/item/item.tsx

@@ -1,6 +1,6 @@
 import { Component, Element, Listen, Prop } from '@stencil/core';
 import { CssClassMap, Mode } from '../../interface';
-import { createThemedClasses, getElementClassMap, openURL } from '../../utils/theme';
+import { RouterDirection, createThemedClasses, getElementClassMap, openURL } from '../../utils/theme';
 
 
 @Component({
@@ -63,7 +63,7 @@ export class Item {
    * When using a router, it specifies the transition direction when navigating to
    * another page using `href`.
    */
-  @Prop() routerDirection?: 'forward' | 'back';
+  @Prop() routerDirection?: RouterDirection;
 
 
   @Listen('ionStyle')

core/src/components/nav/nav.tsx

@@ -181,8 +181,6 @@ export class Nav implements NavOutlet {
       });
     }
 
-    const viewController = this.views.find(v => matches(v, id, params));
-
     let resolve: (result: RouteWrite) => void;
     const promise = new Promise<RouteWrite>((r) => resolve = r);
     let finish: Promise<boolean>;
@@ -202,14 +200,19 @@ export class Nav implements NavOutlet {
         return p;
       }
     };
+
+    if (direction === 0) {
+      finish = this.setRoot(id, params, commonOpts);
+    } else {
+      const viewController = this.views.find(v => matches(v, id, params));
+
       if (viewController) {
         finish = this.popTo(viewController, {...commonOpts, direction: 'back'});
       } else if (direction === 1) {
         finish = this.push(id, params, commonOpts);
       } else if (direction === -1) {
         finish = this.setRoot(id, params, {...commonOpts, direction: 'back', animated: true});
-    } else {
-      finish = this.setRoot(id, params, commonOpts);
+      }
     }
     return promise;
   }

core/src/components/router/router.tsx

@@ -72,34 +72,13 @@ export class Router {
     return this.writeNavStateRoot(path, direction);
   }
 
-  private onRedirectChanged() {
-    const path = this.getPath();
-    if (path && routeRedirect(path, readRedirects(this.el))) {
-      this.writeNavStateRoot(path, RouterDirection.None);
-    }
-  }
+  @Method()
+  push(url: string, direction = RouterDirection.Forward) {
+    const path = parsePath(url);
+    console.debug('[ion-router] URL pushed -> updating nav', url, direction);
 
-  private onRoutesChanged() {
-    return this.writeNavStateRoot(this.getPath(), RouterDirection.None);
-  }
-
-  private historyDirection() {
-    if (this.win.history.state === null) {
-      this.state++;
-      this.win.history.replaceState(this.state, this.win.document.title, this.win.document.location.href);
-    }
-
-    const state = this.win.history.state;
-    const lastState = this.lastState;
-    this.lastState = state;
-
-    if (state > lastState) {
-      return RouterDirection.Forward;
-    } else if (state < lastState) {
-      return RouterDirection.Back;
-    } else {
-      return RouterDirection.None;
-    }
+    this.setPath(path, direction);
+    return this.writeNavStateRoot(path, direction);
   }
 
   @Method()
@@ -136,14 +115,36 @@ export class Router {
     return true;
   }
 
-  @Method()
-  push(url: string, direction = RouterDirection.Forward) {
-    const path = parsePath(url);
-    console.debug('[ion-router] URL pushed -> updating nav', url, direction);
-
-    this.setPath(path, direction);
-    return this.writeNavStateRoot(path, direction);
+  private onRedirectChanged() {
+    const path = this.getPath();
+    if (path && routeRedirect(path, readRedirects(this.el))) {
+      this.writeNavStateRoot(path, RouterDirection.None);
     }
+  }
+
+  private onRoutesChanged() {
+    return this.writeNavStateRoot(this.getPath(), RouterDirection.None);
+  }
+
+  private historyDirection() {
+    if (this.win.history.state === null) {
+      this.state++;
+      this.win.history.replaceState(this.state, this.win.document.title, this.win.document.location.href);
+    }
+
+    const state = this.win.history.state;
+    const lastState = this.lastState;
+    this.lastState = state;
+
+    if (state > lastState) {
+      return RouterDirection.Forward;
+    } else if (state < lastState) {
+      return RouterDirection.Back;
+    } else {
+      return RouterDirection.None;
+    }
+  }
+
 
   private async writeNavStateRoot(path: string[]|null, direction: RouterDirection): Promise<boolean> {
     if (this.busy) {

core/src/utils/theme.ts

@@ -64,7 +64,7 @@ export function getClassMap(classes: string | string[] | undefined): CssClassMap
   return map;
 }
 
-export type RouterDirection = 'forward' | 'back';
+export type RouterDirection = 'forward' | 'back' | 'root';
 
 export async function openURL(win: Window, url: string|undefined, ev: Event, direction: RouterDirection = 'forward') {
   if (url && url[0] !== '#' && url.indexOf('://') === -1) {
@@ -72,8 +72,14 @@ export async function openURL(win: Window, url: string|undefined, ev: Event, dir
     if (router) {
       ev && ev.preventDefault();
       await router.componentOnReady();
-      return router.push(url, direction === 'back' ? -1 : 1);
+      return router.push(url, DIRECTION_MAP[direction]);
     }
   }
   return Promise.resolve();
 }
+
+const DIRECTION_MAP = {
+  'back': -1,
+  'root': 0,
+  'forward': 1
+};