chore(): fix host properties for MD components.

gulpfile.js

@@ -650,7 +650,7 @@ gulp.task('build', ['build.js', 'build.dart']);
 
 // ------------
 // angular material testing rules
-gulp.task('build/css.js.dev', function() {
+gulp.task('build.js.material', ['build.js.dev'], function() {
   return gulp.src('modules/*/src/**/*.scss')
       .pipe(sass())
       .pipe(autoprefixer())
@@ -658,15 +658,13 @@ gulp.task('build/css.js.dev', function() {
 });
 
 // TODO: this target is temporary until we find a way to use the SASS transformer
-gulp.task('build/css.dart', function() {
-  return gulp.src('dist/dart/angular2_material/lib/src/**/*.scss')
+gulp.task('build.dart.material', ['build/packages.dart'], function() {
+  return gulp.src('dist/dart/angular2_material/src/**/*.scss')
       .pipe(sass())
       .pipe(autoprefixer())
       .pipe(gulp.dest('dist/dart/angular2_material/lib/src'));
 });
 
-gulp.task('build.material', ['build.js.dev', 'build/css.js.dev']);
-
 
 gulp.task('cleanup.builder', function() {
   angularBuilder.cleanup();

modules/angular2/src/facade/browser.dart

@@ -12,6 +12,7 @@ export 'dart:html' show
   window,
   Element,
   Node,
+  MouseEvent,
   KeyboardEvent,
   Event;
 

modules/angular2/src/facade/browser.es6

@@ -8,3 +8,6 @@ export {win as window};
 export var document = window.document;
 export var location = window.location;
 export var gc = window.gc ? () => window.gc() : () => null;
+export {Event as Event};
+export {MouseEvent as MouseEvent};
+export {KeyboardEvent as KeyboardEvent};

modules/angular2/src/facade/browser.ts

@@ -12,3 +12,6 @@ export {win as window};
 export var document = window.document;
 export var location = window.location;
 export var gc = window.gc ? () => window.gc() : () => null;
+export const Event = Event;
+export const MouseEvent = MouseEvent;
+export const KeyboardEvent = KeyboardEvent;

modules/angular2_material/src/components/checkbox/checkbox.js

@@ -2,6 +2,7 @@ import {Component, View, Attribute} from 'angular2/angular2';
 import {isPresent} from 'angular2/src/facade/lang';
 import {KEY_SPACE} from 'angular2_material/src/core/constants'
 import {KeyboardEvent} from 'angular2/src/facade/browser';
+import {NumberWrapper} from 'angular2/src/facade/lang';
 
 @Component({
   selector: 'md-checkbox',
@@ -34,12 +35,12 @@ export class MdCheckbox {
   role: string;
 
   /** Setter for tabindex */
-  tabindex: any;
+  tabindex: number;
 
   constructor(@Attribute('tabindex') tabindex: string) {
     this.role = 'checkbox';
     this.checked = false;
-    this.tabindex = isPresent(tabindex) ? tabindex : '0';
+    this.tabindex = isPresent(tabindex) ? NumberWrapper.parseInt(tabindex, 10) : 0;
   }
 
   get disabled() {

modules/angular2_material/src/components/progress-linear/progress_linear.js

@@ -13,7 +13,7 @@ import {Math} from 'angular2/src/facade/math';
     'role': 'attr.role',
     'ariaValuemin': 'attr.aria-valuemin',
     'ariaValuemax': 'attr.aria-valuemax',
-    'ariaValuenow': 'attr.aria-valuenow'
+    'value': 'attr.aria-valuenow'
   }
 })
 @View({
@@ -30,23 +30,17 @@ export class MdProgressLinear {
   /** The render mode for the progress bar. */
   mode: string;
 
-  /** Attribute setter for aria-valuenow. */
-  ariaValueNowSetter: Function;
-
   /** CSS `transform` property applied to the primary bar. */
   primaryBarTransform: string;
 
   /** CSS `transform` property applied to the secondary bar. */
   secondaryBarTransform: string;
 
-
-  role:any;
-  ariaValuemin:any;
-  ariaValuemax:any;
-  ariaValuenow:any;
+  role: string;
+  ariaValuemin: string;
+  ariaValuemax: string;
 
   constructor(@Attribute('md-mode') mode: string) {
-    this.ariaValueNowSetter = ariaValueNowSetter;
     this.primaryBarTransform = '';
     this.secondaryBarTransform = '';
 
@@ -64,7 +58,6 @@ export class MdProgressLinear {
   set value(v) {
     if (isPresent(v)) {
       this.value_ = MdProgressLinear.clamp(v);
-      this.ariaValueNowSetter(this.value_);
     }
   }
 

modules/angular2_material/src/components/radio/radio_button.js

@@ -2,7 +2,7 @@ import {Component, View, Parent, Ancestor, Attribute} from 'angular2/angular2';
 import {Optional} from 'angular2/src/di/annotations';
 import {MdRadioDispatcher} from 'angular2_material/src/components/radio/radio_dispatcher'
 import {onChange} from 'angular2/src/core/annotations/annotations';
-import {isPresent, StringWrapper} from 'angular2/src/facade/lang';
+import {isPresent, StringWrapper, NumberWrapper} from 'angular2/src/facade/lang';
 import {ObservableWrapper, EventEmitter} from 'angular2/src/facade/async';
 import {ListWrapper} from 'angular2/src/facade/collection';
 import {KEY_UP, KEY_DOWN, KEY_SPACE} from 'angular2_material/src/core/constants'
@@ -69,9 +69,9 @@ export class MdRadioButton {
   /** Dispatcher for coordinating radio unique-selection by name. */
   radioDispatcher: MdRadioDispatcher;
 
-  tabindex:any;
+  tabindex: number;
 
-  role:any;
+  role: string;
 
   constructor(
       @Optional() @Parent() radioGroup: MdRadioGroup,
@@ -105,7 +105,9 @@ export class MdRadioButton {
 
     // If the user has not set a tabindex, default to zero (in the normal document flow).
     if (!isPresent(radioGroup)) {
-      this.tabindex = isPresent(tabindex) ? tabindex : '0';
+      this.tabindex = isPresent(tabindex) ? NumberWrapper.parseInt(tabindex, 10) : 0;
+    } else {
+      this.tabindex = -1;
     }
   }
 
@@ -169,12 +171,12 @@ export class MdRadioButton {
     'value': 'value'
   },
   hostListeners: {
-    'keydown': 'onKeydown($event)'
+    // TODO(jelbourn): Remove ^ when event retargeting is fixed.
+    '^keydown': 'onKeydown($event)'
   },
   hostProperties: {
     'tabindex': 'tabindex',
     'role': 'attr.role',
-    'checked': 'attr.aria-checked',
     'disabled': 'attr.aria-disabled',
     'activedescendant': 'attr.aria-activedescendant'
   }
@@ -202,11 +204,11 @@ export class MdRadioGroup {
   /** The ID of the selected radio button. */
   selectedRadioId: string;
 
-  change:EventEmitter;
+  change: EventEmitter;
 
-  tabindex:any;
+  tabindex: number;
 
-  role:any;
+  role: string;
 
   constructor(
       @Attribute('tabindex') tabindex: string,
@@ -225,7 +227,7 @@ export class MdRadioGroup {
     this.disabled = isPresent(disabled);
 
     // If the user has not set a tabindex, default to zero (in the normal document flow).
-    this.tabindex = isPresent(tabindex) ? tabindex : '0';
+    this.tabindex = isPresent(tabindex) ? NumberWrapper.parseInt(tabindex, 10) : 0;
   }
 
   /** Gets the name of this group, as to be applied in the HTML 'name' attribute. */
@@ -319,6 +321,7 @@ export class MdRadioGroup {
 
     this.radioDispatcher.notify(this.name_);
     radio.checked = true;
+    ObservableWrapper.callNext(this.change, null);
 
     this.value = radio.value;
     this.selectedRadioId = radio.id;

modules/angular2_material/src/components/switcher/switch.js

@@ -2,6 +2,7 @@ import {Component, View, Attribute} from 'angular2/angular2';
 import {isPresent} from 'angular2/src/facade/lang';
 import {KEY_SPACE} from 'angular2_material/src/core/constants'
 import {KeyboardEvent} from 'angular2/src/facade/browser';
+import {NumberWrapper} from 'angular2/src/facade/lang';
 
 // TODO(jelbourn): without gesture support, this is identical to MdCheckbox.
 
@@ -31,13 +32,13 @@ export class MdSwitch {
   /** Whether this switch is disabled. */
   disabled_: boolean;
 
-  tabindex:any;
-  role:any;
+  tabindex: number;
+  role: string;
 
   constructor(@Attribute('tabindex') tabindex: string) {
     this.role = 'checkbox';
     this.checked = false;
-    this.tabindex = isPresent(tabindex) ? tabindex : '0';
+    this.tabindex = isPresent(tabindex) ? NumberWrapper.parseInt(tabindex, 10) : 0;
   }
 
   get disabled() {

modules/examples/src/material/demo_common.js

@@ -13,13 +13,13 @@ export function commonDemoSetup(): void {
 }
 
 @Injectable()
-@IMPLEMENTS(UrlResolver)
-export class DemoUrlResolver {
+export class DemoUrlResolver extends UrlResolver {
     static a;
 
     isInPubServe:boolean;
 
     constructor() {
+        super();
         if (isBlank(UrlResolver.a)) {
             UrlResolver.a = DOM.createElement('a');
         }