diff --git a/angular/src/directives/proxies.ts b/angular/src/directives/proxies.ts
index d5cbe339de..944c018159 100644
--- a/angular/src/directives/proxies.ts
+++ b/angular/src/directives/proxies.ts
@@ -1,4 +1,5 @@
 /* auto-generated angular directive proxies */
+/* tslint:disable */
 import { Directive, ElementRef, EventEmitter } from '@angular/core';
 
 export function proxyInputs(instance: any, el: ElementRef, props: string[]) {
@@ -29,17 +30,17 @@ export function proxyMethods(instance: any, ref: ElementRef, methods: string[])
 
 
 export declare interface App extends StencilComponents.IonApp {}
-@Directive({selector: 'ion-app'})
+@Directive({ selector: 'ion-app' })
 export class App {
 }
 
 export declare interface Avatar extends StencilComponents.IonAvatar {}
-@Directive({selector: 'ion-avatar'})
+@Directive({ selector: 'ion-avatar' })
 export class Avatar {
 }
 
 export declare interface BackButton extends StencilComponents.IonBackButton {}
-@Directive({selector: 'ion-back-button', inputs: ['color', 'mode', 'defaultHref', 'icon', 'text']})
+@Directive({ selector: 'ion-back-button', inputs: ['color', 'mode', 'defaultHref', 'icon', 'text'] })
 export class BackButton {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode', 'defaultHref', 'icon', 'text']);
@@ -47,7 +48,7 @@ export class BackButton {
 }
 
 export declare interface Badge extends StencilComponents.IonBadge {}
-@Directive({selector: 'ion-badge', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-badge', inputs: ['color', 'mode'] })
 export class Badge {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -55,7 +56,7 @@ export class Badge {
 }
 
 export declare interface Button extends StencilComponents.IonButton {}
-@Directive({selector: 'ion-button', inputs: ['color', 'mode', 'buttonType', 'disabled', 'expand', 'fill', 'routerDirection', 'href', 'shape', 'size', 'strong', 'type'], outputs: ['ionFocus', 'ionBlur']})
+@Directive({ selector: 'ion-button', inputs: ['color', 'mode', 'buttonType', 'disabled', 'expand', 'fill', 'routerDirection', 'href', 'shape', 'size', 'strong', 'type'], outputs: ['ionFocus', 'ionBlur'] })
 export class Button {
   ionFocus: EventEmitter<any>;
   ionBlur: EventEmitter<any>;
@@ -66,12 +67,12 @@ export class Button {
 }
 
 export declare interface Buttons extends StencilComponents.IonButtons {}
-@Directive({selector: 'ion-buttons'})
+@Directive({ selector: 'ion-buttons' })
 export class Buttons {
 }
 
 export declare interface Card extends StencilComponents.IonCard {}
-@Directive({selector: 'ion-card', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-card', inputs: ['color', 'mode'] })
 export class Card {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -79,7 +80,7 @@ export class Card {
 }
 
 export declare interface CardContent extends StencilComponents.IonCardContent {}
-@Directive({selector: 'ion-card-content', inputs: ['mode']})
+@Directive({ selector: 'ion-card-content', inputs: ['mode'] })
 export class CardContent {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['mode']);
@@ -87,7 +88,7 @@ export class CardContent {
 }
 
 export declare interface CardHeader extends StencilComponents.IonCardHeader {}
-@Directive({selector: 'ion-card-header', inputs: ['color', 'mode', 'translucent']})
+@Directive({ selector: 'ion-card-header', inputs: ['color', 'mode', 'translucent'] })
 export class CardHeader {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode', 'translucent']);
@@ -95,7 +96,7 @@ export class CardHeader {
 }
 
 export declare interface CardSubtitle extends StencilComponents.IonCardSubtitle {}
-@Directive({selector: 'ion-card-subtitle', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-card-subtitle', inputs: ['color', 'mode'] })
 export class CardSubtitle {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -103,7 +104,7 @@ export class CardSubtitle {
 }
 
 export declare interface CardTitle extends StencilComponents.IonCardTitle {}
-@Directive({selector: 'ion-card-title', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-card-title', inputs: ['color', 'mode'] })
 export class CardTitle {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -111,7 +112,7 @@ export class CardTitle {
 }
 
 export declare interface Checkbox extends StencilComponents.IonCheckbox {}
-@Directive({selector: 'ion-checkbox', inputs: ['color', 'mode', 'name', 'checked', 'disabled', 'value'], outputs: ['ionChange', 'ionFocus', 'ionBlur', 'ionStyle']})
+@Directive({ selector: 'ion-checkbox', inputs: ['color', 'mode', 'name', 'checked', 'disabled', 'value'], outputs: ['ionChange', 'ionFocus', 'ionBlur', 'ionStyle'] })
 export class Checkbox {
   ionChange: EventEmitter<any>;
   ionFocus: EventEmitter<any>;
@@ -124,7 +125,7 @@ export class Checkbox {
 }
 
 export declare interface Chip extends StencilComponents.IonChip {}
-@Directive({selector: 'ion-chip', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-chip', inputs: ['color', 'mode'] })
 export class Chip {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -132,7 +133,7 @@ export class Chip {
 }
 
 export declare interface ChipButton extends StencilComponents.IonChipButton {}
-@Directive({selector: 'ion-chip-button', inputs: ['color', 'mode', 'disabled', 'fill', 'href']})
+@Directive({ selector: 'ion-chip-button', inputs: ['color', 'mode', 'disabled', 'fill', 'href'] })
 export class ChipButton {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode', 'disabled', 'fill', 'href']);
@@ -140,15 +141,15 @@ export class ChipButton {
 }
 
 export declare interface ChipIcon extends StencilComponents.IonChipIcon {}
-@Directive({selector: 'ion-chip-icon', inputs: ['color', 'mode', 'name']})
+@Directive({ selector: 'ion-chip-icon', inputs: ['color', 'mode', 'name', 'src'] })
 export class ChipIcon {
   constructor(r: ElementRef) {
-    proxyInputs(this, r, ['color', 'mode', 'name']);
+    proxyInputs(this, r, ['color', 'mode', 'name', 'src']);
   }
 }
 
 export declare interface Col extends StencilComponents.IonCol {}
-@Directive({selector: 'ion-col', inputs: ['offset', 'offsetXs', 'offsetSm', 'offsetMd', 'offsetLg', 'offsetXl', 'pull', 'pullXs', 'pullSm', 'pullMd', 'pullLg', 'pullXl', 'push', 'pushXs', 'pushSm', 'pushMd', 'pushLg', 'pushXl', 'size', 'sizeXs', 'sizeSm', 'sizeMd', 'sizeLg', 'sizeXl']})
+@Directive({ selector: 'ion-col', inputs: ['offset', 'offsetXs', 'offsetSm', 'offsetMd', 'offsetLg', 'offsetXl', 'pull', 'pullXs', 'pullSm', 'pullMd', 'pullLg', 'pullXl', 'push', 'pushXs', 'pushSm', 'pushMd', 'pushLg', 'pushXl', 'size', 'sizeXs', 'sizeSm', 'sizeMd', 'sizeLg', 'sizeXl'] })
 export class Col {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['offset', 'offsetXs', 'offsetSm', 'offsetMd', 'offsetLg', 'offsetXl', 'pull', 'pullXs', 'pullSm', 'pullMd', 'pullLg', 'pullXl', 'push', 'pushXs', 'pushSm', 'pushMd', 'pushLg', 'pushXl', 'size', 'sizeXs', 'sizeSm', 'sizeMd', 'sizeLg', 'sizeXl']);
@@ -156,7 +157,7 @@ export class Col {
 }
 
 export declare interface Content extends StencilComponents.IonContent {}
-@Directive({selector: 'ion-content', inputs: ['color', 'fullscreen', 'forceOverscroll', 'scrollEnabled', 'scrollEvents']})
+@Directive({ selector: 'ion-content', inputs: ['color', 'fullscreen', 'forceOverscroll', 'scrollEnabled', 'scrollEvents'] })
 export class Content {
   constructor(r: ElementRef) {
     proxyMethods(this, r, ['getScrollElement']);
@@ -165,18 +166,19 @@ export class Content {
 }
 
 export declare interface Datetime extends StencilComponents.IonDatetime {}
-@Directive({selector: 'ion-datetime', inputs: ['disabled', 'min', 'max', 'displayFormat', 'pickerFormat', 'cancelText', 'doneText', 'yearValues', 'monthValues', 'dayValues', 'hourValues', 'minuteValues', 'monthNames', 'monthShortNames', 'dayNames', 'dayShortNames', 'pickerOptions', 'placeholder', 'value'], outputs: ['ionCancel', 'ionStyle']})
+@Directive({ selector: 'ion-datetime', inputs: ['disabled', 'min', 'max', 'displayFormat', 'pickerFormat', 'cancelText', 'doneText', 'yearValues', 'monthValues', 'dayValues', 'hourValues', 'minuteValues', 'monthNames', 'monthShortNames', 'dayNames', 'dayShortNames', 'pickerOptions', 'placeholder', 'value'], outputs: ['ionCancel', 'ionChange', 'ionStyle'] })
 export class Datetime {
   ionCancel: EventEmitter<any>;
+  ionChange: EventEmitter<any>;
   ionStyle: EventEmitter<any>;
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['disabled', 'min', 'max', 'displayFormat', 'pickerFormat', 'cancelText', 'doneText', 'yearValues', 'monthValues', 'dayValues', 'hourValues', 'minuteValues', 'monthNames', 'monthShortNames', 'dayNames', 'dayShortNames', 'pickerOptions', 'placeholder', 'value']);
-    proxyOutputs(this, ['ionCancel', 'ionStyle']);
+    proxyOutputs(this, ['ionCancel', 'ionChange', 'ionStyle']);
   }
 }
 
 export declare interface Fab extends StencilComponents.IonFab {}
-@Directive({selector: 'ion-fab', inputs: ['horizontal', 'vertical', 'edge', 'activated']})
+@Directive({ selector: 'ion-fab', inputs: ['horizontal', 'vertical', 'edge', 'activated'] })
 export class Fab {
   constructor(r: ElementRef) {
     proxyMethods(this, r, ['close']);
@@ -185,7 +187,7 @@ export class Fab {
 }
 
 export declare interface FabButton extends StencilComponents.IonFabButton {}
-@Directive({selector: 'ion-fab-button', inputs: ['color', 'mode', 'activated', 'disabled', 'href', 'translucent', 'show']})
+@Directive({ selector: 'ion-fab-button', inputs: ['color', 'mode', 'activated', 'disabled', 'href', 'translucent', 'show'] })
 export class FabButton {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode', 'activated', 'disabled', 'href', 'translucent', 'show']);
@@ -193,7 +195,7 @@ export class FabButton {
 }
 
 export declare interface FabList extends StencilComponents.IonFabList {}
-@Directive({selector: 'ion-fab-list', inputs: ['activated', 'side']})
+@Directive({ selector: 'ion-fab-list', inputs: ['activated', 'side'] })
 export class FabList {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['activated', 'side']);
@@ -201,7 +203,7 @@ export class FabList {
 }
 
 export declare interface Footer extends StencilComponents.IonFooter {}
-@Directive({selector: 'ion-footer', inputs: ['mode', 'translucent']})
+@Directive({ selector: 'ion-footer', inputs: ['mode', 'translucent'] })
 export class Footer {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['mode', 'translucent']);
@@ -209,7 +211,7 @@ export class Footer {
 }
 
 export declare interface Grid extends StencilComponents.IonGrid {}
-@Directive({selector: 'ion-grid', inputs: ['fixed']})
+@Directive({ selector: 'ion-grid', inputs: ['fixed'] })
 export class Grid {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['fixed']);
@@ -217,7 +219,7 @@ export class Grid {
 }
 
 export declare interface Header extends StencilComponents.IonHeader {}
-@Directive({selector: 'ion-header', inputs: ['mode', 'translucent']})
+@Directive({ selector: 'ion-header', inputs: ['mode', 'translucent'] })
 export class Header {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['mode', 'translucent']);
@@ -225,7 +227,7 @@ export class Header {
 }
 
 export declare interface HideWhen extends StencilComponents.IonHideWhen {}
-@Directive({selector: 'ion-hide-when', inputs: ['mode', 'orientation', 'mediaQuery', 'size', 'platform', 'or']})
+@Directive({ selector: 'ion-hide-when', inputs: ['mode', 'orientation', 'mediaQuery', 'size', 'platform', 'or'] })
 export class HideWhen {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['mode', 'orientation', 'mediaQuery', 'size', 'platform', 'or']);
@@ -233,7 +235,7 @@ export class HideWhen {
 }
 
 export declare interface Icon extends StencilComponents.IonIcon {}
-@Directive({selector: 'ion-icon', inputs: ['ariaLabel', 'color', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'size', 'src']})
+@Directive({ selector: 'ion-icon', inputs: ['ariaLabel', 'color', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'size', 'src'] })
 export class Icon {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['ariaLabel', 'color', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'size', 'src']);
@@ -241,7 +243,7 @@ export class Icon {
 }
 
 export declare interface Img extends StencilComponents.IonImg {}
-@Directive({selector: 'ion-img', inputs: ['alt', 'src'], outputs: ['ionImgDidLoad']})
+@Directive({ selector: 'ion-img', inputs: ['alt', 'src'], outputs: ['ionImgDidLoad'] })
 export class Img {
   ionImgDidLoad: EventEmitter<any>;
   constructor(r: ElementRef) {
@@ -251,7 +253,7 @@ export class Img {
 }
 
 export declare interface InfiniteScroll extends StencilComponents.IonInfiniteScroll {}
-@Directive({selector: 'ion-infinite-scroll', inputs: ['threshold', 'disabled', 'position'], outputs: ['ionInfinite']})
+@Directive({ selector: 'ion-infinite-scroll', inputs: ['threshold', 'disabled', 'position'], outputs: ['ionInfinite'] })
 export class InfiniteScroll {
   ionInfinite: EventEmitter<any>;
   constructor(r: ElementRef) {
@@ -262,7 +264,7 @@ export class InfiniteScroll {
 }
 
 export declare interface InfiniteScrollContent extends StencilComponents.IonInfiniteScrollContent {}
-@Directive({selector: 'ion-infinite-scroll-content', inputs: ['loadingSpinner', 'loadingText']})
+@Directive({ selector: 'ion-infinite-scroll-content', inputs: ['loadingSpinner', 'loadingText'] })
 export class InfiniteScrollContent {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['loadingSpinner', 'loadingText']);
@@ -270,7 +272,7 @@ export class InfiniteScrollContent {
 }
 
 export declare interface Input extends StencilComponents.IonInput {}
-@Directive({selector: 'ion-input', inputs: ['color', 'mode', 'accept', 'autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'debounce', 'disabled', 'inputmode', 'max', 'maxlength', 'min', 'minlength', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'results', 'spellcheck', 'step', 'size', 'type', 'value'], outputs: ['ionInput', 'ionChange', 'ionStyle', 'ionBlur', 'ionFocus', 'ionInputDidLoad', 'ionInputDidUnload']})
+@Directive({ selector: 'ion-input', inputs: ['color', 'mode', 'accept', 'autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'debounce', 'disabled', 'inputmode', 'max', 'maxlength', 'min', 'minlength', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'results', 'spellcheck', 'step', 'size', 'type', 'value'], outputs: ['ionInput', 'ionChange', 'ionStyle', 'ionBlur', 'ionFocus', 'ionInputDidLoad', 'ionInputDidUnload'] })
 export class Input {
   ionInput: EventEmitter<any>;
   ionChange: EventEmitter<any>;
@@ -286,7 +288,7 @@ export class Input {
 }
 
 export declare interface Item extends StencilComponents.IonItem {}
-@Directive({selector: 'ion-item', inputs: ['color', 'mode', 'button', 'detail', 'detailIcon', 'disabled', 'href', 'lines', 'routerDirection', 'state', 'type']})
+@Directive({ selector: 'ion-item', inputs: ['color', 'mode', 'button', 'detail', 'detailIcon', 'disabled', 'href', 'lines', 'routerDirection', 'state', 'type'] })
 export class Item {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode', 'button', 'detail', 'detailIcon', 'disabled', 'href', 'lines', 'routerDirection', 'state', 'type']);
@@ -294,7 +296,7 @@ export class Item {
 }
 
 export declare interface ItemDivider extends StencilComponents.IonItemDivider {}
-@Directive({selector: 'ion-item-divider', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-item-divider', inputs: ['color', 'mode'] })
 export class ItemDivider {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -302,12 +304,12 @@ export class ItemDivider {
 }
 
 export declare interface ItemGroup extends StencilComponents.IonItemGroup {}
-@Directive({selector: 'ion-item-group'})
+@Directive({ selector: 'ion-item-group' })
 export class ItemGroup {
 }
 
 export declare interface ItemOption extends StencilComponents.IonItemOption {}
-@Directive({selector: 'ion-item-option', inputs: ['color', 'mode', 'disabled', 'expandable', 'href']})
+@Directive({ selector: 'ion-item-option', inputs: ['color', 'mode', 'disabled', 'expandable', 'href'] })
 export class ItemOption {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode', 'disabled', 'expandable', 'href']);
@@ -315,7 +317,7 @@ export class ItemOption {
 }
 
 export declare interface ItemOptions extends StencilComponents.IonItemOptions {}
-@Directive({selector: 'ion-item-options', inputs: ['side'], outputs: ['ionSwipe']})
+@Directive({ selector: 'ion-item-options', inputs: ['side'], outputs: ['ionSwipe'] })
 export class ItemOptions {
   ionSwipe: EventEmitter<any>;
   constructor(r: ElementRef) {
@@ -326,17 +328,18 @@ export class ItemOptions {
 }
 
 export declare interface ItemSliding extends StencilComponents.IonItemSliding {}
-@Directive({selector: 'ion-item-sliding', outputs: ['ionDrag']})
+@Directive({ selector: 'ion-item-sliding', inputs: ['disabled'], outputs: ['ionDrag'] })
 export class ItemSliding {
   ionDrag: EventEmitter<any>;
   constructor(r: ElementRef) {
     proxyMethods(this, r, ['getOpenAmount', 'getSlidingRatio', 'close', 'closeOpened']);
+    proxyInputs(this, r, ['disabled']);
     proxyOutputs(this, ['ionDrag']);
   }
 }
 
 export declare interface Label extends StencilComponents.IonLabel {}
-@Directive({selector: 'ion-label', inputs: ['color', 'mode', 'position'], outputs: ['ionStyle']})
+@Directive({ selector: 'ion-label', inputs: ['color', 'mode', 'position'], outputs: ['ionStyle'] })
 export class Label {
   ionStyle: EventEmitter<any>;
   constructor(r: ElementRef) {
@@ -347,7 +350,7 @@ export class Label {
 }
 
 export declare interface List extends StencilComponents.IonList {}
-@Directive({selector: 'ion-list', inputs: ['lines', 'inset']})
+@Directive({ selector: 'ion-list', inputs: ['lines', 'inset'] })
 export class List {
   constructor(r: ElementRef) {
     proxyMethods(this, r, ['getOpenItem', 'setOpenItem', 'closeSlidingItems']);
@@ -356,7 +359,7 @@ export class List {
 }
 
 export declare interface ListHeader extends StencilComponents.IonListHeader {}
-@Directive({selector: 'ion-list-header', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-list-header', inputs: ['color', 'mode'] })
 export class ListHeader {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -364,7 +367,7 @@ export class ListHeader {
 }
 
 export declare interface Menu extends StencilComponents.IonMenu {}
-@Directive({selector: 'ion-menu', inputs: ['contentId', 'menuId', 'type', 'disabled', 'side', 'swipeEnabled', 'maxEdgeStart'], outputs: ['ionOpen', 'ionClose', 'ionMenuChange']})
+@Directive({ selector: 'ion-menu', inputs: ['contentId', 'menuId', 'type', 'disabled', 'side', 'swipeEnabled', 'maxEdgeStart'], outputs: ['ionOpen', 'ionClose', 'ionMenuChange'] })
 export class Menu {
   ionOpen: EventEmitter<any>;
   ionClose: EventEmitter<any>;
@@ -377,7 +380,7 @@ export class Menu {
 }
 
 export declare interface MenuButton extends StencilComponents.IonMenuButton {}
-@Directive({selector: 'ion-menu-button', inputs: ['color', 'mode', 'menu', 'autoHide']})
+@Directive({ selector: 'ion-menu-button', inputs: ['color', 'mode', 'menu', 'autoHide'] })
 export class MenuButton {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode', 'menu', 'autoHide']);
@@ -385,7 +388,7 @@ export class MenuButton {
 }
 
 export declare interface MenuToggle extends StencilComponents.IonMenuToggle {}
-@Directive({selector: 'ion-menu-toggle', inputs: ['menu', 'autoHide']})
+@Directive({ selector: 'ion-menu-toggle', inputs: ['menu', 'autoHide'] })
 export class MenuToggle {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['menu', 'autoHide']);
@@ -393,25 +396,25 @@ export class MenuToggle {
 }
 
 export declare interface Nav extends StencilComponents.IonNav {}
-@Directive({selector: 'ion-nav', inputs: ['swipeBackEnabled', 'animated', 'delegate', 'rootParams', 'root'], outputs: ['ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange']})
+@Directive({ selector: 'ion-nav', inputs: ['swipeBackEnabled', 'animated', 'delegate', 'rootParams', 'root'], outputs: ['ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange'] })
 export class Nav {
   ionNavWillLoad: EventEmitter<any>;
   ionNavWillChange: EventEmitter<any>;
   ionNavDidChange: EventEmitter<any>;
   constructor(r: ElementRef) {
-    proxyMethods(this, r, ['push', 'insert', 'insertPages', 'pop', 'popTo', 'popToRoot', 'removeIndex', 'setRoot', 'setPages', 'setRouteId', 'getRouteId', 'canGoBack', 'getActive', 'getByIndex', 'getPrevious', 'isAnimating', 'length']);
+    proxyMethods(this, r, ['push', 'insert', 'insertPages', 'pop', 'popTo', 'popToRoot', 'removeIndex', 'setRoot', 'setPages', 'setRouteId', 'getRouteId', 'canGoBack', 'getActive', 'getByIndex', 'getPrevious', 'isAnimating', 'getLength']);
     proxyInputs(this, r, ['swipeBackEnabled', 'animated', 'delegate', 'rootParams', 'root']);
     proxyOutputs(this, ['ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange']);
   }
 }
 
 export declare interface NavPop extends StencilComponents.IonNavPop {}
-@Directive({selector: 'ion-nav-pop'})
+@Directive({ selector: 'ion-nav-pop' })
 export class NavPop {
 }
 
 export declare interface NavPush extends StencilComponents.IonNavPush {}
-@Directive({selector: 'ion-nav-push', inputs: ['component', 'componentProps']})
+@Directive({ selector: 'ion-nav-push', inputs: ['component', 'componentProps'] })
 export class NavPush {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['component', 'componentProps']);
@@ -419,7 +422,7 @@ export class NavPush {
 }
 
 export declare interface NavSetRoot extends StencilComponents.IonNavSetRoot {}
-@Directive({selector: 'ion-nav-set-root', inputs: ['component', 'componentProps']})
+@Directive({ selector: 'ion-nav-set-root', inputs: ['component', 'componentProps'] })
 export class NavSetRoot {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['component', 'componentProps']);
@@ -427,7 +430,7 @@ export class NavSetRoot {
 }
 
 export declare interface Note extends StencilComponents.IonNote {}
-@Directive({selector: 'ion-note', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-note', inputs: ['color', 'mode'] })
 export class Note {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -435,7 +438,7 @@ export class Note {
 }
 
 export declare interface Radio extends StencilComponents.IonRadio {}
-@Directive({selector: 'ion-radio', inputs: ['color', 'mode', 'name', 'disabled', 'checked', 'value'], outputs: ['ionRadioDidLoad', 'ionRadioDidUnload', 'ionStyle', 'ionSelect', 'ionFocus', 'ionBlur']})
+@Directive({ selector: 'ion-radio', inputs: ['color', 'mode', 'name', 'disabled', 'checked', 'value'], outputs: ['ionRadioDidLoad', 'ionRadioDidUnload', 'ionStyle', 'ionSelect', 'ionFocus', 'ionBlur'] })
 export class Radio {
   ionRadioDidLoad: EventEmitter<any>;
   ionRadioDidUnload: EventEmitter<any>;
@@ -450,7 +453,7 @@ export class Radio {
 }
 
 export declare interface RadioGroup extends StencilComponents.IonRadioGroup {}
-@Directive({selector: 'ion-radio-group', inputs: ['allowEmptySelection', 'name', 'disabled', 'value'], outputs: ['ionChange']})
+@Directive({ selector: 'ion-radio-group', inputs: ['allowEmptySelection', 'name', 'disabled', 'value'], outputs: ['ionChange'] })
 export class RadioGroup {
   ionChange: EventEmitter<any>;
   constructor(r: ElementRef) {
@@ -460,7 +463,7 @@ export class RadioGroup {
 }
 
 export declare interface Range extends StencilComponents.IonRange {}
-@Directive({selector: 'ion-range', inputs: ['color', 'mode', 'debounce', 'name', 'dualKnobs', 'min', 'max', 'pin', 'snaps', 'step', 'disabled', 'value'], outputs: ['ionChange', 'ionStyle', 'ionFocus', 'ionBlur']})
+@Directive({ selector: 'ion-range', inputs: ['color', 'mode', 'debounce', 'name', 'dualKnobs', 'min', 'max', 'pin', 'snaps', 'step', 'disabled', 'value'], outputs: ['ionChange', 'ionStyle', 'ionFocus', 'ionBlur'] })
 export class Range {
   ionChange: EventEmitter<any>;
   ionStyle: EventEmitter<any>;
@@ -473,7 +476,7 @@ export class Range {
 }
 
 export declare interface Refresher extends StencilComponents.IonRefresher {}
-@Directive({selector: 'ion-refresher', inputs: ['pullMin', 'pullMax', 'closeDuration', 'snapbackDuration', 'disabled'], outputs: ['ionRefresh', 'ionPull', 'ionStart']})
+@Directive({ selector: 'ion-refresher', inputs: ['pullMin', 'pullMax', 'closeDuration', 'snapbackDuration', 'disabled'], outputs: ['ionRefresh', 'ionPull', 'ionStart'] })
 export class Refresher {
   ionRefresh: EventEmitter<any>;
   ionPull: EventEmitter<any>;
@@ -486,7 +489,7 @@ export class Refresher {
 }
 
 export declare interface RefresherContent extends StencilComponents.IonRefresherContent {}
-@Directive({selector: 'ion-refresher-content', inputs: ['pullingIcon', 'pullingText', 'refreshingSpinner', 'refreshingText']})
+@Directive({ selector: 'ion-refresher-content', inputs: ['pullingIcon', 'pullingText', 'refreshingSpinner', 'refreshingText'] })
 export class RefresherContent {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['pullingIcon', 'pullingText', 'refreshingSpinner', 'refreshingText']);
@@ -494,12 +497,12 @@ export class RefresherContent {
 }
 
 export declare interface Reorder extends StencilComponents.IonReorder {}
-@Directive({selector: 'ion-reorder'})
+@Directive({ selector: 'ion-reorder' })
 export class Reorder {
 }
 
 export declare interface ReorderGroup extends StencilComponents.IonReorderGroup {}
-@Directive({selector: 'ion-reorder-group', inputs: ['disabled']})
+@Directive({ selector: 'ion-reorder-group', inputs: ['disabled'] })
 export class ReorderGroup {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['disabled']);
@@ -507,7 +510,7 @@ export class ReorderGroup {
 }
 
 export declare interface RippleEffect extends StencilComponents.IonRippleEffect {}
-@Directive({selector: 'ion-ripple-effect', inputs: ['parent', 'tapClick']})
+@Directive({ selector: 'ion-ripple-effect', inputs: ['parent', 'tapClick'] })
 export class RippleEffect {
   constructor(r: ElementRef) {
     proxyMethods(this, r, ['addRipple']);
@@ -516,12 +519,12 @@ export class RippleEffect {
 }
 
 export declare interface Row extends StencilComponents.IonRow {}
-@Directive({selector: 'ion-row'})
+@Directive({ selector: 'ion-row' })
 export class Row {
 }
 
 export declare interface Scroll extends StencilComponents.IonScroll {}
-@Directive({selector: 'ion-scroll', inputs: ['mode', 'forceOverscroll', 'scrollEvents'], outputs: ['ionScrollStart', 'ionScroll', 'ionScrollEnd']})
+@Directive({ selector: 'ion-scroll', inputs: ['mode', 'forceOverscroll', 'scrollEvents'], outputs: ['ionScrollStart', 'ionScroll', 'ionScrollEnd'] })
 export class Scroll {
   ionScrollStart: EventEmitter<any>;
   ionScroll: EventEmitter<any>;
@@ -534,7 +537,7 @@ export class Scroll {
 }
 
 export declare interface Searchbar extends StencilComponents.IonSearchbar {}
-@Directive({selector: 'ion-searchbar', inputs: ['color', 'mode', 'animated', 'autocomplete', 'autocorrect', 'cancelButtonIcon', 'cancelButtonText', 'clearIcon', 'debounce', 'placeholder', 'searchIcon', 'showCancelButton', 'spellcheck', 'type', 'value'], outputs: ['ionInput', 'ionChange', 'ionCancel', 'ionClear', 'ionBlur', 'ionFocus']})
+@Directive({ selector: 'ion-searchbar', inputs: ['color', 'mode', 'animated', 'autocomplete', 'autocorrect', 'cancelButtonIcon', 'cancelButtonText', 'clearIcon', 'debounce', 'placeholder', 'searchIcon', 'showCancelButton', 'spellcheck', 'type', 'value'], outputs: ['ionInput', 'ionChange', 'ionCancel', 'ionClear', 'ionBlur', 'ionFocus'] })
 export class Searchbar {
   ionInput: EventEmitter<any>;
   ionChange: EventEmitter<any>;
@@ -549,7 +552,7 @@ export class Searchbar {
 }
 
 export declare interface Segment extends StencilComponents.IonSegment {}
-@Directive({selector: 'ion-segment', inputs: ['color', 'mode', 'disabled', 'value'], outputs: ['ionChange']})
+@Directive({ selector: 'ion-segment', inputs: ['color', 'mode', 'disabled', 'value'], outputs: ['ionChange'] })
 export class Segment {
   ionChange: EventEmitter<any>;
   constructor(r: ElementRef) {
@@ -559,7 +562,7 @@ export class Segment {
 }
 
 export declare interface SegmentButton extends StencilComponents.IonSegmentButton {}
-@Directive({selector: 'ion-segment-button', inputs: ['color', 'mode', 'checked', 'disabled', 'value'], outputs: ['ionSelect']})
+@Directive({ selector: 'ion-segment-button', inputs: ['color', 'mode', 'checked', 'disabled', 'value'], outputs: ['ionSelect'] })
 export class SegmentButton {
   ionSelect: EventEmitter<any>;
   constructor(r: ElementRef) {
@@ -569,7 +572,7 @@ export class SegmentButton {
 }
 
 export declare interface Select extends StencilComponents.IonSelect {}
-@Directive({selector: 'ion-select', inputs: ['disabled', 'cancelText', 'okText', 'placeholder', 'name', 'selectedText', 'multiple', 'interface', 'interfaceOptions', 'value'], outputs: ['ionChange', 'ionCancel', 'ionFocus', 'ionBlur', 'ionStyle']})
+@Directive({ selector: 'ion-select', inputs: ['disabled', 'cancelText', 'okText', 'placeholder', 'name', 'selectedText', 'multiple', 'interface', 'interfaceOptions', 'value'], outputs: ['ionChange', 'ionCancel', 'ionFocus', 'ionBlur', 'ionStyle'] })
 export class Select {
   ionChange: EventEmitter<any>;
   ionCancel: EventEmitter<any>;
@@ -583,7 +586,7 @@ export class Select {
 }
 
 export declare interface SelectOption extends StencilComponents.IonSelectOption {}
-@Directive({selector: 'ion-select-option', inputs: ['disabled', 'selected', 'value'], outputs: ['ionSelectOptionDidLoad', 'ionSelectOptionDidUnload']})
+@Directive({ selector: 'ion-select-option', inputs: ['disabled', 'selected', 'value'], outputs: ['ionSelectOptionDidLoad', 'ionSelectOptionDidUnload'] })
 export class SelectOption {
   ionSelectOptionDidLoad: EventEmitter<any>;
   ionSelectOptionDidUnload: EventEmitter<any>;
@@ -594,7 +597,7 @@ export class SelectOption {
 }
 
 export declare interface SelectPopover extends StencilComponents.IonSelectPopover {}
-@Directive({selector: 'ion-select-popover', inputs: ['header', 'subHeader', 'message', 'options']})
+@Directive({ selector: 'ion-select-popover', inputs: ['header', 'subHeader', 'message', 'options'] })
 export class SelectPopover {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['header', 'subHeader', 'message', 'options']);
@@ -602,7 +605,7 @@ export class SelectPopover {
 }
 
 export declare interface ShowWhen extends StencilComponents.IonShowWhen {}
-@Directive({selector: 'ion-show-when', inputs: ['mode', 'orientation', 'mediaQuery', 'size', 'platform', 'or']})
+@Directive({ selector: 'ion-show-when', inputs: ['mode', 'orientation', 'mediaQuery', 'size', 'platform', 'or'] })
 export class ShowWhen {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['mode', 'orientation', 'mediaQuery', 'size', 'platform', 'or']);
@@ -610,7 +613,7 @@ export class ShowWhen {
 }
 
 export declare interface SkeletonText extends StencilComponents.IonSkeletonText {}
-@Directive({selector: 'ion-skeleton-text', inputs: ['width']})
+@Directive({ selector: 'ion-skeleton-text', inputs: ['width'] })
 export class SkeletonText {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['width']);
@@ -618,12 +621,12 @@ export class SkeletonText {
 }
 
 export declare interface Slide extends StencilComponents.IonSlide {}
-@Directive({selector: 'ion-slide'})
+@Directive({ selector: 'ion-slide' })
 export class Slide {
 }
 
 export declare interface Slides extends StencilComponents.IonSlides {}
-@Directive({selector: 'ion-slides', inputs: ['options', 'pager', 'scrollbar'], outputs: ['ionSlidesDidLoad', 'ionSlideTap', 'ionSlideDoubleTap', 'ionSlideWillChange', 'ionSlideDidChange', 'ionSlideNextStart', 'ionSlidePrevStart', 'ionSlideNextEnd', 'ionSlidePrevEnd', 'ionSlideTransitionStart', 'ionSlideTransitionEnd', 'ionSlideDrag', 'ionSlideReachStart', 'ionSlideReachEnd', 'ionSlideTouchStart', 'ionSlideTouchEnd']})
+@Directive({ selector: 'ion-slides', inputs: ['options', 'pager', 'scrollbar'], outputs: ['ionSlidesDidLoad', 'ionSlideTap', 'ionSlideDoubleTap', 'ionSlideWillChange', 'ionSlideDidChange', 'ionSlideNextStart', 'ionSlidePrevStart', 'ionSlideNextEnd', 'ionSlidePrevEnd', 'ionSlideTransitionStart', 'ionSlideTransitionEnd', 'ionSlideDrag', 'ionSlideReachStart', 'ionSlideReachEnd', 'ionSlideTouchStart', 'ionSlideTouchEnd'] })
 export class Slides {
   ionSlidesDidLoad: EventEmitter<any>;
   ionSlideTap: EventEmitter<any>;
@@ -649,7 +652,7 @@ export class Slides {
 }
 
 export declare interface Spinner extends StencilComponents.IonSpinner {}
-@Directive({selector: 'ion-spinner', inputs: ['color', 'mode', 'duration', 'name', 'paused']})
+@Directive({ selector: 'ion-spinner', inputs: ['color', 'mode', 'duration', 'name', 'paused'] })
 export class Spinner {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode', 'duration', 'name', 'paused']);
@@ -657,7 +660,7 @@ export class Spinner {
 }
 
 export declare interface SplitPane extends StencilComponents.IonSplitPane {}
-@Directive({selector: 'ion-split-pane', inputs: ['disabled', 'when'], outputs: ['ionChange', 'ionSplitPaneVisible']})
+@Directive({ selector: 'ion-split-pane', inputs: ['disabled', 'when'], outputs: ['ionChange', 'ionSplitPaneVisible'] })
 export class SplitPane {
   ionChange: EventEmitter<any>;
   ionSplitPaneVisible: EventEmitter<any>;
@@ -669,7 +672,7 @@ export class SplitPane {
 }
 
 export declare interface Tab extends StencilComponents.IonTab {}
-@Directive({selector: 'ion-tab', inputs: ['active', 'btnId', 'delegate', 'label', 'href', 'icon', 'badge', 'badgeColor', 'component', 'name', 'disabled', 'selected', 'show', 'tabsHideOnSubPages'], outputs: ['ionSelect', 'ionTabMutated']})
+@Directive({ selector: 'ion-tab', inputs: ['active', 'btnId', 'delegate', 'label', 'href', 'icon', 'badge', 'badgeColor', 'component', 'name', 'disabled', 'selected', 'show', 'tabsHideOnSubPages'], outputs: ['ionSelect', 'ionTabMutated'] })
 export class Tab {
   ionSelect: EventEmitter<any>;
   ionTabMutated: EventEmitter<any>;
@@ -681,7 +684,7 @@ export class Tab {
 }
 
 export declare interface Tabs extends StencilComponents.IonTabs {}
-@Directive({selector: 'ion-tabs', inputs: ['color', 'name', 'tabbarHidden', 'tabbarHighlight', 'tabbarLayout', 'tabbarPlacement', 'translucent', 'scrollable', 'useRouter'], outputs: ['ionChange', 'ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange']})
+@Directive({ selector: 'ion-tabs', inputs: ['color', 'name', 'tabbarHidden', 'tabbarHighlight', 'tabbarLayout', 'tabbarPlacement', 'translucent', 'scrollable', 'useRouter'], outputs: ['ionChange', 'ionNavWillLoad', 'ionNavWillChange', 'ionNavDidChange'] })
 export class Tabs {
   ionChange: EventEmitter<any>;
   ionNavWillLoad: EventEmitter<any>;
@@ -695,7 +698,7 @@ export class Tabs {
 }
 
 export declare interface Text extends StencilComponents.IonText {}
-@Directive({selector: 'ion-text', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-text', inputs: ['color', 'mode'] })
 export class Text {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -703,7 +706,7 @@ export class Text {
 }
 
 export declare interface Textarea extends StencilComponents.IonTextarea {}
-@Directive({selector: 'ion-textarea', inputs: ['color', 'mode', 'autocapitalize', 'autocomplete', 'autofocus', 'clearOnEdit', 'debounce', 'disabled', 'maxlength', 'minlength', 'name', 'placeholder', 'readonly', 'required', 'spellcheck', 'cols', 'rows', 'wrap', 'value'], outputs: ['ionChange', 'ionInput', 'ionStyle', 'ionBlur', 'ionFocus']})
+@Directive({ selector: 'ion-textarea', inputs: ['color', 'mode', 'autocapitalize', 'autocomplete', 'autofocus', 'clearOnEdit', 'debounce', 'disabled', 'maxlength', 'minlength', 'name', 'placeholder', 'readonly', 'required', 'spellcheck', 'cols', 'rows', 'wrap', 'value'], outputs: ['ionChange', 'ionInput', 'ionStyle', 'ionBlur', 'ionFocus'] })
 export class Textarea {
   ionChange: EventEmitter<any>;
   ionInput: EventEmitter<any>;
@@ -717,12 +720,12 @@ export class Textarea {
 }
 
 export declare interface Thumbnail extends StencilComponents.IonThumbnail {}
-@Directive({selector: 'ion-thumbnail'})
+@Directive({ selector: 'ion-thumbnail' })
 export class Thumbnail {
 }
 
 export declare interface Toggle extends StencilComponents.IonToggle {}
-@Directive({selector: 'ion-toggle', inputs: ['color', 'mode', 'name', 'checked', 'disabled', 'value'], outputs: ['ionChange', 'ionFocus', 'ionBlur', 'ionStyle']})
+@Directive({ selector: 'ion-toggle', inputs: ['color', 'mode', 'name', 'checked', 'disabled', 'value'], outputs: ['ionChange', 'ionFocus', 'ionBlur', 'ionStyle'] })
 export class Toggle {
   ionChange: EventEmitter<any>;
   ionFocus: EventEmitter<any>;
@@ -735,7 +738,7 @@ export class Toggle {
 }
 
 export declare interface Toolbar extends StencilComponents.IonToolbar {}
-@Directive({selector: 'ion-toolbar', inputs: ['color', 'mode']})
+@Directive({ selector: 'ion-toolbar', inputs: ['color', 'mode'] })
 export class Toolbar {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['color', 'mode']);
@@ -743,7 +746,7 @@ export class Toolbar {
 }
 
 export declare interface ToolbarTitle extends StencilComponents.IonTitle {}
-@Directive({selector: 'ion-title', inputs: ['mode', 'color']})
+@Directive({ selector: 'ion-title', inputs: ['mode', 'color'] })
 export class ToolbarTitle {
   constructor(r: ElementRef) {
     proxyInputs(this, r, ['mode', 'color']);
diff --git a/core/scripts/clean.js b/core/scripts/clean.js
index 507c4acfba..d699b12d15 100644
--- a/core/scripts/clean.js
+++ b/core/scripts/clean.js
@@ -3,7 +3,9 @@ const path = require('path');
 
 
 const cleanDirs = [
-  'dist'
+  'dist',
+  'css',
+  '.stencil'
 ];
 
 cleanDirs.forEach(dir => {
diff --git a/core/src/components/nav/readme.md b/core/src/components/nav/readme.md
index 3dcab2b8f0..f16a78c522 100644
--- a/core/src/components/nav/readme.md
+++ b/core/src/components/nav/readme.md
@@ -111,6 +111,9 @@ Gets the active view
 Returns the view at the index
 
 
+#### getLength()
+
+
 #### getPrevious()
 
 Gets the previous view
@@ -134,9 +137,6 @@ Inserts an array of components into the nav stack at the specified index. The la
 Returns the length of navigation stack
 
 
-#### length()
-
-
 #### pop()
 
 Call to navigate back from a current component. Similar to push(), you can also pass navigation options.
diff --git a/core/src/components/popover/readme.md b/core/src/components/popover/readme.md
index 1d942a11dc..0e8dd5556b 100644
--- a/core/src/components/popover/readme.md
+++ b/core/src/components/popover/readme.md
@@ -66,7 +66,7 @@ AnimationBuilder
 Animation to use when the popover is presented.
 
 
-#### ev
+#### event
 
 any
 
@@ -171,7 +171,7 @@ If true, the popover will be dismissed when the backdrop is clicked. Defaults to
 Animation to use when the popover is presented.
 
 
-#### ev
+#### event
 
 any