refactor(shadow_dom): remove ShadowDomStrategy in favor of @View(encapsulation)

BREAKING CHANGES:
- `ShadowDomStrategy` was removed. To specify the encapsulation of a component use `@View(encapsulation: ViewEncapsulation.NONE | ViewEncapsulation.EMULATED | ViewEncapsulation.NATIVE)`
- The default encapsulation strategy is now `ViewEncapsulation.EMULATED` if a component contains styles and `ViewEncapsulation.NONE` if it does not. Before this was always `NONE`.
- `ViewLoader` now returns the template as a string and the styles as a separate array

modules/angular2_material/src/components/button/button.ts

@@ -1,9 +1,12 @@
-import {Component, View, LifecycleEvent} from 'angular2/angular2';
+import {Component, View, LifecycleEvent, ViewEncapsulation} from 'angular2/angular2';
 import {isPresent} from 'angular2/src/facade/lang';
 
 
 @Component({selector: '[md-button]:not([href])'})
-@View({templateUrl: 'package:angular2_material/src/components/button/button.html'})
+@View({
+  templateUrl: 'package:angular2_material/src/components/button/button.html',
+  encapsulation: ViewEncapsulation.NONE
+})
 export class MdButton {
   // TODO(jelbourn): Ink ripples.
 }
@@ -15,7 +18,10 @@ export class MdButton {
   host: {'(click)': 'onClick($event)', '[tabIndex]': 'tabIndex'},
   lifecycle: [LifecycleEvent.onChange]
 })
-@View({templateUrl: 'package:angular2_material/src/components/button/button.html'})
+@View({
+  templateUrl: 'package:angular2_material/src/components/button/button.html',
+  encapsulation: ViewEncapsulation.NONE
+})
 export class MdAnchor {
   tabIndex: number;
 

modules/angular2_material/src/components/checkbox/checkbox.ts

@@ -1,4 +1,4 @@
-import {Component, View, Attribute} from 'angular2/angular2';
+import {Component, View, Attribute, ViewEncapsulation} 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';
@@ -17,7 +17,8 @@ import {NumberWrapper} from 'angular2/src/facade/lang';
 })
 @View({
   templateUrl: 'package:angular2_material/src/components/checkbox/checkbox.html',
-  directives: []
+  directives: [],
+  encapsulation: ViewEncapsulation.NONE
 })
 export class MdCheckbox {
   /** Whether this checkbox is checked. */

modules/angular2_material/src/components/dialog/dialog.ts

@@ -2,6 +2,7 @@ import {
   Component,
   Directive,
   View,
+  ViewEncapsulation,
   Ancestor,
   ElementRef,
   DynamicComponentLoader,
@@ -211,7 +212,8 @@ export class MdDialogConfig {
 })
 @View({
   templateUrl: 'package:angular2_material/src/components/dialog/dialog.html',
-  directives: [forwardRef(() => MdDialogContent)]
+  directives: [forwardRef(() => MdDialogContent)],
+  encapsulation: ViewEncapsulation.NONE
 })
 class MdDialogContainer {
   // Ref to the dialog content. Used by the DynamicComponentLoader to load the dialog content.

modules/angular2_material/src/components/grid_list/grid_list.ts

@@ -1,4 +1,4 @@
-import {Component, View, Ancestor, LifecycleEvent} from 'angular2/angular2';
+import {Component, View, ViewEncapsulation, Ancestor, LifecycleEvent} from 'angular2/angular2';
 
 import {ListWrapper} from 'angular2/src/facade/collection';
 import {StringWrapper, isPresent, isString, NumberWrapper} from 'angular2/src/facade/lang';
@@ -16,7 +16,10 @@ import {Math} from 'angular2/src/facade/math';
   properties: ['cols', 'rowHeight', 'gutterSize'],
   lifecycle: [LifecycleEvent.onAllChangesDone]
 })
