chore: make the library ready for offline compile (#738)

Author: jelbourn

src/components/checkbox/checkbox.ts

@@ -22,7 +22,7 @@ let nextId = 0;
  * Provider Expression that allows md-checkbox to register as a ControlValueAccessor. This allows it
  * to support [(ngModel)] and ngControl.
  */
-const MD_CHECKBOX_CONTROL_VALUE_ACCESSOR = new Provider(
+export const MD_CHECKBOX_CONTROL_VALUE_ACCESSOR = new Provider(
     NG_VALUE_ACCESSOR, {
       useExisting: forwardRef(() => MdCheckbox),
       multi: true

src/components/input/input.ts

@@ -18,7 +18,9 @@ import {
 } from '@angular/core';
 import {
   NG_VALUE_ACCESSOR,
-  ControlValueAccessor
+  ControlValueAccessor,
+  NgModel,
+  NgIf,
 } from '@angular/common';
 import {BooleanFieldValue} from '@angular2-material/core/annotations/field-value';
 import {MdError} from '@angular2-material/core/errors/error';
@@ -27,7 +29,7 @@ import {Observable} from 'rxjs/Observable';
 
 const noop = () => {};
 
-const MD_INPUT_CONTROL_VALUE_ACCESSOR = new Provider(NG_VALUE_ACCESSOR, {
+export const MD_INPUT_CONTROL_VALUE_ACCESSOR = new Provider(NG_VALUE_ACCESSOR, {
   useExisting: forwardRef(() => MdInput),
   multi: true
 });
@@ -97,6 +99,7 @@ export class MdHint {
   templateUrl: 'input.html',
   styleUrls: ['input.css'],
   providers: [MD_INPUT_CONTROL_VALUE_ACCESSOR],
+  directives: [NgIf, NgModel],
   host: {'(click)' : 'focus()'}
 })
 export class MdInput implements ControlValueAccessor, AfterContentInit, OnChanges {

src/components/progress-bar/progress-bar.ts

@@ -4,7 +4,7 @@ import {
     HostBinding,
     Input,
 } from '@angular/core';
-
+import {NgStyle} from '@angular/common';
 
 // TODO(josephperrott): Benchpress tests.
 // TODO(josephperrott): Add ARIA attributes for progressbar "for".
@@ -24,6 +24,7 @@ import {
   templateUrl: 'progress-bar.html',
   styleUrls: ['progress-bar.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  directives: [NgStyle],
 })
 export class MdProgressBar {
   /** Value of the progressbar. Defaults to zero. Mirrored to aria-valuenow. */

src/components/radio/radio.ts

@@ -34,7 +34,7 @@ export {
  * Provider Expression that allows md-radio-group to register as a ControlValueAccessor. This
  * allows it to support [(ngModel)] and ngControl.
  */
-const MD_RADIO_GROUP_CONTROL_VALUE_ACCESSOR = new Provider(
+export const MD_RADIO_GROUP_CONTROL_VALUE_ACCESSOR = new Provider(
     NG_VALUE_ACCESSOR, {
       useExisting: forwardRef(() => MdRadioGroup),
       multi: true

src/components/sidenav/sidenav.ts

@@ -12,6 +12,7 @@ import {
     EventEmitter,
     Renderer
 } from '@angular/core';
+import {NgStyle} from '@angular/common';
 import {Dir} from '@angular2-material/core/rtl/dir';
 import {PromiseCompleter} from '@angular2-material/core/async/promise-completer';
 import {MdError} from '@angular2-material/core/errors/error';
@@ -231,7 +232,7 @@ export class MdSidenav {
   // Do not use ChangeDetectionStrategy.OnPush. It does not work for this component because
   // technically it is a sibling of MdSidenav (on the content tree) and isn't updated when MdSidenav
   // changes its state.
-  directives: [MdSidenav],
+  directives: [MdSidenav, NgStyle],
   templateUrl: 'sidenav.html',
   styleUrls: [
     'sidenav.css',

src/components/tabs/tabs.ts

@@ -6,10 +6,11 @@ import {
     Output,
     ViewChildren,
     NgZone,
-    EventEmitter
+    EventEmitter,
+    QueryList,
+    ContentChildren
 } from '@angular/core';
-import {QueryList} from '@angular/core';
-import {ContentChildren} from '@angular/core';
+import {NgIf, NgFor} from '@angular/common';
 import {PortalHostDirective} from '@angular2-material/core/portal/portal-directives';
 import {MdTabLabel} from './tab-label';
 import {MdTabContent} from './tab-content';
@@ -45,7 +46,7 @@ export class MdTab {
   selector: 'md-tab-group',
   templateUrl: 'tab-group.html',
   styleUrls: ['tab-group.css'],
-  directives: [PortalHostDirective, MdTabLabelWrapper, MdInkBar],
+  directives: [PortalHostDirective, MdTabLabelWrapper, MdInkBar, NgIf, NgFor],
 })
 export class MdTabGroup {
   /** @internal */

src/core/a11y/live-announcer.ts

@@ -14,7 +14,11 @@ export class MdLiveAnnouncer {
 
   private _liveElement: Element;
 
-  constructor(@Optional() @Inject(LIVE_ANNOUNCER_ELEMENT_TOKEN) elementToken: Element) {
+  constructor(@Optional() @Inject(LIVE_ANNOUNCER_ELEMENT_TOKEN) elementToken: any) {
+
+    // We inject the live element as `any` because the constructor signature cannot reference
+    // browser globals (HTMLElement) on non-browser environments, since having a class decorator
+    // causes TypeScript to preserve the constructor signature types.
     this._liveElement = elementToken || this._createLiveElement();
   }
 

src/core/overlay/overlay.ts

@@ -32,10 +32,17 @@ let defaultState = new OverlayState();
  */
  @Injectable()
 export class Overlay {
+  private _overlayContainerElement: HTMLElement;
+
   constructor(
-      @Inject(OVERLAY_CONTAINER_TOKEN) private _overlayContainerElement: HTMLElement,
+      @Inject(OVERLAY_CONTAINER_TOKEN) overlayContainerElement: any,
       private _componentResolver: ComponentResolver,
       private _positionBuilder: OverlayPositionBuilder) {
+
+    // We inject the container as `any` because the constructor signature cannot reference
+    // browser globals (HTMLElement) on non-browser environments, since having a class decorator
+    // causes TypeScript to preserve the constructor signature types.
+    this._overlayContainerElement = overlayContainerElement;
   }
 
   /**

src/demo-app/checkbox/checkbox-demo.ts

@@ -1,8 +1,8 @@
 import {Component} from '@angular/core';
-import {FORM_DIRECTIVES} from '@angular/common';
+import {NgFor, FORM_DIRECTIVES} from '@angular/common';
 import {MdCheckbox} from '@angular2-material/checkbox/checkbox';
 
-interface Task {
+export interface Task {
   name: string;
   completed: boolean;
   subtasks?: Task[];
@@ -17,9 +17,9 @@ interface Task {
     }
   `],
   templateUrl: 'nested-checklist.html',
-  directives: [MdCheckbox]
+  directives: [MdCheckbox, NgFor]
 })
-class MdCheckboxDemoNestedChecklist {
+export class MdCheckboxDemoNestedChecklist {
   tasks: Task[] = [
     {
       name: 'Reminders',

src/demo-app/grid-list/grid-list-demo.ts

@@ -1,4 +1,5 @@
 import {Component} from '@angular/core';
+import {NgFor, FORM_DIRECTIVES} from '@angular/common';
 import {MD_GRID_LIST_DIRECTIVES} from '@angular2-material/grid-list/grid-list';
 import {MdButton} from '@angular2-material/button/button';
 import {MD_CARD_DIRECTIVES} from '@angular2-material/card/card';
@@ -9,7 +10,14 @@ import {MdIcon, MdIconRegistry} from '@angular2-material/icon/icon';
   selector: 'grid-list-demo',
   templateUrl: 'grid-list-demo.html',
   styleUrls: ['grid-list-demo.css'],
-  directives: [MD_GRID_LIST_DIRECTIVES, MdButton, MD_CARD_DIRECTIVES, MdIcon],
+  directives: [
+    MD_GRID_LIST_DIRECTIVES,
+    MdButton,
+    MD_CARD_DIRECTIVES,
+    MdIcon,
+    FORM_DIRECTIVES,
+    NgFor,
+  ],
   providers: [MdIconRegistry]
 })
 export class GridListDemo {