chore(): update to ionic-rules/strict

core/src/components/action-sheet-controller/action-sheet-controller.tsx

@@ -1,4 +1,5 @@
 import { Component, Listen, Method, Prop } from '@stencil/core';
+
 import { ActionSheetOptions } from '../../interface';
 import { OverlayController, createOverlay, dismissOverlay, getTopOverlay, removeLastOverlay } from '../../utils/overlays';
 

core/src/components/action-sheet/action-sheet-interface.ts

@@ -15,4 +15,3 @@ export interface ActionSheetButton {
   cssClass?: string | string[];
   handler?: () => boolean | void;
 }
-

core/src/components/action-sheet/action-sheet.tsx

@@ -1,13 +1,14 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
+
 import { ActionSheetButton, Animation, AnimationBuilder, Color, Config, CssClassMap, Mode, OverlayEventDetail, OverlayInterface } from '../../interface';
 import { BACKDROP, dismiss, eventMethod, isCancel, present } from '../../utils/overlays';
 import { createColorClasses, getClassMap } from '../../utils/theme';
+
 import { iosEnterAnimation } from './animations/ios.enter';
 import { iosLeaveAnimation } from './animations/ios.leave';
 import { mdEnterAnimation } from './animations/md.enter';
 import { mdLeaveAnimation } from './animations/md.leave';
 
