diff --git a/packages/core/package-lock.json b/packages/core/package-lock.json
index 6f1b7c024a..492eb927c4 100644
--- a/packages/core/package-lock.json
+++ b/packages/core/package-lock.json
@@ -14,9 +14,9 @@
       }
     },
     "@stencil/core": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-0.0.7.tgz",
-      "integrity": "sha512-mpS4l+aSm9i1dLFCGYXY8IDhfylh4+Aijxuzpi7G2VOmLmA/raZeS6hqtdg3pnTU72ckgdZ84D/+x4pgkluinQ==",
+      "version": "0.0.8-1",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-0.0.8-1.tgz",
+      "integrity": "sha512-CWeVxwFpzepOc1dOVimuG+S1Ga684ZpdmGCToOpmsQwabwAMbCLZEirEUCDumZ0IXhqw+2B00/Gg9myN1VZntw==",
       "dev": true,
       "requires": {
         "chokidar": "1.7.0",
@@ -28,14 +28,6 @@
         "typescript": "2.6.1",
         "uglify-es": "3.1.6",
         "workbox-build": "2.1.1"
-      },
-      "dependencies": {
-        "typescript": {
-          "version": "2.6.1",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.6.1.tgz",
-          "integrity": "sha1-7znN6ierrAtQAkLWcmq5DgyEZjE=",
-          "dev": true
-        }
       }
     },
     "@stencil/dev-server": {
@@ -7246,6 +7238,12 @@
       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
       "dev": true
     },
+    "typescript": {
+      "version": "2.6.1",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.6.1.tgz",
+      "integrity": "sha1-7znN6ierrAtQAkLWcmq5DgyEZjE=",
+      "dev": true
+    },
     "uglify-es": {
       "version": "3.1.6",
       "resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.1.6.tgz",
diff --git a/packages/core/package.json b/packages/core/package.json
index 74dc00a137..67fede9940 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -10,7 +10,7 @@
     "dist/"
   ],
   "devDependencies": {
-    "@stencil/core": "^0.0.7",
+    "@stencil/core": "0.0.8-1",
     "@stencil/dev-server": "0.0.18-0",
     "@stencil/utils": "latest",
     "@types/jest": "^21.1.0",
diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts
index 7db3eaf8d2..9c7bbe5f86 100644
--- a/packages/core/src/components.d.ts
+++ b/packages/core/src/components.d.ts
@@ -6,3243 +6,3318 @@
 
 import 'ionicons';
 
-import { ActionSheetController as IonActionSheetController } from './components/action-sheet-controller/action-sheet-controller';
+import {
+  ActionSheetButton,
+} from './components/action-sheet/action-sheet.js';
+import {
+  AnimationBuilder,
+  PickerOptions,
+  PickerColumn,
+} from './index';
+import {
+  AlertButton,
+  AlertInput,
+} from './components/alert/alert.js';
+import {
+  ElementRef,
+  Side,
+} from './utils/helpers';
+import {
+  GestureCallback,
+  GestureDetail,
+} from './components/gesture/gesture.js';
+import {
+  FrameworkDelegate,
+} from './navigation/nav-interfaces';
+import {
+  PickerButton,
+  PickerColumn as PickerColumn2,
+} from './components/picker/picker.js';
+import {
+  Event,
+} from '@stencil/core';
+import {
+  ScrollCallback,
+} from './components/scroll/scroll.js';
+import {
+  SelectPopoverOption,
+} from './components/select/select-popover.js';
+
+import {
+  ActionSheetController as IonActionSheetController
+} from './components/action-sheet-controller/action-sheet-controller';
 
-interface HTMLIonActionSheetControllerElement extends IonActionSheetController, HTMLElement {
-}
-declare var HTMLIonActionSheetControllerElement: {
-  prototype: HTMLIonActionSheetControllerElement;
-  new (): HTMLIonActionSheetControllerElement;
-};
 declare global {
+  interface HTMLIonActionSheetControllerElement extends IonActionSheetController, HTMLElement {
+  }
+  var HTMLIonActionSheetControllerElement: {
+    prototype: HTMLIonActionSheetControllerElement;
+    new (): HTMLIonActionSheetControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-action-sheet-controller": HTMLIonActionSheetControllerElement;
+    "ion-action-sheet-controller": HTMLIonActionSheetControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-action-sheet-controller": HTMLIonActionSheetControllerElement;
+    "ion-action-sheet-controller": HTMLIonActionSheetControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-action-sheet-controller": JSXElements.IonActionSheetControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-action-sheet-controller": JSXElements.IonActionSheetControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonActionSheetControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          create?: any
-      }
+    export interface IonActionSheetControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { ActionSheet as IonActionSheet } from './components/action-sheet/action-sheet';
 
-interface HTMLIonActionSheetElement extends IonActionSheet, HTMLElement {
-}
-declare var HTMLIonActionSheetElement: {
-  prototype: HTMLIonActionSheetElement;
-  new (): HTMLIonActionSheetElement;
-};
+import {
+  ActionSheet as IonActionSheet
+} from './components/action-sheet/action-sheet';
+
 declare global {
+  interface HTMLIonActionSheetElement extends IonActionSheet, HTMLElement {
+  }
+  var HTMLIonActionSheetElement: {
+    prototype: HTMLIonActionSheetElement;
+    new (): HTMLIonActionSheetElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-action-sheet": HTMLIonActionSheetElement;
+    "ion-action-sheet": HTMLIonActionSheetElement;
   }
   interface ElementTagNameMap {
-      "ion-action-sheet": HTMLIonActionSheetElement;
+    "ion-action-sheet": HTMLIonActionSheetElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-action-sheet": JSXElements.IonActionSheetAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-action-sheet": JSXElements.IonActionSheetAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonActionSheetAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          animationCtrl?: any,
-          cssClass?: string,
-          title?: string,
-          subTitle?: string,
-          buttons?: any,
-          enableBackdropDismiss?: boolean,
-          enterAnimation?: any,
-          exitAnimation?: any,
-          actionSheetId?: string
-      }
+    export interface IonActionSheetAttributes extends HTMLAttributes {
+      
+        cssClass?: string,
+        title?: string,
+        subTitle?: string,
+        buttons?: ActionSheetButton[],
+        enableBackdropDismiss?: boolean,
+        enterAnimation?: AnimationBuilder,
+        exitAnimation?: AnimationBuilder,
+        actionSheetId?: string
+    }
   }
 }
 
-import { AlertController as IonAlertController } from './components/alert-controller/alert-controller';
 
-interface HTMLIonAlertControllerElement extends IonAlertController, HTMLElement {
-}
-declare var HTMLIonAlertControllerElement: {
-  prototype: HTMLIonAlertControllerElement;
-  new (): HTMLIonAlertControllerElement;
-};
+import {
+  AlertController as IonAlertController
+} from './components/alert-controller/alert-controller';
+
 declare global {
+  interface HTMLIonAlertControllerElement extends IonAlertController, HTMLElement {
+  }
+  var HTMLIonAlertControllerElement: {
+    prototype: HTMLIonAlertControllerElement;
+    new (): HTMLIonAlertControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-alert-controller": HTMLIonAlertControllerElement;
+    "ion-alert-controller": HTMLIonAlertControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-alert-controller": HTMLIonAlertControllerElement;
+    "ion-alert-controller": HTMLIonAlertControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-alert-controller": JSXElements.IonAlertControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-alert-controller": JSXElements.IonAlertControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonAlertControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          create?: any
-      }
+    export interface IonAlertControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Alert as IonAlert } from './components/alert/alert';
 
-interface HTMLIonAlertElement extends IonAlert, HTMLElement {
-}
-declare var HTMLIonAlertElement: {
-  prototype: HTMLIonAlertElement;
-  new (): HTMLIonAlertElement;
-};
+import {
+  Alert as IonAlert
+} from './components/alert/alert';
+
 declare global {
+  interface HTMLIonAlertElement extends IonAlert, HTMLElement {
+  }
+  var HTMLIonAlertElement: {
+    prototype: HTMLIonAlertElement;
+    new (): HTMLIonAlertElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-alert": HTMLIonAlertElement;
+    "ion-alert": HTMLIonAlertElement;
   }
   interface ElementTagNameMap {
-      "ion-alert": HTMLIonAlertElement;
+    "ion-alert": HTMLIonAlertElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-alert": JSXElements.IonAlertAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-alert": JSXElements.IonAlertAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonAlertAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          animationCtrl?: any,
-          cssClass?: string,
-          title?: string,
-          subTitle?: string,
-          message?: string,
-          buttons?: any,
-          inputs?: any,
-          enableBackdropDismiss?: boolean,
-          enterAnimation?: any,
-          exitAnimation?: any,
-          alertId?: string
-      }
+    export interface IonAlertAttributes extends HTMLAttributes {
+      
+        cssClass?: string,
+        title?: string,
+        subTitle?: string,
+        message?: string,
+        buttons?: AlertButton[],
+        inputs?: AlertInput[],
+        enableBackdropDismiss?: boolean,
+        enterAnimation?: AnimationBuilder,
+        exitAnimation?: AnimationBuilder,
+        alertId?: string
+    }
   }
 }
 
-import { AnimationControllerImpl as IonAnimationController } from './components/animation-controller/animation-controller';
 