-@View({templateUrl: 'package:angular2_material/src/components/grid_list/grid_list.html'})
+@View({
+  templateUrl: 'package:angular2_material/src/components/grid_list/grid_list.html',
+  encapsulation: ViewEncapsulation.NONE
+})
 export class MdGridList {
   /** List of tiles that are being rendered. */
   tiles: List<MdGridTile>;
@@ -223,7 +226,10 @@ export class MdGridList {
   },
   lifecycle: [LifecycleEvent.onDestroy, LifecycleEvent.onChange]
 })
-@View({templateUrl: 'package:angular2_material/src/components/grid_list/grid_tile.html'})
+@View({
+  templateUrl: 'package:angular2_material/src/components/grid_list/grid_tile.html',
+  encapsulation: ViewEncapsulation.NONE
+})
 export class MdGridTile {
   gridList: MdGridList;
   _rowspan: number;

modules/angular2_material/src/components/progress-circular/progress_circular.ts

@@ -1,8 +1,9 @@
-import {Component, View} from 'angular2/angular2';
+import {Component, View, ViewEncapsulation} from 'angular2/angular2';
 
 @Component({selector: 'md-progress-circular'})
 @View({
-  templateUrl: 'package:angular2_material/src/components/progress-circular/progress_circular.html'
+  templateUrl: 'package:angular2_material/src/components/progress-circular/progress_circular.html',
+  encapsulation: ViewEncapsulation.NONE
 })
 export class MdProgressCircular {
   constructor() {}

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

@@ -1,4 +1,4 @@
-import {Component, LifecycleEvent, View, Attribute} from 'angular2/angular2';
+import {Component, LifecycleEvent, View, ViewEncapsulation, Attribute} from 'angular2/angular2';
 
 import {isPresent, isBlank} from 'angular2/src/facade/lang';
 import {Math} from 'angular2/src/facade/math';
@@ -16,7 +16,8 @@ import {Math} from 'angular2/src/facade/math';
 })
 @View({
   templateUrl: 'package:angular2_material/src/components/progress-linear/progress_linear.html',
-  directives: []
+  directives: [],
+  encapsulation: ViewEncapsulation.NONE
 })
 export class MdProgressLinear {
   /** Value for the primary bar. */

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

@@ -1,4 +1,12 @@
-import {Component, View, LifecycleEvent, Ancestor, Attribute, Optional} from 'angular2/angular2';
+import {
+  Component,
+  View,
+  ViewEncapsulation,
+  LifecycleEvent,
+  Ancestor,
+  Attribute,
+  Optional
+} from 'angular2/angular2';
 
 import {isPresent, StringWrapper, NumberWrapper} from 'angular2/src/facade/lang';
 import {ObservableWrapper, EventEmitter} from 'angular2/src/facade/async';
@@ -36,7 +44,10 @@ var _uniqueIdCounter: number = 0;
     '[attr.aria-activedescendant]': 'activedescendant'
   }
 })
-@View({templateUrl: 'package:angular2_material/src/components/radio/radio_group.html'})
+@View({
+  templateUrl: 'package:angular2_material/src/components/radio/radio_group.html',
+  encapsulation: ViewEncapsulation.NONE
+})
 export class MdRadioGroup {
   /** The selected value for the radio group. The value comes from the options. */
   value: any;
@@ -192,7 +203,8 @@ export class MdRadioGroup {
 })
 @View({
   templateUrl: 'package:angular2_material/src/components/radio/radio_button.html',
-  directives: []
+  directives: [],
+  encapsulation: ViewEncapsulation.NONE
 })
 export class MdRadioButton {
   /** Whether this radio is checked. */

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

@@ -1,4 +1,4 @@
-import {Component, View, Attribute} from 'angular2/angular2';
+import {Component, View, ViewEncapsulation, 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';
@@ -16,8 +16,11 @@ import {NumberWrapper} from 'angular2/src/facade/lang';
     '[attr.role]': '"checkbox"'
   }
 })
-@View(
-    {templateUrl: 'package:angular2_material/src/components/switcher/switch.html', directives: []})
+@View({
+  templateUrl: 'package:angular2_material/src/components/switcher/switch.html',
+  directives: [],
+  encapsulation: ViewEncapsulation.NONE
+})
 export class MdSwitch {
   /** Whether this switch is checked. */
   checked: boolean;