@pod-os/elements 0.7.1-92705ee.0 → 0.7.1-a71f01c.0

package/dist/cjs/ion-nav.cjs.entry.js

@@ -2,13 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-b4a9ece2.js');
-const ionicGlobal = require('./ionic-global-56e10eb5.js');
-const cubicBezier = require('./cubic-bezier-dcb7bfef.js');
-const helpers = require('./helpers-398ced09.js');
-const index$1 = require('./index-2067b305.js');
-const frameworkDelegate = require('./framework-delegate-c45292a3.js');
+const index = require('./index-eaa0d16e.js');
+const ionicGlobal = require('./ionic-global-f2d95fd3.js');
+const cubicBezier = require('./cubic-bezier-0b702a31.js');
+const helpers = require('./helpers-cb08f5ae.js');
+const index$1 = require('./index-1b07c737.js');
+const frameworkDelegate = require('./framework-delegate-437c0645.js');
 
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
 const VIEW_STATE_NEW = 1;
 const VIEW_STATE_ATTACHED = 2;
 const VIEW_STATE_DESTROYED = 3;
@@ -50,28 +53,7 @@ const matches = (view, id, params) => {
   if (view.component !== id) {
     return false;
   }
-  const currentParams = view.params;
-  if (currentParams === params) {
-    return true;
-  }
-  if (!currentParams && !params) {
-    return true;
-  }
-  if (!currentParams || !params) {
-    return false;
-  }
-  const keysA = Object.keys(currentParams);
-  const keysB = Object.keys(params);
-  if (keysA.length !== keysB.length) {
-    return false;
-  }
-  // Test for A's keys different from B.
-  for (const key of keysA) {
-    if (currentParams[key] !== params[key]) {
-      return false;
-    }
-  }
-  return true;
+  return helpers.shallowEqualStringMap(view.params, params);
 };
 const convertToView = (page, params) => {
   if (!page) {
@@ -83,22 +65,17 @@ const convertToView = (page, params) => {
   return new ViewController(page, params);
 };
 const convertToViews = (pages) => {
-  return pages.map(page => {
+  return pages
+    .map((page) => {
     if (page instanceof ViewController) {
       return page;
     }
     if ('component' in page) {
-      /**
-       * TODO Ionic 6:
-       * Consider switching to just using `undefined` here
-       * as well as on the public interfaces and on
-       * `NavComponentWithProps`. Previously `pages` was
-       * of type `any[]` so TypeScript did not catch this.
-       */
-      return convertToView(page.component, (page.componentProps === null) ? undefined : page.componentProps);
+      return convertToView(page.component, page.componentProps === null ? undefined : page.componentProps);
     }
     return convertToView(page, undefined);
-  }).filter(v => v !== null);
+  })
+    .filter((v) => v !== null);
 };
 
 const navCss = ":host{left:0;right:0;top:0;bottom:0;position:absolute;contain:layout size style;overflow:hidden;z-index:0}";
@@ -133,9 +110,7 @@ const Nav = class {
     }
   }
   componentWillLoad() {
-    this.useRouter =
-      !!document.querySelector('ion-router') &&
-        !this.el.closest('[no-router]');
+    this.useRouter = document.querySelector('ion-router') !== null && this.el.closest('[no-router]') === null;
     if (this.swipeGesture === undefined) {
       const mode = ionicGlobal.getIonMode(this);
       this.swipeGesture = ionicGlobal.config.getBoolean('swipeBackEnabled', mode === 'ios');
@@ -144,20 +119,24 @@ const Nav = class {
   }
   async componentDidLoad() {
     this.rootChanged();
-    this.gesture = (await Promise.resolve().then(function () { return require('./swipe-back-c4a778df.js'); })).createSwipeBackGesture(this.el, this.canStart.bind(this), this.onStart.bind(this), this.onMove.bind(this), this.onEnd.bind(this));
+    this.gesture = (await Promise.resolve().then(function () { return require('./swipe-back-666ea8e6.js'); })).createSwipeBackGesture(this.el, this.canStart.bind(this), this.onStart.bind(this), this.onMove.bind(this), this.onEnd.bind(this));
     this.swipeGestureChanged();
   }
+  connectedCallback() {
+    this.destroyed = false;
+  }
   disconnectedCallback() {
     for (const view of this.views) {
       index$1.lifecycle(view.element, index$1.LIFECYCLE_WILL_UNLOAD);
       view._destroy();
     }
+    // Release swipe back gesture and transition.
     if (this.gesture) {
       this.gesture.destroy();
       this.gesture = undefined;
     }
-    // release swipe back gesture and transition
-    this.transInstr.length = this.views.length = 0;
+    this.transInstr.length = 0;
+    this.views.length = 0;
     this.destroyed = true;
   }
   /**
@@ -171,11 +150,7 @@ const Nav = class {
    * @param done The transition complete function.
    */
   push(component, componentProps, opts, done) {
-    return this.queueTrns({
-      insertStart: -1,
-      insertViews: [{ component, componentProps }],
-      opts
-    }, done);
+    return this.insert(-1, component, componentProps, opts, done);
   }
   /**
    * Inserts a component into the navigation stack at the specified index.
@@ -188,11 +163,7 @@ const Nav = class {
    * @param done The transition complete function.
    */
   insert(insertIndex, component, componentProps, opts, done) {
-    return this.queueTrns({
-      insertStart: insertIndex,
-      insertViews: [{ component, componentProps }],
-      opts
-    }, done);
+    return this.insertPages(insertIndex, [{ component, componentProps }], opts, done);
   }
   /**
    * Inserts an array of components into the navigation stack at the specified index.
@@ -208,7 +179,7 @@ const Nav = class {
     return this.queueTrns({
       insertStart: insertIndex,
       insertViews: insertComponents,
-      opts
+      opts,
     }, done);
   }
   /**
@@ -219,11 +190,7 @@ const Nav = class {
    * @param done The transition complete function.
    */
   pop(opts, done) {
-    return this.queueTrns({
-      removeStart: -1,
-      removeCount: 1,
-      opts
-    }, done);
+    return this.removeIndex(-1, 1, opts, done);
   }
   /**
    * Pop to a specific index in the navigation stack.
@@ -233,19 +200,19 @@ const Nav = class {
    * @param done The transition complete function.
    */
   popTo(indexOrViewCtrl, opts, done) {
-    const tiConfig = {
+    const ti = {
       removeStart: -1,
       removeCount: -1,
-      opts
+      opts,
     };
     if (typeof indexOrViewCtrl === 'object' && indexOrViewCtrl.component) {
-      tiConfig.removeView = indexOrViewCtrl;
-      tiConfig.removeStart = 1;
+      ti.removeView = indexOrViewCtrl;
+      ti.removeStart = 1;
     }
     else if (typeof indexOrViewCtrl === 'number') {
-      tiConfig.removeStart = indexOrViewCtrl + 1;
+      ti.removeStart = indexOrViewCtrl + 1;
     }
-    return this.queueTrns(tiConfig, done);
+    return this.queueTrns(ti, done);
   }
   /**
    * Navigate back to the root of the stack, no matter how far back that is.
@@ -254,11 +221,7 @@ const Nav = class {
    * @param done The transition complete function.
    */
   popToRoot(opts, done) {
-    return this.queueTrns({
-      removeStart: 1,
-      removeCount: -1,
-      opts
-    }, done);
+    return this.removeIndex(1, -1, opts, done);
   }
   /**
    * Removes a component from the navigation stack at the specified index.
@@ -272,7 +235,7 @@ const Nav = class {
     return this.queueTrns({
       removeStart: startIndex,
       removeCount,
-      opts
+      opts,
     }, done);
   }
   /**
@@ -297,9 +260,7 @@ const Nav = class {
    * @param done The transition complete function.
    */
   setPages(views, opts, done) {
-    if (opts == null) {
-      opts = {};
-    }
+    opts !== null && opts !== void 0 ? opts : (opts = {});
     // if animation wasn't set to true then default it to NOT animate
     if (opts.animated !== true) {
       opts.animated = false;
@@ -309,42 +270,53 @@ const Nav = class {
       insertViews: views,
       removeStart: 0,
       removeCount: -1,
-      opts
+      opts,
     }, done);
   }
-  /** @internal */
+  /**
+   * Called by the router to update the view.
+   *
+   * @param id The component tag.
+   * @param params The component params.
+   * @param direction A direction hint.
+   * @param animation an AnimationBuilder.
+   *
+   * @return the status.
+   * @internal
+   */
   setRouteId(id, params, direction, animation) {
     const active = this.getActiveSync();
     if (matches(active, id, params)) {
       return Promise.resolve({
         changed: false,
-        element: active.element
+        element: active.element,
       });
     }
     let resolve;
-    const promise = new Promise(r => (resolve = r));
+    const promise = new Promise((r) => (resolve = r));
     let finish;
     const commonOpts = {
       updateURL: false,
-      viewIsReady: enteringEl => {
+      viewIsReady: (enteringEl) => {
         let mark;
-        const p = new Promise(r => (mark = r));
+        const p = new Promise((r) => (mark = r));
         resolve({
           changed: true,
           element: enteringEl,
           markVisible: async () => {
             mark();
             await finish;
-          }
+          },
         });
         return p;
-      }
+      },
     };
     if (direction === 'root') {
       finish = this.setRoot(id, params, commonOpts);
     }
     else {
-      const viewController = this.views.find(v => matches(v, id, params));
+      // Look for a view matching the target in the view stack.
+      const viewController = this.views.find((v) => matches(v, id, params));
       if (viewController) {
         finish = this.popTo(viewController, Object.assign(Object.assign({}, commonOpts), { direction: 'back', animationBuilder: animation }));
       }
@@ -357,46 +329,51 @@ const Nav = class {
     }
     return promise;
   }
-  /** @internal */
+  /**
+   * Called by <ion-router> to retrieve the current component.
+   *
+   * @internal
+   */
   async getRouteId() {
     const active = this.getActiveSync();
-    return active
-      ? {
+    if (active) {
+      return {
         id: active.element.tagName,
         params: active.params,
-        element: active.element
-      }
-      : undefined;
+        element: active.element,
+      };
+    }
+    return undefined;
   }
   /**
    * Get the active view.
    */
-  getActive() {
-    return Promise.resolve(this.getActiveSync());
+  async getActive() {
+    return this.getActiveSync();
   }
   /**
    * Get the view at the specified index.
    *
    * @param index The index of the view.
    */
-  getByIndex(index) {
-    return Promise.resolve(this.views[index]);
+  async getByIndex(index) {
+    return this.views[index];
   }
   /**
    * Returns `true` if the current view can go back.
    *
    * @param view The view to check.
    */
-  canGoBack(view) {
-    return Promise.resolve(this.canGoBackSync(view));
+  async canGoBack(view) {
+    return this.canGoBackSync(view);
   }
   /**
    * Get the previous view.
    *
    * @param view The view to get.
    */
-  getPrevious(view) {
-    return Promise.resolve(this.getPreviousSync(view));
+  async getPrevious(view) {
+    return this.getPreviousSync(view);
   }
   getLength() {
     return this.views.length;
@@ -415,19 +392,15 @@ const Nav = class {
     const index = views.indexOf(view);
     return index > 0 ? views[index - 1] : undefined;
   }
-  // _queueTrns() adds a navigation stack change to the queue and schedules it to run:
-  // 1. _nextTrns(): consumes the next transition in the queue
-  // 2. _viewInit(): initializes enteringView if required
-  // 3. _viewTest(): ensures canLeave/canEnter Returns `true`, so the operation can continue
-  // 4. _postViewInit(): add/remove the views from the navigation stack
-  // 5. _transitionInit(): initializes the visual transition if required and schedules it to run
-  // 6. _viewAttachToDOM(): attaches the enteringView to the DOM
-  // 7. _transitionStart(): called once the transition actually starts, it initializes the Animation underneath.
-  // 8. _transitionFinish(): called once the transition finishes
-  // 9. _cleanup(): syncs the navigation internal state with the DOM. For example it removes the pages from the DOM or hides/show them.
+  /**
+   * Adds a navigation stack change to the queue and schedules it to run.
+   *
+   * @returns Whether the transition succeeds.
+   */
   async queueTrns(ti, done) {
-    if (this.isTransitioning && ti.opts != null && ti.opts.skipIfBusy) {
-      return Promise.resolve(false);
+    var _a, _b;
+    if (this.isTransitioning && ((_a = ti.opts) === null || _a === void 0 ? void 0 : _a.skipIfBusy)) {
+      return false;
     }
     const promise = new Promise((resolve, reject) => {
       ti.resolve = resolve;
@@ -445,16 +418,16 @@ const Nav = class {
       if (router) {
         const canTransition = await router.canTransition();
         if (canTransition === false) {
-          return Promise.resolve(false);
+          return false;
         }
-        else if (typeof canTransition === 'string') {
+        if (typeof canTransition === 'string') {
           router.push(canTransition, ti.opts.direction || 'back');
-          return Promise.resolve(false);
+          return false;
         }
       }
     }
     // Normalize empty
-    if (ti.insertViews && ti.insertViews.length === 0) {
+    if (((_b = ti.insertViews) === null || _b === void 0 ? void 0 : _b.length) === 0) {
       ti.insertViews = undefined;
     }
     // Enqueue transition instruction
@@ -500,14 +473,18 @@ const Nav = class {
       ti.resolve(false);
     }
   }
+  /**
+   * Consumes the next transition in the queue.
+   *
+   * @returns whether the transition is executed.
+   */
   nextTrns() {
     // this is the framework's bread 'n butta function
     // only one transition is allowed at any given time
     if (this.isTransitioning) {
       return false;
     }
-    // there is no transition happening right now
-    // get the next instruction
+    // there is no transition happening right now, executes the next instructions.
     const ti = this.transInstr.shift();
     if (!ti) {
       return false;
@@ -515,6 +492,7 @@ const Nav = class {
     this.runTransition(ti);
     return true;
   }
+  /** Executes all the transition instruction from the queue. */
   async runTransition(ti) {
     try {
       // set that this nav is actively transitioning
@@ -531,8 +509,7 @@ const Nav = class {
       }
       this.postViewInit(enteringView, leavingView, ti);
       // Needs transition?
-      const requiresTransition = (ti.enteringRequiresTransition || ti.leavingRequiresTransition) &&
-        enteringView !== leavingView;
+      const requiresTransition = (ti.enteringRequiresTransition || ti.leavingRequiresTransition) && enteringView !== leavingView;
       if (requiresTransition && ti.opts && leavingView) {
         const isBackDirection = ti.opts.direction === 'back';
         /**
@@ -540,20 +517,24 @@ const Nav = class {
          * unless otherwise specified by the developer.
          */
         if (isBackDirection) {
-          ti.opts.animationBuilder = ti.opts.animationBuilder || (enteringView && enteringView.animationBuilder);
+          ti.opts.animationBuilder = ti.opts.animationBuilder || (enteringView === null || enteringView === void 0 ? void 0 : enteringView.animationBuilder);
         }
         leavingView.animationBuilder = ti.opts.animationBuilder;
       }
-      const result = requiresTransition
-        ? await this.transition(enteringView, leavingView, ti)
-        : {
-          // transition is not required, so we are already done!
-          // they're inserting/removing the views somewhere in the middle or
-          // beginning, so visually nothing needs to animate/transition
-          // resolve immediately because there's no animation that's happening
+      let result;
+      if (requiresTransition) {
+        result = await this.transition(enteringView, leavingView, ti);
+      }
+      else {
+        // transition is not required, so we are already done!
+        // they're inserting/removing the views somewhere in the middle or
+        // beginning, so visually nothing needs to animate/transition
+        // resolve immediately because there's no animation that's happening
+        result = {
           hasCompleted: true,
-          requiresTransition: false
+          requiresTransition: false,
         };
+      }
       this.success(result, ti);
       this.ionNavDidChange.emit();
     }
@@ -564,11 +545,11 @@ const Nav = class {
     this.nextTrns();
   }
   prepareTI(ti) {
+    var _a, _b;
+    var _c;
     const viewsLength = this.views.length;
-    ti.opts = ti.opts || {};
-    if (ti.opts.delegate === undefined) {
-      ti.opts.delegate = this.delegate;
-    }
+    (_a = ti.opts) !== null && _a !== void 0 ? _a : (ti.opts = {});
+    (_b = (_c = ti.opts).delegate) !== null && _b !== void 0 ? _b : (_c.delegate = this.delegate);
     if (ti.removeView !== undefined) {
       helpers.assert(ti.removeStart !== undefined, 'removeView needs removeStart');
       helpers.assert(ti.removeCount !== undefined, 'removeView needs removeCount');
@@ -585,8 +566,7 @@ const Nav = class {
       if (ti.removeCount < 0) {
         ti.removeCount = viewsLength - ti.removeStart;
       }
-      ti.leavingRequiresTransition =
-        ti.removeCount > 0 && ti.removeStart + ti.removeCount === viewsLength;
+      ti.leavingRequiresTransition = ti.removeCount > 0 && ti.removeStart + ti.removeCount === viewsLength;
     }
     if (ti.insertViews) {
       // allow -1 to be passed in to auto push it on the end
@@ -618,13 +598,21 @@ const Nav = class {
     }
     ti.insertViews = viewControllers;
   }
+  /**
+   * Returns the view that will be entered considering the transition instructions.
+   *
+   * @param ti The instructions.
+   * @param leavingView The view being left or undefined if none.
+   *
+   * @returns The view that will be entered, undefined if none.
+   */
   getEnteringView(ti, leavingView) {
+    // The last inserted view will be entered when view are inserted.
     const insertViews = ti.insertViews;
     if (insertViews !== undefined) {
-      // grab the very last view of the views to be inserted
-      // and initialize it as the new entering view
       return insertViews[insertViews.length - 1];
     }
+    // When views are deleted, we will enter the last view that is not removed and not the view being left.
     const removeStart = ti.removeStart;
     if (removeStart !== undefined) {
       const views = this.views;
@@ -638,39 +626,45 @@ const Nav = class {
     }
     return undefined;
   }
+  /**
+   * Adds and Removes the views from the navigation stack.
+   *
+   * @param enteringView The view being entered.
+   * @param leavingView The view being left.
+   * @param ti The instructions.
+   */
   postViewInit(enteringView, leavingView, ti) {
+    var _a, _b, _c;
     helpers.assert(leavingView || enteringView, 'Both leavingView and enteringView are null');
     helpers.assert(ti.resolve, 'resolve must be valid');
     helpers.assert(ti.reject, 'reject must be valid');
+    // Compute the views to remove.
     const opts = ti.opts;
-    const insertViews = ti.insertViews;
-    const removeStart = ti.removeStart;
-    const removeCount = ti.removeCount;
+    const { insertViews, removeStart, removeCount } = ti;
+    /** Records the view to destroy */
     let destroyQueue;
     // there are views to remove
     if (removeStart !== undefined && removeCount !== undefined) {
       helpers.assert(removeStart >= 0, 'removeStart can not be negative');
       helpers.assert(removeCount >= 0, 'removeCount can not be negative');
       destroyQueue = [];
-      for (let i = 0; i < removeCount; i++) {
-        const view = this.views[i + removeStart];
-        if (view && view !== enteringView && view !== leavingView) {
+      for (let i = removeStart; i < removeStart + removeCount; i++) {
+        const view = this.views[i];
+        if (view !== undefined && view !== enteringView && view !== leavingView) {
           destroyQueue.push(view);
         }
       }
       // default the direction to "back"
-      opts.direction = opts.direction || 'back';
+      (_a = opts.direction) !== null && _a !== void 0 ? _a : (opts.direction = 'back');
     }
-    const finalBalance = this.views.length +
-      (insertViews !== undefined ? insertViews.length : 0) -
-      (removeCount !== undefined ? removeCount : 0);
-    helpers.assert(finalBalance >= 0, 'final balance can not be negative');
-    if (finalBalance === 0) {
+    const finalNumViews = this.views.length + ((_b = insertViews === null || insertViews === void 0 ? void 0 : insertViews.length) !== null && _b !== void 0 ? _b : 0) - (removeCount !== null && removeCount !== void 0 ? removeCount : 0);
+    helpers.assert(finalNumViews >= 0, 'final balance can not be negative');
+    if (finalNumViews === 0) {
       console.warn(`You can't remove all the pages in the navigation stack. nav.pop() is probably called too many times.`, this, this.el);
       throw new Error('navigation stack needs at least one root page');
     }
     // At this point the transition can not be rejected, any throw should be an error
-    // there are views to insert
+    // Insert the new views in the stack.
     if (insertViews) {
       // add the views to the
       let insertIndex = ti.insertStart;
@@ -680,7 +674,7 @@ const Nav = class {
       }
       if (ti.enteringRequiresTransition) {
         // default to forward if not already set
-        opts.direction = opts.direction || 'forward';
+        (_c = opts.direction) !== null && _c !== void 0 ? _c : (opts.direction = 'forward');
       }
     }
     // if the views to be removed are in the beginning or middle
@@ -704,9 +698,7 @@ const Nav = class {
     // we should animate (duration > 0) if the pushed page is not the first one (startup)
     // or if it is a portal (modal, actionsheet, etc.)
     const opts = ti.opts;
-    const progressCallback = opts.progressAnimation
-      ? (ani) => this.sbAni = ani
-      : undefined;
+    const progressCallback = opts.progressAnimation ? (ani) => (this.sbAni = ani) : undefined;
     const mode = ionicGlobal.getIonMode(this);
     const enteringEl = enteringView.element;
     const leavingEl = leavingView && leavingView.element;
@@ -716,36 +708,53 @@ const Nav = class {
     return this.transitionFinish(hasCompleted, enteringView, leavingView, opts);
   }
   transitionFinish(hasCompleted, enteringView, leavingView, opts) {
-    const cleanupView = hasCompleted ? enteringView : leavingView;
-    if (cleanupView) {
-      this.cleanup(cleanupView);
+    /**
+     * If the transition did not complete, the leavingView will still be the active
+     * view on the stack. Otherwise unmount all the views after the enteringView.
+     */
+    const activeView = hasCompleted ? enteringView : leavingView;
+    if (activeView) {
+      this.unmountInactiveViews(activeView);
     }
     return {
       hasCompleted,
       requiresTransition: true,
       enteringView,
       leavingView,
-      direction: opts.direction
+      direction: opts.direction,
     };
   }
+  /**
+   * Inserts a view at the specified index.
+   *
+   * When the view already is in the stack it will be moved to the new position.
+   *
+   * @param view The view to insert.
+   * @param index The index where to insert the view.
+   */
   insertViewAt(view, index) {
     const views = this.views;
     const existingIndex = views.indexOf(view);
     if (existingIndex > -1) {
-      // this view is already in the stack!!
-      // move it to its new location
       helpers.assert(view.nav === this, 'view is not part of the nav');
-      views.splice(index, 0, views.splice(existingIndex, 1)[0]);
+      // The view already in the stack, removes it.
+      views.splice(existingIndex, 1);
+      // and add it back at the requested index.
+      views.splice(index, 0, view);
     }
     else {
       helpers.assert(!view.nav, 'nav is used');
       // this is a new view to add to the stack
       // create the new entering view
       view.nav = this;
-      // insert the entering view into the correct index in the stack
       views.splice(index, 0, view);
     }
   }
+  /**
+   * Removes a view from the stack.
+   *
+   * @param view The view to remove.
+   */
   removeView(view) {
     helpers.assert(view.state === VIEW_STATE_ATTACHED || view.state === VIEW_STATE_DESTROYED, 'view state should be loaded or destroyed');
     const views = this.views;
@@ -760,9 +769,13 @@ const Nav = class {
     this.removeView(view);
   }
   /**
+   * Unmounts all inactive views after the specified active view.
+   *
    * DOM WRITE
+   *
+   * @param activeView The view that is actively visible in the stack. Used to calculate which views to unmount.
    */
-  cleanup(activeView) {
+  unmountInactiveViews(activeView) {
     // ok, cleanup time!! Destroy all of the views that are
     // INACTIVE and come after the active view
     // only do this if the views exist, though
@@ -805,14 +818,7 @@ const Nav = class {
       this.canGoBackSync());
   }
   onStart() {
-    this.queueTrns({
-      removeStart: -1,
-      removeCount: 1,
-      opts: {
-        direction: 'back',
-        progressAnimation: true
-      }
-    }, undefined);
+    this.pop({ direction: 'back', progressAnimation: true });
   }
   onMove(stepValue) {
     if (this.sbAni) {
@@ -826,7 +832,7 @@ const Nav = class {
         this.animationEnabled = true;
       }, { oneTimeCallback: true });
       // Account for rounding errors in JS
-      let newStepValue = (shouldComplete) ? -0.001 : 0.001;
+      let newStepValue = shouldComplete ? -0.001 : 0.001;
       /**
        * Animation will be reversed here, so need to
        * reverse the easing curve as well
@@ -846,7 +852,7 @@ const Nav = class {
     }
   }
   render() {
-    return (index.h("slot", null));
+    return index.h("slot", null);
   }
   get el() { return index.getElement(this); }
   static get watchers() { return {