-interface HTMLIonAnimationControllerElement extends IonAnimationController, HTMLElement {
-}
-declare var HTMLIonAnimationControllerElement: {
-  prototype: HTMLIonAnimationControllerElement;
-  new (): HTMLIonAnimationControllerElement;
-};
+import {
+  AnimationControllerImpl as IonAnimationController
+} from './components/animation-controller/animation-controller';
+
 declare global {
+  interface HTMLIonAnimationControllerElement extends IonAnimationController, HTMLElement {
+  }
+  var HTMLIonAnimationControllerElement: {
+    prototype: HTMLIonAnimationControllerElement;
+    new (): HTMLIonAnimationControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-animation-controller": HTMLIonAnimationControllerElement;
+    "ion-animation-controller": HTMLIonAnimationControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-animation-controller": HTMLIonAnimationControllerElement;
+    "ion-animation-controller": HTMLIonAnimationControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-animation-controller": JSXElements.IonAnimationControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-animation-controller": JSXElements.IonAnimationControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonAnimationControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          create?: any
-      }
+    export interface IonAnimationControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { IonApp as IonApp } from './components/app/app';
 
-interface HTMLIonAppElement extends IonApp, HTMLElement {
-}
-declare var HTMLIonAppElement: {
-  prototype: HTMLIonAppElement;
-  new (): HTMLIonAppElement;
-};
+import {
+  IonApp as IonApp
+} from './components/app/app';
+
 declare global {
+  interface HTMLIonAppElement extends IonApp, HTMLElement {
+  }
+  var HTMLIonAppElement: {
+    prototype: HTMLIonAppElement;
+    new (): HTMLIonAppElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-app": HTMLIonAppElement;
+    "ion-app": HTMLIonAppElement;
   }
   interface ElementTagNameMap {
-      "ion-app": HTMLIonAppElement;
+    "ion-app": HTMLIonAppElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-app": JSXElements.IonAppAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-app": JSXElements.IonAppAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonAppAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonAppAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Avatar as IonAvatar } from './components/avatar/avatar';
 
-interface HTMLIonAvatarElement extends IonAvatar, HTMLElement {
-}
-declare var HTMLIonAvatarElement: {
-  prototype: HTMLIonAvatarElement;
-  new (): HTMLIonAvatarElement;
-};
+import {
+  Avatar as IonAvatar
+} from './components/avatar/avatar';
+
 declare global {
+  interface HTMLIonAvatarElement extends IonAvatar, HTMLElement {
+  }
+  var HTMLIonAvatarElement: {
+    prototype: HTMLIonAvatarElement;
+    new (): HTMLIonAvatarElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-avatar": HTMLIonAvatarElement;
+    "ion-avatar": HTMLIonAvatarElement;
   }
   interface ElementTagNameMap {
-      "ion-avatar": HTMLIonAvatarElement;
+    "ion-avatar": HTMLIonAvatarElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-avatar": JSXElements.IonAvatarAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-avatar": JSXElements.IonAvatarAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonAvatarAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonAvatarAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Backdrop as IonBackdrop } from './components/backdrop/backdrop';
 
-interface HTMLIonBackdropElement extends IonBackdrop, HTMLElement {
-}
-declare var HTMLIonBackdropElement: {
-  prototype: HTMLIonBackdropElement;
-  new (): HTMLIonBackdropElement;
-};
+import {
+  Backdrop as IonBackdrop
+} from './components/backdrop/backdrop';
+
 declare global {
+  interface HTMLIonBackdropElement extends IonBackdrop, HTMLElement {
+  }
+  var HTMLIonBackdropElement: {
+    prototype: HTMLIonBackdropElement;
+    new (): HTMLIonBackdropElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-backdrop": HTMLIonBackdropElement;
+    "ion-backdrop": HTMLIonBackdropElement;
   }
   interface ElementTagNameMap {
-      "ion-backdrop": HTMLIonBackdropElement;
+    "ion-backdrop": HTMLIonBackdropElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-backdrop": JSXElements.IonBackdropAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-backdrop": JSXElements.IonBackdropAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonBackdropAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonBackdropAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Badge as IonBadge } from './components/badge/badge';
 
-interface HTMLIonBadgeElement extends IonBadge, HTMLElement {
-}
-declare var HTMLIonBadgeElement: {
-  prototype: HTMLIonBadgeElement;
-  new (): HTMLIonBadgeElement;
-};
+import {
+  Badge as IonBadge
+} from './components/badge/badge';
+
 declare global {
+  interface HTMLIonBadgeElement extends IonBadge, HTMLElement {
+  }
+  var HTMLIonBadgeElement: {
+    prototype: HTMLIonBadgeElement;
+    new (): HTMLIonBadgeElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-badge": HTMLIonBadgeElement;
+    "ion-badge": HTMLIonBadgeElement;
   }
   interface ElementTagNameMap {
-      "ion-badge": HTMLIonBadgeElement;
+    "ion-badge": HTMLIonBadgeElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-badge": JSXElements.IonBadgeAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-badge": JSXElements.IonBadgeAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonBadgeAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonBadgeAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { Button as IonButton } from './components/button/button';
 
-interface HTMLIonButtonElement extends IonButton, HTMLElement {
-}
-declare var HTMLIonButtonElement: {
-  prototype: HTMLIonButtonElement;
-  new (): HTMLIonButtonElement;
-};
+import {
+  Button as IonButton
+} from './components/button/button';
+
 declare global {
+  interface HTMLIonButtonElement extends IonButton, HTMLElement {
+  }
+  var HTMLIonButtonElement: {
+    prototype: HTMLIonButtonElement;
+    new (): HTMLIonButtonElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-button": HTMLIonButtonElement;
+    "ion-button": HTMLIonButtonElement;
   }
   interface ElementTagNameMap {
-      "ion-button": HTMLIonButtonElement;
+    "ion-button": HTMLIonButtonElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-button": JSXElements.IonButtonAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-button": JSXElements.IonButtonAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonButtonAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          itemButton?: boolean,
-          href?: string,
-          buttonType?: string,
-          large?: boolean,
-          small?: boolean,
-          default?: boolean,
-          disabled?: boolean,
-          outline?: boolean,
-          clear?: boolean,
-          solid?: boolean,
-          round?: boolean,
-          block?: boolean,
-          full?: boolean,
-          strong?: boolean
-      }
+    export interface IonButtonAttributes extends HTMLAttributes {
+      
+        itemButton?: boolean,
+        href?: string,
+        buttonType?: string,
+        large?: boolean,
+        small?: boolean,
+        default?: boolean,
+        disabled?: boolean,
+        outline?: boolean,
+        clear?: boolean,
+        solid?: boolean,
+        round?: boolean,
+        block?: boolean,
+        full?: boolean,
+        strong?: boolean,
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { Buttons as IonButtons } from './components/buttons/buttons';
 
-interface HTMLIonButtonsElement extends IonButtons, HTMLElement {
-}
-declare var HTMLIonButtonsElement: {
-  prototype: HTMLIonButtonsElement;
-  new (): HTMLIonButtonsElement;
-};
+import {
+  Buttons as IonButtons
+} from './components/buttons/buttons';
+
 declare global {
+  interface HTMLIonButtonsElement extends IonButtons, HTMLElement {
+  }
+  var HTMLIonButtonsElement: {
+    prototype: HTMLIonButtonsElement;
+    new (): HTMLIonButtonsElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-buttons": HTMLIonButtonsElement;
+    "ion-buttons": HTMLIonButtonsElement;
   }
   interface ElementTagNameMap {
-      "ion-buttons": HTMLIonButtonsElement;
+    "ion-buttons": HTMLIonButtonsElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-buttons": JSXElements.IonButtonsAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-buttons": JSXElements.IonButtonsAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonButtonsAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonButtonsAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { CardContent as IonCardContent } from './components/card-content/card-content';
 
-interface HTMLIonCardContentElement extends IonCardContent, HTMLElement {
-}
-declare var HTMLIonCardContentElement: {
-  prototype: HTMLIonCardContentElement;
-  new (): HTMLIonCardContentElement;
-};
+import {
+  CardContent as IonCardContent
+} from './components/card-content/card-content';
+
 declare global {
+  interface HTMLIonCardContentElement extends IonCardContent, HTMLElement {
+  }
+  var HTMLIonCardContentElement: {
+    prototype: HTMLIonCardContentElement;
+    new (): HTMLIonCardContentElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-card-content": HTMLIonCardContentElement;
+    "ion-card-content": HTMLIonCardContentElement;
   }
   interface ElementTagNameMap {
-      "ion-card-content": HTMLIonCardContentElement;
+    "ion-card-content": HTMLIonCardContentElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-card-content": JSXElements.IonCardContentAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-card-content": JSXElements.IonCardContentAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonCardContentAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonCardContentAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { CardHeader as IonCardHeader } from './components/card-header/card-header';
 
-interface HTMLIonCardHeaderElement extends IonCardHeader, HTMLElement {
-}
-declare var HTMLIonCardHeaderElement: {
-  prototype: HTMLIonCardHeaderElement;
-  new (): HTMLIonCardHeaderElement;
-};
+import {
+  CardHeader as IonCardHeader
+} from './components/card-header/card-header';
+
 declare global {
+  interface HTMLIonCardHeaderElement extends IonCardHeader, HTMLElement {
+  }
+  var HTMLIonCardHeaderElement: {
+    prototype: HTMLIonCardHeaderElement;
+    new (): HTMLIonCardHeaderElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-card-header": HTMLIonCardHeaderElement;
+    "ion-card-header": HTMLIonCardHeaderElement;
   }
   interface ElementTagNameMap {
-      "ion-card-header": HTMLIonCardHeaderElement;
+    "ion-card-header": HTMLIonCardHeaderElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-card-header": JSXElements.IonCardHeaderAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-card-header": JSXElements.IonCardHeaderAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonCardHeaderAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonCardHeaderAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { CardTitle as IonCardTitle } from './components/card-title/card-title';
 
-interface HTMLIonCardTitleElement extends IonCardTitle, HTMLElement {
-}
-declare var HTMLIonCardTitleElement: {
-  prototype: HTMLIonCardTitleElement;
-  new (): HTMLIonCardTitleElement;
-};
+import {
+  CardTitle as IonCardTitle
+} from './components/card-title/card-title';
+
 declare global {
+  interface HTMLIonCardTitleElement extends IonCardTitle, HTMLElement {
+  }
+  var HTMLIonCardTitleElement: {
+    prototype: HTMLIonCardTitleElement;
+    new (): HTMLIonCardTitleElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-card-title": HTMLIonCardTitleElement;
+    "ion-card-title": HTMLIonCardTitleElement;
   }
   interface ElementTagNameMap {
-      "ion-card-title": HTMLIonCardTitleElement;
+    "ion-card-title": HTMLIonCardTitleElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-card-title": JSXElements.IonCardTitleAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-card-title": JSXElements.IonCardTitleAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonCardTitleAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonCardTitleAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { Card as IonCard } from './components/card/card';
 
-interface HTMLIonCardElement extends IonCard, HTMLElement {
-}
-declare var HTMLIonCardElement: {
-  prototype: HTMLIonCardElement;
-  new (): HTMLIonCardElement;
-};
+import {
+  Card as IonCard
+} from './components/card/card';
+
 declare global {
+  interface HTMLIonCardElement extends IonCard, HTMLElement {
+  }
+  var HTMLIonCardElement: {
+    prototype: HTMLIonCardElement;
+    new (): HTMLIonCardElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-card": HTMLIonCardElement;
+    "ion-card": HTMLIonCardElement;
   }
   interface ElementTagNameMap {
-      "ion-card": HTMLIonCardElement;
+    "ion-card": HTMLIonCardElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-card": JSXElements.IonCardAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-card": JSXElements.IonCardAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonCardAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonCardAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { Checkbox as IonCheckbox } from './components/checkbox/checkbox';
 
-interface HTMLIonCheckboxElement extends IonCheckbox, HTMLElement {
-}
-declare var HTMLIonCheckboxElement: {
-  prototype: HTMLIonCheckboxElement;
-  new (): HTMLIonCheckboxElement;
-};
+import {
+  Checkbox as IonCheckbox
+} from './components/checkbox/checkbox';
+
 declare global {
+  interface HTMLIonCheckboxElement extends IonCheckbox, HTMLElement {
+  }
+  var HTMLIonCheckboxElement: {
+    prototype: HTMLIonCheckboxElement;
+    new (): HTMLIonCheckboxElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-checkbox": HTMLIonCheckboxElement;
+    "ion-checkbox": HTMLIonCheckboxElement;
   }
   interface ElementTagNameMap {
-      "ion-checkbox": HTMLIonCheckboxElement;
+    "ion-checkbox": HTMLIonCheckboxElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-checkbox": JSXElements.IonCheckboxAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-checkbox": JSXElements.IonCheckboxAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonCheckboxAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          checked?: boolean,
-          disabled?: boolean,
-          value?: string
-      }
+    export interface IonCheckboxAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        checked?: boolean,
+        disabled?: boolean,
+        value?: string
+    }
   }
 }
 
-import { ChipButton as IonChipButton } from './components/chip-button/chip-button';
 
-interface HTMLIonChipButtonElement extends IonChipButton, HTMLElement {
-}
-declare var HTMLIonChipButtonElement: {
-  prototype: HTMLIonChipButtonElement;
-  new (): HTMLIonChipButtonElement;
-};
+import {
+  ChipButton as IonChipButton
+} from './components/chip-button/chip-button';
+
 declare global {
+  interface HTMLIonChipButtonElement extends IonChipButton, HTMLElement {
+  }
+  var HTMLIonChipButtonElement: {
+    prototype: HTMLIonChipButtonElement;
+    new (): HTMLIonChipButtonElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-chip-button": HTMLIonChipButtonElement;
+    "ion-chip-button": HTMLIonChipButtonElement;
   }
   interface ElementTagNameMap {
-      "ion-chip-button": HTMLIonChipButtonElement;
+    "ion-chip-button": HTMLIonChipButtonElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-chip-button": JSXElements.IonChipButtonAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-chip-button": JSXElements.IonChipButtonAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonChipButtonAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          href?: string,
-          clear?: boolean,
-          disabled?: boolean
-      }
+    export interface IonChipButtonAttributes extends HTMLAttributes {
+      
+        href?: string,
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        clear?: boolean,
+        disabled?: boolean
+    }
   }
 }
 
-import { Chip as IonChip } from './components/chip/chip';
 
-interface HTMLIonChipElement extends IonChip, HTMLElement {
-}
-declare var HTMLIonChipElement: {
-  prototype: HTMLIonChipElement;
-  new (): HTMLIonChipElement;
-};
+import {
+  Chip as IonChip
+} from './components/chip/chip';
+
 declare global {
+  interface HTMLIonChipElement extends IonChip, HTMLElement {
+  }
+  var HTMLIonChipElement: {
+    prototype: HTMLIonChipElement;
+    new (): HTMLIonChipElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-chip": HTMLIonChipElement;
+    "ion-chip": HTMLIonChipElement;
   }
   interface ElementTagNameMap {
-      "ion-chip": HTMLIonChipElement;
+    "ion-chip": HTMLIonChipElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-chip": JSXElements.IonChipAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-chip": JSXElements.IonChipAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonChipAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonChipAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { Content as IonContent } from './components/content/content';
 
-interface HTMLIonContentElement extends IonContent, HTMLElement {
-}
-declare var HTMLIonContentElement: {
-  prototype: HTMLIonContentElement;
-  new (): HTMLIonContentElement;
-};
+import {
+  Content as IonContent
+} from './components/content/content';
+
 declare global {
+  interface HTMLIonContentElement extends IonContent, HTMLElement {
+  }
+  var HTMLIonContentElement: {
+    prototype: HTMLIonContentElement;
+    new (): HTMLIonContentElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-content": HTMLIonContentElement;
+    "ion-content": HTMLIonContentElement;
   }
   interface ElementTagNameMap {
-      "ion-content": HTMLIonContentElement;
+    "ion-content": HTMLIonContentElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-content": JSXElements.IonContentAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-content": JSXElements.IonContentAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonContentAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          enableJsScroll?: any,
-          scrollToTop?: any,
-          scrollToBottom?: any,
-          ionScrollStart?: any,
-          ionScroll?: any,
-          ionScrollEnd?: any,
-          fullscreen?: boolean
-      }
+    export interface IonContentAttributes extends HTMLAttributes {
+      
+        ionScrollStart?: Function,
+        ionScroll?: Function,
+        ionScrollEnd?: Function,
+        fullscreen?: boolean
+    }
   }
 }
 
-import { Datetime as IonDatetime } from './components/datetime/datetime';
 
-interface HTMLIonDatetimeElement extends IonDatetime, HTMLElement {
-}
-declare var HTMLIonDatetimeElement: {
-  prototype: HTMLIonDatetimeElement;
-  new (): HTMLIonDatetimeElement;
-};
+import {
+  Datetime as IonDatetime
+} from './components/datetime/datetime';
+
 declare global {
+  interface HTMLIonDatetimeElement extends IonDatetime, HTMLElement {
+  }
+  var HTMLIonDatetimeElement: {
+    prototype: HTMLIonDatetimeElement;
+    new (): HTMLIonDatetimeElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-datetime": HTMLIonDatetimeElement;
+    "ion-datetime": HTMLIonDatetimeElement;
   }
   interface ElementTagNameMap {
-      "ion-datetime": HTMLIonDatetimeElement;
+    "ion-datetime": HTMLIonDatetimeElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-datetime": JSXElements.IonDatetimeAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-datetime": JSXElements.IonDatetimeAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonDatetimeAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          pickerCtrl?: any,
-          disabled?: boolean,
-          min?: string,
-          max?: string,
-          displayFormat?: string,
-          pickerFormat?: string,
-          cancelText?: string,
-          doneText?: string,
-          yearValues?: any,
-          monthValues?: any,
-          dayValues?: any,
-          hourValues?: any,
-          minuteValues?: any,
-          monthNames?: any,
-          monthShortNames?: any,
-          dayNames?: any,
-          dayShortNames?: any,
-          pickerOptions?: any,
-          placeholder?: string,
-          value?: string
-      }
+    export interface IonDatetimeAttributes extends HTMLAttributes {
+      
+        disabled?: boolean,
+        min?: string,
+        max?: string,
+        displayFormat?: string,
+        pickerFormat?: string,
+        cancelText?: string,
+        doneText?: string,
+        yearValues?: any,
+        monthValues?: any,
+        dayValues?: any,
+        hourValues?: any,
+        minuteValues?: any,
+        monthNames?: any,
+        monthShortNames?: any,
+        dayNames?: any,
+        dayShortNames?: any,
+        pickerOptions?: PickerOptions,
+        placeholder?: string,
+        value?: string
+    }
   }
 }
 
-import { FabContainer as IonFab } from './components/fab/fab-container';
 
-interface HTMLIonFabElement extends IonFab, HTMLElement {
-}
-declare var HTMLIonFabElement: {
-  prototype: HTMLIonFabElement;
-  new (): HTMLIonFabElement;
-};
+import {
+  FabContainer as IonFab
+} from './components/fab/fab-container';
+
 declare global {
+  interface HTMLIonFabElement extends IonFab, HTMLElement {
+  }
+  var HTMLIonFabElement: {
+    prototype: HTMLIonFabElement;
+    new (): HTMLIonFabElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-fab": HTMLIonFabElement;
+    "ion-fab": HTMLIonFabElement;
   }
   interface ElementTagNameMap {
-      "ion-fab": HTMLIonFabElement;
+    "ion-fab": HTMLIonFabElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-fab": JSXElements.IonFabAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-fab": JSXElements.IonFabAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonFabAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          close?: any
-      }
+    export interface IonFabAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { FabList as IonFabList } from './components/fab/fab-list';
 
-interface HTMLIonFabListElement extends IonFabList, HTMLElement {
-}
-declare var HTMLIonFabListElement: {
-  prototype: HTMLIonFabListElement;
-  new (): HTMLIonFabListElement;
-};
+import {
+  FabList as IonFabList
+} from './components/fab/fab-list';
+
 declare global {
+  interface HTMLIonFabListElement extends IonFabList, HTMLElement {
+  }
+  var HTMLIonFabListElement: {
+    prototype: HTMLIonFabListElement;
+    new (): HTMLIonFabListElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-fab-list": HTMLIonFabListElement;
+    "ion-fab-list": HTMLIonFabListElement;
   }
   interface ElementTagNameMap {
-      "ion-fab-list": HTMLIonFabListElement;
+    "ion-fab-list": HTMLIonFabListElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-fab-list": JSXElements.IonFabListAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-fab-list": JSXElements.IonFabListAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonFabListAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          activated?: boolean
-      }
+    export interface IonFabListAttributes extends HTMLAttributes {
+      
+        activated?: boolean
+    }
   }
 }
 
-import { FabButton as IonFabButton } from './components/fab/fab';
 
-interface HTMLIonFabButtonElement extends IonFabButton, HTMLElement {
-}
-declare var HTMLIonFabButtonElement: {
-  prototype: HTMLIonFabButtonElement;
-  new (): HTMLIonFabButtonElement;
-};
+import {
+  FabButton as IonFabButton
+} from './components/fab/fab';
+
 declare global {
+  interface HTMLIonFabButtonElement extends IonFabButton, HTMLElement {
+  }
+  var HTMLIonFabButtonElement: {
+    prototype: HTMLIonFabButtonElement;
+    new (): HTMLIonFabButtonElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-fab-button": HTMLIonFabButtonElement;
+    "ion-fab-button": HTMLIonFabButtonElement;
   }
   interface ElementTagNameMap {
-      "ion-fab-button": HTMLIonFabButtonElement;
+    "ion-fab-button": HTMLIonFabButtonElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-fab-button": JSXElements.IonFabButtonAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-fab-button": JSXElements.IonFabButtonAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonFabButtonAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          href?: string,
-          activated?: boolean,
-          toggleActive?: any,
-          show?: boolean,
-          disabled?: boolean
-      }
+    export interface IonFabButtonAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        href?: string,
+        activated?: boolean,
+        toggleActive?: Function,
+        show?: boolean,
+        disabled?: boolean
+    }
   }
 }
 
-import { Footer as IonFooter } from './components/footer/footer';
 
-interface HTMLIonFooterElement extends IonFooter, HTMLElement {
-}
-declare var HTMLIonFooterElement: {
-  prototype: HTMLIonFooterElement;
-  new (): HTMLIonFooterElement;
-};
+import {
+  Footer as IonFooter
+} from './components/footer/footer';
+
 declare global {
+  interface HTMLIonFooterElement extends IonFooter, HTMLElement {
+  }
+  var HTMLIonFooterElement: {
+    prototype: HTMLIonFooterElement;
+    new (): HTMLIonFooterElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-footer": HTMLIonFooterElement;
+    "ion-footer": HTMLIonFooterElement;
   }
   interface ElementTagNameMap {
-      "ion-footer": HTMLIonFooterElement;
+    "ion-footer": HTMLIonFooterElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-footer": JSXElements.IonFooterAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-footer": JSXElements.IonFooterAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonFooterAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonFooterAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { GestureController as IonGestureController } from './components/gesture-controller/gesture-controller';
 
-interface HTMLIonGestureControllerElement extends IonGestureController, HTMLElement {
-}
-declare var HTMLIonGestureControllerElement: {
-  prototype: HTMLIonGestureControllerElement;
-  new (): HTMLIonGestureControllerElement;
-};
+import {
+  GestureController as IonGestureController
+} from './components/gesture-controller/gesture-controller';
+
 declare global {
+  interface HTMLIonGestureControllerElement extends IonGestureController, HTMLElement {
+  }
+  var HTMLIonGestureControllerElement: {
+    prototype: HTMLIonGestureControllerElement;
+    new (): HTMLIonGestureControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-gesture-controller": HTMLIonGestureControllerElement;
+    "ion-gesture-controller": HTMLIonGestureControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-gesture-controller": HTMLIonGestureControllerElement;
+    "ion-gesture-controller": HTMLIonGestureControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-gesture-controller": JSXElements.IonGestureControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-gesture-controller": JSXElements.IonGestureControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonGestureControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonGestureControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Gesture as IonGesture } from './components/gesture/gesture';
 
-interface HTMLIonGestureElement extends IonGesture, HTMLElement {
-}
-declare var HTMLIonGestureElement: {
-  prototype: HTMLIonGestureElement;
-  new (): HTMLIonGestureElement;
-};
+import {
+  Gesture as IonGesture
+} from './components/gesture/gesture';
+
 declare global {
+  interface HTMLIonGestureElement extends IonGesture, HTMLElement {
+  }
+  var HTMLIonGestureElement: {
+    prototype: HTMLIonGestureElement;
+    new (): HTMLIonGestureElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-gesture": HTMLIonGestureElement;
+    "ion-gesture": HTMLIonGestureElement;
   }
   interface ElementTagNameMap {
-      "ion-gesture": HTMLIonGestureElement;
+    "ion-gesture": HTMLIonGestureElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-gesture": JSXElements.IonGestureAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-gesture": JSXElements.IonGestureAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonGestureAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          enabled?: boolean,
-          attachTo?: string,
-          autoBlockAll?: boolean,
-          block?: string,
-          disableScroll?: boolean,
-          direction?: string,
-          gestureName?: string,
-          gesturePriority?: number,
-          maxAngle?: number,
-          threshold?: number,
-          type?: string,
-          canStart?: any,
-          onWillStart?: any,
-          onStart?: any,
-          onMove?: any,
-          onEnd?: any,
-          onPress?: any,
-          notCaptured?: any
-      }
+    export interface IonGestureAttributes extends HTMLAttributes {
+      
+        enabled?: boolean,
+        attachTo?: ElementRef,
+        autoBlockAll?: boolean,
+        block?: string,
+        disableScroll?: boolean,
+        direction?: string,
+        gestureName?: string,
+        gesturePriority?: number,
+        maxAngle?: number,
+        threshold?: number,
+        type?: string,
+        canStart?: GestureCallback,
+        onWillStart?: (_: GestureDetail) => Promise<void>,
+        onStart?: GestureCallback,
+        onMove?: GestureCallback,
+        onEnd?: GestureCallback,
+        onPress?: GestureCallback,
+        notCaptured?: GestureCallback
+    }
   }
 }
 
-import { Col as IonCol } from './components/grid/col';
 
-interface HTMLIonColElement extends IonCol, HTMLElement {
-}
-declare var HTMLIonColElement: {
-  prototype: HTMLIonColElement;
-  new (): HTMLIonColElement;
-};
+import {
+  Col as IonCol
+} from './components/grid/col';
+
 declare global {
+  interface HTMLIonColElement extends IonCol, HTMLElement {
+  }
+  var HTMLIonColElement: {
+    prototype: HTMLIonColElement;
+    new (): HTMLIonColElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-col": HTMLIonColElement;
+    "ion-col": HTMLIonColElement;
   }
   interface ElementTagNameMap {
-      "ion-col": HTMLIonColElement;
+    "ion-col": HTMLIonColElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-col": JSXElements.IonColAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-col": JSXElements.IonColAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonColAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonColAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Grid as IonGrid } from './components/grid/grid';
 
-interface HTMLIonGridElement extends IonGrid, HTMLElement {
-}
-declare var HTMLIonGridElement: {
-  prototype: HTMLIonGridElement;
-  new (): HTMLIonGridElement;
-};
+import {
+  Grid as IonGrid
+} from './components/grid/grid';
+
 declare global {
+  interface HTMLIonGridElement extends IonGrid, HTMLElement {
+  }
+  var HTMLIonGridElement: {
+    prototype: HTMLIonGridElement;
+    new (): HTMLIonGridElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-grid": HTMLIonGridElement;
+    "ion-grid": HTMLIonGridElement;
   }
   interface ElementTagNameMap {
-      "ion-grid": HTMLIonGridElement;
+    "ion-grid": HTMLIonGridElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-grid": JSXElements.IonGridAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-grid": JSXElements.IonGridAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonGridAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonGridAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Row as IonRow } from './components/grid/row';
 
-interface HTMLIonRowElement extends IonRow, HTMLElement {
-}
-declare var HTMLIonRowElement: {
-  prototype: HTMLIonRowElement;
-  new (): HTMLIonRowElement;
-};
+import {
+  Row as IonRow
+} from './components/grid/row';
+
 declare global {
+  interface HTMLIonRowElement extends IonRow, HTMLElement {
+  }
+  var HTMLIonRowElement: {
+    prototype: HTMLIonRowElement;
+    new (): HTMLIonRowElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-row": HTMLIonRowElement;
+    "ion-row": HTMLIonRowElement;
   }
   interface ElementTagNameMap {
-      "ion-row": HTMLIonRowElement;
+    "ion-row": HTMLIonRowElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-row": JSXElements.IonRowAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-row": JSXElements.IonRowAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonRowAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonRowAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Header as IonHeader } from './components/header/header';
 
-interface HTMLIonHeaderElement extends IonHeader, HTMLElement {
-}
-declare var HTMLIonHeaderElement: {
-  prototype: HTMLIonHeaderElement;
-  new (): HTMLIonHeaderElement;
-};
+import {
+  Header as IonHeader
+} from './components/header/header';
+
 declare global {
+  interface HTMLIonHeaderElement extends IonHeader, HTMLElement {
+  }
+  var HTMLIonHeaderElement: {
+    prototype: HTMLIonHeaderElement;
+    new (): HTMLIonHeaderElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-header": HTMLIonHeaderElement;
+    "ion-header": HTMLIonHeaderElement;
   }
   interface ElementTagNameMap {
-      "ion-header": HTMLIonHeaderElement;
+    "ion-header": HTMLIonHeaderElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-header": JSXElements.IonHeaderAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-header": JSXElements.IonHeaderAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonHeaderAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonHeaderAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { InfiniteScrollContent as IonInfiniteScrollContent } from './components/infinite-scroll/infinite-scroll-content';
 
-interface HTMLIonInfiniteScrollContentElement extends IonInfiniteScrollContent, HTMLElement {
-}
-declare var HTMLIonInfiniteScrollContentElement: {
-  prototype: HTMLIonInfiniteScrollContentElement;
-  new (): HTMLIonInfiniteScrollContentElement;
-};
+import {
+  InfiniteScrollContent as IonInfiniteScrollContent
+} from './components/infinite-scroll/infinite-scroll-content';
+
 declare global {
+  interface HTMLIonInfiniteScrollContentElement extends IonInfiniteScrollContent, HTMLElement {
+  }
+  var HTMLIonInfiniteScrollContentElement: {
+    prototype: HTMLIonInfiniteScrollContentElement;
+    new (): HTMLIonInfiniteScrollContentElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-infinite-scroll-content": HTMLIonInfiniteScrollContentElement;
+    "ion-infinite-scroll-content": HTMLIonInfiniteScrollContentElement;
   }
   interface ElementTagNameMap {
-      "ion-infinite-scroll-content": HTMLIonInfiniteScrollContentElement;
+    "ion-infinite-scroll-content": HTMLIonInfiniteScrollContentElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-infinite-scroll-content": JSXElements.IonInfiniteScrollContentAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-infinite-scroll-content": JSXElements.IonInfiniteScrollContentAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonInfiniteScrollContentAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          loadingSpinner?: string,
-          loadingText?: string
-      }
+    export interface IonInfiniteScrollContentAttributes extends HTMLAttributes {
+      
+        loadingSpinner?: string,
+        loadingText?: string
+    }
   }
 }
 
-import { InfiniteScroll as IonInfiniteScroll } from './components/infinite-scroll/infinite-scroll';
 
-interface HTMLIonInfiniteScrollElement extends IonInfiniteScroll, HTMLElement {
-}
-declare var HTMLIonInfiniteScrollElement: {
-  prototype: HTMLIonInfiniteScrollElement;
-  new (): HTMLIonInfiniteScrollElement;
-};
+import {
+  InfiniteScroll as IonInfiniteScroll
+} from './components/infinite-scroll/infinite-scroll';
+
 declare global {
+  interface HTMLIonInfiniteScrollElement extends IonInfiniteScroll, HTMLElement {
+  }
+  var HTMLIonInfiniteScrollElement: {
+    prototype: HTMLIonInfiniteScrollElement;
+    new (): HTMLIonInfiniteScrollElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-infinite-scroll": HTMLIonInfiniteScrollElement;
+    "ion-infinite-scroll": HTMLIonInfiniteScrollElement;
   }
   interface ElementTagNameMap {
-      "ion-infinite-scroll": HTMLIonInfiniteScrollElement;
+    "ion-infinite-scroll": HTMLIonInfiniteScrollElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-infinite-scroll": JSXElements.IonInfiniteScrollAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-infinite-scroll": JSXElements.IonInfiniteScrollAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonInfiniteScrollAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          complete?: any,
-          threshold?: string,
-          enabled?: boolean,
-          position?: string
-      }
+    export interface IonInfiniteScrollAttributes extends HTMLAttributes {
+      
+        threshold?: string,
+        enabled?: boolean,
+        position?: string
+    }
   }
 }
 
-import { Input as IonInput } from './components/input/input';
 
-interface HTMLIonInputElement extends IonInput, HTMLElement {
-}
-declare var HTMLIonInputElement: {
-  prototype: HTMLIonInputElement;
-  new (): HTMLIonInputElement;
-};
+import {
+  Input as IonInput
+} from './components/input/input';
+
 declare global {
+  interface HTMLIonInputElement extends IonInput, HTMLElement {
+  }
+  var HTMLIonInputElement: {
+    prototype: HTMLIonInputElement;
+    new (): HTMLIonInputElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-input": HTMLIonInputElement;
+    "ion-input": HTMLIonInputElement;
   }
   interface ElementTagNameMap {
-      "ion-input": HTMLIonInputElement;
+    "ion-input": HTMLIonInputElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-input": JSXElements.IonInputAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-input": JSXElements.IonInputAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonInputAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          accept?: string,
-          autocapitalize?: string,
-          autocomplete?: string,
-          autocorrect?: string,
-          autofocus?: boolean,
-          checked?: boolean,
-          clearInput?: boolean,
-          clearOnEdit?: boolean,
-          disabled?: boolean,
-          inputmode?: string,
-          max?: string,
-          maxlength?: number,
-          min?: string,
-          minlength?: number,
-          multiple?: boolean,
-          name?: string,
-          pattern?: string,
-          placeholder?: string,
-          readonly?: boolean,
-          required?: boolean,
-          results?: number,
-          spellcheck?: boolean,
-          step?: string,
-          size?: number,
-          type?: string,
-          value?: string
-      }
+    export interface IonInputAttributes extends HTMLAttributes {
+      
+        accept?: string,
+        autocapitalize?: string,
+        autocomplete?: string,
+        autocorrect?: string,
+        autofocus?: boolean,
+        checked?: boolean,
+        clearInput?: boolean,
+        clearOnEdit?: boolean,
+        disabled?: boolean,
+        inputmode?: string,
+        max?: string,
+        maxlength?: number,
+        min?: string,
+        minlength?: number,
+        multiple?: boolean,
+        name?: string,
+        pattern?: string,
+        placeholder?: string,
+        readonly?: boolean,
+        required?: boolean,
+        results?: number,
+        spellcheck?: boolean,
+        step?: string,
+        size?: number,
+        type?: string,
+        value?: string
+    }
   }
 }
 
-import { Textarea as IonTextarea } from './components/input/textarea';
 
-interface HTMLIonTextareaElement extends IonTextarea, HTMLElement {
-}
-declare var HTMLIonTextareaElement: {
-  prototype: HTMLIonTextareaElement;
-  new (): HTMLIonTextareaElement;
-};
+import {
+  Textarea as IonTextarea
+} from './components/input/textarea';
+
 declare global {
+  interface HTMLIonTextareaElement extends IonTextarea, HTMLElement {
+  }
+  var HTMLIonTextareaElement: {
+    prototype: HTMLIonTextareaElement;
+    new (): HTMLIonTextareaElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-textarea": HTMLIonTextareaElement;
+    "ion-textarea": HTMLIonTextareaElement;
   }
   interface ElementTagNameMap {
-      "ion-textarea": HTMLIonTextareaElement;
+    "ion-textarea": HTMLIonTextareaElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-textarea": JSXElements.IonTextareaAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-textarea": JSXElements.IonTextareaAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonTextareaAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          autocapitalize?: string,
-          autocomplete?: string,
-          autofocus?: boolean,
-          clearOnEdit?: boolean,
-          disabled?: boolean,
-          maxlength?: number,
-          minlength?: number,
-          name?: string,
-          placeholder?: string,
-          readonly?: boolean,
-          required?: boolean,
-          spellcheck?: boolean,
-          cols?: number,
-          rows?: number,
-          wrap?: string,
-          value?: string
-      }
+    export interface IonTextareaAttributes extends HTMLAttributes {
+      
+        autocapitalize?: string,
+        autocomplete?: string,
+        autofocus?: boolean,
+        clearOnEdit?: boolean,
+        disabled?: boolean,
+        maxlength?: number,
+        minlength?: number,
+        name?: string,
+        placeholder?: string,
+        readonly?: boolean,
+        required?: boolean,
+        spellcheck?: boolean,
+        cols?: number,
+        rows?: number,
+        wrap?: string,
+        value?: string
+    }
   }
 }
 
-import { ItemDivider as IonItemDivider } from './components/item-divider/item-divider';
 
-interface HTMLIonItemDividerElement extends IonItemDivider, HTMLElement {
-}
-declare var HTMLIonItemDividerElement: {
-  prototype: HTMLIonItemDividerElement;
-  new (): HTMLIonItemDividerElement;
-};
+import {
+  ItemDivider as IonItemDivider
+} from './components/item-divider/item-divider';
+
 declare global {
+  interface HTMLIonItemDividerElement extends IonItemDivider, HTMLElement {
+  }
+  var HTMLIonItemDividerElement: {
+    prototype: HTMLIonItemDividerElement;
+    new (): HTMLIonItemDividerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-item-divider": HTMLIonItemDividerElement;
+    "ion-item-divider": HTMLIonItemDividerElement;
   }
   interface ElementTagNameMap {
-      "ion-item-divider": HTMLIonItemDividerElement;
+    "ion-item-divider": HTMLIonItemDividerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-item-divider": JSXElements.IonItemDividerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-item-divider": JSXElements.IonItemDividerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonItemDividerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonItemDividerAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { ItemOption as IonItemOption } from './components/item-sliding/item-option';
 
-interface HTMLIonItemOptionElement extends IonItemOption, HTMLElement {
-}
-declare var HTMLIonItemOptionElement: {
-  prototype: HTMLIonItemOptionElement;
-  new (): HTMLIonItemOptionElement;
-};
+import {
+  ItemOption as IonItemOption
+} from './components/item-sliding/item-option';
+
 declare global {
+  interface HTMLIonItemOptionElement extends IonItemOption, HTMLElement {
+  }
+  var HTMLIonItemOptionElement: {
+    prototype: HTMLIonItemOptionElement;
+    new (): HTMLIonItemOptionElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-item-option": HTMLIonItemOptionElement;
+    "ion-item-option": HTMLIonItemOptionElement;
   }
   interface ElementTagNameMap {
-      "ion-item-option": HTMLIonItemOptionElement;
+    "ion-item-option": HTMLIonItemOptionElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-item-option": JSXElements.IonItemOptionAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-item-option": JSXElements.IonItemOptionAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonItemOptionAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          href?: string,
-          disabled?: boolean
-      }
+    export interface IonItemOptionAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        href?: string,
+        disabled?: boolean
+    }
   }
 }
 
-import { ItemOptions as IonItemOptions } from './components/item-sliding/item-options';
 
-interface HTMLIonItemOptionsElement extends IonItemOptions, HTMLElement {
-}
-declare var HTMLIonItemOptionsElement: {
-  prototype: HTMLIonItemOptionsElement;
-  new (): HTMLIonItemOptionsElement;
-};
+import {
+  ItemOptions as IonItemOptions
+} from './components/item-sliding/item-options';
+
 declare global {
+  interface HTMLIonItemOptionsElement extends IonItemOptions, HTMLElement {
+  }
+  var HTMLIonItemOptionsElement: {
+    prototype: HTMLIonItemOptionsElement;
+    new (): HTMLIonItemOptionsElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-item-options": HTMLIonItemOptionsElement;
+    "ion-item-options": HTMLIonItemOptionsElement;
   }
   interface ElementTagNameMap {
-      "ion-item-options": HTMLIonItemOptionsElement;
+    "ion-item-options": HTMLIonItemOptionsElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-item-options": JSXElements.IonItemOptionsAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-item-options": JSXElements.IonItemOptionsAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonItemOptionsAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          isRightSide?: any,
-          width?: any,
-          fireSwipeEvent?: any,
-          side?: string
-      }
+    export interface IonItemOptionsAttributes extends HTMLAttributes {
+      
+        side?: Side
+    }
   }
 }
 
-import { ItemSliding as IonItemSliding } from './components/item-sliding/item-sliding';
 
-interface HTMLIonItemSlidingElement extends IonItemSliding, HTMLElement {
-}
-declare var HTMLIonItemSlidingElement: {
-  prototype: HTMLIonItemSlidingElement;
-  new (): HTMLIonItemSlidingElement;
-};
+import {
+  ItemSliding as IonItemSliding
+} from './components/item-sliding/item-sliding';
+
 declare global {
+  interface HTMLIonItemSlidingElement extends IonItemSliding, HTMLElement {
+  }
+  var HTMLIonItemSlidingElement: {
+    prototype: HTMLIonItemSlidingElement;
+    new (): HTMLIonItemSlidingElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-item-sliding": HTMLIonItemSlidingElement;
+    "ion-item-sliding": HTMLIonItemSlidingElement;
   }
   interface ElementTagNameMap {
-      "ion-item-sliding": HTMLIonItemSlidingElement;
+    "ion-item-sliding": HTMLIonItemSlidingElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-item-sliding": JSXElements.IonItemSlidingAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-item-sliding": JSXElements.IonItemSlidingAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonItemSlidingAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          getOpenAmount?: any,
-          getSlidingPercent?: any,
-          close?: any,
-          closeOpened?: any
-      }
+    export interface IonItemSlidingAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Item as IonItem } from './components/item/item';
 
-interface HTMLIonItemElement extends IonItem, HTMLElement {
-}
-declare var HTMLIonItemElement: {
-  prototype: HTMLIonItemElement;
-  new (): HTMLIonItemElement;
-};
+import {
+  Item as IonItem
+} from './components/item/item';
+
 declare global {
+  interface HTMLIonItemElement extends IonItem, HTMLElement {
+  }
+  var HTMLIonItemElement: {
+    prototype: HTMLIonItemElement;
+    new (): HTMLIonItemElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-item": HTMLIonItemElement;
+    "ion-item": HTMLIonItemElement;
   }
   interface ElementTagNameMap {
-      "ion-item": HTMLIonItemElement;
+    "ion-item": HTMLIonItemElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-item": JSXElements.IonItemAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-item": JSXElements.IonItemAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonItemAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          getLabelText?: any,
-          href?: string
-      }
+    export interface IonItemAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        href?: string
+    }
   }
 }
 
-import { IonKeyboardController as IonKeyboardController } from './components/keyboard-controller/keyboard-controller';
 
-interface HTMLIonKeyboardControllerElement extends IonKeyboardController, HTMLElement {
-}
-declare var HTMLIonKeyboardControllerElement: {
-  prototype: HTMLIonKeyboardControllerElement;
-  new (): HTMLIonKeyboardControllerElement;
-};
+import {
+  IonKeyboardController as IonKeyboardController
+} from './components/keyboard-controller/keyboard-controller';
+
 declare global {
+  interface HTMLIonKeyboardControllerElement extends IonKeyboardController, HTMLElement {
+  }
+  var HTMLIonKeyboardControllerElement: {
+    prototype: HTMLIonKeyboardControllerElement;
+    new (): HTMLIonKeyboardControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-keyboard-controller": HTMLIonKeyboardControllerElement;
+    "ion-keyboard-controller": HTMLIonKeyboardControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-keyboard-controller": HTMLIonKeyboardControllerElement;
+    "ion-keyboard-controller": HTMLIonKeyboardControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-keyboard-controller": JSXElements.IonKeyboardControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-keyboard-controller": JSXElements.IonKeyboardControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonKeyboardControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonKeyboardControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Label as IonLabel } from './components/label/label';
 
-interface HTMLIonLabelElement extends IonLabel, HTMLElement {
-}
-declare var HTMLIonLabelElement: {
-  prototype: HTMLIonLabelElement;
-  new (): HTMLIonLabelElement;
-};
+import {
+  Label as IonLabel
+} from './components/label/label';
+
 declare global {
+  interface HTMLIonLabelElement extends IonLabel, HTMLElement {
+  }
+  var HTMLIonLabelElement: {
+    prototype: HTMLIonLabelElement;
+    new (): HTMLIonLabelElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-label": HTMLIonLabelElement;
+    "ion-label": HTMLIonLabelElement;
   }
   interface ElementTagNameMap {
-      "ion-label": HTMLIonLabelElement;
+    "ion-label": HTMLIonLabelElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-label": JSXElements.IonLabelAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-label": JSXElements.IonLabelAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonLabelAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          getText?: any,
-          fixed?: boolean,
-          floating?: boolean,
-          stacked?: boolean
-      }
+    export interface IonLabelAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        fixed?: boolean,
+        floating?: boolean,
+        stacked?: boolean
+    }
   }
 }
 
-import { ListHeader as IonListHeader } from './components/list-header/list-header';
 
-interface HTMLIonListHeaderElement extends IonListHeader, HTMLElement {
-}
-declare var HTMLIonListHeaderElement: {
-  prototype: HTMLIonListHeaderElement;
-  new (): HTMLIonListHeaderElement;
-};
+import {
+  ListHeader as IonListHeader
+} from './components/list-header/list-header';
+
 declare global {
+  interface HTMLIonListHeaderElement extends IonListHeader, HTMLElement {
+  }
+  var HTMLIonListHeaderElement: {
+    prototype: HTMLIonListHeaderElement;
+    new (): HTMLIonListHeaderElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-list-header": HTMLIonListHeaderElement;
+    "ion-list-header": HTMLIonListHeaderElement;
   }
   interface ElementTagNameMap {
-      "ion-list-header": HTMLIonListHeaderElement;
+    "ion-list-header": HTMLIonListHeaderElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-list-header": JSXElements.IonListHeaderAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-list-header": JSXElements.IonListHeaderAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonListHeaderAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonListHeaderAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { List as IonList } from './components/list/list';
 
-interface HTMLIonListElement extends IonList, HTMLElement {
-}
-declare var HTMLIonListElement: {
-  prototype: HTMLIonListElement;
-  new (): HTMLIonListElement;
-};
+import {
+  List as IonList
+} from './components/list/list';
+
 declare global {
+  interface HTMLIonListElement extends IonList, HTMLElement {
+  }
+  var HTMLIonListElement: {
+    prototype: HTMLIonListElement;
+    new (): HTMLIonListElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-list": HTMLIonListElement;
+    "ion-list": HTMLIonListElement;
   }
   interface ElementTagNameMap {
-      "ion-list": HTMLIonListElement;
+    "ion-list": HTMLIonListElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-list": JSXElements.IonListAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-list": JSXElements.IonListAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonListAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          getOpenedItem?: any,
-          setOpenedItem?: any,
-          closeSlidingItems?: any
-      }
+    export interface IonListAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { LoadingController as IonLoadingController } from './components/loading-controller/loading-controller';
 
-interface HTMLIonLoadingControllerElement extends IonLoadingController, HTMLElement {
-}
-declare var HTMLIonLoadingControllerElement: {
-  prototype: HTMLIonLoadingControllerElement;
-  new (): HTMLIonLoadingControllerElement;
-};
+import {
+  LoadingController as IonLoadingController
+} from './components/loading-controller/loading-controller';
+
 declare global {
+  interface HTMLIonLoadingControllerElement extends IonLoadingController, HTMLElement {
+  }
+  var HTMLIonLoadingControllerElement: {
+    prototype: HTMLIonLoadingControllerElement;
+    new (): HTMLIonLoadingControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-loading-controller": HTMLIonLoadingControllerElement;
+    "ion-loading-controller": HTMLIonLoadingControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-loading-controller": HTMLIonLoadingControllerElement;
+    "ion-loading-controller": HTMLIonLoadingControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-loading-controller": JSXElements.IonLoadingControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-loading-controller": JSXElements.IonLoadingControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonLoadingControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          create?: any
-      }
+    export interface IonLoadingControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Loading as IonLoading } from './components/loading/loading';
 
-interface HTMLIonLoadingElement extends IonLoading, HTMLElement {
-}
-declare var HTMLIonLoadingElement: {
-  prototype: HTMLIonLoadingElement;
-  new (): HTMLIonLoadingElement;
-};
+import {
+  Loading as IonLoading
+} from './components/loading/loading';
+
 declare global {
+  interface HTMLIonLoadingElement extends IonLoading, HTMLElement {
+  }
+  var HTMLIonLoadingElement: {
+    prototype: HTMLIonLoadingElement;
+    new (): HTMLIonLoadingElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-loading": HTMLIonLoadingElement;
+    "ion-loading": HTMLIonLoadingElement;
   }
   interface ElementTagNameMap {
-      "ion-loading": HTMLIonLoadingElement;
+    "ion-loading": HTMLIonLoadingElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-loading": JSXElements.IonLoadingAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-loading": JSXElements.IonLoadingAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonLoadingAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          animationCtrl?: any,
-          cssClass?: string,
-          content?: string,
-          dismissOnPageChange?: boolean,
-          duration?: number,
-          enterAnimation?: any,
-          exitAnimation?: any,
-          loadingId?: string,
-          showBackdrop?: boolean
-      }
+    export interface IonLoadingAttributes extends HTMLAttributes {
+      
+        cssClass?: string,
+        content?: string,
+        dismissOnPageChange?: boolean,
+        duration?: number,
+        enterAnimation?: AnimationBuilder,
+        exitAnimation?: AnimationBuilder,
+        loadingId?: string,
+        showBackdrop?: boolean
+    }
   }
 }
 
-import { MenuController as IonMenuController } from './components/menu/menu-controller';
 
-interface HTMLIonMenuControllerElement extends IonMenuController, HTMLElement {
-}
-declare var HTMLIonMenuControllerElement: {
-  prototype: HTMLIonMenuControllerElement;
-  new (): HTMLIonMenuControllerElement;
-};
+import {
+  MenuController as IonMenuController
+} from './components/menu/menu-controller';
+
 declare global {
+  interface HTMLIonMenuControllerElement extends IonMenuController, HTMLElement {
+  }
+  var HTMLIonMenuControllerElement: {
+    prototype: HTMLIonMenuControllerElement;
+    new (): HTMLIonMenuControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-menu-controller": HTMLIonMenuControllerElement;
+    "ion-menu-controller": HTMLIonMenuControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-menu-controller": HTMLIonMenuControllerElement;
+    "ion-menu-controller": HTMLIonMenuControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-menu-controller": JSXElements.IonMenuControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-menu-controller": JSXElements.IonMenuControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonMenuControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          open?: any,
-          close?: any,
-          toggle?: any,
-          enable?: any,
-          swipeEnable?: any,
-          isOpen?: any,
-          isEnabled?: any,
-          get?: any,
-          getOpen?: any,
-          getMenus?: any,
-          isAnimating?: any,
-          _register?: any,
-          _unregister?: any,
-          _setActiveMenu?: any,
-          createAnimation?: any,
-          animationCtrl?: any
-      }
+    export interface IonMenuControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Menu as IonMenu } from './components/menu/menu';
 
-interface HTMLIonMenuElement extends IonMenu, HTMLElement {
-}
-declare var HTMLIonMenuElement: {
-  prototype: HTMLIonMenuElement;
-  new (): HTMLIonMenuElement;
-};
+import {
+  Menu as IonMenu
+} from './components/menu/menu';
+
 declare global {
+  interface HTMLIonMenuElement extends IonMenu, HTMLElement {
+  }
+  var HTMLIonMenuElement: {
+    prototype: HTMLIonMenuElement;
+    new (): HTMLIonMenuElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-menu": HTMLIonMenuElement;
+    "ion-menu": HTMLIonMenuElement;
   }
   interface ElementTagNameMap {
-      "ion-menu": HTMLIonMenuElement;
+    "ion-menu": HTMLIonMenuElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-menu": JSXElements.IonMenuAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-menu": JSXElements.IonMenuAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonMenuAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          isOpen?: any,
-          setOpen?: any,
-          open?: any,
-          close?: any,
-          toggle?: any,
-          lazyMenuCtrl?: any,
-          content?: string,
-          menuId?: string,
-          type?: string,
-          enabled?: boolean,
-          side?: string,
-          swipeEnabled?: boolean,
-          persistent?: boolean,
-          maxEdgeStart?: number
-      }
+    export interface IonMenuAttributes extends HTMLAttributes {
+      
+        content?: string,
+        menuId?: string,
+        type?: string,
+        enabled?: boolean,
+        side?: Side,
+        swipeEnabled?: boolean,
+        persistent?: boolean,
+        maxEdgeStart?: number
+    }
   }
 }
 
-import { ModalController as IonModalController } from './components/modal-controller/modal-controller';
 
-interface HTMLIonModalControllerElement extends IonModalController, HTMLElement {
-}
-declare var HTMLIonModalControllerElement: {
-  prototype: HTMLIonModalControllerElement;
-  new (): HTMLIonModalControllerElement;
-};
+import {
+  ModalController as IonModalController
+} from './components/modal-controller/modal-controller';
+
 declare global {
+  interface HTMLIonModalControllerElement extends IonModalController, HTMLElement {
+  }
+  var HTMLIonModalControllerElement: {
+    prototype: HTMLIonModalControllerElement;
+    new (): HTMLIonModalControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-modal-controller": HTMLIonModalControllerElement;
+    "ion-modal-controller": HTMLIonModalControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-modal-controller": HTMLIonModalControllerElement;
+    "ion-modal-controller": HTMLIonModalControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-modal-controller": JSXElements.IonModalControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-modal-controller": JSXElements.IonModalControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonModalControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          create?: any
-      }
+    export interface IonModalControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Modal as IonModal } from './components/modal/modal';
 
-interface HTMLIonModalElement extends IonModal, HTMLElement {
-}
-declare var HTMLIonModalElement: {
-  prototype: HTMLIonModalElement;
-  new (): HTMLIonModalElement;
-};
+import {
+  Modal as IonModal
+} from './components/modal/modal';
+
 declare global {
+  interface HTMLIonModalElement extends IonModal, HTMLElement {
+  }
+  var HTMLIonModalElement: {
+    prototype: HTMLIonModalElement;
+    new (): HTMLIonModalElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-modal": HTMLIonModalElement;
+    "ion-modal": HTMLIonModalElement;
   }
   interface ElementTagNameMap {
-      "ion-modal": HTMLIonModalElement;
+    "ion-modal": HTMLIonModalElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-modal": JSXElements.IonModalAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-modal": JSXElements.IonModalAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonModalAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          animationCtrl?: any,
-          component?: string,
-          componentProps?: any,
-          cssClass?: string,
-          enableBackdropDismiss?: boolean,
-          enterAnimation?: any,
-          exitAnimation?: any,
-          modalId?: string,
-          showBackdrop?: boolean
-      }
+    export interface IonModalAttributes extends HTMLAttributes {
+      
+        mode?: string,
+        color?: string,
+        component?: string,
+        componentProps?: any,
+        cssClass?: string,
+        enableBackdropDismiss?: boolean,
+        enterAnimation?: AnimationBuilder,
+        exitAnimation?: AnimationBuilder,
+        modalId?: string,
+        showBackdrop?: boolean
+    }
   }
 }
 
-import { NavControllerImpl as IonNavController } from './components/nav-controller/nav-controller';
 
-interface HTMLIonNavControllerElement extends IonNavController, HTMLElement {
-}
-declare var HTMLIonNavControllerElement: {
-  prototype: HTMLIonNavControllerElement;
-  new (): HTMLIonNavControllerElement;
-};
+import {
+  NavControllerImpl as IonNavController
+} from './components/nav-controller/nav-controller';
+
 declare global {
+  interface HTMLIonNavControllerElement extends IonNavController, HTMLElement {
+  }
+  var HTMLIonNavControllerElement: {
+    prototype: HTMLIonNavControllerElement;
+    new (): HTMLIonNavControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-nav-controller": HTMLIonNavControllerElement;
+    "ion-nav-controller": HTMLIonNavControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-nav-controller": HTMLIonNavControllerElement;
+    "ion-nav-controller": HTMLIonNavControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-nav-controller": JSXElements.IonNavControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-nav-controller": JSXElements.IonNavControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonNavControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          push?: any,
-          pop?: any,
-          setRoot?: any,
-          insert?: any,
-          insertPages?: any,
-          popToRoot?: any,
-          popTo?: any,
-          removeIndex?: any,
-          removeView?: any,
-          setPages?: any,
-          delegate?: any,
-          animationCtrl?: any
-      }
+    export interface IonNavControllerAttributes extends HTMLAttributes {
+      
+        delegate?: FrameworkDelegate
+    }
   }
 }
 
-import { StencilNavDelegate as StencilIonNavDelegate } from './components/nav-controller/stencil-nav-delegate';
 
-interface HTMLStencilIonNavDelegateElement extends StencilIonNavDelegate, HTMLElement {
-}
-declare var HTMLStencilIonNavDelegateElement: {
-  prototype: HTMLStencilIonNavDelegateElement;
-  new (): HTMLStencilIonNavDelegateElement;
-};
+import {
+  StencilNavDelegate as StencilIonNavDelegate
+} from './components/nav-controller/stencil-nav-delegate';
+
 declare global {
+  interface HTMLStencilIonNavDelegateElement extends StencilIonNavDelegate, HTMLElement {
+  }
+  var HTMLStencilIonNavDelegateElement: {
+    prototype: HTMLStencilIonNavDelegateElement;
+    new (): HTMLStencilIonNavDelegateElement;
+  };
   interface HTMLElementTagNameMap {
-      "stencil-ion-nav-delegate": HTMLStencilIonNavDelegateElement;
+    "stencil-ion-nav-delegate": HTMLStencilIonNavDelegateElement;
   }
   interface ElementTagNameMap {
-      "stencil-ion-nav-delegate": HTMLStencilIonNavDelegateElement;
+    "stencil-ion-nav-delegate": HTMLStencilIonNavDelegateElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "stencil-ion-nav-delegate": JSXElements.StencilIonNavDelegateAttributes;
-      }
+    interface IntrinsicElements {
+      "stencil-ion-nav-delegate": JSXElements.StencilIonNavDelegateAttributes;
+    }
   }
   namespace JSXElements {
-      export interface StencilIonNavDelegateAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          attachViewToDom?: any,
-          removeViewFromDom?: any
-      }
+    export interface StencilIonNavDelegateAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { IonNav as IonNav } from './components/nav/nav';
 
-interface HTMLIonNavElement extends IonNav, HTMLElement {
-}
-declare var HTMLIonNavElement: {
-  prototype: HTMLIonNavElement;
-  new (): HTMLIonNavElement;
-};
+import {
+  IonNav as IonNav
+} from './components/nav/nav';
+
 declare global {
+  interface HTMLIonNavElement extends IonNav, HTMLElement {
+  }
+  var HTMLIonNavElement: {
+    prototype: HTMLIonNavElement;
+    new (): HTMLIonNavElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-nav": HTMLIonNavElement;
+    "ion-nav": HTMLIonNavElement;
   }
   interface ElementTagNameMap {
-      "ion-nav": HTMLIonNavElement;
+    "ion-nav": HTMLIonNavElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-nav": JSXElements.IonNavAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-nav": JSXElements.IonNavAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonNavAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          push?: any,
-          pop?: any,
-          setRoot?: any,
-          insert?: any,
-          insertPages?: any,
-          popToRoot?: any,
-          popTo?: any,
-          removeIndex?: any,
-          removeView?: any,
-          setPages?: any,
-          getActive?: any,
-          getPrevious?: any,
-          canGoBack?: any,
-          canSwipeBack?: any,
-          getFirstView?: any,
-          resize?: any,
-          root?: any,
-          delegate?: any
-      }
+    export interface IonNavAttributes extends HTMLAttributes {
+      
+        mode?: string,
+        root?: any,
+        delegate?: FrameworkDelegate
+    }
   }
 }
 
-import { PageOne as PageOne } from './components/nav/page-one';
 
-interface HTMLPageOneElement extends PageOne, HTMLElement {
-}
-declare var HTMLPageOneElement: {
-  prototype: HTMLPageOneElement;
-  new (): HTMLPageOneElement;
-};
+import {
+  PageOne as PageOne
+} from './components/nav/page-one';
+
 declare global {
+  interface HTMLPageOneElement extends PageOne, HTMLElement {
+  }
+  var HTMLPageOneElement: {
+    prototype: HTMLPageOneElement;
+    new (): HTMLPageOneElement;
+  };
   interface HTMLElementTagNameMap {
-      "page-one": HTMLPageOneElement;
+    "page-one": HTMLPageOneElement;
   }
   interface ElementTagNameMap {
-      "page-one": HTMLPageOneElement;
+    "page-one": HTMLPageOneElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "page-one": JSXElements.PageOneAttributes;
-      }
+    interface IntrinsicElements {
+      "page-one": JSXElements.PageOneAttributes;
+    }
   }
   namespace JSXElements {
-      export interface PageOneAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface PageOneAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { PageThree as PageThree } from './components/nav/page-three';
 
-interface HTMLPageThreeElement extends PageThree, HTMLElement {
-}
-declare var HTMLPageThreeElement: {
-  prototype: HTMLPageThreeElement;
-  new (): HTMLPageThreeElement;
-};
+import {
+  PageThree as PageThree
+} from './components/nav/page-three';
+
 declare global {
+  interface HTMLPageThreeElement extends PageThree, HTMLElement {
+  }
+  var HTMLPageThreeElement: {
+    prototype: HTMLPageThreeElement;
+    new (): HTMLPageThreeElement;
+  };
   interface HTMLElementTagNameMap {
-      "page-three": HTMLPageThreeElement;
+    "page-three": HTMLPageThreeElement;
   }
   interface ElementTagNameMap {
-      "page-three": HTMLPageThreeElement;
+    "page-three": HTMLPageThreeElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "page-three": JSXElements.PageThreeAttributes;
-      }
+    interface IntrinsicElements {
+      "page-three": JSXElements.PageThreeAttributes;
+    }
   }
   namespace JSXElements {
-      export interface PageThreeAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface PageThreeAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { PageTwo as PageTwo } from './components/nav/page-two';
 
-interface HTMLPageTwoElement extends PageTwo, HTMLElement {
-}
-declare var HTMLPageTwoElement: {
-  prototype: HTMLPageTwoElement;
-  new (): HTMLPageTwoElement;
-};
+import {
+  PageTwo as PageTwo
+} from './components/nav/page-two';
+
 declare global {
+  interface HTMLPageTwoElement extends PageTwo, HTMLElement {
+  }
+  var HTMLPageTwoElement: {
+    prototype: HTMLPageTwoElement;
+    new (): HTMLPageTwoElement;
+  };
   interface HTMLElementTagNameMap {
-      "page-two": HTMLPageTwoElement;
+    "page-two": HTMLPageTwoElement;
   }
   interface ElementTagNameMap {
-      "page-two": HTMLPageTwoElement;
+    "page-two": HTMLPageTwoElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "page-two": JSXElements.PageTwoAttributes;
-      }
+    interface IntrinsicElements {
+      "page-two": JSXElements.PageTwoAttributes;
+    }
   }
   namespace JSXElements {
-      export interface PageTwoAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface PageTwoAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Note as IonNote } from './components/note/note';
 
-interface HTMLIonNoteElement extends IonNote, HTMLElement {
-}
-declare var HTMLIonNoteElement: {
-  prototype: HTMLIonNoteElement;
-  new (): HTMLIonNoteElement;
-};
+import {
+  Note as IonNote
+} from './components/note/note';
+
 declare global {
+  interface HTMLIonNoteElement extends IonNote, HTMLElement {
+  }
+  var HTMLIonNoteElement: {
+    prototype: HTMLIonNoteElement;
+    new (): HTMLIonNoteElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-note": HTMLIonNoteElement;
+    "ion-note": HTMLIonNoteElement;
   }
   interface ElementTagNameMap {
-      "ion-note": HTMLIonNoteElement;
+    "ion-note": HTMLIonNoteElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-note": JSXElements.IonNoteAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-note": JSXElements.IonNoteAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonNoteAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonNoteAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { Page as IonPage } from './components/page/page';
 
-interface HTMLIonPageElement extends IonPage, HTMLElement {
-}
-declare var HTMLIonPageElement: {
-  prototype: HTMLIonPageElement;
-  new (): HTMLIonPageElement;
-};
+import {
+  Page as IonPage
+} from './components/page/page';
+
 declare global {
+  interface HTMLIonPageElement extends IonPage, HTMLElement {
+  }
+  var HTMLIonPageElement: {
+    prototype: HTMLIonPageElement;
+    new (): HTMLIonPageElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-page": HTMLIonPageElement;
+    "ion-page": HTMLIonPageElement;
   }
   interface ElementTagNameMap {
-      "ion-page": HTMLIonPageElement;
+    "ion-page": HTMLIonPageElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-page": JSXElements.IonPageAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-page": JSXElements.IonPageAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonPageAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonPageAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { PickerController as IonPickerController } from './components/picker-controller/picker-controller';
 
-interface HTMLIonPickerControllerElement extends IonPickerController, HTMLElement {
-}
-declare var HTMLIonPickerControllerElement: {
-  prototype: HTMLIonPickerControllerElement;
-  new (): HTMLIonPickerControllerElement;
-};
+import {
+  PickerController as IonPickerController
+} from './components/picker-controller/picker-controller';
+
 declare global {
+  interface HTMLIonPickerControllerElement extends IonPickerController, HTMLElement {
+  }
+  var HTMLIonPickerControllerElement: {
+    prototype: HTMLIonPickerControllerElement;
+    new (): HTMLIonPickerControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-picker-controller": HTMLIonPickerControllerElement;
+    "ion-picker-controller": HTMLIonPickerControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-picker-controller": HTMLIonPickerControllerElement;
+    "ion-picker-controller": HTMLIonPickerControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-picker-controller": JSXElements.IonPickerControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-picker-controller": JSXElements.IonPickerControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonPickerControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          create?: any
-      }
+    export interface IonPickerControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { PickerColumnCmp as IonPickerColumn } from './components/picker/picker-column';
 
-interface HTMLIonPickerColumnElement extends IonPickerColumn, HTMLElement {
-}
-declare var HTMLIonPickerColumnElement: {
-  prototype: HTMLIonPickerColumnElement;
-  new (): HTMLIonPickerColumnElement;
-};
+import {
+  PickerColumnCmp as IonPickerColumn
+} from './components/picker/picker-column';
+
 declare global {
+  interface HTMLIonPickerColumnElement extends IonPickerColumn, HTMLElement {
+  }
+  var HTMLIonPickerColumnElement: {
+    prototype: HTMLIonPickerColumnElement;
+    new (): HTMLIonPickerColumnElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-picker-column": HTMLIonPickerColumnElement;
+    "ion-picker-column": HTMLIonPickerColumnElement;
   }
   interface ElementTagNameMap {
-      "ion-picker-column": HTMLIonPickerColumnElement;
+    "ion-picker-column": HTMLIonPickerColumnElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-picker-column": JSXElements.IonPickerColumnAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-picker-column": JSXElements.IonPickerColumnAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonPickerColumnAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          col?: any
-      }
+    export interface IonPickerColumnAttributes extends HTMLAttributes {
+      
+        col?: PickerColumn
+    }
   }
 }
 
-import { Picker as IonPicker } from './components/picker/picker';
 
-interface HTMLIonPickerElement extends IonPicker, HTMLElement {
-}
-declare var HTMLIonPickerElement: {
-  prototype: HTMLIonPickerElement;
-  new (): HTMLIonPickerElement;
-};
+import {
+  Picker as IonPicker
+} from './components/picker/picker';
+
 declare global {
+  interface HTMLIonPickerElement extends IonPicker, HTMLElement {
+  }
+  var HTMLIonPickerElement: {
+    prototype: HTMLIonPickerElement;
+    new (): HTMLIonPickerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-picker": HTMLIonPickerElement;
+    "ion-picker": HTMLIonPickerElement;
   }
   interface ElementTagNameMap {
-      "ion-picker": HTMLIonPickerElement;
+    "ion-picker": HTMLIonPickerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-picker": JSXElements.IonPickerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-picker": JSXElements.IonPickerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonPickerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          addButton?: any,
-          addColumn?: any,
-          getColumn?: any,
-          getColumns?: any,
-          animationCtrl?: any,
-          cssClass?: string,
-          content?: string,
-          dismissOnPageChange?: boolean,
-          duration?: number,
-          enterAnimation?: any,
-          exitAnimation?: any,
-          pickerId?: string,
-          showBackdrop?: boolean,
-          enableBackdropDismiss?: boolean,
-          buttons?: any,
-          columns?: any
-      }
+    export interface IonPickerAttributes extends HTMLAttributes {
+      
+        cssClass?: string,
+        content?: string,
+        dismissOnPageChange?: boolean,
+        duration?: number,
+        enterAnimation?: AnimationBuilder,
+        exitAnimation?: AnimationBuilder,
+        pickerId?: string,
+        showBackdrop?: boolean,
+        enableBackdropDismiss?: boolean,
+        buttons?: PickerButton[],
+        columns?: PickerColumn[]
+    }
   }
 }
 
-import { PopoverController as IonPopoverController } from './components/popover-controller/popover-controller';
 
-interface HTMLIonPopoverControllerElement extends IonPopoverController, HTMLElement {
-}
-declare var HTMLIonPopoverControllerElement: {
-  prototype: HTMLIonPopoverControllerElement;
-  new (): HTMLIonPopoverControllerElement;
-};
+import {
+  PopoverController as IonPopoverController
+} from './components/popover-controller/popover-controller';
+
 declare global {
+  interface HTMLIonPopoverControllerElement extends IonPopoverController, HTMLElement {
+  }
+  var HTMLIonPopoverControllerElement: {
+    prototype: HTMLIonPopoverControllerElement;
+    new (): HTMLIonPopoverControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-popover-controller": HTMLIonPopoverControllerElement;
+    "ion-popover-controller": HTMLIonPopoverControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-popover-controller": HTMLIonPopoverControllerElement;
+    "ion-popover-controller": HTMLIonPopoverControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-popover-controller": JSXElements.IonPopoverControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-popover-controller": JSXElements.IonPopoverControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonPopoverControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          create?: any
-      }
+    export interface IonPopoverControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Popover as IonPopover } from './components/popover/popover';
 
-interface HTMLIonPopoverElement extends IonPopover, HTMLElement {
-}
-declare var HTMLIonPopoverElement: {
-  prototype: HTMLIonPopoverElement;
-  new (): HTMLIonPopoverElement;
-};
+import {
+  Popover as IonPopover
+} from './components/popover/popover';
+
 declare global {
+  interface HTMLIonPopoverElement extends IonPopover, HTMLElement {
+  }
+  var HTMLIonPopoverElement: {
+    prototype: HTMLIonPopoverElement;
+    new (): HTMLIonPopoverElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-popover": HTMLIonPopoverElement;
+    "ion-popover": HTMLIonPopoverElement;
   }
   interface ElementTagNameMap {
-      "ion-popover": HTMLIonPopoverElement;
+    "ion-popover": HTMLIonPopoverElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-popover": JSXElements.IonPopoverAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-popover": JSXElements.IonPopoverAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonPopoverAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          animationCtrl?: any,
-          component?: string,
-          componentProps?: any,
-          cssClass?: string,
-          enableBackdropDismiss?: boolean,
-          enterAnimation?: any,
-          exitAnimation?: any,
-          ev?: any,
-          popoverId?: string,
-          showBackdrop?: boolean
-      }
+    export interface IonPopoverAttributes extends HTMLAttributes {
+      
+        mode?: string,
+        color?: string,
+        component?: string,
+        componentProps?: any,
+        cssClass?: string,
+        enableBackdropDismiss?: boolean,
+        enterAnimation?: AnimationBuilder,
+        exitAnimation?: AnimationBuilder,
+        ev?: Event,
+        popoverId?: string,
+        showBackdrop?: boolean
+    }
   }
 }
 
-import { RadioGroup as IonRadioGroup } from './components/radio/radio-group';
 
-interface HTMLIonRadioGroupElement extends IonRadioGroup, HTMLElement {
-}
-declare var HTMLIonRadioGroupElement: {
-  prototype: HTMLIonRadioGroupElement;
-  new (): HTMLIonRadioGroupElement;
-};
+import {
+  RadioGroup as IonRadioGroup
+} from './components/radio/radio-group';
+
 declare global {
+  interface HTMLIonRadioGroupElement extends IonRadioGroup, HTMLElement {
+  }
+  var HTMLIonRadioGroupElement: {
+    prototype: HTMLIonRadioGroupElement;
+    new (): HTMLIonRadioGroupElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-radio-group": HTMLIonRadioGroupElement;
+    "ion-radio-group": HTMLIonRadioGroupElement;
   }
   interface ElementTagNameMap {
-      "ion-radio-group": HTMLIonRadioGroupElement;
+    "ion-radio-group": HTMLIonRadioGroupElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-radio-group": JSXElements.IonRadioGroupAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-radio-group": JSXElements.IonRadioGroupAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonRadioGroupAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          allowEmptySelection?: boolean,
-          disabled?: boolean,
-          value?: string
-      }
+    export interface IonRadioGroupAttributes extends HTMLAttributes {
+      
+        allowEmptySelection?: boolean,
+        disabled?: boolean,
+        value?: string
+    }
   }
 }
 
-import { Radio as IonRadio } from './components/radio/radio';
 
-interface HTMLIonRadioElement extends IonRadio, HTMLElement {
-}
-declare var HTMLIonRadioElement: {
-  prototype: HTMLIonRadioElement;
-  new (): HTMLIonRadioElement;
-};
+import {
+  Radio as IonRadio
+} from './components/radio/radio';
+
 declare global {
+  interface HTMLIonRadioElement extends IonRadio, HTMLElement {
+  }
+  var HTMLIonRadioElement: {
+    prototype: HTMLIonRadioElement;
+    new (): HTMLIonRadioElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-radio": HTMLIonRadioElement;
+    "ion-radio": HTMLIonRadioElement;
   }
   interface ElementTagNameMap {
-      "ion-radio": HTMLIonRadioElement;
+    "ion-radio": HTMLIonRadioElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-radio": JSXElements.IonRadioAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-radio": JSXElements.IonRadioAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonRadioAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          checked?: boolean,
-          disabled?: boolean,
-          value?: string
-      }
+    export interface IonRadioAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        checked?: boolean,
+        disabled?: boolean,
+        value?: string
+    }
   }
 }
 
-import { RangeKnob as IonRangeKnob } from './components/range/range-knob';
 
-interface HTMLIonRangeKnobElement extends IonRangeKnob, HTMLElement {
-}
-declare var HTMLIonRangeKnobElement: {
-  prototype: HTMLIonRangeKnobElement;
-  new (): HTMLIonRangeKnobElement;
-};
+import {
+  RangeKnob as IonRangeKnob
+} from './components/range/range-knob';
+
 declare global {
+  interface HTMLIonRangeKnobElement extends IonRangeKnob, HTMLElement {
+  }
+  var HTMLIonRangeKnobElement: {
+    prototype: HTMLIonRangeKnobElement;
+    new (): HTMLIonRangeKnobElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-range-knob": HTMLIonRangeKnobElement;
+    "ion-range-knob": HTMLIonRangeKnobElement;
   }
   interface ElementTagNameMap {
-      "ion-range-knob": HTMLIonRangeKnobElement;
+    "ion-range-knob": HTMLIonRangeKnobElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-range-knob": JSXElements.IonRangeKnobAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-range-knob": JSXElements.IonRangeKnobAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonRangeKnobAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          pressed?: boolean,
-          pin?: boolean,
-          min?: number,
-          max?: number,
-          val?: number,
-          disabled?: boolean,
-          labelId?: string,
-          knob?: string,
-          ratio?: number
-      }
+    export interface IonRangeKnobAttributes extends HTMLAttributes {
+      
+        pressed?: boolean,
+        pin?: boolean,
+        min?: number,
+        max?: number,
+        val?: number,
+        disabled?: boolean,
+        labelId?: string,
+        knob?: string,
+        ratio?: number
+    }
   }
 }
 
-import { Range as IonRange } from './components/range/range';
 
-interface HTMLIonRangeElement extends IonRange, HTMLElement {
-}
-declare var HTMLIonRangeElement: {
-  prototype: HTMLIonRangeElement;
-  new (): HTMLIonRangeElement;
-};
+import {
+  Range as IonRange
+} from './components/range/range';
+
 declare global {
+  interface HTMLIonRangeElement extends IonRange, HTMLElement {
+  }
+  var HTMLIonRangeElement: {
+    prototype: HTMLIonRangeElement;
+    new (): HTMLIonRangeElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-range": HTMLIonRangeElement;
+    "ion-range": HTMLIonRangeElement;
   }
   interface ElementTagNameMap {
-      "ion-range": HTMLIonRangeElement;
+    "ion-range": HTMLIonRangeElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-range": JSXElements.IonRangeAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-range": JSXElements.IonRangeAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonRangeAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          ratio?: any,
-          ratioUpper?: any,
-          debounce?: number,
-          disabled?: boolean,
-          dualKnobs?: boolean,
-          max?: number,
-          min?: number,
-          pin?: boolean,
-          snaps?: boolean,
-          step?: number,
-          value?: any
-      }
+    export interface IonRangeAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        debounce?: number,
+        disabled?: boolean,
+        dualKnobs?: boolean,
+        max?: number,
+        min?: number,
+        pin?: boolean,
+        snaps?: boolean,
+        step?: number,
+        value?: any
+    }
   }
 }
 
-import { ReorderGroup as IonReorderGroup } from './components/reorder/reorder-group';
 
-interface HTMLIonReorderGroupElement extends IonReorderGroup, HTMLElement {
-}
-declare var HTMLIonReorderGroupElement: {
-  prototype: HTMLIonReorderGroupElement;
-  new (): HTMLIonReorderGroupElement;
-};
+import {
+  ReorderGroup as IonReorderGroup
+} from './components/reorder/reorder-group';
+
 declare global {
+  interface HTMLIonReorderGroupElement extends IonReorderGroup, HTMLElement {
+  }
+  var HTMLIonReorderGroupElement: {
+    prototype: HTMLIonReorderGroupElement;
+    new (): HTMLIonReorderGroupElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-reorder-group": HTMLIonReorderGroupElement;
+    "ion-reorder-group": HTMLIonReorderGroupElement;
   }
   interface ElementTagNameMap {
-      "ion-reorder-group": HTMLIonReorderGroupElement;
+    "ion-reorder-group": HTMLIonReorderGroupElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-reorder-group": JSXElements.IonReorderGroupAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-reorder-group": JSXElements.IonReorderGroupAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonReorderGroupAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          enabled?: boolean
-      }
+    export interface IonReorderGroupAttributes extends HTMLAttributes {
+      
+        enabled?: boolean
+    }
   }
 }
 
-import { ItemReorder as IonReorder } from './components/reorder/reorder';
 
-interface HTMLIonReorderElement extends IonReorder, HTMLElement {
-}
-declare var HTMLIonReorderElement: {
-  prototype: HTMLIonReorderElement;
-  new (): HTMLIonReorderElement;
-};
+import {
+  ItemReorder as IonReorder
+} from './components/reorder/reorder';
+
 declare global {
+  interface HTMLIonReorderElement extends IonReorder, HTMLElement {
+  }
+  var HTMLIonReorderElement: {
+    prototype: HTMLIonReorderElement;
+    new (): HTMLIonReorderElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-reorder": HTMLIonReorderElement;
+    "ion-reorder": HTMLIonReorderElement;
   }
   interface ElementTagNameMap {
-      "ion-reorder": HTMLIonReorderElement;
+    "ion-reorder": HTMLIonReorderElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-reorder": JSXElements.IonReorderAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-reorder": JSXElements.IonReorderAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonReorderAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonReorderAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { RouteLink as IonRouteLink } from './components/router/route-link';
 
-interface HTMLIonRouteLinkElement extends IonRouteLink, HTMLElement {
-}
-declare var HTMLIonRouteLinkElement: {
-  prototype: HTMLIonRouteLinkElement;
-  new (): HTMLIonRouteLinkElement;
-};
+import {
+  RouteLink as IonRouteLink
+} from './components/router/route-link';
+
 declare global {
+  interface HTMLIonRouteLinkElement extends IonRouteLink, HTMLElement {
+  }
+  var HTMLIonRouteLinkElement: {
+    prototype: HTMLIonRouteLinkElement;
+    new (): HTMLIonRouteLinkElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-route-link": HTMLIonRouteLinkElement;
+    "ion-route-link": HTMLIonRouteLinkElement;
   }
   interface ElementTagNameMap {
-      "ion-route-link": HTMLIonRouteLinkElement;
+    "ion-route-link": HTMLIonRouteLinkElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-route-link": JSXElements.IonRouteLinkAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-route-link": JSXElements.IonRouteLinkAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonRouteLinkAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          url?: string,
-          router?: any
-      }
+    export interface IonRouteLinkAttributes extends HTMLAttributes {
+      
+        url?: string,
+        router?: any
+    }
   }
 }
 
-import { Route as IonRoute } from './components/router/route';
 
-interface HTMLIonRouteElement extends IonRoute, HTMLElement {
-}
-declare var HTMLIonRouteElement: {
-  prototype: HTMLIonRouteElement;
-  new (): HTMLIonRouteElement;
-};
+import {
+  Route as IonRoute
+} from './components/router/route';
+
 declare global {
+  interface HTMLIonRouteElement extends IonRoute, HTMLElement {
+  }
+  var HTMLIonRouteElement: {
+    prototype: HTMLIonRouteElement;
+    new (): HTMLIonRouteElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-route": HTMLIonRouteElement;
+    "ion-route": HTMLIonRouteElement;
   }
   interface ElementTagNameMap {
-      "ion-route": HTMLIonRouteElement;
+    "ion-route": HTMLIonRouteElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-route": JSXElements.IonRouteAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-route": JSXElements.IonRouteAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonRouteAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          url?: string,
-          component?: string,
-          componentProps?: any,
-          router?: any
-      }
+    export interface IonRouteAttributes extends HTMLAttributes {
+      
+        url?: string,
+        component?: string,
+        componentProps?: any,
+        router?: any
+    }
   }
 }
 
-import { Router as IonRouter } from './components/router/router';
 
-interface HTMLIonRouterElement extends IonRouter, HTMLElement {
-}
-declare var HTMLIonRouterElement: {
-  prototype: HTMLIonRouterElement;
-  new (): HTMLIonRouterElement;
-};
+import {
+  Router as IonRouter
+} from './components/router/router';
+
 declare global {
+  interface HTMLIonRouterElement extends IonRouter, HTMLElement {
+  }
+  var HTMLIonRouterElement: {
+    prototype: HTMLIonRouterElement;
+    new (): HTMLIonRouterElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-router": HTMLIonRouterElement;
+    "ion-router": HTMLIonRouterElement;
   }
   interface ElementTagNameMap {
-      "ion-router": HTMLIonRouterElement;
+    "ion-router": HTMLIonRouterElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-router": JSXElements.IonRouterAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-router": JSXElements.IonRouterAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonRouterAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          root?: string,
-          match?: any
-      }
+    export interface IonRouterAttributes extends HTMLAttributes {
+      
+        root?: string,
+        match?: any
+    }
   }
 }
 
-import { Scroll as IonScroll } from './components/scroll/scroll';
 
-interface HTMLIonScrollElement extends IonScroll, HTMLElement {
-}
-declare var HTMLIonScrollElement: {
-  prototype: HTMLIonScrollElement;
-  new (): HTMLIonScrollElement;
-};
+import {
+  Scroll as IonScroll
+} from './components/scroll/scroll';
+
 declare global {
+  interface HTMLIonScrollElement extends IonScroll, HTMLElement {
+  }
+  var HTMLIonScrollElement: {
+    prototype: HTMLIonScrollElement;
+    new (): HTMLIonScrollElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-scroll": HTMLIonScrollElement;
+    "ion-scroll": HTMLIonScrollElement;
   }
   interface ElementTagNameMap {
-      "ion-scroll": HTMLIonScrollElement;
+    "ion-scroll": HTMLIonScrollElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-scroll": JSXElements.IonScrollAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-scroll": JSXElements.IonScrollAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonScrollAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          scrollToTop?: any,
-          scrollToBottom?: any,
-          scrollToPoint?: any,
-          enabled?: boolean,
-          jsScroll?: boolean,
-          onionScrollStart?: any,
-          onionScroll?: any,
-          onionScrollEnd?: any
-      }
+    export interface IonScrollAttributes extends HTMLAttributes {
+      
+        enabled?: boolean,
+        jsScroll?: boolean,
+        onionScrollStart?: ScrollCallback,
+        onionScroll?: ScrollCallback,
+        onionScrollEnd?: ScrollCallback
+    }
   }
 }
 
-import { Searchbar as IonSearchbar } from './components/searchbar/searchbar';
 
-interface HTMLIonSearchbarElement extends IonSearchbar, HTMLElement {
-}
-declare var HTMLIonSearchbarElement: {
-  prototype: HTMLIonSearchbarElement;
-  new (): HTMLIonSearchbarElement;
-};
+import {
+  Searchbar as IonSearchbar
+} from './components/searchbar/searchbar';
+
 declare global {
+  interface HTMLIonSearchbarElement extends IonSearchbar, HTMLElement {
+  }
+  var HTMLIonSearchbarElement: {
+    prototype: HTMLIonSearchbarElement;
+    new (): HTMLIonSearchbarElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-searchbar": HTMLIonSearchbarElement;
+    "ion-searchbar": HTMLIonSearchbarElement;
   }
   interface ElementTagNameMap {
-      "ion-searchbar": HTMLIonSearchbarElement;
+    "ion-searchbar": HTMLIonSearchbarElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-searchbar": JSXElements.IonSearchbarAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-searchbar": JSXElements.IonSearchbarAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSearchbarAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          animated?: boolean,
-          autocomplete?: string,
-          autocorrect?: string,
-          cancelButtonText?: string,
-          debounce?: number,
-          placeholder?: string,
-          showCancelButton?: boolean,
-          spellcheck?: boolean,
-          type?: string,
-          value?: string
-      }
+    export interface IonSearchbarAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        animated?: boolean,
+        autocomplete?: string,
+        autocorrect?: string,
+        cancelButtonText?: string,
+        debounce?: number,
+        placeholder?: string,
+        showCancelButton?: boolean,
+        spellcheck?: boolean,
+        type?: string,
+        value?: string
+    }
   }
 }
 
-import { SegmentButton as IonSegmentButton } from './components/segment-button/segment-button';
 
-interface HTMLIonSegmentButtonElement extends IonSegmentButton, HTMLElement {
-}
-declare var HTMLIonSegmentButtonElement: {
-  prototype: HTMLIonSegmentButtonElement;
-  new (): HTMLIonSegmentButtonElement;
-};
+import {
+  SegmentButton as IonSegmentButton
+} from './components/segment-button/segment-button';
+
 declare global {
+  interface HTMLIonSegmentButtonElement extends IonSegmentButton, HTMLElement {
+  }
+  var HTMLIonSegmentButtonElement: {
+    prototype: HTMLIonSegmentButtonElement;
+    new (): HTMLIonSegmentButtonElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-segment-button": HTMLIonSegmentButtonElement;
+    "ion-segment-button": HTMLIonSegmentButtonElement;
   }
   interface ElementTagNameMap {
-      "ion-segment-button": HTMLIonSegmentButtonElement;
+    "ion-segment-button": HTMLIonSegmentButtonElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-segment-button": JSXElements.IonSegmentButtonAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-segment-button": JSXElements.IonSegmentButtonAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSegmentButtonAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          checked?: boolean,
-          disabled?: boolean,
-          value?: string
-      }
+    export interface IonSegmentButtonAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        checked?: boolean,
+        disabled?: boolean,
+        value?: string
+    }
   }
 }
 
-import { Segment as IonSegment } from './components/segment/segment';
 
-interface HTMLIonSegmentElement extends IonSegment, HTMLElement {
-}
-declare var HTMLIonSegmentElement: {
-  prototype: HTMLIonSegmentElement;
-  new (): HTMLIonSegmentElement;
-};
+import {
+  Segment as IonSegment
+} from './components/segment/segment';
+
 declare global {
+  interface HTMLIonSegmentElement extends IonSegment, HTMLElement {
+  }
+  var HTMLIonSegmentElement: {
+    prototype: HTMLIonSegmentElement;
+    new (): HTMLIonSegmentElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-segment": HTMLIonSegmentElement;
+    "ion-segment": HTMLIonSegmentElement;
   }
   interface ElementTagNameMap {
-      "ion-segment": HTMLIonSegmentElement;
+    "ion-segment": HTMLIonSegmentElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-segment": JSXElements.IonSegmentAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-segment": JSXElements.IonSegmentAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSegmentAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          disabled?: boolean,
-          value?: string
-      }
+    export interface IonSegmentAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        disabled?: boolean,
+        value?: string
+    }
   }
 }
 
