Merge branch '2.0' of github.com:driftyco/ionic into 2.0

CODE_OF_CONDUCT.md

@@ -0,0 +1,11 @@
+# Contributor Code of Conduct
+
+As contributors and maintainers of the Ionic project, we pledge to respect everyone who contributes by posting issues, updating documentation, submitting pull requests, providing feedback in comments, and any other activities.
+
+Communication through any of Ionic's channels (GitHub, Slack, Forum, IRC, mailing lists, Twitter, etc.) must be constructive and never resort to personal attacks, trolling, public or private harassment, insults, or other unprofessional conduct.
+
+We promise to extend courtesy and respect to everyone involved in this project regardless of gender, gender identity, sexual orientation, disability, age, race, ethnicity, religion, or level of experience. We expect anyone contributing to the Ionic project to do the same.
+
+If any member of the community violates this code of conduct, the maintainers of the Ionic project may take action, removing issues, comments, and PRs or blocking accounts as deemed appropriate.
+
+If you are subject to or witness unacceptable behavior, or have any other concerns, please email us at [hi@ionicframework.com](mailto:hi@ionicframework.com).

gulpfile.js

@@ -159,6 +159,8 @@ gulp.task('transpile.no-typecheck', function(){
     .pipe(gulp.dest('dist'));
 });
 
