@pod-os/elements 0.7.0 → 0.7.1-2196a40.0

package/dist/esm/ion-router.entry.js

@@ -1,15 +1,19 @@
-import { r as registerInstance, c as createEvent, a as getElement } from './index-e4deec27.js';
-import { a as componentOnReady, o as debounce } from './helpers-44e3bd9f.js';
+import { r as registerInstance, d as createEvent, c as getElement } from './index-cb938ffb.js';
+import { c as componentOnReady, p as debounce } from './helpers-aeff219b.js';
 
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
 const ROUTER_INTENT_NONE = 'root';
 const ROUTER_INTENT_FORWARD = 'forward';
 const ROUTER_INTENT_BACK = 'back';
 
-// Join the non empty segments with "/".
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
+/** Join the non empty segments with "/". */
 const generatePath = (segments) => {
-  const path = segments
-    .filter(s => s.length > 0)
-    .join('/');
+  const path = segments.filter((s) => s.length > 0).join('/');
   return '/' + path;
 };
 const generateUrl = (segments, useHash, queryString) => {
@@ -22,8 +26,8 @@ const generateUrl = (segments, useHash, queryString) => {
   }
   return url;
 };
-const writePath = (history, root, useHash, path, direction, state, queryString) => {
-  const url = generateUrl([...parsePath(root).segments, ...path], useHash, queryString);
+const writeSegments = (history, root, useHash, segments, direction, state, queryString) => {
+  const url = generateUrl([...parsePath(root).segments, ...segments], useHash, queryString);
   if (direction === ROUTER_INTENT_FORWARD) {
     history.pushState(state, '', url);
   }
@@ -31,67 +35,79 @@ const writePath = (history, root, useHash, path, direction, state, queryString)
     history.replaceState(state, '', url);
   }
 };