-import { SelectOption as IonSelectOption } from './components/select-option/select-option';
 
-interface HTMLIonSelectOptionElement extends IonSelectOption, HTMLElement {
-}
-declare var HTMLIonSelectOptionElement: {
-  prototype: HTMLIonSelectOptionElement;
-  new (): HTMLIonSelectOptionElement;
-};
+import {
+  SelectOption as IonSelectOption
+} from './components/select-option/select-option';
+
 declare global {
+  interface HTMLIonSelectOptionElement extends IonSelectOption, HTMLElement {
+  }
+  var HTMLIonSelectOptionElement: {
+    prototype: HTMLIonSelectOptionElement;
+    new (): HTMLIonSelectOptionElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-select-option": HTMLIonSelectOptionElement;
+    "ion-select-option": HTMLIonSelectOptionElement;
   }
   interface ElementTagNameMap {
-      "ion-select-option": HTMLIonSelectOptionElement;
+    "ion-select-option": HTMLIonSelectOptionElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-select-option": JSXElements.IonSelectOptionAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-select-option": JSXElements.IonSelectOptionAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSelectOptionAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          getText?: any,
-          disabled?: boolean,
-          selected?: boolean,
-          value?: string
-      }
+    export interface IonSelectOptionAttributes extends HTMLAttributes {
+      
+        disabled?: boolean,
+        selected?: boolean,
+        value?: string
+    }
   }
 }
 