+gulp.task('typecheck', ['transpile.typecheck']);
+
 gulp.task('transpile.typecheck', function(){
   var merge = require('merge2');
   var stripDebug = require('gulp-strip-debug');

ionic/animations/animation.ts

@@ -209,15 +209,15 @@ export class Animation {
 
   get before() {
     return {
-      addClass: (className) => {
+      addClass: (className): Animation => {
         this._bfAdd.push(className);
         return this;
       },
-      removeClass: (className) => {
+      removeClass: (className): Animation => {
         this._bfRmv.push(className);
         return this;
       },
-      setStyles: (styles) => {
+      setStyles: (styles): Animation => {
         this._bfSty = styles;
         return this;
       }
@@ -226,11 +226,11 @@ export class Animation {
 
   get after() {
     return {
-      addClass: (className) => {
+      addClass: (className: string): Animation => {
         this._afAdd.push(className);
         return this;
       },
-      removeClass: (className) => {
+      removeClass: (className: string): Animation => {
         this._afRmv.push(className);
         return this;
       }

ionic/components/action-sheet/action-sheet.ts

@@ -175,7 +175,7 @@ class ActionSheetCmp {
     this.d = params.data;
 
     if (this.d.cssClass) {
-      renderer.setElementClass(elementRef, this.d.cssClass, true);
+      renderer.setElementClass(elementRef.nativeElement, this.d.cssClass, true);
     }
   }
 

ionic/components/alert/alert.ts

@@ -279,14 +279,12 @@ export class Alert extends ViewController {
   host: {
     'role': 'dialog',
     '[attr.aria-labelledby]': 'hdrId',
-    '[attr.aria-describedby]': 'descId',
-    '[class]': 'cssClass'
+    '[attr.aria-describedby]': 'descId'
   },
   directives: [NgClass, NgSwitch, NgIf, NgFor]
 })
 class AlertCmp {
   activeId: string;
-  cssClass: string;
   descId: string;
   d: any;
   hdrId: string;
@@ -304,7 +302,12 @@ class AlertCmp {
     renderer: Renderer
   ) {
     this.d = params.data;
-    this.cssClass = this.d.cssClass || '';
+
+    if (this.d.cssClass) {
+      this.d.cssClass.split(' ').forEach(cssClass => {
+        renderer.setElementClass(_elementRef.nativeElement, cssClass, true);
+      });
+    }
 
     this.id = (++alertIds);
     this.descId = '';

ionic/components/alert/test/basic/index.ts

@@ -148,6 +148,75 @@ class E2EPage {
     });
   }
 
+  doCheckbox() {
+    let alert = Alert.create();
+    alert.setTitle('Checkbox!');
+
+    alert.addInput({
+      type: 'checkbox',
+      label: 'Checkbox 1',
+      value: 'value1',
+      checked: true
+    });
+
+    alert.addInput({
+      type: 'checkbox',
+      label: 'Checkbox 2',
+      value: 'value2'
+    });
+
+    alert.addInput({
+      type: 'checkbox',
+      label: 'Checkbox 3',
+      value: 'value3'
+    });
+
+    alert.addInput({
+      type: 'checkbox',
+      label: 'Checkbox 4',
+      value: 'value4'
+    });
+
+    alert.addInput({
+      type: 'checkbox',
+      label: 'Checkbox 5',
+      value: 'value5'
+    });
+
+    alert.addInput({
+      type: 'checkbox',
+      label: 'Checkbox 6 Checkbox 6 Checkbox 6 Checkbox 6 Checkbox 6 Checkbox 6 Checkbox 6 Checkbox 6 Checkbox 6 Checkbox 6',
+      value: 'value6'
+    });
+
+    alert.addButton('Cancel');
+    alert.addButton({
+      text: 'Ok',
+      handler: data => {
+        console.log('Checkbox data:', data);
+        this.testCheckboxOpen = false;
+        this.testCheckboxResult = data;
+      }
+    });
+
+    this.nav.present(alert).then(() => {
+      this.testCheckboxOpen = true;
+    });
+  }
+
+  doFastClose() {
+    let alert = Alert.create({
+      title: 'Alert!',
+      buttons: ['OK']
+    });
+
+    this.nav.present(alert);
+
+    setTimeout(() => {
+      alert.dismiss();
+    }, 100);
+  }
+
 }
 
 

ionic/components/alert/test/basic/main.html

@@ -9,6 +9,8 @@
   <button block class="e2eOpenConfirm" (click)="doConfirm()">Confirm</button>
   <button block class="e2eOpenPrompt" (click)="doPrompt()">Prompt</button>
   <button block class="e2eOpenRadio" (click)="doRadio()">Radio</button>
+  <button block class="e2eOpenCheckbox" (click)="doCheckbox()">Checkbox</button>
+  <button block class="e2eFastClose" (click)="doFastClose()">Fast Close</button>
 
   <pre>
     Confirm Opened: {{testConfirmOpen}}
@@ -17,6 +19,8 @@
     Prompt Result: {{testPromptResult | json}}
     Radio Opened: {{testRadioOpen}}
     Radio Result: {{testRadioResult}}
+    Checkbox Opened: {{testCheckboxOpen}}
+    Checkbox Result: {{testCheckboxResult}}
   </pre>
 
 </ion-content>

ionic/components/app/id.ts

@@ -88,6 +88,6 @@ export class Attr {
  * @private
  */
   ngOnInit() {
-    this._renderer.setElementAttribute(this._elementRef, this.attr, '');
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, this.attr, '');
   }
 }

ionic/components/button/button.ts

@@ -57,7 +57,7 @@ export class Button {
     let element = _elementRef.nativeElement;
 
     if (config.get('hoverCSS') === false) {
-      _renderer.setElementClass(_elementRef, 'disable-hover', true);
+      _renderer.setElementClass(_elementRef.nativeElement, 'disable-hover', true);
     }
 
     if (element.hasAttribute('ion-item')) {
@@ -100,18 +100,21 @@ export class Button {
   /**
    * @private
    */
-  addClass(className) {
-    this._renderer.setElementClass(this._elementRef, className, true);
+  addClass(className: string) {
+    this._renderer.setElementClass(this._elementRef.nativeElement, className, true);
   }
 
   /**
    * @private
    */
-  setRole(val) {
+  setRole(val: string) {
     this._role = val;
   }
 
-  _readIcon(element) {
+  /**
+   * @private
+   */
+  private _readIcon(element: HTMLElement) {
     // figure out if and where the icon lives in the button
     let childNodes = element.childNodes;
     let childNode;
@@ -149,7 +152,10 @@ export class Button {
     }
   }
 
-  _readAttrs(element) {
+  /**
+   * @private
+   */
+  private _readAttrs(element: HTMLElement) {
     let elementAttrs = element.attributes;
     let attrName;
     for (let i = 0, l = elementAttrs.length; i < l; i++) {
@@ -175,10 +181,13 @@ export class Button {
     }
   }
 
-  _assignCss(assignCssClass) {
+  /**
+   * @private
+   */
+  private _assignCss(assignCssClass: boolean) {
     let role = this._role;
     if (role) {
-      this._renderer.setElementClass(this._elementRef, role, assignCssClass); // button
+      this._renderer.setElementClass(this._elementRef.nativeElement, role, assignCssClass); // button
 
       this._setClass(this._style, assignCssClass); // button-clear
       this._setClass(this._shape, assignCssClass); // button-round
@@ -193,16 +202,19 @@ export class Button {
     }
   }
 
-  _setClass(type, assignCssClass) {
+  /**
+   * @private
+   */
+  private _setClass(type: string, assignCssClass: boolean) {
     if (type) {
-      this._renderer.setElementClass(this._elementRef, this._role + '-' + type, assignCssClass);
+      this._renderer.setElementClass(this._elementRef.nativeElement, this._role + '-' + type, assignCssClass);
     }
   }
 
 /**
  * @private
  */
-  static setRoles(contentButtonChildren, role) {
+  static setRoles(contentButtonChildren, role: string) {
     let buttons = contentButtonChildren.toArray();
     buttons.forEach(button => {
       button.setRole(role);

ionic/components/checkbox/checkbox.ts

@@ -35,14 +35,15 @@ import {Form} from '../../util/form';
       '<div class="checkbox-media" disable-activated>' +
         '<div class="checkbox-icon"></div>' +
       '</div>' +
-      '<ion-item-content id="{{labelId}}">' +
+      '<ion-item-content id="{{_labelId}}">' +
         '<ng-content></ng-content>' +
       '</ion-item-content>' +
     '</div>'
 })
 export class Checkbox {
   private _checked: boolean;
-  private labelId: string;
+  private _labelId: string;
+
   @Input() value: string = '';
   @Input() disabled: boolean = false;
   @Input() id: string;
@@ -66,11 +67,11 @@ export class Checkbox {
   ngOnInit() {
     if (!this.id) {
       this.id = 'chk-' + this._form.nextId();
-      this._renderer.setElementAttribute(this._elementRef, 'id', this.id);
+      this._renderer.setElementAttribute(this._elementRef.nativeElement, 'id', this.id);
     }
 
-    this.labelId = 'lbl-' + this.id;
-    this._renderer.setElementAttribute(this._elementRef, 'aria-labelledby', this.labelId);
+    this._labelId = 'lbl-' + this.id;
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-labelledby', this._labelId);
   }
 
   /**
@@ -82,13 +83,13 @@ export class Checkbox {
   }
 
   @Input()
-  get checked() {
+  get checked(): boolean {
     return !!this._checked;
   }
 
   set checked(val) {
     this._checked = !!val;
-    this._renderer.setElementAttribute(this._elementRef, 'aria-checked', this._checked.toString());
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-checked', this._checked.toString());
     this.onChange(this._checked);
   }
 

ionic/components/icon/icon.ts

@@ -75,7 +75,7 @@ export class Icon {
    */
   ngOnDestroy() {
     if (this._css) {
-      this._renderer.setElementClass(this._elementRef, this._css, false);
+      this._renderer.setElementClass(this._elementRef.nativeElement, this._css, false);
     }
   }
 
@@ -146,12 +146,12 @@ export class Icon {
 
     if (this._css !== css) {
       if (this._css) {
-        this._renderer.setElementClass(this._elementRef, this._css, false);
+        this._renderer.setElementClass(this._elementRef.nativeElement, this._css, false);
       }
       this._css = css;
-      this._renderer.setElementClass(this._elementRef, css, true);
+      this._renderer.setElementClass(this._elementRef.nativeElement, css, true);
 
-      this._renderer.setElementAttribute(this._elementRef, 'aria-label',
+      this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-label',
           css.replace('ion-', '').replace('ios-', '').replace('md-', '').replace('-', ' '));
     }
   }
@@ -161,7 +161,7 @@ export class Icon {
    * @param {string} add class name
    */
   addClass(className: string) {
-    this._renderer.setElementClass(this._elementRef, className, true);
+    this._renderer.setElementClass(this._elementRef.nativeElement, className, true);
   }
 
 }

ionic/components/input/input.ts

@@ -357,7 +357,7 @@ export class ItemInput {
    * @private
    */
   focusChange(inputHasFocus) {
-    this._renderer.setElementClass(this._elementRef, 'input-focused', inputHasFocus);
+    this._renderer.setElementClass(this._elementRef.nativeElement, 'input-focused', inputHasFocus);
     if (!inputHasFocus) {
       this.deregMove();
     }
@@ -375,7 +375,7 @@ export class ItemInput {
    */
   hasValue(inputValue) {
     let inputHasValue = !!(inputValue && inputValue !== '');
-    this._renderer.setElementClass(this._elementRef, 'input-has-value', inputHasValue);
+    this._renderer.setElementClass(this._elementRef.nativeElement, 'input-has-value', inputHasValue);
   }
 
   /**

ionic/components/label/label.ts

@@ -54,7 +54,7 @@ export class Label {
    * @param {string} add class name
    */
   addClass(className: string) {
-    this._renderer.setElementClass(this._elementRef, className, true);
+    this._renderer.setElementClass(this._elementRef.nativeElement, className, true);
   }
 
 }

ionic/components/list/list.ts

@@ -153,7 +153,7 @@ export class ListHeader {
 
   public set id(val: string) {
     this._id = val;
-    this._renderer.setElementAttribute(this._elementRef, 'id', val);
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'id', val);
   }
 
 }

ionic/components/menu/menu.ts

@@ -151,7 +151,7 @@ export class Menu extends Ion {
     if (self.side !== 'left' && self.side !== 'right') {
       self.side = 'left';
     }
-    self._renderer.setElementAttribute(self._elementRef, 'side', self.side);
+    self._renderer.setElementAttribute(self._elementRef.nativeElement, 'side', self.side);
 
     if (self.swipeEnabled === 'false') {
       self.isSwipeEnabled = false;
@@ -209,7 +209,7 @@ export class Menu extends Ion {
       type = this._config.get('menuType');
     }
     this.type = type;
-    this._renderer.setElementAttribute(this._elementRef, 'menuType', type);
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'menuType', type);
   }
 
   /**

ionic/components/nav/nav-controller.ts

@@ -1102,7 +1102,7 @@ export class NavController extends Ion {
       // class to the nav when it's finished its first transition
       if (!this._init) {
         this._init = true;
-        this._renderer.setElementClass(this.elementRef, 'has-views', true);
+        this._renderer.setElementClass(this.elementRef.nativeElement, 'has-views', true);
       }
 
       // allow clicks and enable the app again
@@ -1178,12 +1178,12 @@ export class NavController extends Ion {
 
       // auto-add page css className created from component JS class name
       let cssClassName = pascalCaseToDashCase(view.componentType['name']);
-      this._renderer.setElementClass(pageElementRef, cssClassName, true);
+      this._renderer.setElementClass(pageElementRef.nativeElement, cssClassName, true);
 
       view.addDestroy(() => {
         // ensure the element is cleaned up for when the view pool reuses this element
-        this._renderer.setElementAttribute(pageElementRef, 'class', null);
-        this._renderer.setElementAttribute(pageElementRef, 'style', null);
+        this._renderer.setElementAttribute(pageElementRef.nativeElement, 'class', null);
+        this._renderer.setElementAttribute(pageElementRef.nativeElement, 'style', null);
 
         // remove the page from its container
         let index = viewContainer.indexOf(hostViewRef);

ionic/components/nav/nav.ts

@@ -101,7 +101,7 @@ import {ViewController} from './view-controller';
  */
 @Component({
   selector: 'ion-nav',
-  template: '<template #contents></template>'
+  template: '<div #contents></div>'
 })
 export class Nav extends NavController {
   @Input() root: Type;

ionic/components/nav/view-controller.ts

@@ -165,11 +165,11 @@ export class ViewController {
 
       this._hdAttr = (shouldShow ? null : '');
 
-      renderer.setElementAttribute(this._pgRef, 'hidden', this._hdAttr);
+      renderer.setElementAttribute(this._pgRef.nativeElement, 'hidden', this._hdAttr);
 
       let navbarRef = this.navbarRef();
       if (navbarRef) {
-        renderer.setElementAttribute(navbarRef, 'hidden', this._hdAttr);
+        renderer.setElementAttribute(navbarRef.nativeElement, 'hidden', this._hdAttr);
       }
     }
   }
@@ -177,7 +177,7 @@ export class ViewController {
   setZIndex(zIndex: number, renderer: Renderer) {
     if (this._pgRef && zIndex !== this.zIndex) {
       this.zIndex = zIndex;
-      renderer.setElementStyle(this._pgRef, 'z-index', zIndex.toString());
+      renderer.setElementStyle(this._pgRef.nativeElement, 'z-index', zIndex.toString());
     }
   }
 

ionic/components/radio/radio.ts

@@ -66,17 +66,17 @@ export class RadioButton {
   ngOnInit() {
     if (!this.id) {
       this.id = 'rb-' + this._form.nextId();
-      this._renderer.setElementAttribute(this._elementRef, 'id', this.id);
+      this._renderer.setElementAttribute(this._elementRef.nativeElement, 'id', this.id);
     }
     this.labelId = 'lbl-' + this.id;
-    this._renderer.setElementAttribute(this._elementRef, 'aria-labelledby', this.labelId);
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-labelledby', this.labelId);
 
     let checked = this.checked;
     if (typeof checked === 'string') {
       this.checked = (checked === '' || checked === 'true');
     }
     this.isChecked = this.checked;
-    this._renderer.setElementAttribute(this._elementRef, 'checked', null);
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'checked', null);
   }
 
   /**
@@ -89,7 +89,7 @@ export class RadioButton {
   }
 
   public set isChecked(isChecked) {
-    this._renderer.setElementAttribute(this._elementRef, 'aria-checked', isChecked);
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-checked', isChecked);
   }
 
   /**
@@ -155,13 +155,13 @@ export class RadioButton {
   }
 })
 export class RadioGroup {
+  id;
+  value;
+
   @Output() change: EventEmitter<RadioGroup> = new EventEmitter();
   @ContentChildren(RadioButton) private _buttons;
   @ContentChild(ListHeader) private _header;
 
-  id: any;
-  value: any;
-
   constructor(
     @Optional() ngControl: NgControl,
     private _renderer: Renderer,
@@ -180,7 +180,7 @@ export class RadioGroup {
    * the checked value.
    * https://github.com/angular/angular/blob/master/modules/angular2/src/forms/directives/shared.ts#L34
    */
-  public writeValue(value) {
+  writeValue(value) {
     this.value = isDefined(value) ? value : '';
     if (this._buttons) {
       let buttons = this._buttons.toArray();
@@ -188,7 +188,7 @@ export class RadioGroup {
         let isChecked = (button.value === this.value);
         button.isChecked = isChecked;
         if (isChecked) {
-          this._renderer.setElementAttribute(this._elementRef, 'aria-activedescendant', button.id);
+          this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-activedescendant', button.id);
         }
       }
     }
@@ -215,7 +215,7 @@ export class RadioGroup {
    * https://github.com/angular/angular/blob/master/modules/angular2/src/forms/directives/shared.ts#L27
    * @param {Function} fn  the onChange event handler.
    */
-  public registerOnChange(fn) { this.onChange = fn; }
+  registerOnChange(fn) { this.onChange = fn; }
 
   /**
    * @private
@@ -223,7 +223,7 @@ export class RadioGroup {
    * the onTouched event handler that marks the model (Control) as touched.
    * @param {Function} fn  onTouched event handler.
    */
-  public registerOnTouched(fn) { this.onTouched = fn; }
+  registerOnTouched(fn) { this.onTouched = fn; }
 
   /**
    * @private
@@ -234,7 +234,7 @@ export class RadioGroup {
       if (!header.id) {
         header.id = 'rg-hdr-' + this.id;
       }
-      this._renderer.setElementAttribute(this._elementRef, 'aria-describedby', header.id);
+      this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-describedby', header.id);
     }
 
     this._buttons.toArray().forEach(button => {
@@ -250,7 +250,7 @@ export class RadioGroup {
         if (isChecked) {
           this.writeValue(button.value);
           //this.onChange(button.value);
-          this._renderer.setElementAttribute(this._elementRef, 'aria-activedescendant', button.id);
+          this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-activedescendant', button.id);
         }
       }
     });

ionic/components/segment/segment.ts

@@ -69,15 +69,21 @@ export class SegmentButton {
     this.select.emit(this);
   }
 
+  /**
+   * @private
+   */
   ngOnInit() {
     if (!isDefined(this.value)) {
       console.warn('<ion-segment-button> requires a "value" attribute');
     }
   }
 
-  public set isActive(isActive) {
-    this._renderer.setElementClass(this._elementRef, 'segment-activated', isActive);
-    this._renderer.setElementAttribute(this._elementRef, 'aria-pressed', isActive);
+  /**
+   * @private
+   */
+  set isActive(isActive) {
+    this._renderer.setElementClass(this._elementRef.nativeElement, 'segment-activated', isActive);
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-pressed', isActive);
   }
 
 }

ionic/components/select/select.ts

@@ -147,11 +147,11 @@ export class Select {
   ngOnInit() {
     if (!this.id) {
       this.id = 'sel-' + this.form.nextId();
-      this.renderer.setElementAttribute(this.elementRef, 'id', this.id);
+      this.renderer.setElementAttribute(this.elementRef.nativeElement, 'id', this.id);
     }
 
     this.labelId = 'lbl-' + this.id;
-    this.renderer.setElementAttribute(this.elementRef, 'aria-labelledby', this.labelId);
+    this.renderer.setElementAttribute(this.elementRef.nativeElement, 'aria-labelledby', this.labelId);
   }
 
   /**

ionic/components/tabs/tab.ts

@@ -90,7 +90,7 @@ import {TabButton} from './tab-button';
     '[attr.aria-labelledby]': '_btnId',
     'role': 'tabpanel'
   },
-  template: '<template #contents></template>'
+  template: '<div #contents></div>'
 })
 export class Tab extends NavController {
   public isSelected: boolean;

ionic/components/tabs/tabs.ts

@@ -133,12 +133,15 @@ export class Tabs extends Ion {
     });
   }
 
-  _setConfig(attrKey, fallback) {
+  /**
+   * @private
+   */
+  private _setConfig(attrKey, fallback) {
     var val = this[attrKey];
     if (isUndefined(val)) {
       val = this._config.get(attrKey);
     }
-    this._renderer.setElementAttribute(this._elementRef, attrKey, val);
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, attrKey, val);
   }
 
   /**
@@ -248,7 +251,7 @@ export class Tabs extends Ion {
    * "Touch" the active tab, going back to the root view of the tab
    * or optionally letting the tab handle the event
    */
-  _touchActive(tab) {
+  private _touchActive(tab) {
     let active = tab.getActive();
 
     if (!active) {

ionic/components/text-input/text-input.ts

@@ -13,13 +13,15 @@ import {CSS, hasFocus}  from '../../util/dom';
   }
 })
 export class TextInput {
-  @Input() value: string;
-  @Input() ngModel: any;
-  @Output() valueChange: EventEmitter<string> = new EventEmitter();
-  @Output() focusChange: EventEmitter<boolean> = new EventEmitter();
-  public type: string;
   private _relocated: boolean;
 
+  type: string;
+
+  @Input() ngModel;
+  @Input() value: string;
+  @Output() focusChange: EventEmitter<boolean> = new EventEmitter();
+  @Output() valueChange: EventEmitter<string> = new EventEmitter();
+
   constructor(
     @Attribute('type') type: string,
     private _elementRef: ElementRef,
@@ -28,6 +30,9 @@ export class TextInput {
     this.type = type || 'text';
   }
 
+  /**
+   * @private
+   */
   ngOnInit() {
     if (this.ngModel) {
       this.value = this.ngModel;
@@ -36,30 +41,45 @@ export class TextInput {
     }
   }
 
+  /**
+   * @private
+   */
   @HostListener('keyup', ['$event'])
-  _keyup(ev) {
+  private _keyup(ev) {
     this.valueChange.emit(ev.target.value);
   }
 
+  /**
+   * @private
+   */
   @HostListener('focus')
-  _focus() {
+  private _focus() {
     this.focusChange.emit(true);
   }
 
+  /**
+   * @private
+   */
   @HostListener('blur')
-  _blur() {
+  private _blur() {
     this.focusChange.emit(false);
     this.hideFocus(false);
   }
 
-  labelledBy(val) {
-    this._renderer.setElementAttribute(this._elementRef, 'aria-labelledby', val);
+  labelledBy(val: string) {
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-labelledby', val);
   }
 
+  /**
+   * @private
+   */
   setFocus() {
     this.element().focus();
   }
 
+  /**
+   * @private
+   */
   relocate(shouldRelocate: boolean, inputRelativeY?) {
     if (this._relocated !== shouldRelocate) {
 
@@ -76,7 +96,7 @@ export class TextInput {
       } else {
         focusedInputEle.classList.remove('hide-focused-input');
         focusedInputEle.style[CSS.transform] = '';
-        let clonedInputEle = focusedInputEle.parentNode.querySelector('.cloned-input');
+        let clonedInputEle = focusedInputEle.parentElement.querySelector('.cloned-input');
         if (clonedInputEle) {
           clonedInputEle.parentNode.removeChild(clonedInputEle);
         }
@@ -86,7 +106,10 @@ export class TextInput {
     }
   }
 
-  hideFocus(shouldHideFocus) {
+  /**
+   * @private
+   */
+  hideFocus(shouldHideFocus: boolean) {
     let focusedInputEle = this.element();
 
     if (shouldHideFocus) {
@@ -99,32 +122,38 @@ export class TextInput {
     } else {
       focusedInputEle.classList.remove('hide-focused-input');
       focusedInputEle.style[CSS.transform] = '';
-      let clonedInputEle = focusedInputEle.parentNode.querySelector('.cloned-hidden');
+      let clonedInputEle = focusedInputEle.parentElement.querySelector('.cloned-hidden');
       if (clonedInputEle) {
         clonedInputEle.parentNode.removeChild(clonedInputEle);
       }
     }
   }
 
-  hasFocus() {
+  hasFocus(): boolean {
     return hasFocus(this.element());
   }
 
-  addClass(className) {
-    this._renderer.setElementClass(this._elementRef, className, true);
+  /**
+   * @private
+   */
+  addClass(className: string) {
+    this._renderer.setElementClass(this._elementRef.nativeElement, className, true);
   }
 
-  hasClass(className) {
-    this._elementRef.nativeElement.classList.contains(className);
+  hasClass(className): boolean {
+    return this._elementRef.nativeElement.classList.contains(className);
   }
 
-  element() {
+  /**
+   * @private
+   */
+  element(): HTMLElement {
     return this._elementRef.nativeElement;
   }
 
 }
 
-function cloneInput(srcInput, addCssClass) {
+function cloneInput(srcInput, addCssClass: string) {
   let clonedInputEle = srcInput.cloneNode(true);
   clonedInputEle.classList.add(addCssClass);
   clonedInputEle.classList.remove('hide-focused-input');

ionic/components/toggle/toggle.ts

@@ -69,17 +69,19 @@ import {pointerCoord} from '../../util/dom';
     `</div>`
 })
 export class Toggle {
+  private _checked: boolean;
+  private _mode: string;
+  private _startX;
+  private _touched: number = 0;
+  private addMoveListener;
+  private removeMoveListener;
+
+  public isActivated: boolean;
+  public labelId: string;
+
   @Input() value: string = '';
   @Input() disabled: boolean = false;
   @Input() id: string;
-  private _checked: boolean;
-  private _touched: number = 0;
-  private _mode: string;
-  private _startX: any;
-  private addMoveListener: any;
-  private removeMoveListener: any;
-  public labelId: string;
-  public isActivated: boolean;
 
   constructor(
     private _form: Form,
@@ -143,11 +145,11 @@ export class Toggle {
   ngOnInit() {
     if (!this.id) {
       this.id = 'tgl-' + this._form.nextId();
-      this._renderer.setElementAttribute(this._elementRef, 'id', this.id);
+      this._renderer.setElementAttribute(this._elementRef.nativeElement, 'id', this.id);
     }
 
     this.labelId = 'lbl-' + this.id;
-    this._renderer.setElementAttribute(this._elementRef, 'aria-labelledby', this.labelId);
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-labelledby', this.labelId);
   }
 
   /**
@@ -164,14 +166,14 @@ export class Toggle {
 
   set checked(val: boolean) {
     this._checked = !!val;
-    this._renderer.setElementAttribute(this._elementRef, 'aria-checked', this._checked.toString());
+    this._renderer.setElementAttribute(this._elementRef.nativeElement, 'aria-checked', this._checked.toString());
     this.onChange(this._checked);
   }
 
   /**
    * @private
    */
-  pointerDown(ev) {
+  private pointerDown(ev) {
     if (/touch/.test(ev.type)) {
       this._touched = Date.now();
     }
@@ -189,7 +191,7 @@ export class Toggle {
   /**
    * @private
    */
-  pointerUp(ev) {
+  private pointerUp(ev) {
     if (this.isDisabled(ev)) return;
 
     let endX = pointerCoord(ev).x;

ionic/platform/storage/storage.ts

@@ -13,18 +13,27 @@
 export class Storage {
   private _strategy: any;
 
-  constructor(strategyCls: IStorageEngine, options: any) {
+  constructor(strategyCls: IStorageEngine, options?: any) {
     this._strategy = new strategyCls(options);
   }
   get(key: string): any {
     return this._strategy.get(key);
   }
   getJson(key: string): any {
+    return this.get(key).then(value => {
       try {
-      return JSON.parse(this._strategy.get(key));
-    } catch(e) {
-      console.warn('Storage getJson(): unable to parse value for key', key,' as JSON')
-      return null;
+        return JSON.parse(value);
+      } catch (e) {
+        console.warn('Storage getJson(): unable to parse value for key', key, ' as JSON');
+        throw e; // rethrowing exception so it can be handled with .catch()
+      }
+    });
+  }
+  setJson(key: string, value: any): Promise<any> {
+    try {
+      return this.set(key, JSON.stringify(value));
+    } catch (e) {
+      return Promise.reject(e);
     }
   }
   set(key: string, value: any) {
@@ -33,7 +42,7 @@ export class Storage {
   remove(key: string) {
     return this._strategy.remove(key);
   }
-  query(query: string, params: any) {
+  query(query: string, params?: any) {
     return this._strategy.query(query, params);
   }
 }

package.json

@@ -13,7 +13,7 @@
     "link": "npm install && gulp src && npm link"
   },
   "dependencies": {
-    "angular2": "2.0.0-beta.0",
+    "angular2": "2.0.0-beta.1",
     "colors": "^1.1.2",
     "es6-promise": "^3.0.2",
     "es6-shim": "0.33.6",

scripts/npm/package.json

@@ -2,6 +2,7 @@
   "name": "ionic-framework",
   "version": "2.0.0-alpha.<%= ionicVersion %>",
   "license": "Apache-2.0",
+  "keywords": ["ionic", "framework", "mobile", "app", "hybrid", "webapp"],
   "repository": {
     "type": "git",
     "url": "https://github.com/driftyco/ionic2.git"