-const chainToPath = (chain) => {
-  const path = [];
+/**
+ * Transforms a chain to a list of segments.
+ *
+ * Notes:
+ * - parameter segments of the form :param are replaced with their value,
+ * - null is returned when a value is missing for any parameter segment.
+ */
+const chainToSegments = (chain) => {
+  const segments = [];
   for (const route of chain) {
-    for (const segment of route.path) {
+    for (const segment of route.segments) {
       if (segment[0] === ':') {
         const param = route.params && route.params[segment.slice(1)];
         if (!param) {
           return null;
         }
-        path.push(param);
+        segments.push(param);
       }
       else if (segment !== '') {
-        path.push(segment);
+        segments.push(segment);
       }
     }
   }
-  return path;
+  return segments;
 };
-// Remove the prefix segments from the path segments.
-//
-// Return:
-// - null when the path segments do not start with the passed prefix,
-// - the path segments after the prefix otherwise.
-const removePrefix = (prefix, path) => {
-  if (prefix.length > path.length) {
+/**
+ * Removes the prefix segments from the path segments.
+ *
+ * Return:
+ * - null when the path segments do not start with the passed prefix,
+ * - the path segments after the prefix otherwise.
+ */
+const removePrefix = (prefix, segments) => {
+  if (prefix.length > segments.length) {
     return null;
   }
   if (prefix.length <= 1 && prefix[0] === '') {
-    return path;
+    return segments;
   }
   for (let i = 0; i < prefix.length; i++) {
-    if (prefix[i] !== path[i]) {
+    if (prefix[i] !== segments[i]) {
       return null;
     }
   }
-  if (path.length === prefix.length) {
+  if (segments.length === prefix.length) {
     return [''];
   }
-  return path.slice(prefix.length);
+  return segments.slice(prefix.length);
 };
-const readPath = (loc, root, useHash) => {
+const readSegments = (loc, root, useHash) => {
   const prefix = parsePath(root).segments;
   const pathname = useHash ? loc.hash.slice(1) : loc.pathname;
-  const path = parsePath(pathname).segments;
-  return removePrefix(prefix, path);
+  const segments = parsePath(pathname).segments;
+  return removePrefix(prefix, segments);
 };
-// Parses the path to:
-// - segments an array of '/' separated parts,
-// - queryString (undefined when no query string).
+/**
+ * Parses the path to:
+ * - segments an array of '/' separated parts,
+ * - queryString (undefined when no query string).
+ */
 const parsePath = (path) => {
   let segments = [''];
   let queryString;
   if (path != null) {
     const qsStart = path.indexOf('?');
     if (qsStart > -1) {
-      queryString = path.substr(qsStart + 1);
-      path = path.substr(0, qsStart);
+      queryString = path.substring(qsStart + 1);
+      path = path.substring(0, qsStart);
     }
-    segments = path.split('/')
-      .map(s => s.trim())
-      .filter(s => s.length > 0);
+    segments = path
+      .split('/')
+      .map((s) => s.trim())
+      .filter((s) => s.length > 0);
     if (segments.length === 0) {
       segments = [''];
     }
@@ -99,13 +115,16 @@ const parsePath = (path) => {
   return { segments, queryString };
 };
 
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
 const printRoutes = (routes) => {
   console.group(`[ion-core] ROUTES[${routes.length}]`);
   for (const chain of routes) {
-    const path = [];
-    chain.forEach(r => path.push(...r.path));
-    const ids = chain.map(r => r.id);
-    console.debug(`%c ${generatePath(path)}`, 'font-weight: bold; padding-left: 20px', '=>\t', `(${ids.join(', ')})`);
+    const segments = [];
+    chain.forEach((r) => segments.push(...r.segments));
+    const ids = chain.map((r) => r.id);
+    console.debug(`%c ${generatePath(segments)}`, 'font-weight: bold; padding-left: 20px', '=>\t', `(${ids.join(', ')})`);
   }
   console.groupEnd();
 };
@@ -119,6 +138,17 @@ const printRedirects = (redirects) => {
   console.groupEnd();
 };
 
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
+/**
+ * Activates the passed route chain.
+ *
+ * There must be exactly one outlet per route entry in the chain.
+ *
+ * The methods calls setRouteId on each of the outlet with the corresponding route entry in the chain.
+ * setRouteId will create or select the view in the outlet.
+ */
 const writeNavState = async (root, chain, direction, index, changed = false, animation) => {
   try {
     // find next navigation outlet in the DOM
@@ -127,7 +157,7 @@ const writeNavState = async (root, chain, direction, index, changed = false, ani
     if (index >= chain.length || !outlet) {
       return changed;
     }
-    await new Promise(resolve => componentOnReady(outlet, resolve));
+    await new Promise((resolve) => componentOnReady(outlet, resolve));
     const route = chain[index];
     const result = await outlet.setRouteId(route.id, route.params, direction, animation);
     // if the outlet changed the page, reset navigation to neutral (no direction)
@@ -150,23 +180,22 @@ const writeNavState = async (root, chain, direction, index, changed = false, ani
     return false;
   }
 };
+/**
+ * Recursively walks the outlet in the DOM.
+ *
+ * The function returns a list of RouteID corresponding to each of the outlet and the last outlet without a RouteID.
+ */
 const readNavState = async (root) => {
   const ids = [];
   let outlet;
   let node = root;
-  // tslint:disable-next-line:no-constant-condition
-  while (true) {
-    outlet = searchNavNode(node);
-    if (outlet) {
-      const id = await outlet.getRouteId();
-      if (id) {
-        node = id.element;
-        id.element = undefined;
-        ids.push(id);
-      }
-      else {
-        break;
-      }
+  // eslint-disable-next-line no-cond-assign
+  while ((outlet = searchNavNode(node))) {
+    const id = await outlet.getRouteId();
+    if (id) {
+      node = id.element;
+      id.element = undefined;
+      ids.push(id);
     }
     else {
       break;
@@ -178,33 +207,39 @@ const waitUntilNavNode = () => {
   if (searchNavNode(document.body)) {
     return Promise.resolve();
   }
-  return new Promise(resolve => {
-    window.addEventListener('ionNavWillLoad', resolve, { once: true });
+  return new Promise((resolve) => {
+    window.addEventListener('ionNavWillLoad', () => resolve(), { once: true });
   });
 };
-const QUERY = ':not([no-router]) ion-nav, :not([no-router]) ion-tabs, :not([no-router]) ion-router-outlet';
+/** Selector for all the outlets supported by the router. */
+const OUTLET_SELECTOR = ':not([no-router]) ion-nav, :not([no-router]) ion-tabs, :not([no-router]) ion-router-outlet';
 const searchNavNode = (root) => {
   if (!root) {
     return undefined;
   }
-  if (root.matches(QUERY)) {
+  if (root.matches(OUTLET_SELECTOR)) {
     return root;
   }
-  const outlet = root.querySelector(QUERY);
+  const outlet = root.querySelector(OUTLET_SELECTOR);
   return outlet !== null && outlet !== void 0 ? outlet : undefined;
 };
 
-// Returns whether the given redirect matches the given path segments.
-//
-// A redirect matches when the segments of the path and redirect.from are equal.
-// Note that segments are only checked until redirect.from contains a '*' which matches any path segment.
-// The path ['some', 'path', 'to', 'page'] matches both ['some', 'path', 'to', 'page'] and ['some', 'path', '*'].
-const matchesRedirect = (path, redirect) => {
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
+/**
+ * Returns whether the given redirect matches the given path segments.
+ *
+ * A redirect matches when the segments of the path and redirect.from are equal.
+ * Note that segments are only checked until redirect.from contains a '*' which matches any path segment.
+ * The path ['some', 'path', 'to', 'page'] matches both ['some', 'path', 'to', 'page'] and ['some', 'path', '*'].
+ */
+const matchesRedirect = (segments, redirect) => {
   const { from, to } = redirect;
   if (to === undefined) {
     return false;
   }
-  if (from.length > path.length) {
+  if (from.length > segments.length) {
     return false;
   }
   for (let i = 0; i < from.length; i++) {
@@ -212,15 +247,15 @@ const matchesRedirect = (path, redirect) => {
     if (expected === '*') {
       return true;
     }
-    if (expected !== path[i]) {
+    if (expected !== segments[i]) {
       return false;
     }
   }
-  return from.length === path.length;
+  return from.length === segments.length;
 };
-// Returns the first redirect matching the path segments or undefined when no match found.
-const findRouteRedirect = (path, redirects) => {
-  return redirects.find(redirect => matchesRedirect(path, redirect));
+/** Returns the first redirect matching the path segments or undefined when no match found. */
+const findRouteRedirect = (segments, redirects) => {
+  return redirects.find((redirect) => matchesRedirect(segments, redirect));
 };
 const matchesIDs = (ids, chain) => {
   const len = Math.min(ids.length, chain.length);
@@ -234,33 +269,30 @@ const matchesIDs = (ids, chain) => {
     }
     if (routeId.params) {
       const routeIdParams = Object.keys(routeId.params);
-      /**
-       * Only compare routes with the chain that have the same number of parameters.
-       */
-      if (routeIdParams.length === routeChain.path.length) {
-        /**
-         * Maps the route's params into a path based on the path variable names,
-         * to compare against the route chain format.
-         *
-         * Before:
-         * ```ts
-         * {
-         *  params: {
-         *    s1: 'a',
-         *    s2: 'b'
-         *  }
-         * }
-         * ```
-         *
-         * After:
-         * ```ts
-         * [':s1',':s2']
-         * ```
-         */
-        const pathWithParams = routeIdParams.map(key => `:${key}`);
+      // Only compare routes with the chain that have the same number of parameters.
+      if (routeIdParams.length === routeChain.segments.length) {
+        // Maps the route's params into a path based on the path variable names,
+        // to compare against the route chain format.
+        //
+        // Before:
+        // ```ts
+        // {
+        //  params: {
+        //    s1: 'a',
+        //    s2: 'b'
+        //  }
+        // }
+        // ```
+        //
+        // After:
+        // ```ts
+        // [':s1',':s2']
+        // ```
+        //
+        const pathWithParams = routeIdParams.map((key) => `:${key}`);
         for (let j = 0; j < pathWithParams.length; j++) {
           // Skip results where the path variable is not a match
-          if (pathWithParams[j].toLowerCase() !== routeChain.path[j]) {
+          if (pathWithParams[j].toLowerCase() !== routeChain.segments[j]) {
             break;
           }
           // Weight path matches for the same index higher.
@@ -273,18 +305,25 @@ const matchesIDs = (ids, chain) => {
   }
   return score;
 };
-const matchesPath = (inputPath, chain) => {
-  const segments = new RouterSegments(inputPath);
+/**
+ * Matches the segments against the chain.
+ *
+ * Returns:
+ * - null when there is no match,
+ * - a chain with the params properties updated with the parameter segments on match.
+ */
+const matchesSegments = (segments, chain) => {
+  const inputSegments = new RouterSegments(segments);
   let matchesDefault = false;
   let allparams;
   for (let i = 0; i < chain.length; i++) {
-    const path = chain[i].path;
-    if (path[0] === '') {
+    const chainSegments = chain[i].segments;
+    if (chainSegments[0] === '') {
       matchesDefault = true;
     }
     else {
-      for (const segment of path) {
-        const data = segments.next();
+      for (const segment of chainSegments) {
+        const data = inputSegments.next();
         // data param
         if (segment[0] === ':') {
           if (data === '') {
@@ -301,29 +340,36 @@ const matchesPath = (inputPath, chain) => {
       matchesDefault = false;
     }
   }
-  const matches = (matchesDefault)
-    ? matchesDefault === (segments.next() === '')
-    : true;
+  const matches = matchesDefault ? matchesDefault === (inputSegments.next() === '') : true;
   if (!matches) {
     return null;
   }
   if (allparams) {
     return chain.map((route, i) => ({
       id: route.id,
-      path: route.path,
+      segments: route.segments,
       params: mergeParams(route.params, allparams[i]),
       beforeEnter: route.beforeEnter,
-      beforeLeave: route.beforeLeave
+      beforeLeave: route.beforeLeave,
     }));
   }
   return chain;
 };
-// Merges the route parameter objects.
-// Returns undefined when both parameters are undefined.
+/**
+ * Merges the route parameter objects.
+ * Returns undefined when both parameters are undefined.
+ */
 const mergeParams = (a, b) => {
   return a || b ? Object.assign(Object.assign({}, a), b) : undefined;
 };
-const routerIDsToChain = (ids, chains) => {
+/**
+ * Finds the best match for the ids in the chains.
+ *
+ * Returns the best match or null when no match is found.
+ * When a chain is returned the parameters are updated from the RouteIDs.
+ * That is they contain both the componentProps of the <ion-route> and the parameter segment.
+ */
+const findChainForIDs = (ids, chains) => {
   let match = null;
   let maxMatches = 0;
   for (const chain of chains) {
@@ -334,38 +380,59 @@ const routerIDsToChain = (ids, chains) => {
     }
   }
   if (match) {
-    return match.map((route, i) => ({
-      id: route.id,
-      path: route.path,
-      params: mergeParams(route.params, ids[i] && ids[i].params)
-    }));
+    return match.map((route, i) => {
+      var _a;
+      return ({
+        id: route.id,
+        segments: route.segments,
+        params: mergeParams(route.params, (_a = ids[i]) === null || _a === void 0 ? void 0 : _a.params),
+      });
+    });
   }
   return null;
 };
-const routerPathToChain = (path, chains) => {
+/**
+ * Finds the best match for the segments in the chains.
+ *
+ * Returns the best match or null when no match is found.
+ * When a chain is returned the parameters are updated from the segments.
+ * That is they contain both the componentProps of the <ion-route> and the parameter segments.
+ */
+const findChainForSegments = (segments, chains) => {
   let match = null;
-  let matches = 0;
+  let bestScore = 0;
   for (const chain of chains) {
-    const matchedChain = matchesPath(path, chain);
+    const matchedChain = matchesSegments(segments, chain);
     if (matchedChain !== null) {
       const score = computePriority(matchedChain);
-      if (score > matches) {
-        matches = score;
+      if (score > bestScore) {
+        bestScore = score;
         match = matchedChain;
       }
     }
   }
   return match;
 };
+/**
+ * Computes the priority of a chain.
+ *
+ * Parameter segments are given a lower priority over fixed segments.
+ *
+ * Considering the following 2 chains matching the path /path/to/page:
+ * - /path/to/:where
+ * - /path/to/page
+ *
+ * The second one will be given a higher priority because "page" is a fixed segment (vs ":where", a parameter segment).
+ */
 const computePriority = (chain) => {
   let score = 1;
   let level = 1;
   for (const route of chain) {
-    for (const path of route.path) {
-      if (path[0] === ':') {
+    for (const segment of route.segments) {
+      if (segment[0] === ':') {
         score += Math.pow(1, level);
       }
-      else if (path !== '') {
+      else if (segment !== '') {
         score += Math.pow(2, level);
       }
       level++;
@@ -374,17 +441,20 @@ const computePriority = (chain) => {
   return score;
 };
 class RouterSegments {
-  constructor(path) {
-    this.path = path.slice();
+  constructor(segments) {
+    this.segments = segments.slice();
   }
   next() {
-    if (this.path.length > 0) {
-      return this.path.shift();
+    if (this.segments.length > 0) {
+      return this.segments.shift();
     }
     return '';
   }
 }
 
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
 const readProp = (el, prop) => {
   if (prop in el) {
     return el[prop];
@@ -394,10 +464,15 @@ const readProp = (el, prop) => {
   }
   return null;
 };
+/**
+ * Extracts the redirects (that is <ion-route-redirect> elements inside the root).
+ *
+ * The redirects are returned as a list of RouteRedirect.
+ */
 const readRedirects = (root) => {
   return Array.from(root.children)
-    .filter(el => el.tagName === 'ION-ROUTE-REDIRECT')
-    .map(el => {
+    .filter((el) => el.tagName === 'ION-ROUTE-REDIRECT')
+    .map((el) => {
     const to = readProp(el, 'to');
     return {
       from: parsePath(readProp(el, 'from')).segments,
@@ -405,24 +480,39 @@ const readRedirects = (root) => {
     };
   });
 };
+/**
+ * Extracts all the routes (that is <ion-route> elements inside the root).
+ *
+ * The routes are returned as a list of chains - the flattened tree.
+ */
 const readRoutes = (root) => {
   return flattenRouterTree(readRouteNodes(root));
 };
+/**
+ * Reads the route nodes as a tree modeled after the DOM tree of <ion-route> elements.
+ *
+ * Note: routes without a component are ignored together with their children.
+ */
 const readRouteNodes = (node) => {
   return Array.from(node.children)
-    .filter(el => el.tagName === 'ION-ROUTE' && el.component)
-    .map(el => {
+    .filter((el) => el.tagName === 'ION-ROUTE' && el.component)
+    .map((el) => {
     const component = readProp(el, 'component');
     return {
-      path: parsePath(readProp(el, 'url')).segments,
+      segments: parsePath(readProp(el, 'url')).segments,
       id: component.toLowerCase(),
       params: el.componentProps,
       beforeLeave: el.beforeLeave,
       beforeEnter: el.beforeEnter,
-      children: readRouteNodes(el)
+      children: readRouteNodes(el),
     };
   });
 };
+/**
+ * Flattens a RouterTree in a list of chains.
+ *
+ * Each chain represents a path from the root node to a terminal node.
+ */
 const flattenRouterTree = (nodes) => {
   const chains = [];
   for (const node of nodes) {
@@ -430,15 +520,18 @@ const flattenRouterTree = (nodes) => {
   }
   return chains;
 };
+/** Flattens a route node recursively and push each branch to the chains list. */
 const flattenNode = (chain, chains, node) => {
-  chain = chain.slice();
-  chain.push({
-    id: node.id,
-    path: node.path,
-    params: node.params,
-    beforeLeave: node.beforeLeave,
-    beforeEnter: node.beforeEnter
-  });
+  chain = [
+    ...chain,
+    {
+      id: node.id,
+      segments: node.segments,
+      params: node.params,
+      beforeLeave: node.beforeLeave,
+      beforeEnter: node.beforeEnter,
+    },
+  ];
   if (node.children.length === 0) {
     chains.push(chain);
     return;
@@ -480,12 +573,12 @@ const Router = class {
   }
   async componentWillLoad() {
     await waitUntilNavNode();
-    const canProceed = await this.runGuards(this.getPath());
+    const canProceed = await this.runGuards(this.getSegments());
     if (canProceed !== true) {
       if (typeof canProceed === 'object') {
         const { redirect } = canProceed;
         const path = parsePath(redirect);
-        this.setPath(path.segments, ROUTER_INTENT_NONE, path.queryString);
+        this.setSegments(path.segments, ROUTER_INTENT_NONE, path.queryString);
         await this.writeNavStateRoot(path.segments, ROUTER_INTENT_NONE);
       }
     }
@@ -499,7 +592,7 @@ const Router = class {
   }
   async onPopState() {
     const direction = this.historyDirection();
-    let segments = this.getPath();
+    let segments = this.getSegments();
     const canProceed = await this.runGuards(segments);
     if (canProceed !== true) {
       if (typeof canProceed === 'object') {
@@ -512,7 +605,7 @@ const Router = class {
     return this.writeNavStateRoot(segments, direction);
   }
   onBackButton(ev) {
-    ev.detail.register(0, processNextHandler => {
+    ev.detail.register(0, (processNextHandler) => {
       this.back();
       processNextHandler();
     });
@@ -531,16 +624,20 @@ const Router = class {
     return true;
   }
   /**
-   * Navigate to the specified URL.
+   * Navigate to the specified path.
    *
-   * @param url The url to navigate to.
+   * @param path The path to navigate to.
    * @param direction The direction of the animation. Defaults to `"forward"`.
    */
-  async push(url, direction = 'forward', animation) {
-    if (url.startsWith('.')) {
-      url = (new URL(url, window.location.href)).pathname;
+  async push(path, direction = 'forward', animation) {
+    var _a;
+    if (path.startsWith('.')) {
+      const currentPath = (_a = this.previousPath) !== null && _a !== void 0 ? _a : '/';
+      // Convert currentPath to an URL by pre-pending a protocol and a host to resolve the relative path.
+      const url = new URL(path, `https://host/${currentPath}`);
+      path = url.pathname + url.search;
     }
-    let parsedPath = parsePath(url);
+    let parsedPath = parsePath(path);
     const canProceed = await this.runGuards(parsedPath.segments);
     if (canProceed !== true) {
       if (typeof canProceed === 'object') {
@@ -550,12 +647,10 @@ const Router = class {
         return false;
       }
     }
-    this.setPath(parsedPath.segments, direction, parsedPath.queryString);
+    this.setSegments(parsedPath.segments, direction, parsedPath.queryString);
     return this.writeNavStateRoot(parsedPath.segments, direction, animation);
   }
-  /**
-   * Go back to previous page in the window.history.
-   */
+  /** Go back to previous page in the window.history. */
   back() {
     window.history.back();
     return Promise.resolve(this.waitPromise);
@@ -573,30 +668,30 @@ const Router = class {
     }
     const { ids, outlet } = await readNavState(window.document.body);
     const routes = readRoutes(this.el);
-    const chain = routerIDsToChain(ids, routes);
+    const chain = findChainForIDs(ids, routes);
     if (!chain) {
-      console.warn('[ion-router] no matching URL for ', ids.map(i => i.id));
+      console.warn('[ion-router] no matching URL for ', ids.map((i) => i.id));
       return false;
     }
-    const path = chainToPath(chain);
-    if (!path) {
+    const segments = chainToSegments(chain);
+    if (!segments) {
       console.warn('[ion-router] router could not match path because some required param is missing');
       return false;
     }
-    this.setPath(path, direction);
-    await this.safeWriteNavState(outlet, chain, ROUTER_INTENT_NONE, path, null, ids.length);
+    this.setSegments(segments, direction);
+    await this.safeWriteNavState(outlet, chain, ROUTER_INTENT_NONE, segments, null, ids.length);
     return true;
   }
-  // This handler gets called when a `ion-route-redirect` component is added to the DOM or if the from or to property of such node changes.
+  /** This handler gets called when a `ion-route-redirect` component is added to the DOM or if the from or to property of such node changes. */
   onRedirectChanged() {
-    const path = this.getPath();
-    if (path && findRouteRedirect(path, readRedirects(this.el))) {
-      this.writeNavStateRoot(path, ROUTER_INTENT_NONE);
+    const segments = this.getSegments();
+    if (segments && findRouteRedirect(segments, readRedirects(this.el))) {
+      this.writeNavStateRoot(segments, ROUTER_INTENT_NONE);
     }
   }
-  // This handler gets called when a `ion-route` component is added to the DOM or if the from or to property of such node changes.
+  /** This handler gets called when a `ion-route` component is added to the DOM or if the from or to property of such node changes. */
   onRoutesChanged() {
-    return this.writeNavStateRoot(this.getPath(), ROUTER_INTENT_NONE);
+    return this.writeNavStateRoot(this.getSegments(), ROUTER_INTENT_NONE);
   }
   historyDirection() {
     var _a;
@@ -616,36 +711,36 @@ const Router = class {
     }
     return ROUTER_INTENT_NONE;
   }
-  async writeNavStateRoot(path, direction, animation) {
-    if (!path) {
+  async writeNavStateRoot(segments, direction, animation) {
+    if (!segments) {
       console.error('[ion-router] URL is not part of the routing set');
       return false;
     }
     // lookup redirect rule
     const redirects = readRedirects(this.el);
-    const redirect = findRouteRedirect(path, redirects);
+    const redirect = findRouteRedirect(segments, redirects);
     let redirectFrom = null;
     if (redirect) {
-      const { segments, queryString } = redirect.to;
-      this.setPath(segments, direction, queryString);
+      const { segments: toSegments, queryString } = redirect.to;
+      this.setSegments(toSegments, direction, queryString);
       redirectFrom = redirect.from;
-      path = segments;
+      segments = toSegments;
     }
     // lookup route chain
     const routes = readRoutes(this.el);
-    const chain = routerPathToChain(path, routes);
+    const chain = findChainForSegments(segments, routes);
     if (!chain) {
       console.error('[ion-router] the path does not match any route');
       return false;
     }
     // write DOM give
-    return this.safeWriteNavState(document.body, chain, direction, path, redirectFrom, 0, animation);
+    return this.safeWriteNavState(document.body, chain, direction, segments, redirectFrom, 0, animation);
   }
-  async safeWriteNavState(node, chain, direction, path, redirectFrom, index = 0, animation) {
+  async safeWriteNavState(node, chain, direction, segments, redirectFrom, index = 0, animation) {
     const unlock = await this.lock();
     let changed = false;
     try {
-      changed = await this.writeNavState(node, chain, direction, path, redirectFrom, index, animation);
+      changed = await this.writeNavState(node, chain, direction, segments, redirectFrom, index, animation);
     }
     catch (e) {
       console.error(e);
@@ -656,17 +751,19 @@ const Router = class {
   async lock() {
     const p = this.waitPromise;
     let resolve;
-    this.waitPromise = new Promise(r => resolve = r);
+    this.waitPromise = new Promise((r) => (resolve = r));
     if (p !== undefined) {
       await p;
     }
     return resolve;
   }
-  // Executes the beforeLeave hook of the source route and the beforeEnter hook of the target route if they exist.
-  //
-  // When the beforeLeave hook does not return true (to allow navigating) then that value is returned early and the beforeEnter is executed.
-  // Otherwise the beforeEnterHook hook of the target route is executed.
-  async runGuards(to = this.getPath(), from) {
+  /**
+   * Executes the beforeLeave hook of the source route and the beforeEnter hook of the target route if they exist.
+   *
+   * When the beforeLeave hook does not return true (to allow navigating) then that value is returned early and the beforeEnter is executed.
+   * Otherwise the beforeEnterHook hook of the target route is executed.
+   */
+  async runGuards(to = this.getSegments(), from) {
     if (from === undefined) {
       from = parsePath(this.previousPath).segments;
     }
@@ -674,24 +771,24 @@ const Router = class {
       return true;
     }
     const routes = readRoutes(this.el);
-    const fromChain = routerPathToChain(from, routes);
+    const fromChain = findChainForSegments(from, routes);
     const beforeLeaveHook = fromChain && fromChain[fromChain.length - 1].beforeLeave;
     const canLeave = beforeLeaveHook ? await beforeLeaveHook() : true;
     if (canLeave === false || typeof canLeave === 'object') {
       return canLeave;
     }
-    const toChain = routerPathToChain(to, routes);
+    const toChain = findChainForSegments(to, routes);
     const beforeEnterHook = toChain && toChain[toChain.length - 1].beforeEnter;
     return beforeEnterHook ? beforeEnterHook() : true;
   }
-  async writeNavState(node, chain, direction, path, redirectFrom, index = 0, animation) {
+  async writeNavState(node, chain, direction, segments, redirectFrom, index = 0, animation) {
     if (this.busy) {
       console.warn('[ion-router] router is busy, transition was cancelled');
       return false;
     }
     this.busy = true;
     // generate route event and emit will change
-    const routeEvent = this.routeChangeEvent(path, redirectFrom);
+    const routeEvent = this.routeChangeEvent(segments, redirectFrom);
     if (routeEvent) {
       this.ionRouteWillChange.emit(routeEvent);
     }
@@ -703,21 +800,21 @@ const Router = class {
     }
     return changed;
   }
-  setPath(path, direction, queryString) {
+  setSegments(segments, direction, queryString) {
     this.state++;
-    writePath(window.history, this.root, this.useHash, path, direction, this.state, queryString);
+    writeSegments(window.history, this.root, this.useHash, segments, direction, this.state, queryString);
   }
-  getPath() {
-    return readPath(window.location, this.root, this.useHash);
+  getSegments() {
+    return readSegments(window.location, this.root, this.useHash);
   }
-  routeChangeEvent(path, redirectFromPath) {
+  routeChangeEvent(toSegments, redirectFromSegments) {
     const from = this.previousPath;
-    const to = generatePath(path);
+    const to = generatePath(toSegments);
     this.previousPath = to;
     if (to === from) {
       return null;
     }
-    const redirectedFrom = redirectFromPath ? generatePath(redirectFromPath) : null;
+    const redirectedFrom = redirectFromSegments ? generatePath(redirectFromSegments) : null;
     return {
       from,
       redirectedFrom,