-import { SelectPopover as IonSelectPopover } from './components/select/select-popover';
 
-interface HTMLIonSelectPopoverElement extends IonSelectPopover, HTMLElement {
-}
-declare var HTMLIonSelectPopoverElement: {
-  prototype: HTMLIonSelectPopoverElement;
-  new (): HTMLIonSelectPopoverElement;
-};
+import {
+  SelectPopover as IonSelectPopover
+} from './components/select/select-popover';
+
 declare global {
+  interface HTMLIonSelectPopoverElement extends IonSelectPopover, HTMLElement {
+  }
+  var HTMLIonSelectPopoverElement: {
+    prototype: HTMLIonSelectPopoverElement;
+    new (): HTMLIonSelectPopoverElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-select-popover": HTMLIonSelectPopoverElement;
+    "ion-select-popover": HTMLIonSelectPopoverElement;
   }
   interface ElementTagNameMap {
-      "ion-select-popover": HTMLIonSelectPopoverElement;
+    "ion-select-popover": HTMLIonSelectPopoverElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-select-popover": JSXElements.IonSelectPopoverAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-select-popover": JSXElements.IonSelectPopoverAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSelectPopoverAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          options?: any,
-          value?: string
-      }
+    export interface IonSelectPopoverAttributes extends HTMLAttributes {
+      
+        options?: SelectPopoverOption[],
+        value?: string
+    }
   }
 }
 
