refactor(all): add index.ts, and build using es2015 and UMD bundles. (#…

…1158)

package.json

@@ -74,6 +74,7 @@
     "protractor": "^3.3.0",
     "protractor-accessibility-plugin": "0.1.1",
     "resolve-bin": "^0.4.0",
+    "rollup": "^0.34.13",
     "run-sequence": "^1.2.2",
     "sass": "^0.5.0",
     "strip-ansi": "^3.0.0",

scripts/release/inline-resources.js

@@ -47,6 +47,7 @@ function inlineResources(globs) {
       readFile(filePath, 'utf-8')
         .then(content => inlineTemplate(filePath, content))
         .then(content => inlineStyle(filePath, content))
+        .then(content => removeModuleId(filePath, content))
         .then(content => writeFile(filePath, content))
         .catch(err => {
           console.error('An error occured: ', err);
@@ -104,4 +105,15 @@ function inlineStyle(filePath, content) {
 }
 
 
+/**
+ * Remove every mention of `moduleId: module.id`.
+ * @param _ {string} The file path of the source file, currently ignored.
+ * @param content {string} The source file's content.
+ * @returns {string} The content with all moduleId: mentions removed.
+ */
+function removeModuleId(_, content) {
+  return content.replace(/\s*moduleId:\s*module\.id\s*,?\s*/gm, '');
+}
+
+
 module.exports = inlineResources;

src/demo-app/button-toggle/button-toggle-demo.ts

@@ -1,7 +1,5 @@
 import {Component} from '@angular/core';
-import {
-  MdUniqueSelectionDispatcher
-} from '@angular2-material/core/coordination/unique-selection-dispatcher';
+import {MdUniqueSelectionDispatcher} from '@angular2-material/core';
 
 @Component({
   moduleId: module.id,

src/demo-app/demo-app-module.ts

@@ -4,7 +4,7 @@ import {HttpModule} from '@angular/http';
 import {FormsModule} from '@angular/forms';
 import {DemoApp, Home} from './demo-app/demo-app';
 import {RouterModule} from '@angular/router';
-import {MaterialModule} from '@angular2-material/all/all';
+import {MaterialModule} from '@angular2-material/all';
 import {DEMO_APP_ROUTES} from './demo-app/routes';
 import {ProgressBarDemo} from './progress-bar/progress-bar-demo';
 import {JazzDialog, DialogDemo} from './dialog/dialog-demo';

src/demo-app/dialog/dialog-demo.ts

@@ -1,5 +1,5 @@
 import {Component, ViewContainerRef} from '@angular/core';
-import {MdDialog, MdDialogConfig, MdDialogRef} from '@angular2-material/dialog/dialog';
+import {MdDialog, MdDialogConfig, MdDialogRef} from '@angular2-material/dialog';
 
 @Component({
   moduleId: module.id,

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

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {MdIconRegistry} from '@angular2-material/icon/icon';
+import {MdIconRegistry} from '@angular2-material/icon';
 
 
 @Component({

src/demo-app/icon/icon-demo.ts

@@ -1,5 +1,5 @@
 import {Component, ViewEncapsulation} from '@angular/core';
-import {MdIconRegistry} from '@angular2-material/icon/icon';
+import {MdIconRegistry} from '@angular2-material/icon';
 
 @Component({
   moduleId: module.id,

src/demo-app/live-announcer/live-announcer-demo.ts

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {MdLiveAnnouncer} from '@angular2-material/core/a11y/live-announcer';
+import {MdLiveAnnouncer} from '@angular2-material/core';
 
 @Component({
   moduleId: module.id,

src/demo-app/overlay/overlay-demo.ts

@@ -13,7 +13,7 @@ import {
     ComponentPortal,
     Portal,
     TemplatePortalDirective,
-} from '@angular2-material/core/core';
+} from '@angular2-material/core';
 
 
 @Component({

src/demo-app/portal/portal-demo.ts

@@ -3,7 +3,7 @@ import {
     Portal,
     ComponentPortal,
     TemplatePortalDirective,
-} from '@angular2-material/core/core';
+} from '@angular2-material/core';
 
 
 @Component({

src/demo-app/ripple/ripple-demo.ts

@@ -1,5 +1,5 @@
 import {Component, ViewChild} from '@angular/core';
-import {MdRipple} from '@angular2-material/core/core';
+import {MdRipple} from '@angular2-material/core';
 
 
 @Component({

src/demo-app/system-config.ts

@@ -30,7 +30,7 @@ const components = [
 const packages: any = {
   '@angular2-material/core': {
     format: 'cjs',
-    defaultExtension: 'js'
+    main: 'core.umd.js'
   },
   // Set the default extension for the root package, because otherwise the demo-app can't
   // be built within the production mode. Due to missing file extensions.
@@ -41,7 +41,7 @@ const packages: any = {
 components.forEach(name => {
   packages[`@angular2-material/${name}`] = {
     format: 'cjs',
-    defaultExtension: 'js'
+    main: `${name}.umd.js`
   };
 });
 
@@ -81,9 +81,9 @@ const barrels: string[] = [
   /** @cli-barrel */
 ];
 
-const _cliSystemConfig = angularPackages;
+const _cliSystemConfig: any = angularPackages;
 barrels.forEach((barrelName: string) => {
-  (<any> _cliSystemConfig)[barrelName] = { main: 'index' };
+  _cliSystemConfig[barrelName] = { main: 'index' };
 });
 
 /** Type declaration for ambient System. */

src/demo-app/tooltip/tooltip-demo.ts

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {TooltipPosition} from '@angular2-material/tooltip/tooltip';
+import {TooltipPosition} from '@angular2-material/tooltip';
 
 
 @Component({

src/e2e-app/e2e-app-module.ts

@@ -6,7 +6,7 @@ import {IconE2E} from './icon/icon-e2e';
 import {ButtonE2E} from './button/button-e2e';
 import {MenuE2E} from './menu/menu-e2e';
 import {BasicTabs} from './tabs/tabs-e2e';
-import {MaterialModule} from '@angular2-material/all/all';
+import {MaterialModule} from '@angular2-material/all';
 import {E2E_APP_ROUTES} from './e2e-app/routes';
 
 

src/e2e-app/system-config.ts

@@ -30,7 +30,7 @@ const components = [
 const packages: any = {
   '@angular2-material/core': {
     format: 'cjs',
-    defaultExtension: 'js'
+    main: 'core.umd.js'
   },
   // Set the default extension for the root package, because otherwise the demo-app can't
   // be built within the production mode. Due to missing file extensions.
@@ -41,7 +41,7 @@ const packages: any = {
 components.forEach(name => {
   packages[`@angular2-material/${name}`] = {
     format: 'cjs',
-    defaultExtension: 'js'
+    main: `${name}.umd.js`
   };
 });
 

src/lib/all/all.ts

@@ -1,28 +1,30 @@
 import {NgModule, ModuleWithProviders} from '@angular/core';
-import {MdButtonToggleModule} from '@angular2-material/button-toggle/button-toggle';
-import {MdButtonModule} from '@angular2-material/button/button';
-import {MdCheckboxModule} from '@angular2-material/checkbox/checkbox';
-import {MdRadioModule} from '@angular2-material/radio/radio';
-import {MdSlideToggleModule} from '@angular2-material/slide-toggle/slide-toggle';
-import {MdSliderModule} from '@angular2-material/slider/slider';
-import {MdSidenavModule} from '@angular2-material/sidenav/sidenav';
-import {MdListModule} from '@angular2-material/list/list';
-import {MdGridListModule} from '@angular2-material/grid-list/grid-list';
-import {MdCardModule} from '@angular2-material/card/card';
-import {MdIconModule} from '@angular2-material/icon/icon';
-import {MdProgressCircleModule} from '@angular2-material/progress-circle/progress-circle';
-import {MdProgressBarModule} from '@angular2-material/progress-bar/progress-bar';
-import {MdInputModule} from '@angular2-material/input/input';
-import {MdTabsModule} from '@angular2-material/tabs/tabs';
-import {MdToolbarModule} from '@angular2-material/toolbar/toolbar';
-import {MdTooltipModule} from '@angular2-material/tooltip/tooltip';
-import {MdRippleModule} from '@angular2-material/core/ripple/ripple';
-import {PortalModule} from '@angular2-material/core/portal/portal-directives';
-import {OverlayModule} from '@angular2-material/core/overlay/overlay-directives';
-import {MdMenuModule} from '@angular2-material/menu/menu';
-import {MdDialogModule} from '@angular2-material/dialog/dialog';
-import {RtlModule} from '@angular2-material/core/rtl/dir';
-import {MdLiveAnnouncer} from '@angular2-material/core/a11y/live-announcer';
+import {MdButtonToggleModule} from '@angular2-material/button-toggle';
+import {MdButtonModule} from '@angular2-material/button';
+import {MdCheckboxModule} from '@angular2-material/checkbox';
+import {MdRadioModule} from '@angular2-material/radio';
+import {MdSlideToggleModule} from '@angular2-material/slide-toggle';
+import {MdSliderModule} from '@angular2-material/slider';
+import {MdSidenavModule} from '@angular2-material/sidenav';
+import {MdListModule} from '@angular2-material/list';
+import {MdGridListModule} from '@angular2-material/grid-list';
+import {MdCardModule} from '@angular2-material/card';
+import {MdIconModule} from '@angular2-material/icon';
+import {MdProgressCircleModule} from '@angular2-material/progress-circle';
+import {MdProgressBarModule} from '@angular2-material/progress-bar';
+import {MdInputModule} from '@angular2-material/input';
+import {MdTabsModule} from '@angular2-material/tabs';
+import {MdToolbarModule} from '@angular2-material/toolbar';
+import {MdTooltipModule} from '@angular2-material/tooltip';
+import {
+  MdLiveAnnouncer,
+  MdRippleModule,
+  RtlModule,
+  PortalModule,
+  OverlayModule
+} from '@angular2-material/core';
+import {MdMenuModule} from '@angular2-material/menu';
+import {MdDialogModule} from '@angular2-material/dialog';
 
 
 const MATERIAL_MODULES = [

src/lib/all/index.ts

@@ -0,0 +1 @@
+export * from './all';

src/lib/button-toggle/button-toggle.ts

@@ -20,10 +20,7 @@ import {
     FormsModule,
 } from '@angular/forms';
 import {Observable} from 'rxjs/Observable';
-import {
-    MdUniqueSelectionDispatcher
-} from '@angular2-material/core/coordination/unique-selection-dispatcher';
-import {BooleanFieldValue} from '@angular2-material/core/annotations/field-value';
+import {BooleanFieldValue, MdUniqueSelectionDispatcher} from '@angular2-material/core';
 
 export type ToggleType = 'checkbox' | 'radio';
 

src/lib/button-toggle/index.ts

@@ -0,0 +1 @@
+export * from './button-toggle';

src/lib/button-toggle/package.json

@@ -2,8 +2,9 @@
   "name": "@angular2-material/button-toggle",
   "version": "2.0.0-alpha.7-12",
   "description": "Angular 2 Material Button Toggle",
-  "main": "./button-toggle.js",
-  "typings": "./button-toggle.d.ts",
+  "main": "./button-toggle.umd.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts",
   "repository": {
     "type": "git",
     "url": "https://github.com/angular/material2.git"

src/lib/button/button.ts

@@ -9,8 +9,8 @@ import {
   NgModule,
 } from '@angular/core';
 import {CommonModule} from '@angular/common';
-import {BooleanFieldValue} from '@angular2-material/core/annotations/field-value';
-import {MdRippleModule} from '@angular2-material/core/ripple/ripple';
+import {BooleanFieldValue} from '@angular2-material/core';
+import {MdRippleModule} from '@angular2-material/core';
 
 // TODO(jelbourn): Make the `isMouseDown` stuff done with one global listener.
 // TODO(kara): Convert attribute selectors to classes when attr maps become available

src/lib/button/package.json

@@ -2,8 +2,9 @@
   "name": "@angular2-material/button",
   "version": "2.0.0-alpha.7-12",
   "description": "Angular 2 Material button",
-  "main": "./button.js",
-  "typings": "./button.d.ts",
+  "main": "./button.umd.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts",
   "repository": {
     "type": "git",
     "url": "https://github.com/angular/material2.git"

src/lib/card/index.ts

@@ -0,0 +1 @@
+export * from './card';

src/lib/card/package.json

@@ -2,8 +2,9 @@
   "name": "@angular2-material/card",
   "version": "2.0.0-alpha.7-12",
   "description": "Angular 2 Material card",
-  "main": "./card.js",
-  "typings": "./card.d.ts",
+  "main": "./card.umd.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts",
   "repository": {
     "type": "git",
     "url": "https://github.com/angular/material2.git"

src/lib/checkbox/index.ts

@@ -0,0 +1 @@
+export * from './checkbox';

src/lib/checkbox/package.json

@@ -2,8 +2,9 @@
   "name": "@angular2-material/checkbox",
   "version": "2.0.0-alpha.7-12",
   "description": "Angular 2 Material checkbox",
-  "main": "./checkbox.js",
-  "typings": "./checkbox.d.ts",
+  "main": "./checkbox.umd.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts",
   "repository": {
     "type": "git",
     "url": "https://github.com/angular/material2.git"

src/lib/core/core.ts

@@ -34,10 +34,8 @@ export {
   OverlayOrigin,
   OverlayModule,
 } from './overlay/overlay-directives';
-export {
-  OverlayConnectionPosition,
-  OriginConnectionPosition
-} from './overlay/position/connected-position';
+export * from './overlay/position/connected-position-strategy';
+export * from './overlay/position/connected-position';
 
 // Gestures
 export {MdGestureConfig} from './gestures/MdGestureConfig';
@@ -59,6 +57,21 @@ export {
 
 export {MdLineModule, MdLine, MdLineSetter} from './line/line';
 
+// Style
+export {applyCssTransform} from './style/apply-transform';
+
+// Error
+export {MdError} from './errors/error';
+
+// Annotations.
+export {BooleanFieldValue} from './annotations/field-value';
+
+// Misc
+export {ComponentType} from './overlay/generic-component-type';
+
+// Keybindings
+export * from './keyboard/keycodes';
+
 
 @NgModule({
   imports: [MdLineModule, RtlModule, MdRippleModule, PortalModule, OverlayModule],

src/lib/core/index.ts

@@ -0,0 +1 @@
+export * from './core';

src/lib/core/overlay/position/connected-position-strategy.ts

@@ -1,7 +1,7 @@
 import {PositionStrategy} from './position-strategy';
 import {ElementRef} from '@angular/core';
 import {ViewportRuler} from './viewport-ruler';
-import {applyCssTransform} from '@angular2-material/core/style/apply-transform';
+import {applyCssTransform} from '@angular2-material/core';
 import {
     ConnectionPositionPair,
     OriginConnectionPosition,

src/lib/core/overlay/position/global-position-strategy.ts

@@ -1,4 +1,4 @@
-import {applyCssTransform} from '@angular2-material/core/style/apply-transform';
+import {applyCssTransform} from '@angular2-material/core';
 import {PositionStrategy} from './position-strategy';
 
 

src/lib/core/package.json

@@ -2,8 +2,9 @@
   "name": "@angular2-material/core",
   "version": "2.0.0-alpha.7-12",
   "description": "Angular 2 Material core",
-  "main": "./core.js",
-  "typings": "./core.d.ts",
+  "main": "./core.umd.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts",
   "repository": {
     "type": "git",
     "url": "https://github.com/angular/material2.git"

src/lib/dialog/dialog-container.ts

@@ -2,9 +2,9 @@ import {Component, ComponentRef, ViewChild} from '@angular/core';
 import {
   BasePortalHost,
   ComponentPortal,
+  PortalHostDirective,
   TemplatePortal
-} from '@angular2-material/core/portal/portal';
-import {PortalHostDirective} from '@angular2-material/core/portal/portal-directives';
+} from '@angular2-material/core';
 import {MdDialogConfig} from './dialog-config';
 import {MdDialogContentAlreadyAttachedError} from './dialog-errors';
 

src/lib/dialog/dialog-errors.ts

@@ -1,4 +1,4 @@
-import {MdError} from '@angular2-material/core/errors/error';
+import {MdError} from '@angular2-material/core';
 
 /** Exception thrown when a ComponentPortal is attached to a DomPortalHost without an origin. */
 export class MdDialogContentAlreadyAttachedError extends MdError {

src/lib/dialog/dialog-ref.ts

@@ -1,4 +1,4 @@
-import {OverlayRef} from '@angular2-material/core/overlay/overlay-ref';
+import {OverlayRef} from '@angular2-material/core';
 import {Observable} from 'rxjs/Observable';
 import {Subject} from 'rxjs/Subject';
 

src/lib/dialog/dialog.spec.ts

@@ -1,7 +1,7 @@
 import {inject, async, ComponentFixture, TestBed} from '@angular/core/testing';
 import {NgModule, Component, Directive, ViewChild, ViewContainerRef} from '@angular/core';
 import {MdDialog, MdDialogModule} from './dialog';
-import {OverlayContainer} from '@angular2-material/core/overlay/overlay-container';
+import {OverlayContainer} from '@angular2-material/core';
 import {MdDialogConfig} from './dialog-config';
 import {MdDialogRef} from './dialog-ref';