-
 @Component({
   tag: 'ion-action-sheet',
   styleUrls: {
@@ -115,7 +116,6 @@ export class ActionSheet implements OverlayInterface {
    */
   @Event({ eventName: 'ionActionSheetDidDismiss' }) didDismiss!: EventEmitter<OverlayEventDetail>;
 
-
   componentDidLoad() {
     this.ionActionSheetDidLoad.emit();
   }
@@ -174,7 +174,7 @@ export class ActionSheet implements OverlayInterface {
     return eventMethod(this.el, 'ionActionSheetWillDismiss', callback);
   }
 
-  protected buttonClick(button: ActionSheetButton) {
+  private buttonClick(button: ActionSheetButton) {
     const role = button.role;
     if (isCancel(role)) {
       this.dismiss(undefined, role);
@@ -190,10 +190,14 @@ export class ActionSheet implements OverlayInterface {
     if (button && button.handler) {
       // a handler has been provided, execute it
       // pass the handler the values from the inputs
+      try {
         if (button.handler() === false) {
           // if the return value of the handler is false then do not dismiss
           return false;
         }
+      } catch (e) {
+        console.error(e);
+      }
     }
     return true;
   }
@@ -212,14 +216,11 @@ export class ActionSheet implements OverlayInterface {
   }
 
   render() {
+    // TODO: move to processedButtons
     const allButtons = this.buttons.map(b => {
-      if (typeof b === 'string') {
-        b = { text: b };
-      }
-      if (!b.cssClass) {
-        b.cssClass = '';
-      }
-      return b;
+      return (typeof b === 'string')
+        ? { text: b }
+        : b;
     });
     const cancelButton = allButtons.find(b => b.role === 'cancel');
     const buttons = allButtons.filter(b => b.role !== 'cancel');
@@ -229,14 +230,12 @@ export class ActionSheet implements OverlayInterface {
       <div class="action-sheet-wrapper" role="dialog">
         <div class="action-sheet-container">
           <div class="action-sheet-group">
-            {this.header
-              ? <div class="action-sheet-title">
+            {this.header &&
+              <div class="action-sheet-title">
                 {this.header}
-                {this.subHeader
-                ? <div class="action-sheet-sub-title">{this.subHeader}</div>
-                : null}
+                {this.subHeader && <div class="action-sheet-sub-title">{this.subHeader}</div>}
               </div>
-              : null}
+            }
             {buttons.map(b =>
               <button class={buttonClass(b)} onClick={() => this.buttonClick(b)}>
                 <span class="action-sheet-button-inner">
@@ -246,8 +245,9 @@ export class ActionSheet implements OverlayInterface {
               </button>
             )}
           </div>
-          {cancelButton
-            ? <div class="action-sheet-group action-sheet-group-cancel">
+
+          {cancelButton &&
+            <div class="action-sheet-group action-sheet-group-cancel">
               <button
                 class={buttonClass(cancelButton)}
                 onClick={() => this.buttonClick(cancelButton)}
@@ -262,9 +262,8 @@ export class ActionSheet implements OverlayInterface {
                   {cancelButton.text}
                 </span>
               </button>
-
             </div>
-            : null}
+          }
         </div>
       </div>
     ];
@@ -272,13 +271,9 @@ export class ActionSheet implements OverlayInterface {
 }
 
 function buttonClass(button: ActionSheetButton): CssClassMap {
-  const buttonClasses: any = {
+  return {
     'action-sheet-button': true,
+    [`action-sheet-${button.role}`]: !!button.role,
     ...getClassMap(button.cssClass),
   };
-  if (button.role) {
-    buttonClasses[`action-sheet-${button.role}`] = true;
 }
-  return buttonClasses;
-}
-

core/src/components/alert-controller/alert-controller.tsx

@@ -1,4 +1,5 @@
 import { Component, Listen, Method, Prop } from '@stencil/core';
+
 import { AlertOptions } from '../../interface';
 import { OverlayController, createOverlay, dismissOverlay, getTopOverlay, removeLastOverlay } from '../../utils/overlays';
 

core/src/components/alert/alert.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop, Watch } from '@stencil/core';
+
 import { AlertButton, AlertInput, Animation, AnimationBuilder, Color, Config, CssClassMap, Mode, OverlayEventDetail, OverlayInterface } from '../../interface';
 import { BACKDROP, dismiss, eventMethod, isCancel, present } from '../../utils/overlays';
 import { createColorClasses, getClassMap } from '../../utils/theme';
@@ -312,7 +313,7 @@ export class Alert implements OverlayInterface {
     }
     return (
       <div class="alert-checkbox-group" aria-labelledby={labelledby}>
-        { inputs.map((i) => (
+        { inputs.map(i => (
           <button
             onClick={() => this.cbClick(i)}
             aria-checked={i.checked ? 'true' : null}
@@ -342,7 +343,7 @@ export class Alert implements OverlayInterface {
     }
     return (
       <div class="alert-radio-group" role="radiogroup" aria-labelledby={labelledby} aria-activedescendant={this.activeId}>
-        { inputs.map((i) => (
+        { inputs.map(i => (
           <button
             onClick={() => this.rbClick(i)}
             aria-checked={i.checked ? 'true' : null}

core/src/components/anchor/anchor.tsx

@@ -1,8 +1,8 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, RouterDirection } from '../../interface';
 import { createColorClasses, openURL } from '../../utils/theme';
 
-
 @Component({
   tag: 'ion-anchor',
   styleUrl: 'anchor.scss',
@@ -41,7 +41,7 @@ export class Anchor {
     return (
       <a
         href={this.href}
-        onClick={(ev) => openURL(this.win, this.href, ev, this.routerDirection)}>
+        onClick={ev => openURL(this.win, this.href, ev, this.routerDirection)}>
           <slot></slot>
       </a>
     );

core/src/components/animation-controller/animation-controller.tsx

@@ -1,7 +1,8 @@
 import { Component, Method } from '@stencil/core';
-import { Animation, AnimationBuilder, AnimationController } from '../../interface';
-import { Animator } from './animator';
 
+import { Animation, AnimationBuilder, AnimationController } from '../../interface';
+
+import { Animator } from './animator';
 
 /** @hidden */
 @Component({

core/src/components/animation-controller/animation-interface.tsx

@@ -42,7 +42,6 @@ export interface Animation {
   hasCompleted: boolean;
 }
 
-
 export type AnimationBuilder = (Animation: Animation, baseEl: HTMLElement, opts?: any) => Promise<Animation>;
 
 export interface PlayOptions {
@@ -50,7 +49,6 @@ export interface PlayOptions {
   promise?: boolean;
 }
 
-
 export interface EffectProperty {
   effectName: string;
   trans: boolean;
@@ -60,7 +58,6 @@ export interface EffectProperty {
   [state: string]: any;
 }
 
-
 export interface EffectState {
   val: any;
   num: number;

core/src/components/animation-controller/animator.tsx

@@ -2,7 +2,6 @@ import { EffectProperty, EffectState, PlayOptions } from './animation-interface'
 import { CSS_PROP, CSS_VALUE_REGEX, DURATION_MIN, TRANSITION_END_FALLBACK_PADDING_MS } from './constants';
 import { transitionEnd } from './transition-end';
 
-
 export const TRANSFORM_PROPS: {[key: string]: number} = {
   'translateX': 1,
   'translateY': 1,
@@ -270,8 +269,8 @@ export class Animator {
    */
   beforeClearStyles(propertyNames: string[]): Animator {
     this._beforeStyles = this._beforeStyles || {};
-    for (let i = 0; i < propertyNames.length; i++) {
-      this._beforeStyles[propertyNames[i]] = '';
+    for (const prop of propertyNames) {
+      this._beforeStyles[prop] = '';
     }
     return this;
   }
@@ -652,8 +651,12 @@ export class Animator {
    * NO RECURSION
    */
   _clearAsync() {
-    this._unregisterTrnsEnd && this._unregisterTrnsEnd();
-    this._timerId && clearTimeout(this._timerId);
+    if (this._unregisterTrnsEnd) {
+      this._unregisterTrnsEnd();
+    }
+    if (this._timerId) {
+      clearTimeout(this._timerId);
+    }
     this._timerId = this._unregisterTrnsEnd = undefined;
   }
 
@@ -839,9 +842,9 @@ export class Animator {
 
       // inline styles to add before the animation
       if (this._beforeStyles) {
-        for (const prop in this._beforeStyles) {
+        for (const [key, value] of Object.entries(this._beforeStyles)) {
           // ******** DOM WRITE ****************
-          (el as any).style[prop] = this._beforeStyles[prop];
+          el.style.setProperty(key, value);
         }
       }
     }
@@ -895,18 +898,12 @@ export class Animator {
    * DOM WRITE
    */
   _setAfterStyles() {
-    let i: number, j: number;
-    let el: HTMLElement;
-    let elementClassList: DOMTokenList;
     const elements = this._elements;
     if (!elements) {
       return;
     }
-    let prop: string;
-
-    for (i = 0; i < elements.length; i++) {
-      el = elements[i];
-      elementClassList = el.classList;
+    for (const el of elements) {
+      const elementClassList = el.classList;
 
       // remove the transition duration/easing
       // ******** DOM WRITE ****************
@@ -918,27 +915,25 @@ export class Animator {
         // css classes that were added before the animation should be removed
         const beforeAddClasses = this._beforeAddClasses;
         if (beforeAddClasses) {
-          for (j = 0; j < beforeAddClasses.length; j++) {
-            // ******** DOM WRITE ****************
-            elementClassList.remove(beforeAddClasses[j]);
+          for (const c of beforeAddClasses) {
+            elementClassList.remove(c);
           }
         }
 
         // css classes that were removed before the animation should be added
         const beforeRemoveClasses = this._beforeRemoveClasses;
         if (beforeRemoveClasses) {
-          for (j = 0; j < beforeRemoveClasses.length; j++) {
-            // ******** DOM WRITE ****************
-            elementClassList.add(beforeRemoveClasses[j]);
+          for (const c of beforeRemoveClasses) {
+            elementClassList.add(c);
           }
         }
 
         // inline styles that were added before the animation should be removed
         const beforeStyles = this._beforeStyles;
         if (beforeStyles) {
-          for (prop in beforeStyles) {
+          for (const propName of Object.keys(beforeStyles)) {
             // ******** DOM WRITE ****************
-            (el as any).style[prop] = '';
+            el.style.removeProperty(propName);
           }
         }
 
@@ -948,27 +943,26 @@ export class Animator {
         // css classes to add after the animation
         const afterAddClasses = this._afterAddClasses;
         if (afterAddClasses) {
-          for (j = 0; j < afterAddClasses.length; j++) {
+          for (const c of afterAddClasses) {
             // ******** DOM WRITE ****************
-            elementClassList.add(afterAddClasses[j]);
+            elementClassList.add(c);
           }
         }
 
         // css classes to remove after the animation
         const afterRemoveClasses = this._afterRemoveClasses;
         if (afterRemoveClasses) {
-          for (j = 0; j < afterRemoveClasses.length; j++) {
+          for (const c of afterRemoveClasses) {
             // ******** DOM WRITE ****************
-            elementClassList.remove(afterRemoveClasses[j]);
+            elementClassList.remove(c);
           }
         }
 
         // inline styles to add after the animation
         const afterStyles = this._afterStyles;
         if (afterStyles) {
-          for (prop in afterStyles) {
-            // ******** DOM WRITE ****************
-            (el as any).style[prop] = afterStyles[prop];
+          for (const [key, value] of Object.entries(afterStyles)) {
+            el.style.setProperty(key, value);
           }
         }
       }

core/src/components/animation-controller/transition-end.ts

@@ -1,11 +1,12 @@
 
-
 export function transitionEnd(el: HTMLElement | null, callback: (ev?: TransitionEvent) => void) {
-  let unRegTrans: () => void;
+  let unRegTrans: (() => void) | undefined;
   const opts: any = { passive: true };
 
   function unregister() {
-    unRegTrans && unRegTrans();
+    if (unRegTrans) {
+      unRegTrans();
+    }
   }
 
   function onTransitionEnd(ev: Event) {

core/src/components/app/app.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Prop, QueueApi } from '@stencil/core';
+
 import { Config } from '../../interface';
 import { isDevice, isHybrid, needInputShims } from '../../utils/platform';
 

core/src/components/avatar/avatar.tsx

@@ -1,6 +1,5 @@
 import { Component } from '@stencil/core';
 
-
 @Component({
   tag: 'ion-avatar',
   styleUrls: {

core/src/components/back-button/back-button.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Prop } from '@stencil/core';
+
 import { Color, Config, Mode } from '../../interface';
 import { createColorClasses, openURL } from '../../utils/theme';
 
@@ -45,7 +46,6 @@ export class BackButton {
    */
   @Prop() text?: string;
 
-
   private async onClick(ev: Event) {
     const nav = this.el.closest('ion-nav');
     if (nav && nav.canGoBack()) {
@@ -78,7 +78,7 @@ export class BackButton {
     return (
       <button
         class="back-button-native"
-        onClick={(ev) => this.onClick(ev)}>
+        onClick={ev => this.onClick(ev)}>
         <span class="back-button-inner">
           { backButtonIcon && <ion-icon icon={backButtonIcon} lazy={false}/> }
           { this.mode === 'ios' && backButtonText && <span class="button-text">{backButtonText}</span> }

core/src/components/backdrop/backdrop.tsx

@@ -1,4 +1,5 @@
 import { Component, Event, EventEmitter, Listen, Prop } from '@stencil/core';
+
 import { now } from '../../utils/helpers';
 
 @Component({

core/src/components/badge/badge.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/button/button.tsx

@@ -1,8 +1,8 @@
 import { Component, Element, Event, EventEmitter, Prop, State } from '@stencil/core';
+
 import { Color, CssClassMap, Mode, RouterDirection } from '../../interface';
 import { getParentNode, openURL } from '../../utils/theme';
 
-
 @Component({
   tag: 'ion-button',
   styleUrls: {
@@ -191,7 +191,6 @@ export class Button {
   }
 }
 
-
 /**
  * Get the classes based on the button type
  * e.g. alert-button, action-sheet-button

core/src/components/card-content/card-content.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Mode } from '../../interface';
 import { createThemedClasses } from '../../utils/theme';
 

core/src/components/card-header/card-header.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/card-subtitle/card-subtitle.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/card-title/card-title.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/card/card.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/checkbox/checkbox.tsx

@@ -1,9 +1,9 @@
 import { Component, Element, Event, EventEmitter, Prop, State, Watch } from '@stencil/core';
+
 import { CheckboxInput, CheckedInputChangeEvent, Color, Mode, StyleEvent } from '../../interface';
 import { deferEvent, renderHiddenInput } from '../../utils/helpers';
 import { createColorClasses, hostContext } from '../../utils/theme';
 
-
 @Component({
   tag: 'ion-checkbox',
   styleUrls: {
@@ -74,7 +74,6 @@ export class Checkbox implements CheckboxInput {
    */
   @Event() ionStyle!: EventEmitter<StyleEvent>;
 
-
   componentWillLoad() {
     this.emitStyle();
   }

core/src/components/chip-button/chip-button.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 
@@ -39,7 +40,6 @@ export class ChipButton {
    */
   @Prop() href?: string;
 
-
   hostData() {
     return {
       class: {

core/src/components/chip-icon/chip-icon.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/chip/chip.tsx

@@ -1,8 +1,8 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 
-
 @Component({
   tag: 'ion-chip',
   styleUrls: {

core/src/components/col/col.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Listen, Prop } from '@stencil/core';
+
 import { isMatch } from '../../utils/media';
 
 const SUPPORTS_VARS = !!(CSS && CSS.supports && CSS.supports('--a', '0'));

core/src/components/content/content.tsx

@@ -1,8 +1,8 @@
 import { Component, Element, Listen, Method, Prop, QueueApi } from '@stencil/core';
+
 import { Color, Config, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 
-
 @Component({
   tag: 'ion-content',
   styleUrls: {
@@ -70,7 +70,6 @@ export class Content {
     return this.scrollEl!;
   }
 
-
   private resize() {
     if (!this.scrollEl) {
       return;

core/src/components/datetime/datetime-util.ts

@@ -32,7 +32,6 @@ export function renderDatetime(template: string, value: DatetimeData, locale: Lo
   return template;
 }
 
-
 export function renderTextFormat(format: string, value: any, date: DatetimeData | null, locale: LocaleData): string {
 
   if ((format === FORMAT_DDDD || format === FORMAT_DDD)) {
@@ -97,7 +96,6 @@ export function renderTextFormat(format: string, value: any, date: DatetimeData
   return value.toString();
 }
 
-
 export function dateValueRange(format: string, min: DatetimeData, max: DatetimeData): any[] {
   const opts: any[] = [];
 
@@ -172,7 +170,6 @@ export function isLeapYear(year: number): boolean {
   return (year % 4 === 0 && year % 100 !== 0) || (year % 400 === 0);
 }
 
-
 const ISO_8601_REGEXP = /^(\d{4}|[+\-]\d{6})(?:-(\d{2})(?:-(\d{2}))?)?(?:T(\d{2}):(\d{2})(?::(\d{2})(?:\.(\d{3}))?)?(?:(Z)|([+\-])(\d{2})(?::(\d{2}))?)?)?$/;
 const TIME_REGEXP = /^((\d{2}):(\d{2})(?::(\d{2})(?:\.(\d{3}))?)?(?:(Z)|([+\-])(\d{2})(?::(\d{2}))?)?)?$/;
 
@@ -231,7 +228,6 @@ export function parseDate(val: any): DatetimeData | null {
   };
 }
 
-
 export function updateDate(existingData: DatetimeData, newData: any): boolean {
   if (newData && newData !== '') {
 
@@ -258,9 +254,7 @@ export function updateDate(existingData: DatetimeData, newData: any): boolean {
 
       // merge new values from the picker's selection
       // to the existing DatetimeData values
-      for (const k in newData) {
-        (existingData as any)[k] = newData[k].value;
-      }
+      Object.assign(existingData, newData);
 
       return true;
     }
@@ -271,13 +265,14 @@ export function updateDate(existingData: DatetimeData, newData: any): boolean {
   } else {
     // blank data, clear everything out
     for (const k in existingData) {
+      if (existingData.hasOwnProperty(k)) {
         delete (existingData as any)[k];
       }
     }
+  }
   return false;
 }
 
-
 export function parseTemplate(template: string): string[] {
   const formats: string[] = [];
 
@@ -311,7 +306,6 @@ export function parseTemplate(template: string): string[] {
   return formats;
 }
 
-
 export function getValueFromFormat(date: DatetimeData, format: string) {
   if (format === FORMAT_A || format === FORMAT_a) {
     return (date.hour! < 12 ? 'am' : 'pm');
@@ -322,7 +316,6 @@ export function getValueFromFormat(date: DatetimeData, format: string) {
   return (date as any)[convertFormatToKey(format)!];
 }
 
-
 export function convertFormatToKey(format: string): string | null {
   for (const k in FORMAT_KEYS) {
     if (FORMAT_KEYS[k].f === format) {
@@ -332,7 +325,6 @@ export function convertFormatToKey(format: string): string | null {
   return null;
 }
 
-
 export function convertDataToISO(data: DatetimeData): string {
   // https://www.w3.org/TR/NOTE-datetime
   let rtn = '';
@@ -390,7 +382,6 @@ export function convertDataToISO(data: DatetimeData): string {
   return rtn;
 }
 
-
 /**
  * Use to convert a string of comma separated strings or
  * an array of strings, and clean up any user input
@@ -419,7 +410,6 @@ export function convertToArrayOfStrings(input: string | string[] | undefined | n
   return values;
 }
 
-
 /**
  * Use to convert a string of comma separated numbers or
  * an array of numbers, and clean up any user input
@@ -448,7 +438,6 @@ export function convertToArrayOfNumbers(input: any[] | string | number, type: st
   return values;
 }
 
-
 function twoDigit(val: number | undefined): string {
   return ('0' + (val ? Math.abs(val) : '0')).slice(-2);
 }
@@ -461,7 +450,6 @@ function fourDigit(val: number | undefined): string {
   return ('000' + (val ? Math.abs(val) : '0')).slice(-4);
 }
 
-
 export interface DatetimeData {
   [key: string]: any;
   year?: number;
@@ -474,7 +462,6 @@ export interface DatetimeData {
   tzOffset?: number;
 }
 
-
 export interface LocaleData {
   monthNames?: string[];
   monthShortNames?: string[];
@@ -482,7 +469,6 @@ export interface LocaleData {
   dayShortNames?: string[];
 }
 
-
 const FORMAT_YYYY = 'YYYY';
 const FORMAT_YY = 'YY';
 const FORMAT_MMMM = 'MMMM';

core/src/components/datetime/datetime.tsx

@@ -1,11 +1,10 @@
 import { Component, Event, EventEmitter, Prop, State, Watch } from '@stencil/core';
 
-import { DatetimeData, LocaleData, convertFormatToKey, convertToArrayOfNumbers, convertToArrayOfStrings, dateDataSortValue, dateSortValue, dateValueRange, daysInMonth, getValueFromFormat, parseDate, parseTemplate, renderDatetime, renderTextFormat, updateDate } from './datetime-util';
-
 import { CssClassMap, PickerColumn, PickerOptions, StyleEvent } from '../../interface';
 import { clamp, deferEvent } from '../../utils/helpers';
 import { createThemedClasses } from '../../utils/theme';
 
+import { DatetimeData, LocaleData, convertFormatToKey, convertToArrayOfNumbers, convertToArrayOfStrings, dateDataSortValue, dateSortValue, dateValueRange, daysInMonth, getValueFromFormat, parseDate, parseTemplate, renderDatetime, renderTextFormat, updateDate } from './datetime-util';
 
 @Component({
   tag: 'ion-datetime',
@@ -199,7 +198,6 @@ export class Datetime {
    */
   @Event() ionStyle!: EventEmitter<StyleEvent>;
 
-
   componentWillLoad() {
     // first see if locale names were provided in the inputs
     // then check to see if they're in the config
@@ -235,8 +233,6 @@ export class Datetime {
   }
 
   private buildPicker(pickerOptions: PickerOptions) {
-    console.debug('Build Datetime: Picker with', pickerOptions);
-
     // If the user has not passed in picker buttons,
     // add a cancel and ok button to the picker
     const buttons = pickerOptions.buttons;
@@ -257,7 +253,6 @@ export class Datetime {
 
     const picker = this.pickerCtrl.create(pickerOptions);
 
-    console.debug('Built Datetime: Picker with', pickerOptions);
     return picker;
   }
 
@@ -489,7 +484,6 @@ export class Datetime {
     return 0;
   }
 
-
   private divyColumns(columns: PickerColumn[]): PickerColumn[] {
     const pickerColumns = columns;
     const columnsWidth: number[] = [];

core/src/components/fab-button/fab-button.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Prop } from '@stencil/core';
+
 import { Color, CssClassMap, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/fab-list/fab-list.tsx

@@ -1,6 +1,5 @@
 import { Component, Element, Prop, Watch } from '@stencil/core';
 
-
 @Component({
   tag: 'ion-fab-list',
   styleUrl: 'fab-list.scss',
@@ -30,7 +29,6 @@ export class FabList {
    */
   @Prop() side: 'start' | 'end' | 'top' | 'bottom' = 'bottom';
 
-
   hostData() {
     return {
       class: {

core/src/components/fab/fab.tsx

@@ -1,6 +1,5 @@
 import { Component, Element, Listen, Method, Prop, Watch } from '@stencil/core';
 
-
 @Component({
   tag: 'ion-fab',
   styleUrl: 'fab.scss',

core/src/components/footer/footer.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Mode } from '../../interface';
 import { createThemedClasses } from '../../utils/theme';
 

core/src/components/gesture-controller/gesture-controller.tsx

@@ -1,5 +1,7 @@
 import { Component, Event, EventEmitter, Method } from '@stencil/core';
+
 import { BlockerConfig, BlockerDelegate, GestureConfig, GestureDelegate } from '../../interface';
+
 import { BlockerDelegate as BD, GestureDelegate as GD } from './gesture-controller-utils';
 
 @Component({
@@ -70,7 +72,9 @@ export class GestureController {
     if (maxPriority === priority) {
       this.capturedId = id;
       requestedStart.clear();
-      this.ionGestureCaptured && this.ionGestureCaptured.emit(gestureName);
+      if (this.ionGestureCaptured) {
+        this.ionGestureCaptured.emit(gestureName);
+      }
       return true;
     }
     requestedStart.delete(id);

core/src/components/gesture-controller/test/gesture-controller.spec.tsx

@@ -69,7 +69,6 @@ describe('gesture controller', () => {
     }
   });
 
-
   it('should test if canStart', () => {
     const c = new GestureController();
     expect(c.canStart('event')).toEqual(true);
@@ -108,7 +107,6 @@ describe('gesture controller', () => {
     expect(g2['id']).toEqual(2);
   });
 
-
   it('should initialize a delegate with options', async () => {
     const c = new GestureController();
     const g = await c.create({
@@ -159,7 +157,6 @@ describe('gesture controller', () => {
     expect(c['requestedStart']).toEqual(expected3);
   });
 
-
   it('should test if several gestures try to capture at the same time', async () => {
     const c = new GestureController();
     const g1 = await c.create({ name: 'swipe1' });
@@ -261,7 +258,6 @@ describe('gesture controller', () => {
       expect(b2['ctrl']).toEqual(c);
       expect(b2['id']).toEqual(2);
 
-
       expect(c.isDisabled('event1')).toBeFalsy();
       expect(c.isDisabled('event2')).toBeFalsy();
       expect(c.isDisabled('event3')).toBeFalsy();
@@ -305,7 +301,6 @@ describe('gesture controller', () => {
       expect(c.isDisabled('event5')).toBeFalsy();
     });
 
-
     it('should disable some events', async () => {
       const c = new GestureController();
 

core/src/components/gesture/gesture.tsx

@@ -1,6 +1,8 @@
 import { Component, EventListenerEnable, Listen, Prop, QueueApi, Watch } from '@stencil/core';
+
 import { GestureCallback, GestureDelegate, GestureDetail } from '../../interface';
 import { assert, now } from '../../utils/helpers';
+
 import { PanRecognizer } from './recognizers';
 
 @Component({

core/src/components/grid/grid.tsx

@@ -1,6 +1,5 @@
 import { Component, Prop } from '@stencil/core';
 
-
 @Component({
   tag: 'ion-grid',
   styleUrl: 'grid.scss',

core/src/components/header/header.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Mode } from '../../interface';
 import { createThemedClasses } from '../../utils/theme';
 

core/src/components/hide-when/hide-when.tsx

@@ -1,6 +1,6 @@
 import { Component, Element, Listen, Prop, State } from '@stencil/core';
-import { Config, Mode } from '../../interface';
 
+import { Config, Mode } from '../../interface';
 import { DisplayWhen, PLATFORM_CONFIGS, PlatformConfig, detectPlatforms, updateTestResults } from '../../utils/show-hide-when-utils';
 
 @Component({

core/src/components/img/img.tsx

@@ -1,6 +1,5 @@
 import { Component, Element, Event, EventEmitter, Prop, State, Watch } from '@stencil/core';
 
-
 @Component({
   tag: 'ion-img',
   styleUrl: 'img.scss',
@@ -43,7 +42,7 @@ export class Img {
     }
     if ('IntersectionObserver' in window) {
       this.removeIO();
-      this.io = new IntersectionObserver((data) => {
+      this.io = new IntersectionObserver(data => {
         // because there will only ever be one instance
         // of the element we are observing
         // we can just use data[0]

core/src/components/infinite-scroll-content/infinite-scroll-content.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Config, Mode } from '../../interface';
 import { createThemedClasses } from '../../utils/theme';
 

core/src/components/infinite-scroll/infinite-scroll.tsx

@@ -42,7 +42,6 @@ export class InfiniteScroll {
     }
   }
 
-
   /**
    * If true, the infinite scroll will be hidden and scroll event listeners
    * will be removed.
@@ -74,7 +73,6 @@ export class InfiniteScroll {
    */
   @Event() ionInfinite!: EventEmitter<void>;
 
-
   async componentDidLoad() {
     const contentEl = this.el.closest('ion-content');
     if (contentEl) {

core/src/components/input/input-base.tsx

@@ -1,6 +1,7 @@
 // Shared Interfaces
 
 import { EventEmitter } from '@stencil/core';
+
 import { StyleEvent } from '../../interface';
 
 export interface InputBaseComponent {

core/src/components/input/input.tsx

@@ -1,9 +1,10 @@
 import { Component, Element, Event, EventEmitter, Prop, State, Watch } from '@stencil/core';
+
 import { Color, InputChangeEvent, Mode, StyleEvent, TextFieldTypes } from '../../interface';
 import { debounceEvent, deferEvent, renderHiddenInput } from '../../utils/helpers';
 import { createColorClasses, hostContext } from '../../utils/theme';
-import { InputComponent } from './input-base';
 
+import { InputComponent } from './input-base';
 
 @Component({
   tag: 'ion-input',
@@ -19,7 +20,6 @@ export class Input implements InputComponent {
   private inputId = `ion-input-${inputIds++}`;
   didBlurAfterEdit = false;
 
-
   @State() hasFocus = false;
 
   @Element() el!: HTMLElement;
@@ -212,7 +212,6 @@ export class Input implements InputComponent {
    */
   @Prop({ mutable: true }) value = '';
 
-
   /**
    * Update the native input element when the value changes
    */

core/src/components/item-divider/item-divider.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/item-group/item-group.tsx

@@ -1,8 +1,8 @@
 import { Component } from '@stencil/core';
+
 import { Mode } from '../../interface';
 import { createThemedClasses } from '../../utils/theme';
 
-
 @Component({
   tag: 'ion-item-group',
   styleUrls: {

core/src/components/item-option/item-option.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/item-options/item-options.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Event, EventEmitter, Method, Prop } from '@stencil/core';
+
 import { Side } from '../../interface';
 import { isEndSide } from '../../utils/helpers';
 

core/src/components/item-sliding/item-sliding.tsx

@@ -1,6 +1,6 @@
 import { Component, Element, Event, EventEmitter, Method, State } from '@stencil/core';
-import { GestureDetail } from '../../interface';
 
+import { GestureDetail } from '../../interface';
 
 const SWIPE_MARGIN = 30;
 const ELASTIC_FACTOR = 0.55;
@@ -22,7 +22,6 @@ const enum SlidingState {
   SwipeStart = 1 << 6,
 }
 
-
 @Component({
   tag: 'ion-item-sliding',
   styleUrl: 'item-sliding.scss'
@@ -88,7 +87,6 @@ export class ItemSliding {
     }
   }
 
-
   /**
    * Close the sliding item. Items can also be closed from the [List](../../list/List).
    */
@@ -138,7 +136,9 @@ export class ItemSliding {
   }
 
   private onDragStart() {
-    this.list && this.list.setOpenItem(this.el);
+    if (this.list) {
+      this.list.setOpenItem(this.el);
+    }
 
     if (this.tmr) {
       clearTimeout(this.tmr);
@@ -247,7 +247,9 @@ export class ItemSliding {
         this.state = SlidingState.Disabled;
         this.tmr = undefined;
       }, 600);
-      this.list && this.list.setOpenItem(undefined);
+      if (this.list) {
+        this.list.setOpenItem(undefined);
+      }
       style.transform = '';
       return;
     }

core/src/components/item/item.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Listen, Prop } from '@stencil/core';
+
 import { Color, CssClassMap, Mode, RouterDirection } from '../../interface';
 import { createColorClasses, hostContext, openURL } from '../../utils/theme';
 
@@ -11,7 +12,7 @@ import { createColorClasses, hostContext, openURL } from '../../utils/theme';
   shadow: true
 })
 export class Item {
-  private itemStyles: { [key: string]: CssClassMap } = {};
+  private itemStyles = new Map<string, CssClassMap>();
 
   @Element() el!: HTMLStencilElement;
 
@@ -78,7 +79,6 @@ export class Item {
    */
   @Prop() type: 'submit' | 'reset' | 'button' = 'button';
 
-
   @Listen('ionStyle')
   itemStyle(ev: UIEvent) {
     ev.stopPropagation();
@@ -87,7 +87,7 @@ export class Item {
     const updatedStyles = ev.detail as any;
     const updatedKeys = Object.keys(ev.detail);
     const newStyles = {} as any;
-    const childStyles = this.itemStyles[tagName] || {};
+    const childStyles = this.itemStyles.get(tagName) || {};
     let hasStyleChange = false;
     for (const key of updatedKeys) {
       const itemKey = `item-${key}`;
@@ -99,7 +99,7 @@ export class Item {
     }
 
     if (hasStyleChange) {
-      this.itemStyles[tagName] = newStyles;
+      this.itemStyles.set(tagName, newStyles);
       this.el.forceUpdate();
     }
   }
@@ -107,12 +107,11 @@ export class Item {
   componentDidLoad() {
     // Change the button size to small for each ion-button in the item
     // unless the size is explicitly set
-    const buttons = this.el.querySelectorAll('ion-button');
-    for (let i = 0; i < buttons.length; i++) {
-      if (!buttons[i].size) {
-        buttons[i].size = 'small';
-      }
+    Array.from(this.el.querySelectorAll('ion-button')).forEach(button => {
+      if (!button.size) {
+        button.size = 'small';
       }
+    });
   }
 
   private isClickable(): boolean {
@@ -121,8 +120,8 @@ export class Item {
 
   hostData() {
     const childStyles = {};
-    for (const key in this.itemStyles) {
-      Object.assign(childStyles, this.itemStyles[key]);
+    for (const value of this.itemStyles.values()) {
+      Object.assign(childStyles, value);
     }
 
     return {

core/src/components/label/label.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Event, EventEmitter, Method, Prop, Watch } from '@stencil/core';
+
 import { Color, Mode, StyleEvent } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/list-header/list-header.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/list/list.tsx

@@ -1,4 +1,5 @@
 import { Component, Method, Prop } from '@stencil/core';
+
 import { Mode } from '../../interface';
 import { createThemedClasses } from '../../utils/theme';
 

core/src/components/loading-controller/loading-controller.tsx

@@ -1,8 +1,8 @@
 import { Component, Listen, Method, Prop } from '@stencil/core';
+
 import { LoadingOptions } from '../../interface';
 import { OverlayController, createOverlay, dismissOverlay, getTopOverlay, removeLastOverlay } from '../../utils/overlays';
 
-
 @Component({
   tag: 'ion-loading-controller'
 })

core/src/components/loading/animations/ios.enter.ts

@@ -1,6 +1,5 @@
 import { Animation } from '../../../interface';
 
-
 /**
  * iOS Loading Enter Animation
  */

core/src/components/loading/animations/ios.leave.ts

@@ -1,6 +1,5 @@
 import { Animation } from '../../../interface';
 
-
 /**
  * iOS Loading Leave Animation
  */
@@ -18,7 +17,6 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): P
   wrapperAnimation.fromTo('opacity', 0.99, 0)
                   .fromTo('scale', 1, 0.9);
 
-
   return Promise.resolve(baseAnimation
     .addElement(baseEl)
     .easing('ease-in-out')

core/src/components/loading/loading.tsx

@@ -1,11 +1,11 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
+
 import { Animation, AnimationBuilder, Color, Config, Mode, OverlayEventDetail, OverlayInterface } from '../../interface';
 import { BACKDROP, dismiss, eventMethod, present } from '../../utils/overlays';
 import { createThemedClasses, getClassMap } from '../../utils/theme';
 
 import { iosEnterAnimation } from './animations/ios.enter';
 import { iosLeaveAnimation } from './animations/ios.leave';
-
 import { mdEnterAnimation } from './animations/md.enter';
 import { mdLeaveAnimation } from './animations/md.leave';
 

core/src/components/menu-button/menu-button.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Config, Mode } from '../../interface';
 
 @Component({

core/src/components/menu-controller/animations/overlay.ts

@@ -1,4 +1,5 @@
 import { Animation, Menu } from '../../../interface';
+
 import { baseAnimation } from './base';
 
 const BOX_SHADOW_WIDTH = 8;
@@ -9,7 +10,8 @@ const BOX_SHADOW_WIDTH = 8;
  * itself, which is under the menu, does not move.
  */
 export function menuOverlayAnimation(AnimationC: Animation, _: HTMLElement, menu: Menu): Promise<Animation> {
-  let closedX: string, openedX: string;
+  let closedX: string;
+  let openedX: string;
   const width = menu.width + BOX_SHADOW_WIDTH;
   if (menu.isEndSide) {
     // right side

core/src/components/menu-controller/animations/push.ts

@@ -1,4 +1,5 @@
 import { Animation, Menu } from '../../../interface';
+
 import { baseAnimation } from './base';
 
 /**
@@ -9,7 +10,8 @@ import { baseAnimation } from './base';
  */
 export function menuPushAnimation(AnimationC: Animation, _: HTMLElement, menu: Menu): Promise<Animation> {
 
-  let contentOpenedX: string, menuClosedX: string;
+  let contentOpenedX: string;
+  let menuClosedX: string;
   const width = menu.width;
 
   if (menu.isEndSide) {
@@ -32,7 +34,7 @@ export function menuPushAnimation(AnimationC: Animation, _: HTMLElement, menu: M
     .addElement(menu.backdropEl)
     .fromTo('opacity', 0.01, 0.2);
 
-  return baseAnimation(AnimationC).then((animation) => {
+  return baseAnimation(AnimationC).then(animation => {
     return animation.add(menuAni)
     .add(backdropAni)
     .add(contentAni);

core/src/components/menu-controller/animations/reveal.ts

@@ -1,4 +1,5 @@
 import { Animation, Menu } from '../../../interface';
+
 import { baseAnimation } from './base';
 
 /**

core/src/components/menu-controller/menu-controller.ts

@@ -1,4 +1,5 @@
 import { Build, Component, Method, Prop } from '@stencil/core';
+
 import { Animation, AnimationBuilder, Menu } from '../../interface';
 
 import { menuOverlayAnimation } from './animations/overlay';

core/src/components/menu/menu.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Event, EventEmitter, EventListenerEnable, Listen, Method, Prop, State, Watch } from '@stencil/core';
+
 import { Animation, Config, GestureDetail, MenuChangeEventDetail, Mode, Side } from '../../interface';
 import { assert, isEndSide as isEnd } from '../../utils/helpers';
 
@@ -172,7 +173,9 @@ export class Menu {
 
   componentDidUnload() {
     this.menuCtrl!._unregister(this);
-    this.animation && this.animation.destroy();
+    if (this.animation) {
+      this.animation.destroy();
+    }
 
     this.animation = undefined;
     this.contentEl = this.backdropEl = this.menuInnerEl = undefined;
@@ -366,7 +369,9 @@ export class Menu {
     // this places the menu into the correct location before it animates in
     // this css class doesn't actually kick off any animations
     this.el.classList.add(SHOW_MENU);
-    this.backdropEl && this.backdropEl.classList.add(SHOW_BACKDROP);
+    if (this.backdropEl) {
+      this.backdropEl.classList.add(SHOW_BACKDROP);
+    }
     this.isAnimating = true;
   }
 
@@ -385,15 +390,21 @@ export class Menu {
 
     if (isOpen) {
       // add css class
-      this.contentEl && this.contentEl.classList.add(MENU_CONTENT_OPEN);
+      if (this.contentEl) {
+        this.contentEl.classList.add(MENU_CONTENT_OPEN);
+      }
 
       // emit open event
       this.ionOpen.emit();
     } else {
       // remove css classes
       this.el.classList.remove(SHOW_MENU);
-      this.contentEl && this.contentEl.classList.remove(MENU_CONTENT_OPEN);
-      this.backdropEl && this.backdropEl.classList.remove(SHOW_BACKDROP);
+      if (this.contentEl) {
+        this.contentEl.classList.remove(MENU_CONTENT_OPEN);
+      }
+      if (this.backdropEl) {
+        this.backdropEl.classList.remove(SHOW_BACKDROP);
+      }
 
       // emit close event
       this.ionClose.emit();

core/src/components/modal-controller/modal-controller.tsx

@@ -1,8 +1,8 @@
 import { Component, Listen, Method, Prop } from '@stencil/core';
+
 import { ModalOptions } from '../../interface';
 import { OverlayController, createOverlay, dismissOverlay, getTopOverlay, removeLastOverlay } from '../../utils/overlays';
 
-
 @Component({
   tag: 'ion-modal-controller'
 })

core/src/components/modal/animations/ios.enter.ts

@@ -1,6 +1,5 @@
 import { Animation } from '../../../interface';
 
-
 /**
  * iOS Modal Enter Animation
  */
@@ -34,7 +33,6 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P
 
 // }
 
-
 // export class ModalSlideOut {
 //   constructor(el: HTMLElement) {
 //     let backdrop = new Animation(this.plt, el.querySelector('ion-backdrop'));
@@ -56,7 +54,6 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P
 //   }
 // }
 
-
 // export class ModalMDSlideIn {
 //   constructor(el: HTMLElement) {
 //     const backdrop = new Animation(this.plt, el.querySelector('ion-backdrop'));
@@ -74,7 +71,6 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P
 //   }
 // }
 
-
 // export class ModalMDSlideOut {
 //   constructor(el: HTMLElement) {
 //     const backdrop = new Animation(this.plt, el.querySelector('ion-backdrop'));

core/src/components/modal/animations/ios.leave.ts

@@ -1,6 +1,5 @@
 import { Animation } from '../../../interface';
 
-
 /**
  * iOS Modal Leave Animation
  */

core/src/components/modal/modal.tsx

@@ -1,13 +1,12 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
-import { Animation, AnimationBuilder, ComponentProps, ComponentRef, Config, FrameworkDelegate, Mode, OverlayEventDetail, OverlayInterface } from '../../interface';
 
+import { Animation, AnimationBuilder, ComponentProps, ComponentRef, Config, FrameworkDelegate, Mode, OverlayEventDetail, OverlayInterface } from '../../interface';
 import { attachComponent, detachComponent } from '../../utils/framework-delegate';
 import { BACKDROP, dismiss, eventMethod, present } from '../../utils/overlays';
 import { createThemedClasses, getClassMap } from '../../utils/theme';
 
 import { iosEnterAnimation } from './animations/ios.enter';
 import { iosLeaveAnimation } from './animations/ios.leave';
-
 import { mdEnterAnimation } from './animations/md.enter';
 import { mdLeaveAnimation } from './animations/md.leave';
 
@@ -222,14 +221,3 @@ const LIFECYCLE_MAP: any = {
   'ionModalWillDismiss': 'ionViewWillDismiss',
   'ionModalDidDismiss': 'ionViewDidDismiss',
 };
-
-export interface ModalOptions {
-  component: ComponentRef;
-  componentProps?: ComponentProps;
-  showBackdrop?: boolean;
-  enableBackdropDismiss?: boolean;
-  enterAnimation?: AnimationBuilder;
-  leaveAnimation?: AnimationBuilder;
-  cssClass?: string | string[];
-  delegate?: FrameworkDelegate;
-}

core/src/components/nav-push/nav-push.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Listen, Prop } from '@stencil/core';
+
 import { ComponentProps, NavComponent } from '../../interface';
 
 @Component({

core/src/components/nav-set-root/nav-set-root.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Listen, Prop } from '@stencil/core';
+
 import { ComponentProps, NavComponent } from '../../interface';
 
 @Component({

core/src/components/nav/nav.tsx

@@ -1,8 +1,10 @@
 import { Build, Component, Element, Event, EventEmitter, Method, Prop, QueueApi, Watch } from '@stencil/core';
+
 import { ViewLifecycle } from '../..';
 import { Animation, ComponentProps, Config, FrameworkDelegate, GestureDetail, Mode, NavComponent, NavOptions, NavOutlet, NavResult, RouteID, RouteWrite, TransitionDoneFn, TransitionInstruction, ViewController } from '../../interface';
 import { assert } from '../../utils/helpers';
 import { TransitionOptions, lifecycle, setPageHidden, transition } from '../../utils/transition';
+
 import { ViewState, convertToViews, matches } from './view-controller';
 
 @Component({
@@ -107,7 +109,9 @@ export class Nav implements NavOutlet {
     }
 
     // release swipe back gesture and transition
-    this.sbTrns && this.sbTrns.destroy();
+    if (this.sbTrns) {
+      this.sbTrns.destroy();
+    }
     this.transInstr.length = this.views.length = 0;
     this.sbTrns = undefined;
     this.destroyed = true;
@@ -786,7 +790,9 @@ export class Nav implements NavOutlet {
 
     // this is the root transition
     // it's safe to destroy this transition
-    trans && trans.destroy();
+    if (trans) {
+      trans.destroy();
+    }
 
     return {
       hasCompleted,

core/src/components/nav/test/nav-controller.spec.ts

@@ -1,12 +1,11 @@
 import { TestWindow } from '@stencil/core/dist/testing';
+
 import { Config } from '../../../global/config';
 import { AnimationControllerImpl } from '../../animation-controller/animation-controller';
 import { Nav } from '../nav';
 import { NavOptions } from '../nav-interface';
 import { ViewController, ViewState } from '../view-controller';
 
-
-
 describe('NavController', () => {
 
   describe('push and pop', () => {
@@ -164,7 +163,6 @@ describe('NavController', () => {
       );
       expect(nav.length()).toEqual(2);
 
-
     }, 10000);
   });
 
@@ -229,7 +227,7 @@ describe('NavController', () => {
 
     }, 10000);
 
-    it('should not insert if null view', (done) => {
+    it('should not insert if null view', done => {
       mockViews(nav, [mockView(MockView1)]);
 
       nav.insert(-1, null as any, null, null, trnsDone).then(() => {
@@ -290,7 +288,7 @@ describe('NavController', () => {
 
   describe('pop', () => {
 
-    it('should not pop when no views in the stack', (done) => {
+    it('should not pop when no views in the stack', done => {
       nav.pop(null, trnsDone).then(() => {
         fail('it should not succeed');
         done();
@@ -338,7 +336,6 @@ describe('NavController', () => {
       expect(nav.getByIndex(0)!.component).toEqual(MockView1);
       expect(nav['isTransitioning']).toEqual(false);
 
-
     }, 10000);
 
   });
@@ -362,7 +359,6 @@ describe('NavController', () => {
       expect(nav.getByIndex(0)!.component).toEqual(MockView1);
       expect(nav.getByIndex(1)!.component).toEqual(MockView2);
 
-
     }, 10000);
 
     it('should pop to using an index number', async () => {
@@ -383,7 +379,6 @@ describe('NavController', () => {
       expect(nav.getByIndex(0)!.component).toEqual(MockView1);
       expect(nav.getByIndex(1)!.component).toEqual(MockView2);
 
-
     }, 10000);
 
     it('should pop to first using an index number', async () => {
@@ -484,7 +479,6 @@ describe('NavController', () => {
       expect(nav.length()).toEqual(1);
       expect(nav.getByIndex(0)!.component).toEqual(MockView1);
 
-
     }, 10000);
 
     it('should not pop first view if it\'s the only view', async () => {
@@ -500,7 +494,6 @@ describe('NavController', () => {
       expect(nav.length()).toEqual(1);
       expect(nav.getByIndex(0)!.component).toEqual(MockView1);
 
-
     }, 10000);
 
   });
@@ -553,7 +546,6 @@ describe('NavController', () => {
       expect(nav.length()).toEqual(1);
       expect(nav.getByIndex(0)!.component).toEqual(MockView4);
 
-
     }, 10000);
 
     it('should remove two views in the middle', async () => {
@@ -612,7 +604,6 @@ describe('NavController', () => {
       expect(nav.getByIndex(1)!.component).toEqual(MockView2);
       expect(nav.getByIndex(2)!.component).toEqual(MockView5);
 
-
     }, 10000);
 
     it('should remove the last two views at the end', async () => {
@@ -662,7 +653,6 @@ describe('NavController', () => {
       expect(nav.getByIndex(0)!.component).toEqual(MockView1);
       expect(nav.getByIndex(1)!.component).toEqual(MockView2);
 
-
     }, 10000);
 
   });
@@ -706,7 +696,6 @@ describe('NavController', () => {
       expect(nav.length()).toEqual(1);
       expect(nav.getByIndex(0)!.component).toEqual(MockView3);
 
-
     }, 10000);
 
     it('should set a ViewController as the root when its the middle view, with transition', async () => {
@@ -785,8 +774,6 @@ describe('NavController', () => {
       expect(nav.length()).toEqual(1);
       expect(nav.getByIndex(0)!.component).toEqual(MockView1);
 
-
-
     }, 10000);
 
     it('should set a page component as the root, with transition', async () => {
@@ -813,7 +800,6 @@ describe('NavController', () => {
       expect(nav.length()).toEqual(1);
       expect(nav.getByIndex(0)!.component).toEqual(MockView4);
 
-
     }, 10000);
   });
 
@@ -846,7 +832,6 @@ describe('NavController', () => {
       expect(nav.getByIndex(0)!.component).toEqual(MockView4);
       expect(nav.getByIndex(1)!.component).toEqual(MockView5);
 
-
     }, 10000);
 
   });
@@ -874,7 +859,6 @@ describe('NavController', () => {
     });
   });
 
-
   function spyOnLifecycles(view: ViewController) {
     const element = view.element as any;
     Object.assign(element, {
@@ -921,7 +905,6 @@ describe('NavController', () => {
     nav = mockNavController();
   });
 
-
   const MockView = 'mock-view';
   const MockView1 = 'mock-view1';
   const MockView2 = 'mock-view2';
@@ -929,7 +912,6 @@ describe('NavController', () => {
   const MockView4 = 'mock-view4';
   const MockView5 = 'mock-view5';
 
-
   function mockView(component ?: any, data ?: any) {
     if (!component) {
       component = MockView;
@@ -970,4 +952,3 @@ describe('NavController', () => {
     return navI;
   }
 });
-

core/src/components/nav/view-controller.ts

@@ -2,7 +2,6 @@ import { ComponentProps, FrameworkDelegate, Nav } from '../../interface';
 import { attachComponent } from '../../utils/framework-delegate';
 import { assert } from '../../utils/helpers';
 
-
 export const enum ViewState {
   New = 1,
   Attached,

core/src/components/note/note.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Color, Mode } from '../../interface';
 import { createColorClasses } from '../../utils/theme';
 

core/src/components/picker-column/picker-column.tsx

@@ -1,10 +1,10 @@
 import { Component, Element, Prop, QueueApi } from '@stencil/core';
+
 import { GestureDetail, Mode, PickerColumn, PickerColumnOption } from '../../interface';
 import { hapticSelectionChanged } from '../../utils';
 import { clamp } from '../../utils/helpers';
 import { createThemedClasses } from '../../utils/theme';
 
-
 /** @hidden */
 @Component({
   tag: 'ion-picker-column'
@@ -237,8 +237,6 @@ export class PickerColumnCmp {
   }
 
   private onDragStart(detail: GestureDetail): boolean {
-    console.debug('picker, onDragStart', detail, this.startY);
-
     // We have to prevent default in order to block scrolling under the picker
     // but we DO NOT have to stop propagation, since we still want
     // some "click" events to capture
@@ -313,8 +311,6 @@ export class PickerColumnCmp {
       return;
     }
 
-    console.debug('picker, onDragEnd', detail);
-
     this.velocity = 0;
 
     if (this.bounceFrom > 0) {
@@ -431,7 +427,7 @@ export class PickerColumnCmp {
           <button
             class={{ 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }}
             disable-activated
-            onClick={(event) => this.optClick(event, index)}>
+            onClick={event => this.optClick(event, index)}>
             {o.text}
           </button>
         )}

core/src/components/picker-controller/picker-controller.tsx

@@ -1,8 +1,8 @@
 import { Component, Listen, Method, Prop } from '@stencil/core';
+
 import { PickerOptions } from '../../interface';
 import { OverlayController, createOverlay, dismissOverlay, getTopOverlay, removeLastOverlay } from '../../utils/overlays';
 
-
 /** @hidden */
 @Component({
   tag: 'ion-picker-controller'

core/src/components/picker/animations/ios.enter.ts

@@ -1,6 +1,5 @@
 import { Animation } from '../../../interface';
 
-
 /**
  * iOS Picker Enter Animation
  */

core/src/components/picker/animations/ios.leave.ts

@@ -1,6 +1,5 @@
 import { Animation } from '../../../interface';
 
-
 /**
  * iOS Picker Leave Animation
  */

core/src/components/picker/picker.tsx

@@ -1,6 +1,6 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop, State } from '@stencil/core';
-import { Animation, AnimationBuilder, Config, CssClassMap, Mode, OverlayEventDetail, OverlayInterface, PickerButton, PickerColumn } from '../../interface';
 
+import { Animation, AnimationBuilder, Config, CssClassMap, Mode, OverlayEventDetail, OverlayInterface, PickerButton, PickerColumn } from '../../interface';
 import { dismiss, eventMethod, present } from '../../utils/overlays';
 import { createThemedClasses, getClassMap } from '../../utils/theme';
 
@@ -26,11 +26,8 @@ export class Picker implements OverlayInterface {
   @State() private showSpinner!: boolean;
   @State() private spinner!: string;
 
-  @Prop({ connect: 'ion-animation-controller' })
-  animationCtrl!: HTMLIonAnimationControllerElement;
-
-  @Prop({ context: 'config' })
-  config!: Config;
+  @Prop({ connect: 'ion-animation-controller' }) animationCtrl!: HTMLIonAnimationControllerElement;
+  @Prop({ context: 'config' }) config!: Config;
 
   /** @hidden */
   @Prop() overlayId!: number;
@@ -281,6 +278,7 @@ export class Picker implements OverlayInterface {
     return {
       class: {
         ...createThemedClasses(this.mode, 'picker'),
+        ...getClassMap(this.cssClass)
       },
       style: {
         zIndex: 20000 + this.overlayId
@@ -289,19 +287,11 @@ export class Picker implements OverlayInterface {
   }
 
   render() {
-    // TODO: cssClass
-
-    const buttons = this.buttons
-      .map(b => {
-        if (typeof b === 'string') {
-          b = { text: b };
-        }
-        if (!b.cssClass) {
-          b.cssClass = '';
-        }
-        return b;
-      })
-      .filter(b => b !== null);
+    const buttons = this.buttons.map(b => {
+      return (typeof b === 'string')
+        ? { text: b }
+        : b;
+    });
 
     const columns = this.columns;
 

core/src/components/popover-controller/popover-controller.tsx

@@ -1,4 +1,5 @@
 import { Component, Listen, Method, Prop } from '@stencil/core';
+
 import { PopoverOptions } from '../../interface';
 import { OverlayController, createOverlay, dismissOverlay, getTopOverlay, removeLastOverlay } from '../../utils/overlays';
 

core/src/components/popover/popover.tsx

@@ -1,13 +1,12 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
-import { Animation, AnimationBuilder, Color, ComponentProps, ComponentRef, Config, FrameworkDelegate, Mode, OverlayEventDetail, OverlayInterface } from '../../interface';
 
+import { Animation, AnimationBuilder, Color, ComponentProps, ComponentRef, Config, FrameworkDelegate, Mode, OverlayEventDetail, OverlayInterface } from '../../interface';
 import { attachComponent, detachComponent } from '../../utils/framework-delegate';
 import { BACKDROP, dismiss, eventMethod, present } from '../../utils/overlays';
 import { createThemedClasses, getClassMap } from '../../utils/theme';
 
 import { iosEnterAnimation } from './animations/ios.enter';
 import { iosLeaveAnimation } from './animations/ios.leave';
-
 import { mdEnterAnimation } from './animations/md.enter';
 import { mdLeaveAnimation } from './animations/md.leave';
 
@@ -127,7 +126,6 @@ export class Popover implements OverlayInterface {
    */
   @Event({ eventName: 'ionPopoverDidDismiss' }) didDismiss!: EventEmitter<OverlayEventDetail>;
 
-
   componentDidLoad() {
     this.ionPopoverDidLoad.emit();
   }
@@ -225,8 +223,8 @@ export class Popover implements OverlayInterface {
       'no-router': true,
       class: {
         ...createThemedClasses(this.mode, 'popover'),
-        ...themedClasses,
         ...getClassMap(this.cssClass),
+        ...themedClasses,
       }
     };
   }
@@ -251,7 +249,6 @@ const LIFECYCLE_MAP: any = {
   'ionPopoverDidDismiss': 'ionViewDidDismiss',
 };
 
-
 export const POPOVER_POSITION_PROPERTIES: any = {
   ios: {
     padding: 2,

core/src/components/radio-group/radio-group.tsx

@@ -1,6 +1,6 @@
 import { Component, ComponentDidLoad, Element, Event, EventEmitter, Listen, Prop, Watch } from '@stencil/core';
-import { InputChangeEvent, RadioGroupInput } from '../../interface';
 
+import { InputChangeEvent, RadioGroupInput } from '../../interface';
 
 @Component({
   tag: 'ion-radio-group'

core/src/components/radio/radio.tsx

@@ -1,9 +1,9 @@
 import { Component, Element, Event, EventEmitter, Prop, State, Watch } from '@stencil/core';
+
 import { CheckedInputChangeEvent, Color, Mode, RadioButtonInput, StyleEvent } from '../../interface';
 import { deferEvent } from '../../utils/helpers';
 import { createColorClasses, hostContext } from '../../utils/theme';
 
-
 @Component({
   tag: 'ion-radio',
   styleUrls: {
@@ -84,7 +84,6 @@ export class Radio implements RadioButtonInput {
    */
   @Event() ionBlur!: EventEmitter<void>;
 
-
   componentWillLoad() {
     this.ionSelect = deferEvent(this.ionSelect);
     this.ionStyle = deferEvent(this.ionStyle);

core/src/components/range-knob/range-knob.tsx

@@ -1,4 +1,5 @@
 import { Component, Event, EventEmitter, Listen, Prop } from '@stencil/core';
+
 import { Knob } from '../../interface';
 
 /** @hidden */

core/src/components/range/range.tsx

@@ -1,7 +1,9 @@
 import { Component, Element, Event, EventEmitter, Listen, Prop, State, Watch } from '@stencil/core';
+
 import { BaseInput, Color, GestureDetail, Mode, RangeInputChangeEvent, StyleEvent } from '../../interface';
 import { clamp, debounceEvent, deferEvent } from '../../utils/helpers';
 import { createColorClasses, hostContext } from '../../utils/theme';
+
 import { Knob, RangeEventDetail, RangeValue } from './range-interface';
 
 @Component({
@@ -332,7 +334,7 @@ export class Range implements BaseInput {
         direction="x"
         threshold={0}
       >
-        <div class="range-slider" ref={(el) => this.rangeSlider = el}>
+        <div class="range-slider" ref={el => this.rangeSlider = el}>
           {ticks.map(t => (
             <div
               style={{ left: t.left }}

core/src/components/refresher-content/refresher-content.tsx

@@ -1,4 +1,5 @@
 import { Component, Prop } from '@stencil/core';
+
 import { Config } from '../../interface';
 
 @Component({
@@ -28,7 +29,6 @@ export class RefresherContent {
    */
   @Prop() refreshingText?: string;
 
-
   protected componentDidLoad() {
     if (!this.pullingIcon) {
       this.pullingIcon = this.config.get('ionPullIcon', 'arrow-down');

core/src/components/refresher/refresher.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, Event, EventEmitter, Method, Prop, QueueApi, State } from '@stencil/core';
+
 import { GestureDetail, Mode } from '../../interface';
 import { createThemedClasses } from '../../utils/theme';
 
@@ -43,7 +44,6 @@ export class Refresher {
    */
   @State() private state: RefresherState = RefresherState.Inactive;
 
-
   @Element() el!: HTMLElement;
 
   /**
@@ -222,7 +222,6 @@ export class Refresher {
     }
 
     // prevent native scroll events
-    console.debug('preventDefault');
     ev.preventDefault();
 
     // the refresher is actively pulling at this point

core/src/components/reorder-group/reorder-group.tsx

@@ -1,9 +1,9 @@
 import { Component, Element, Prop, QueueApi, State } from '@stencil/core';
+
 import { GestureDetail, Mode } from '../../interface';
 import { hapticSelectionChanged, hapticSelectionEnd, hapticSelectionStart } from '../../utils/haptic';
 import { createThemedClasses } from '../../utils/theme';
 
-
 @Component({
   tag: 'ion-reorder-group',
   styleUrl: 'reorder-group.scss'

core/src/components/reorder/reorder.tsx

@@ -1,4 +1,5 @@
 import { Component } from '@stencil/core';
+
 import { Mode } from '../../interface';
 
 @Component({

core/src/components/ripple-effect/ripple-effect.tsx

@@ -1,4 +1,5 @@
 import { Component, Element, EventListenerEnable, Listen, Method, Prop, QueueApi, Watch } from '@stencil/core';
+
 import { now } from '../../utils/helpers';
 
 @Component({
@@ -55,7 +56,9 @@ export class RippleEffect {
    */
   @Method()
   addRipple(pageX: number, pageY: number) {
-    let x: number, y: number, size: number;
+    let x: number;
+    let y: number;
+    let size: number;
 
     this.queue.read(() => {
       const rect = this.el.getBoundingClientRect();

core/src/components/router-outlet/route-outlet.tsx

@@ -1,9 +1,9 @@
 import { Component, Element, Event, EventEmitter, Method, Prop, QueueApi } from '@stencil/core';
+
 import { AnimationBuilder, ComponentProps, ComponentRef, Config, FrameworkDelegate, Mode, NavOutlet, RouteID, RouteWrite, RouterOutletOptions } from '../../interface';
 import { transition } from '../../utils';
 import { attachComponent, detachComponent } from '../../utils/framework-delegate';
 
-
 @Component({
   tag: 'ion-router-outlet',
   styleUrl: 'route-outlet.scss',

core/src/components/router/router.tsx

@@ -1,6 +1,8 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop, QueueApi } from '@stencil/core';
+
 import { Config, RouteChain, RouterDirection, RouterEventDetail } from '../../interface';
 import { debounce } from '../../utils/helpers';
+
 import { RouterIntent } from './utils/constants';
 import { printRedirects, printRoutes } from './utils/debug';
 import { readNavState, waitUntilNavNode, writeNavState } from './utils/dom';
@@ -8,7 +10,6 @@ import { routeRedirect, routerIDsToChain, routerPathToChain } from './utils/matc
 import { readRedirects, readRoutes } from './utils/parser';
 import { chainToPath, generatePath, parsePath, readPath, writePath } from './utils/path';
 
-
 @Component({
   tag: 'ion-router'
 })
@@ -198,7 +199,9 @@ export class Router {
 
     // generate route event and emit will change
     const routeEvent = this.routeChangeEvent(path, redirectFrom);
-    routeEvent && this.ionRouteWillChange.emit(routeEvent);
+    if (routeEvent) {
+      this.ionRouteWillChange.emit(routeEvent);
+    }
 
     const changed = await writeNavState(node, chain, intent, index);
     this.busy = false;
@@ -208,8 +211,9 @@ export class Router {
     }
 
     // emit did change
-    routeEvent && this.ionRouteDidChange.emit(routeEvent);
-
+    if (routeEvent) {
+      this.ionRouteDidChange.emit(routeEvent);
+    }
     return changed;
   }
 

core/src/components/router/test/e2e.spec.tsx

@@ -1,8 +1,10 @@
 import { TestWindow } from '@stencil/core/dist/testing';
+
 import { RouteChain, RouteID } from '../utils/interface';
 import { routerIDsToChain, routerPathToChain } from '../utils/matching';
 import { readRoutes } from '../utils/parser';
 import { chainToPath, generatePath, parsePath } from '../utils/path';
+
 import { mockRouteElement } from './parser.spec';
 
 describe('ionic-conference-app', () => {
@@ -48,7 +50,6 @@ describe('ionic-conference-app', () => {
     win = new TestWindow() as any;
   });
 
-
   function conferenceAppRouting() {
   const p2 = mockRouteElement(win, '/', 'tab-schedule');
   const p3 = mockRouteElement(win, '/', 'PAGE-SCHEDULE');
@@ -75,7 +76,6 @@ describe('ionic-conference-app', () => {
 }
 });
 
-
 export function getRouteIDs(path: string, routes: RouteChain[]): string[] {
   return routerPathToChain(parsePath(path), routes)!.map(r => r.id);
 }

core/src/components/router/test/matching.spec.tsx

@@ -27,8 +27,6 @@ const CHAIN_3: RouteChain = [
   { id: '4', path: [''], params: undefined },
 ];
 
-
-
 describe('matchesIDs', () => {
   it('should match simple set of ids', () => {
     const chain: RouteChain = CHAIN_1;
@@ -228,7 +226,6 @@ describe('mergeParams', () => {
   });
 });
 
-
 describe('RouterSegments', () => {
   it ('should initialize with empty array', () => {
     const s = new RouterSegments([]);
@@ -265,7 +262,6 @@ describe('matchesRedirect', () => {
     expect(matchesRedirect(['workouts', 'hola'], { from: ['workouts', '*'], to: [''] })).toBeTruthy();
     expect(matchesRedirect(['workouts', 'hola'], { from: ['workouts', 'hola'], to: [''] })).toBeTruthy();
 
-
     expect(matchesRedirect(['workouts'], { from: ['workouts', '*'], to: [''] })).toBeFalsy();
     expect(matchesRedirect(['workouts', 'hola'], { from: ['workouts'], to: [''] })).toBeFalsy();
     expect(matchesRedirect(['workouts', 'hola'], { from: ['workouts', 'adios'], to: [''] })).toBeFalsy();

core/src/components/router/test/parser.spec.tsx

@@ -1,4 +1,5 @@
 import { TestWindow } from '@stencil/core/dist/testing';
+
 import { RouteRedirect, RouteTree } from '../utils/interface';
 import { flattenRouterTree, readRedirects, readRouteNodes } from '../utils/parser';
 
@@ -107,4 +108,3 @@ export function mockRedirectElement(win: Window, from: string | undefined, to: s
   }
   return el;
 }
-

core/src/components/router/test/path.spec.tsx

@@ -43,7 +43,6 @@ describe('parseURL', () => {
   });
 });
 
-
 describe('generatePath', () => {
   it('should generate an empty URL', () => {
     expect(generatePath([])).toEqual('/');
@@ -68,7 +67,6 @@ describe('generatePath', () => {
   });
 });
 
-
 describe('chainToPath', () => {
   it('should generate a simple URL', () => {
     const chain: RouteChain = [
@@ -193,7 +191,6 @@ describe('writePath', () => {
     expect(history.pushState).toHaveBeenCalledWith(123, '', '/to/schedule');
   });
 
-
   it('should write non root path (no hash)', () => {
     const history = mockHistory();
     writePath(history, '/path', false, [''], RouterIntent.Forward, 2);
@@ -248,11 +245,9 @@ function mockHistory(): History {
   } as any;
 }
 
-
 function mockLocation(pathname: string, hash: string): Location {
   return {
     pathname,
     hash
   } as Location;
 }
-

core/src/components/router/utils/dom.ts

@@ -1,4 +1,5 @@
 import { NavOutletElement, RouteChain, RouteID } from '../../../interface';
+
 import { RouterIntent } from './constants';
 
 export async function writeNavState(
@@ -70,7 +71,7 @@ export function waitUntilNavNode(win: Window) {
   if (searchNavNode(win.document.body)) {
     return Promise.resolve();
   }
-  return new Promise((resolve) => {
+  return new Promise(resolve => {
     win.addEventListener('ionNavWillLoad', resolve, { once: true });
   });
 }

core/src/components/router/utils/interface.ts

@@ -1,5 +1,4 @@
 
-
 export interface NavOutlet {
   setRouteId(id: string, data: any, direction: number): Promise<RouteWrite>;
   getRouteId(): RouteID | undefined;

core/src/components/router/utils/matching.ts

@@ -1,6 +1,5 @@
 import { RouteChain, RouteID, RouteRedirect } from './interface';
 
-
 export function matchesRedirect(input: string[], route: RouteRedirect): route is RouteRedirect {
   const { from, to } = route;
   if (to === undefined) {
@@ -27,7 +26,6 @@ export function routeRedirect(path: string[], routes: RouteRedirect[]) {
   return routes.find(route => matchesRedirect(path, route)) as RouteRedirect | undefined;
 }
 
-
 export function matchesIDs(ids: string[], chain: RouteChain): number {
   const len = Math.min(ids.length, chain.length);
   let i = 0;
@@ -96,7 +94,6 @@ export function mergeParams(a: any, b: any): any {
   return undefined;
 }
 
-
 export function routerIDsToChain(ids: RouteID[], chains: RouteChain[]): RouteChain | null {
   let match: RouteChain | null = null;
   let maxMatches = 0;
@@ -118,7 +115,6 @@ export function routerIDsToChain(ids: RouteID[], chains: RouteChain[]): RouteCha
   return null;
 }
 
-
 export function routerPathToChain(path: string[], chains: RouteChain[]): RouteChain | null {
   let match: RouteChain | null = null;
   let matches = 0;
@@ -164,4 +160,3 @@ export class RouterSegments {
     return '';
   }
 }
-

core/src/components/router/utils/parser.ts

@@ -1,7 +1,6 @@
 import { RouteChain, RouteNode, RouteRedirect, RouteTree } from './interface';
 import { parsePath } from './path';
 
-
 export function readRedirects(root: Element): RouteRedirect[] {
   return (Array.from(root.children) as HTMLIonRouteRedirectElement[])
     .filter(el => el.tagName === 'ION-ROUTE-REDIRECT')

core/src/components/router/utils/path.ts

@@ -1,4 +1,5 @@
 import { RouteChain } from '../../../interface';
+
 import { RouterIntent } from './constants';
 
 export function generatePath(segments: string[]): string {
@@ -88,4 +89,3 @@ export function parsePath(path: string | undefined | null): string[] {
     return segments;
   }
 }
-