-import { Select as IonSelect } from './components/select/select';
 
-interface HTMLIonSelectElement extends IonSelect, HTMLElement {
-}
-declare var HTMLIonSelectElement: {
-  prototype: HTMLIonSelectElement;
-  new (): HTMLIonSelectElement;
-};
+import {
+  Select as IonSelect
+} from './components/select/select';
+
 declare global {
+  interface HTMLIonSelectElement extends IonSelect, HTMLElement {
+  }
+  var HTMLIonSelectElement: {
+    prototype: HTMLIonSelectElement;
+    new (): HTMLIonSelectElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-select": HTMLIonSelectElement;
+    "ion-select": HTMLIonSelectElement;
   }
   interface ElementTagNameMap {
-      "ion-select": HTMLIonSelectElement;
+    "ion-select": HTMLIonSelectElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-select": JSXElements.IonSelectAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-select": JSXElements.IonSelectAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSelectAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          actionSheetCtrl?: any,
-          alertCtrl?: any,
-          popoverCtrl?: any,
-          disabled?: boolean,
-          cancelText?: string,
-          okText?: string,
-          placeholder?: string,
-          selectOptions?: any,
-          interface?: string,
-          selectedText?: string,
-          multiple?: boolean,
-          value?: any
-      }
+    export interface IonSelectAttributes extends HTMLAttributes {
+      
+        disabled?: boolean,
+        cancelText?: string,
+        okText?: string,
+        placeholder?: string,
+        selectOptions?: any,
+        interface?: string,
+        selectedText?: string,
+        multiple?: boolean,
+        value?: string | string[]
+    }
   }
 }
 
-import { SkeletonText as IonSkeletonText } from './components/skeleton-text/skeleton-text';
 
-interface HTMLIonSkeletonTextElement extends IonSkeletonText, HTMLElement {
-}
-declare var HTMLIonSkeletonTextElement: {
-  prototype: HTMLIonSkeletonTextElement;
-  new (): HTMLIonSkeletonTextElement;
-};
+import {
+  SkeletonText as IonSkeletonText
+} from './components/skeleton-text/skeleton-text';
+
 declare global {
+  interface HTMLIonSkeletonTextElement extends IonSkeletonText, HTMLElement {
+  }
+  var HTMLIonSkeletonTextElement: {
+    prototype: HTMLIonSkeletonTextElement;
+    new (): HTMLIonSkeletonTextElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-skeleton-text": HTMLIonSkeletonTextElement;
+    "ion-skeleton-text": HTMLIonSkeletonTextElement;
   }
   interface ElementTagNameMap {
-      "ion-skeleton-text": HTMLIonSkeletonTextElement;
+    "ion-skeleton-text": HTMLIonSkeletonTextElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-skeleton-text": JSXElements.IonSkeletonTextAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-skeleton-text": JSXElements.IonSkeletonTextAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSkeletonTextAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          width?: string
-      }
+    export interface IonSkeletonTextAttributes extends HTMLAttributes {
+      
+        width?: string
+    }
   }
 }
 
-import { Slide as IonSlide } from './components/slides/slide';
 
-interface HTMLIonSlideElement extends IonSlide, HTMLElement {
-}
-declare var HTMLIonSlideElement: {
-  prototype: HTMLIonSlideElement;
-  new (): HTMLIonSlideElement;
-};
+import {
+  Slide as IonSlide
+} from './components/slides/slide';
+
 declare global {
+  interface HTMLIonSlideElement extends IonSlide, HTMLElement {
+  }
+  var HTMLIonSlideElement: {
+    prototype: HTMLIonSlideElement;
+    new (): HTMLIonSlideElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-slide": HTMLIonSlideElement;
+    "ion-slide": HTMLIonSlideElement;
   }
   interface ElementTagNameMap {
-      "ion-slide": HTMLIonSlideElement;
+    "ion-slide": HTMLIonSlideElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-slide": JSXElements.IonSlideAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-slide": JSXElements.IonSlideAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSlideAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonSlideAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Slides as IonSlides } from './components/slides/slides';
 
-interface HTMLIonSlidesElement extends IonSlides, HTMLElement {
-}
-declare var HTMLIonSlidesElement: {
-  prototype: HTMLIonSlidesElement;
-  new (): HTMLIonSlidesElement;
-};
+import {
+  Slides as IonSlides
+} from './components/slides/slides';
+
 declare global {
+  interface HTMLIonSlidesElement extends IonSlides, HTMLElement {
+  }
+  var HTMLIonSlidesElement: {
+    prototype: HTMLIonSlidesElement;
+    new (): HTMLIonSlidesElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-slides": HTMLIonSlidesElement;
+    "ion-slides": HTMLIonSlidesElement;
   }
   interface ElementTagNameMap {
-      "ion-slides": HTMLIonSlidesElement;
+    "ion-slides": HTMLIonSlidesElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-slides": JSXElements.IonSlidesAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-slides": JSXElements.IonSlidesAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSlidesAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          effect?: string,
-          autoplay?: number,
-          control?: any,
-          direction?: string,
-          initialSlide?: number,
-          loop?: boolean,
-          pager?: boolean,
-          paginationType?: string,
-          parallax?: boolean,
-          slidesPerView?: number,
-          spaceBetween?: number,
-          speed?: number,
-          zoom?: boolean,
-          keyboardControl?: boolean
-      }
+    export interface IonSlidesAttributes extends HTMLAttributes {
+      
+        effect?: string,
+        autoplay?: number,
+        control?: any,
+        direction?: 'horizontal' | 'vertical',
+        initialSlide?: number,
+        loop?: boolean,
+        pager?: boolean,
+        paginationType?: string,
+        parallax?: boolean,
+        slidesPerView?: number | 'auto',
+        spaceBetween?: number,
+        speed?: number,
+        zoom?: boolean,
+        keyboardControl?: boolean
+    }
   }
 }
 
-import { Spinner as IonSpinner } from './components/spinner/spinner';
 
-interface HTMLIonSpinnerElement extends IonSpinner, HTMLElement {
-}
-declare var HTMLIonSpinnerElement: {
-  prototype: HTMLIonSpinnerElement;
-  new (): HTMLIonSpinnerElement;
-};
+import {
+  Spinner as IonSpinner
+} from './components/spinner/spinner';
+
 declare global {
+  interface HTMLIonSpinnerElement extends IonSpinner, HTMLElement {
+  }
+  var HTMLIonSpinnerElement: {
+    prototype: HTMLIonSpinnerElement;
+    new (): HTMLIonSpinnerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-spinner": HTMLIonSpinnerElement;
+    "ion-spinner": HTMLIonSpinnerElement;
   }
   interface ElementTagNameMap {
-      "ion-spinner": HTMLIonSpinnerElement;
+    "ion-spinner": HTMLIonSpinnerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-spinner": JSXElements.IonSpinnerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-spinner": JSXElements.IonSpinnerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSpinnerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          duration?: number,
-          name?: string,
-          paused?: boolean
-      }
+    export interface IonSpinnerAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        duration?: number,
+        name?: string,
+        paused?: boolean
+    }
   }
 }
 
-import { SplitPane as IonSplitPane } from './components/split-pane/split-pane';
 
-interface HTMLIonSplitPaneElement extends IonSplitPane, HTMLElement {
-}
-declare var HTMLIonSplitPaneElement: {
-  prototype: HTMLIonSplitPaneElement;
-  new (): HTMLIonSplitPaneElement;
-};
+import {
+  SplitPane as IonSplitPane
+} from './components/split-pane/split-pane';
+
 declare global {
+  interface HTMLIonSplitPaneElement extends IonSplitPane, HTMLElement {
+  }
+  var HTMLIonSplitPaneElement: {
+    prototype: HTMLIonSplitPaneElement;
+    new (): HTMLIonSplitPaneElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-split-pane": HTMLIonSplitPaneElement;
+    "ion-split-pane": HTMLIonSplitPaneElement;
   }
   interface ElementTagNameMap {
-      "ion-split-pane": HTMLIonSplitPaneElement;
+    "ion-split-pane": HTMLIonSplitPaneElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-split-pane": JSXElements.IonSplitPaneAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-split-pane": JSXElements.IonSplitPaneAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonSplitPaneAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          isVisible?: any,
-          enabled?: boolean,
-          when?: any
-      }
+    export interface IonSplitPaneAttributes extends HTMLAttributes {
+      
+        enabled?: boolean,
+        when?: string | boolean
+    }
   }
 }
 
-import { PageTab as PageTab } from './components/tabs/page-tab';
 
-interface HTMLPageTabElement extends PageTab, HTMLElement {
-}
-declare var HTMLPageTabElement: {
-  prototype: HTMLPageTabElement;
-  new (): HTMLPageTabElement;
-};
+import {
+  PageTab as PageTab
+} from './components/tabs/page-tab';
+
 declare global {
+  interface HTMLPageTabElement extends PageTab, HTMLElement {
+  }
+  var HTMLPageTabElement: {
+    prototype: HTMLPageTabElement;
+    new (): HTMLPageTabElement;
+  };
   interface HTMLElementTagNameMap {
-      "page-tab": HTMLPageTabElement;
+    "page-tab": HTMLPageTabElement;
   }
   interface ElementTagNameMap {
-      "page-tab": HTMLPageTabElement;
+    "page-tab": HTMLPageTabElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "page-tab": JSXElements.PageTabAttributes;
-      }
+    interface IntrinsicElements {
+      "page-tab": JSXElements.PageTabAttributes;
+    }
   }
   namespace JSXElements {
-      export interface PageTabAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface PageTabAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { TabBar as IonTabbar } from './components/tabs/tab-bar';
 
-interface HTMLIonTabbarElement extends IonTabbar, HTMLElement {
-}
-declare var HTMLIonTabbarElement: {
-  prototype: HTMLIonTabbarElement;
-  new (): HTMLIonTabbarElement;
-};
+import {
+  TabBar as IonTabbar
+} from './components/tabs/tab-bar';
+
 declare global {
+  interface HTMLIonTabbarElement extends IonTabbar, HTMLElement {
+  }
+  var HTMLIonTabbarElement: {
+    prototype: HTMLIonTabbarElement;
+    new (): HTMLIonTabbarElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-tabbar": HTMLIonTabbarElement;
+    "ion-tabbar": HTMLIonTabbarElement;
   }
   interface ElementTagNameMap {
-      "ion-tabbar": HTMLIonTabbarElement;
+    "ion-tabbar": HTMLIonTabbarElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-tabbar": JSXElements.IonTabbarAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-tabbar": JSXElements.IonTabbarAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonTabbarAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          placement?: string,
-          tabs?: any,
-          selectedTab?: any,
-          layout?: string,
-          highlight?: boolean
-      }
+    export interface IonTabbarAttributes extends HTMLAttributes {
+      
+        placement?: string,
+        tabs?: HTMLIonTabElement[],
+        selectedTab?: HTMLIonTabElement,
+        layout?: string,
+        highlight?: boolean
+    }
   }
 }
 
-import { TabbarButton as IonTabButton } from './components/tabs/tab-button';
 
-interface HTMLIonTabButtonElement extends IonTabButton, HTMLElement {
-}
-declare var HTMLIonTabButtonElement: {
-  prototype: HTMLIonTabButtonElement;
-  new (): HTMLIonTabButtonElement;
-};
+import {
+  TabbarButton as IonTabButton
+} from './components/tabs/tab-button';
+
 declare global {
+  interface HTMLIonTabButtonElement extends IonTabButton, HTMLElement {
+  }
+  var HTMLIonTabButtonElement: {
+    prototype: HTMLIonTabButtonElement;
+    new (): HTMLIonTabButtonElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-tab-button": HTMLIonTabButtonElement;
+    "ion-tab-button": HTMLIonTabButtonElement;
   }
   interface ElementTagNameMap {
-      "ion-tab-button": HTMLIonTabButtonElement;
+    "ion-tab-button": HTMLIonTabButtonElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-tab-button": JSXElements.IonTabButtonAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-tab-button": JSXElements.IonTabButtonAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonTabButtonAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          selected?: boolean,
-          tab?: any
-      }
+    export interface IonTabButtonAttributes extends HTMLAttributes {
+      
+        selected?: boolean,
+        tab?: HTMLIonTabElement
+    }
   }
 }
 
-import { TabHighlight as IonTabHighlight } from './components/tabs/tab-highlight';
 
-interface HTMLIonTabHighlightElement extends IonTabHighlight, HTMLElement {
-}
-declare var HTMLIonTabHighlightElement: {
-  prototype: HTMLIonTabHighlightElement;
-  new (): HTMLIonTabHighlightElement;
-};
+import {
+  TabHighlight as IonTabHighlight
+} from './components/tabs/tab-highlight';
+
 declare global {
+  interface HTMLIonTabHighlightElement extends IonTabHighlight, HTMLElement {
+  }
+  var HTMLIonTabHighlightElement: {
+    prototype: HTMLIonTabHighlightElement;
+    new (): HTMLIonTabHighlightElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-tab-highlight": HTMLIonTabHighlightElement;
+    "ion-tab-highlight": HTMLIonTabHighlightElement;
   }
   interface ElementTagNameMap {
-      "ion-tab-highlight": HTMLIonTabHighlightElement;
+    "ion-tab-highlight": HTMLIonTabHighlightElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-tab-highlight": JSXElements.IonTabHighlightAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-tab-highlight": JSXElements.IonTabHighlightAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonTabHighlightAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          selectedTab?: any
-      }
+    export interface IonTabHighlightAttributes extends HTMLAttributes {
+      
+        selectedTab?: HTMLIonTabElement
+    }
   }
 }
 
-import { Tab as IonTab } from './components/tabs/tab';
 
-interface HTMLIonTabElement extends IonTab, HTMLElement {
-}
-declare var HTMLIonTabElement: {
-  prototype: HTMLIonTabElement;
-  new (): HTMLIonTabElement;
-};
+import {
+  Tab as IonTab
+} from './components/tabs/tab';
+
 declare global {
+  interface HTMLIonTabElement extends IonTab, HTMLElement {
+  }
+  var HTMLIonTabElement: {
+    prototype: HTMLIonTabElement;
+    new (): HTMLIonTabElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-tab": HTMLIonTabElement;
+    "ion-tab": HTMLIonTabElement;
   }
   interface ElementTagNameMap {
-      "ion-tab": HTMLIonTabElement;
+    "ion-tab": HTMLIonTabElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-tab": JSXElements.IonTabAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-tab": JSXElements.IonTabAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonTabAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          _setActive?: any,
-          resize?: any,
-          goToRoot?: any,
-          getActive?: any,
-          getNav?: any,
-          btnId?: string,
-          root?: any,
-          rootParams?: any,
-          urlPath?: string,
-          title?: string,
-          icon?: string,
-          badge?: string,
-          badgeStyle?: string,
-          enabled?: boolean,
-          show?: boolean,
-          tabsHideOnSubPages?: boolean,
-          selected?: boolean
-      }
+    export interface IonTabAttributes extends HTMLAttributes {
+      
+        btnId?: string,
+        root?: any,
+        rootParams?: any,
+        urlPath?: string,
+        title?: string,
+        icon?: string,
+        badge?: string,
+        badgeStyle?: string,
+        enabled?: boolean,
+        show?: boolean,
+        tabsHideOnSubPages?: boolean,
+        selected?: boolean
+    }
   }
 }
 
-import { Tabs as IonTabs } from './components/tabs/tabs';
 
-interface HTMLIonTabsElement extends IonTabs, HTMLElement {
-}
-declare var HTMLIonTabsElement: {
-  prototype: HTMLIonTabsElement;
-  new (): HTMLIonTabsElement;
-};
+import {
+  Tabs as IonTabs
+} from './components/tabs/tabs';
+
 declare global {
+  interface HTMLIonTabsElement extends IonTabs, HTMLElement {
+  }
+  var HTMLIonTabsElement: {
+    prototype: HTMLIonTabsElement;
+    new (): HTMLIonTabsElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-tabs": HTMLIonTabsElement;
+    "ion-tabs": HTMLIonTabsElement;
   }
   interface ElementTagNameMap {
-      "ion-tabs": HTMLIonTabsElement;
+    "ion-tabs": HTMLIonTabsElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-tabs": JSXElements.IonTabsAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-tabs": JSXElements.IonTabsAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonTabsAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          select?: any,
-          getByIndex?: any,
-          getSelected?: any,
-          getIndex?: any,
-          getTabs?: any,
-          previousTab?: any,
-          resize?: any,
-          name?: string,
-          tabbarHidden?: boolean,
-          tabbarLayout?: string,
-          tabbarPlacement?: string,
-          tabbarHighlight?: boolean
-      }
+    export interface IonTabsAttributes extends HTMLAttributes {
+      
+        name?: string,
+        tabbarHidden?: boolean,
+        tabbarLayout?: string,
+        tabbarPlacement?: string,
+        tabbarHighlight?: boolean
+    }
   }
 }
 
-import { Thumbnail as IonThumbnail } from './components/thumbnail/thumbnail';
 
-interface HTMLIonThumbnailElement extends IonThumbnail, HTMLElement {
-}
-declare var HTMLIonThumbnailElement: {
-  prototype: HTMLIonThumbnailElement;
-  new (): HTMLIonThumbnailElement;
-};
+import {
+  Thumbnail as IonThumbnail
+} from './components/thumbnail/thumbnail';
+
 declare global {
+  interface HTMLIonThumbnailElement extends IonThumbnail, HTMLElement {
+  }
+  var HTMLIonThumbnailElement: {
+    prototype: HTMLIonThumbnailElement;
+    new (): HTMLIonThumbnailElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-thumbnail": HTMLIonThumbnailElement;
+    "ion-thumbnail": HTMLIonThumbnailElement;
   }
   interface ElementTagNameMap {
-      "ion-thumbnail": HTMLIonThumbnailElement;
+    "ion-thumbnail": HTMLIonThumbnailElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-thumbnail": JSXElements.IonThumbnailAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-thumbnail": JSXElements.IonThumbnailAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonThumbnailAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonThumbnailAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { ToolbarTitle as IonTitle } from './components/title/title';
 
-interface HTMLIonTitleElement extends IonTitle, HTMLElement {
-}
-declare var HTMLIonTitleElement: {
-  prototype: HTMLIonTitleElement;
-  new (): HTMLIonTitleElement;
-};
+import {
+  ToolbarTitle as IonTitle
+} from './components/title/title';
+
 declare global {
+  interface HTMLIonTitleElement extends IonTitle, HTMLElement {
+  }
+  var HTMLIonTitleElement: {
+    prototype: HTMLIonTitleElement;
+    new (): HTMLIonTitleElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-title": HTMLIonTitleElement;
+    "ion-title": HTMLIonTitleElement;
   }
   interface ElementTagNameMap {
-      "ion-title": HTMLIonTitleElement;
+    "ion-title": HTMLIonTitleElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-title": JSXElements.IonTitleAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-title": JSXElements.IonTitleAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonTitleAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonTitleAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { ToastController as IonToastController } from './components/toast-controller/toast-controller';
 
-interface HTMLIonToastControllerElement extends IonToastController, HTMLElement {
-}
-declare var HTMLIonToastControllerElement: {
-  prototype: HTMLIonToastControllerElement;
-  new (): HTMLIonToastControllerElement;
-};
+import {
+  ToastController as IonToastController
+} from './components/toast-controller/toast-controller';
+
 declare global {
+  interface HTMLIonToastControllerElement extends IonToastController, HTMLElement {
+  }
+  var HTMLIonToastControllerElement: {
+    prototype: HTMLIonToastControllerElement;
+    new (): HTMLIonToastControllerElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-toast-controller": HTMLIonToastControllerElement;
+    "ion-toast-controller": HTMLIonToastControllerElement;
   }
   interface ElementTagNameMap {
-      "ion-toast-controller": HTMLIonToastControllerElement;
+    "ion-toast-controller": HTMLIonToastControllerElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-toast-controller": JSXElements.IonToastControllerAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-toast-controller": JSXElements.IonToastControllerAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonToastControllerAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          create?: any
-      }
+    export interface IonToastControllerAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
-import { Toast as IonToast } from './components/toast/toast';
 
-interface HTMLIonToastElement extends IonToast, HTMLElement {
-}
-declare var HTMLIonToastElement: {
-  prototype: HTMLIonToastElement;
-  new (): HTMLIonToastElement;
-};
+import {
+  Toast as IonToast
+} from './components/toast/toast';
+
 declare global {
+  interface HTMLIonToastElement extends IonToast, HTMLElement {
+  }
+  var HTMLIonToastElement: {
+    prototype: HTMLIonToastElement;
+    new (): HTMLIonToastElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-toast": HTMLIonToastElement;
+    "ion-toast": HTMLIonToastElement;
   }
   interface ElementTagNameMap {
-      "ion-toast": HTMLIonToastElement;
+    "ion-toast": HTMLIonToastElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-toast": JSXElements.IonToastAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-toast": JSXElements.IonToastAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonToastAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          animationCtrl?: any,
-          message?: string,
-          cssClass?: string,
-          duration?: number,
-          showCloseButton?: boolean,
-          closeButtonText?: string,
-          dismissOnPageChange?: boolean,
-          position?: string,
-          enterAnimation?: any,
-          exitAnimation?: any,
-          toastId?: string
-      }
+    export interface IonToastAttributes extends HTMLAttributes {
+      
+        message?: string,
+        cssClass?: string,
+        duration?: number,
+        showCloseButton?: boolean,
+        closeButtonText?: string,
+        dismissOnPageChange?: boolean,
+        position?: string,
+        enterAnimation?: AnimationBuilder,
+        exitAnimation?: AnimationBuilder,
+        toastId?: string
+    }
   }
 }
 
-import { Toggle as IonToggle } from './components/toggle/toggle';
 
-interface HTMLIonToggleElement extends IonToggle, HTMLElement {
-}
-declare var HTMLIonToggleElement: {
-  prototype: HTMLIonToggleElement;
-  new (): HTMLIonToggleElement;
-};
+import {
+  Toggle as IonToggle
+} from './components/toggle/toggle';
+
 declare global {
+  interface HTMLIonToggleElement extends IonToggle, HTMLElement {
+  }
+  var HTMLIonToggleElement: {
+    prototype: HTMLIonToggleElement;
+    new (): HTMLIonToggleElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-toggle": HTMLIonToggleElement;
+    "ion-toggle": HTMLIonToggleElement;
   }
   interface ElementTagNameMap {
-      "ion-toggle": HTMLIonToggleElement;
+    "ion-toggle": HTMLIonToggleElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-toggle": JSXElements.IonToggleAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-toggle": JSXElements.IonToggleAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonToggleAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          toggle?: any,
-          checked?: boolean,
-          disabled?: boolean,
-          value?: string
-      }
+    export interface IonToggleAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp',
+        checked?: boolean,
+        disabled?: boolean,
+        value?: string
+    }
   }
 }
 
-import { Navbar as IonNavbar } from './components/toolbar/navbar';
 
-interface HTMLIonNavbarElement extends IonNavbar, HTMLElement {
-}
-declare var HTMLIonNavbarElement: {
-  prototype: HTMLIonNavbarElement;
-  new (): HTMLIonNavbarElement;
-};
+import {
+  Navbar as IonNavbar
+} from './components/toolbar/navbar';
+
 declare global {
+  interface HTMLIonNavbarElement extends IonNavbar, HTMLElement {
+  }
+  var HTMLIonNavbarElement: {
+    prototype: HTMLIonNavbarElement;
+    new (): HTMLIonNavbarElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-navbar": HTMLIonNavbarElement;
+    "ion-navbar": HTMLIonNavbarElement;
   }
   interface ElementTagNameMap {
-      "ion-navbar": HTMLIonNavbarElement;
+    "ion-navbar": HTMLIonNavbarElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-navbar": JSXElements.IonNavbarAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-navbar": JSXElements.IonNavbarAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonNavbarAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-          hideBackButton?: boolean,
-          backButtonText?: string,
-          backButtonIcon?: string,
-          hidden?: boolean
-      }
+    export interface IonNavbarAttributes extends HTMLAttributes {
+      
+        hideBackButton?: boolean,
+        backButtonText?: string,
+        backButtonIcon?: string,
+        hidden?: boolean
+    }
   }
 }
 
-import { Toolbar as IonToolbar } from './components/toolbar/toolbar';
 
-interface HTMLIonToolbarElement extends IonToolbar, HTMLElement {
-}
-declare var HTMLIonToolbarElement: {
-  prototype: HTMLIonToolbarElement;
-  new (): HTMLIonToolbarElement;
-};
+import {
+  Toolbar as IonToolbar
+} from './components/toolbar/toolbar';
+
 declare global {
+  interface HTMLIonToolbarElement extends IonToolbar, HTMLElement {
+  }
+  var HTMLIonToolbarElement: {
+    prototype: HTMLIonToolbarElement;
+    new (): HTMLIonToolbarElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-toolbar": HTMLIonToolbarElement;
+    "ion-toolbar": HTMLIonToolbarElement;
   }
   interface ElementTagNameMap {
-      "ion-toolbar": HTMLIonToolbarElement;
+    "ion-toolbar": HTMLIonToolbarElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-toolbar": JSXElements.IonToolbarAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-toolbar": JSXElements.IonToolbarAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonToolbarAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonToolbarAttributes extends HTMLAttributes {
+      
+        color?: string,
+        mode?: 'ios' | 'md' | 'wp'
+    }
   }
 }
 
-import { IonUtils as IonUtils } from './components/util/util';
 
-interface HTMLIonUtilsElement extends IonUtils, HTMLElement {
-}
-declare var HTMLIonUtilsElement: {
-  prototype: HTMLIonUtilsElement;
-  new (): HTMLIonUtilsElement;
-};
+import {
+  IonUtils as IonUtils
+} from './components/util/util';
+
 declare global {
+  interface HTMLIonUtilsElement extends IonUtils, HTMLElement {
+  }
+  var HTMLIonUtilsElement: {
+    prototype: HTMLIonUtilsElement;
+    new (): HTMLIonUtilsElement;
+  };
   interface HTMLElementTagNameMap {
-      "ion-utils": HTMLIonUtilsElement;
+    "ion-utils": HTMLIonUtilsElement;
   }
   interface ElementTagNameMap {
-      "ion-utils": HTMLIonUtilsElement;
+    "ion-utils": HTMLIonUtilsElement;
   }
   namespace JSX {
-      interface IntrinsicElements {
-          "ion-utils": JSXElements.IonUtilsAttributes;
-      }
+    interface IntrinsicElements {
+      "ion-utils": JSXElements.IonUtilsAttributes;
+    }
   }
   namespace JSXElements {
-      export interface IonUtilsAttributes extends HTMLAttributes {
-          mode?: string,
-          color?: string,
-        
-      }
+    export interface IonUtilsAttributes extends HTMLAttributes {
+      
+    }
   }
 }
 
diff --git a/packages/core/src/components/content/content.tsx b/packages/core/src/components/content/content.tsx
index 675615d7d7..098b7ab79c 100644
--- a/packages/core/src/components/content/content.tsx
+++ b/packages/core/src/components/content/content.tsx
@@ -1,5 +1,5 @@
 import { Component, Element, Method, Prop } from '@stencil/core';
-import { Config, HTMLIonScrollElement } from '../../index';
+import { Config } from '../../index';
 import { createThemedClasses, getElementClassObject } from '../../utils/theme';
 import { getPageElement } from '../../utils/helpers';
 
diff --git a/packages/core/src/components/datetime/datetime.tsx b/packages/core/src/components/datetime/datetime.tsx
index bcdbe3c5c4..6ac8cba45d 100644
--- a/packages/core/src/components/datetime/datetime.tsx
+++ b/packages/core/src/components/datetime/datetime.tsx
@@ -1,6 +1,6 @@
 import { Component, CssClassMap, Event, EventEmitter, Prop, PropDidChange, State } from '@stencil/core';
 
-import { convertFormatToKey, convertToArrayOfNumbers, convertToArrayOfStrings, dateDataSortValue, dateSortValue, DatetimeData, dateValueRange, daysInMonth, getValueFromFormat, LocaleData, parseDate, parseTemplate, renderTextFormat, renderDatetime, updateDate } from './datetime-util';
+import { DatetimeData, LocaleData, convertFormatToKey, convertToArrayOfNumbers, convertToArrayOfStrings, dateDataSortValue, dateSortValue, dateValueRange, daysInMonth, getValueFromFormat, parseDate, parseTemplate, renderDatetime, renderTextFormat, updateDate } from './datetime-util';
 
 import { clamp, isBlank, isObject } from '../../utils/helpers';
 
@@ -462,7 +462,7 @@ export class Datetime {
         text: this.cancelText,
         role: 'cancel',
         handler: () => this.ionCancel.emit(this)
-      },{
+      }, {
         text: this.doneText,
         handler: (data: any) => this.value = data,
       }];
diff --git a/packages/core/src/components/fab/fab-list.tsx b/packages/core/src/components/fab/fab-list.tsx
index 654f41d359..d68732e9e8 100644
--- a/packages/core/src/components/fab/fab-list.tsx
+++ b/packages/core/src/components/fab/fab-list.tsx
@@ -1,7 +1,5 @@
 import { Component, Element, Prop, PropDidChange } from '@stencil/core';
 
-import { HTMLIonFabElement } from '../../index';
-
 /**
   * @name FabList
   * @description
diff --git a/packages/core/src/components/infinite-scroll/infinite-scroll.tsx b/packages/core/src/components/infinite-scroll/infinite-scroll.tsx
index 29b46df3c3..741837e551 100644
--- a/packages/core/src/components/infinite-scroll/infinite-scroll.tsx
+++ b/packages/core/src/components/infinite-scroll/infinite-scroll.tsx
@@ -1,5 +1,5 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop, PropDidChange, State } from '@stencil/core';
-import { HTMLIonScrollElement, ScrollDetail, StencilElement } from '../../index';
+import { ScrollDetail, StencilElement } from '../../index';
 
 const enum Position {
   Top = 'top',
diff --git a/packages/core/src/components/item-sliding/item-sliding.tsx b/packages/core/src/components/item-sliding/item-sliding.tsx
index 3a1b5ca6dc..1123f3da42 100644
--- a/packages/core/src/components/item-sliding/item-sliding.tsx
+++ b/packages/core/src/components/item-sliding/item-sliding.tsx
@@ -1,6 +1,6 @@
 import { Component, Element, Event, EventEmitter, Method, State } from '@stencil/core';
 
-import { GestureDetail, HTMLIonItemElement, HTMLIonListElement } from '../../index';
+import { GestureDetail } from '../../index';
 import { swipeShouldReset } from '../../utils/helpers';
 import { ItemOptions } from './item-options';
 
diff --git a/packages/core/src/components/menu/menu-controller.ts b/packages/core/src/components/menu/menu-controller.ts
index e5fd0763bb..dc89dd53da 100644
--- a/packages/core/src/components/menu/menu-controller.ts
+++ b/packages/core/src/components/menu/menu-controller.ts
@@ -1,6 +1,5 @@
 import { Animation, AnimationBuilder, AnimationController, Menu } from '../../index';
 import { Component, Method, Prop } from '@stencil/core';
-import { HTMLIonMenuElement } from '../../index';
 
 import MenuOverlayAnimation from './animations/overlay';
 import MenuRevealAnimation from './animations/reveal';
diff --git a/packages/core/src/components/menu/menu.tsx b/packages/core/src/components/menu/menu.tsx
index a67125fc5a..c031a08741 100644
--- a/packages/core/src/components/menu/menu.tsx
+++ b/packages/core/src/components/menu/menu.tsx
@@ -1,5 +1,5 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop, PropDidChange, PropWillChange } from '@stencil/core';
-import { Animation, Config, GestureDetail, HTMLIonMenuControllerElement, HTMLIonMenuElement, SplitPaneAlert, StencilElement } from '../../index';
+import { Animation, Config, GestureDetail, SplitPaneAlert, StencilElement } from '../../index';
 import { Side, assert, checkEdgeSide, isRightSide } from '../../utils/helpers';
 
 @Component({
diff --git a/packages/core/src/components/menu/tests/basic.html b/packages/core/src/components/menu/tests/basic.html
deleted file mode 100644
index 82ab27358e..0000000000
--- a/packages/core/src/components/menu/tests/basic.html
+++ /dev/null
@@ -1,110 +0,0 @@
-<!DOCTYPE html>
-<html dir="ltr">
-
-<head>
-  <meta charset="UTF-8">
-  <title>Ionic Item Sliding</title>
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
-  <script src="/dist/ionic.js"></script>
-</head>
-
-<body>
-  <ion-app>
-    <ion-menu side="left">
-
-      <ion-header>
-        <ion-toolbar color="secondary">
-          <ion-title>Left Menu</ion-title>
-        </ion-toolbar>
-      </ion-header>
-
-      <ion-content>
-        <ion-list>
-          <ion-item>Open Right Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-          <ion-item detail-none>Close Menu</ion-item>
-        </ion-list>
-      </ion-content>
-
-      <ion-footer>
-        <ion-toolbar color="secondary">
-          <ion-title>Footer</ion-title>
-        </ion-toolbar>
-      </ion-footer>
-
-    </ion-menu>
-
-    <ion-menu side="right">
-      <ion-header>
-        <ion-toolbar>
-          <ion-title>Hola</ion-title>
-        </ion-toolbar>
-      </ion-header>
-
-      <ion-content padding>
-        hola macho
-      </ion-content>
-    </ion-menu>
-
-    <ion-page main>
-
-      <ion-header>
-        <ion-toolbar>
-          <ion-title>Ionic CDN demo</ion-title>
-        </ion-toolbar>
-      </ion-header>
-      <ion-footer>
-          <ion-toolbar>
-          </ion-toolbar>
-        </ion-footer>
-      <ion-content padding>
-        <p>
-          <ion-button onclick="openLeft()">Open left menu</ion-button>
-          <ion-button onclick="openRight()">Open right menu</ion-button>
-        </p>
-        <p>
-          <ion-button onclick="setPush()">Set Push</ion-button>
-          <ion-button onclick="setOverlay()">Set Overlay</ion-button>
-          <ion-button onclick="setReveal()">Set Reveal</ion-button>
-        </p>
-      </ion-content>
-
-    </ion-page>
-
-  </ion-app>
-  <ion-menu-controller></ion-menu-controller>
-
-  <script>
-    const menu = document.querySelector('ion-menu-controller');
-    function openLeft() {
-      console.log('Open left menu');
-      menu.open('left');
-    }
-    function openRight() {
-      console.log('Open right menu');
-      menu.open('right');
-    }
-    function setPush() {
-      menu.get('left').type = 'push';
-      menu.get('right').type = 'push';
-    }
-    function setOverlay() {
-      menu.get('left').type = 'overlay';
-      menu.get('right').type = 'overlay';
-    }
-    function setReveal() {
-      menu.get('left').type = 'reveal';
-      menu.get('right').type = 'reveal';
-    }
-  </script>
-</body>
-</html>
diff --git a/packages/core/src/components/slides/slides.tsx b/packages/core/src/components/slides/slides.tsx
index 67793e4a75..69227f8c7a 100644
--- a/packages/core/src/components/slides/slides.tsx
+++ b/packages/core/src/components/slides/slides.tsx
@@ -118,7 +118,7 @@ export class Slides {
    * that should be controlled by this Slides instance.
    * Default: `null`.
    */
-  @Prop() control: Slides | Slides[] = null;
+  @Prop() control: any = null;
 
   /**
    * @input {string}  Swipe direction: 'horizontal' or 'vertical'.
diff --git a/packages/core/src/components/tabs/page-tab.tsx b/packages/core/src/components/tabs/page-tab.tsx
index 2a1b2fd663..1e701d0df9 100644
--- a/packages/core/src/components/tabs/page-tab.tsx
+++ b/packages/core/src/components/tabs/page-tab.tsx
@@ -1,5 +1,4 @@
 import { Component, Element } from '@stencil/core';
-import { HTMLIonTabsElement } from '../../index';
 
 @Component({
   tag: 'page-tab'
diff --git a/packages/core/src/components/tabs/tab-bar.tsx b/packages/core/src/components/tabs/tab-bar.tsx
index 10510ea98f..417bb6b83f 100644
--- a/packages/core/src/components/tabs/tab-bar.tsx
+++ b/packages/core/src/components/tabs/tab-bar.tsx
@@ -1,5 +1,4 @@
 import { Component, Listen, Prop, State } from '@stencil/core';
-import { HTMLIonTabElement } from '../../index';
 
 @Component({
   tag: 'ion-tabbar',
diff --git a/packages/core/src/components/tabs/tab-button.tsx b/packages/core/src/components/tabs/tab-button.tsx
index daaaf94d5f..f757bf8a0c 100644
--- a/packages/core/src/components/tabs/tab-button.tsx
+++ b/packages/core/src/components/tabs/tab-button.tsx
@@ -1,5 +1,4 @@
 import { Component, Event, EventEmitter, Listen, Prop } from '@stencil/core';
-import { HTMLIonTabElement } from '../../index';
 
 @Component({
   tag: 'ion-tab-button'
diff --git a/packages/core/src/components/tabs/tab-highlight.tsx b/packages/core/src/components/tabs/tab-highlight.tsx
index af3d3fa65a..600db238c0 100644
--- a/packages/core/src/components/tabs/tab-highlight.tsx
+++ b/packages/core/src/components/tabs/tab-highlight.tsx
@@ -1,6 +1,5 @@
 import { Component, Element, Listen, Prop, PropDidChange, State } from '@stencil/core';
 import { getParentElement } from '../../utils/helpers';
-import { HTMLIonTabButtonElement, HTMLIonTabElement } from '../../index';
 
 @Component({
   tag: 'ion-tab-highlight'
diff --git a/packages/core/src/components/tabs/tab.tsx b/packages/core/src/components/tabs/tab.tsx
index 65eca35061..50e91ffac4 100644
--- a/packages/core/src/components/tabs/tab.tsx
+++ b/packages/core/src/components/tabs/tab.tsx
@@ -1,5 +1,5 @@
 import { Component, Element, Event, EventEmitter, Method, Prop, PropDidChange, State } from '@stencil/core';
-import { HTMLIonNavElement, StencilElement } from '../../index';
+import { StencilElement } from '../../index';
 import { ViewController } from '../../navigation/nav-interfaces';
 
 /**
diff --git a/packages/core/src/components/tabs/tabs.tsx b/packages/core/src/components/tabs/tabs.tsx
index 4ffe3a5060..016e00d975 100644
--- a/packages/core/src/components/tabs/tabs.tsx
+++ b/packages/core/src/components/tabs/tabs.tsx
@@ -1,5 +1,5 @@
 import { Component, Element, Event, EventEmitter, Listen, Method, Prop, State } from '@stencil/core';
-import { Config, HTMLIonTabElement } from '../../index';
+import { Config } from '../../index';
 
 export interface NavOptions { }
 // import { isPresent } from '../../utils/helpers';
diff --git a/packages/core/src/global/dom-controller.ts b/packages/core/src/global/dom-controller.ts
new file mode 100644
index 0000000000..37f7460e8d
--- /dev/null
+++ b/packages/core/src/global/dom-controller.ts
@@ -0,0 +1,78 @@
+export interface Now {
+  (): number;
+}
+
+export interface DomController {
+  read: DomControllerCallback;
+  write: DomControllerCallback;
+  raf: DomControllerCallback;
+}
+
+export interface RafCallback {
+  (timeStamp?: number): void;
+}
+
+export interface DomControllerCallback {
+  (cb: RafCallback): void;
+}
+
+export function createDomControllerClient(win: Window, now: Now, rafPending?: boolean): DomController {
+  const readCBs: RafCallback[] = [];
+  const writeCBs: RafCallback[] = [];
+  const raf = (cb: FrameRequestCallback): number => win.requestAnimationFrame(cb);
+
+
+  function rafFlush(timeStamp: number, startTime?: number, cb?: RafCallback, err?: any) {
+    try {
+      startTime = now();
+
+      // ******** DOM READS ****************
+      while (cb = readCBs.shift()) {
+        cb(timeStamp);
+      }
+
+      // ******** DOM WRITES ****************
+      while (cb = writeCBs.shift()) {
+        cb(timeStamp);
+
+        if ((now() - startTime) > 8) {
+          break;
+        }
+      }
+
+    } catch (e) {
+      err = e;
+    }
+
+    if (rafPending = (readCBs.length > 0 || writeCBs.length > 0)) {
+      raf(rafFlush);
+    }
+
+    if (err) {
+      console.error(err);
+    }
+  }
+
+  return {
+
+    read: (cb: RafCallback) => {
+      readCBs.push(cb);
+
+      if (!rafPending) {
+        rafPending = true;
+        raf(rafFlush);
+      }
+    },
+
+    write: (cb: RafCallback) => {
+      writeCBs.push(cb);
+
+      if (!rafPending) {
+        rafPending = true;
+        raf(rafFlush);
+      }
+    },
+
+    raf: raf
+  };
+}
diff --git a/packages/core/src/global/ionic-global.ts b/packages/core/src/global/ionic-global.ts
index b094b492ce..fa0fbf1c1d 100644
--- a/packages/core/src/global/ionic-global.ts
+++ b/packages/core/src/global/ionic-global.ts
@@ -1,9 +1,16 @@
 import { createConfigController } from './config-controller';
 import { PLATFORM_CONFIGS, detectPlatforms } from './platform-configs';
+import { createDomControllerClient } from './dom-controller';
 
 
 const Ionic = (window as any).Ionic = (window as any).Ionic || {};
 
+// add dom controller, used to coordinate DOM reads and write in order to avoid
+// layout thrashing
+if (!Context.dom) {
+  const now = () => window.performance.now();
+  Context.dom = createDomControllerClient(window, now);
+}
 
 // create the Ionic.config from raw config object (if it exists)
 // and convert Ionic.config into a ConfigApi that has a get() fn
diff --git a/packages/core/src/global/test/dom-controller.spec.ts b/packages/core/src/global/test/dom-controller.spec.ts
new file mode 100644
index 0000000000..f94cd295d1
--- /dev/null
+++ b/packages/core/src/global/test/dom-controller.spec.ts
@@ -0,0 +1,42 @@
+import { DomController, createDomControllerClient } from '../dom-controller';
+
+describe('DomController', () => {
+  it('should schedule reads then writes', () => {
+    const stack: string[] = [];
+    dom.read(() => stack.push('r1'));
+    dom.read(() => {
+      stack.push('r2');
+      dom.read(() => stack.push('r1-2'));
+      dom.write(() => stack.push('w1-2'));
+    });
+    dom.read(() => stack.push('r3'));
+
+    dom.write(() => {
+      stack.push('w1');
+      dom.read(() => stack.push('r2-2'));
+      dom.write(() => stack.push('w2-2'));
+    });
+    dom.write(() => stack.push('w2'));
+    dom.write(() => stack.push('w3'));
+
+    expect(stack).toHaveLength(0);
+
+    win.doRAF(0);
+    expect(stack).toEqual(['r1', 'r2', 'r3', 'w1', 'w2', 'w3']);
+  });
+
+  let win: any;
+  let dom: DomController;
+  beforeEach(() => {
+    win = {
+      requestAnimationFrame: (cb: any) => {
+        this.cb = cb;
+      },
+      doRAF: (time: number) => {
+        this.cb(time);
+      }
+    } as any as Window;
+    const now = () => 1;
+    dom = createDomControllerClient(win, now, false);
+  });
+});