Merge branch 'master' of github.com:angular/material2

Author: drager

.travis.yml

@@ -24,19 +24,11 @@ env:
   - BROWSER_STACK_ACCESS_KEY=BWCd4SynLzdDcv8xtzsB
   - ARCH=linux-x64
   - BROWSER_PROVIDER_READY_FILE=/tmp/angular-material2-build/readyfile
-  # Token for tsd to increase github rate limit
-  # See https://github.com/DefinitelyTyped/tsd#tsdrc
-  # This does not use http://docs.travis-ci.com/user/environment-variables/#Secure-Variables
-  # because those are not visible for pull requests, and those should also be reliable.
-  # This SSO token belongs to github account angular-github-ratelimit-token which has no access
-  # (password is in Valentine)
-  - TSDRC='{"token":"ef474500309daea53d5991b3079159a29520a40b"}'
   # GITHUB_TOKEN_ANGULAR
   - secure: "fq/U7VDMWO8O8SnAQkdbkoSe2X92PVqg4d044HmRYVmcf6YbO48+xeGJ8yOk0pCBwl3ISO4Q2ot0x546kxfiYBuHkZetlngZxZCtQiFT9kyId8ZKcYdXaIW9OVdw3Gh3tQyUwDucfkVhqcs52D6NZjyE2aWZ4/d1V4kWRO/LMgo="
   matrix:
     # Order: a slower build first, so that we don't occupy an idle travis worker waiting for others to complete.
     - MODE=lint
-    - MODE=circular_deps
     - MODE=extract_metadata
     - MODE=e2e
     - MODE=saucelabs_required
@@ -45,19 +37,19 @@ env:
     - MODE=browserstack_optional
 
 matrix:
+  fast_finish: true
   allow_failures:
   - env: "MODE=saucelabs_optional"
   - env: "MODE=browserstack_optional"
 
 install:
   - npm install
-  - npm run typings
 
 before_script:
   - mkdir -p $LOGS_DIR
 
 script:
-- ./scripts/ci/build-and-test.sh
+  - ./scripts/ci/build-and-test.sh
 
 cache:
   directories:

CHANGELOG.md

@@ -1,5 +1,117 @@
+<a name="2.0.0-alpha.8"></a>
+# [2.0.0-alpha.8 ectoplasm-helicopter](https://github.com/angular/material2/compare/g3_v2_0...2.0.0-alpha.8) (2016-09-01)
+
+### Breaking Changes
+
+* all: we've updated our packaging to match angular/angular's packaging.  If you're using SystemJS in your project, you will probably want to
+switch to using our UMD bundles.  Example config:
+
+```ts
+'@angular2-material/core': {
+    format: 'cjs',
+    main: 'core.umd.js'
+  }
+```
+
+You can see a more detailed example in our demo app's system config [here](https://github.com/angular/material2/blob/master/src/demo-app/system-config.ts).
+
+* all: material modules must be included with `forRoot()` when bootstrapping. See the [ngModules guide](https://angular.io/docs/ts/latest/cookbook/ngmodule-faq.html#!#q-for-root) for 
+more information.
+
+```ts
+@NgModule({
+    imports: [
+        MdCoreModule.forRoot()
+        MdRadioModule.forRoot(),
+        MdIconModule.forRoot()
+    ]
+...
+});
+```
+
+* input: `md-input` attributes now match the casing of native attributes. Previously they were camel-cased; now they are all lowercase. 
+Example: `autoComplete` is now `autocomplete`.   See [#1066](https://github.com/angular/material2/pull/1066) for a full list.
+
+* overlay: overlays are now synchronous. This means actions like creating an overlay no longer return a promise.
+
+
+### Bug Fixes
+
+* **button:** hover styles no longer applied to disabled buttons ([#909](https://github.com/angular/material2/issues/909)) ([21e419d](https://github.com/angular/material2/commit/21e419d)), closes [#866](https://github.com/angular/material2/issues/866)
+* **button:** stop using `Type` from [@angular](https://github.com/angular) ([#991](https://github.com/angular/material2/issues/991)) ([97d3ed3](https://github.com/angular/material2/commit/97d3ed3))
+* **button-toggle:** toggle group should not emit an initial change event. ([#1144](https://github.com/angular/material2/issues/1144)) ([e5830d1](https://github.com/angular/material2/commit/e5830d1))
+* **card:** remove unnecessary intermediate div ([#1068](https://github.com/angular/material2/issues/1068)) ([b5e1e33](https://github.com/angular/material2/commit/b5e1e33))
+* **checkbox:** export TransitionCheckState enum ([#1147](https://github.com/angular/material2/issues/1147)) ([cda90f3](https://github.com/angular/material2/commit/cda90f3))
+* **input:** make attributes match native ones ([#1066](https://github.com/angular/material2/issues/1066)) ([f3a7b91](https://github.com/angular/material2/commit/f3a7b91)), closes [#1065](https://github.com/angular/material2/issues/1065)
+* **ngc:** _onDragStart/End are called with one param ([#1113](https://github.com/angular/material2/issues/1113)) ([6e5d260](https://github.com/angular/material2/commit/6e5d260)), closes [#1112](https://github.com/angular/material2/issues/1112)
+* **ngc:** don't emit HTMLElement in JS files ([#1061](https://github.com/angular/material2/issues/1061)) ([32eacd2](https://github.com/angular/material2/commit/32eacd2))
+* **rc6:** add directives for custom elements that are part of the APIs. ([#1121](https://github.com/angular/material2/issues/1121)) ([2c0dfcb](https://github.com/angular/material2/commit/2c0dfcb))
+* **sidenav:** turn off view encapsulation and refactor css ([#1114](https://github.com/angular/material2/issues/1114)) ([97fe211](https://github.com/angular/material2/commit/97fe211))
+* **tabs:** change missed md-active to md-tab-active ([#1044](https://github.com/angular/material2/issues/1044)) ([87b6193](https://github.com/angular/material2/commit/87b6193))
+
+### Features
+
+* **menu:** add keyboard events and improve accessibility ([#1132](https://github.com/angular/material2/issues/1132)) ([3669f06](https://github.com/angular/material2/commit/3669f06))
+* **modules:** add `forRoot()` to material modules with providers ([#1122](https://github.com/angular/material2/issues/1122)) ([9ff6196](https://github.com/angular/material2/commit/9ff6196))
+* **modules:** add `forRoot()` to all modules ([#1166](https://github.com/angular/material2/issues/1166)) ([21dc44a](https://github.com/angular/material2/commit/21dc44a))
+* **overlay:** make overlays synchronous ([#1079](https://github.com/angular/material2/issues/1079)) ([cdad90b](https://github.com/angular/material2/commit/cdad90b))
+* **slider:** add thumb-label ([#976](https://github.com/angular/material2/issues/976)) ([22d70ae](https://github.com/angular/material2/commit/22d70ae))
+* **slider:** support ngModel ([#1029](https://github.com/angular/material2/issues/1029)) ([8828358](https://github.com/angular/material2/commit/8828358))
+* **tabs:** support for `disabled` tabs ([#934](https://github.com/angular/material2/issues/934)) ([9d51deb](https://github.com/angular/material2/commit/9d51deb)), closes [#880](https://github.com/angular/material2/issues/880)
+
+<a name="2.0.0-alpha.7"></a>
+# [2.0.0-alpha.7 wax-umpire](https://github.com/angular/material2/compare/2.0.0-alpha.6...2.0.0-alpha.7) (2016-08-09)
+
+
+### Bug Fixes
+
+* **checkbox:** wrong cursor when disabled ([#908](https://github.com/angular/material2/issues/908)) ([5251c27](https://github.com/angular/material2/commit/5251c27)), closes [#907](https://github.com/angular/material2/issues/907)
+* **checkbox, slide-toggle:** only emit change event if native input emitted one. ([#820](https://github.com/angular/material2/issues/820)) ([d52e6e0](https://github.com/angular/material2/commit/d52e6e0)), closes [#575](https://github.com/angular/material2/issues/575)
+* **gestures:** custom recognizers should not inherit twice. ([#902](https://github.com/angular/material2/issues/902)) ([c68efbd](https://github.com/angular/material2/commit/c68efbd))
+* **gestures:** ensure drag and pan are recognized with slide ([#901](https://github.com/angular/material2/issues/901)) ([3179fec](https://github.com/angular/material2/commit/3179fec))
+* **input:** ensure all of label displays on safari ([#871](https://github.com/angular/material2/issues/871)) ([c8303b4](https://github.com/angular/material2/commit/c8303b4)), closes [#795](https://github.com/angular/material2/issues/795)
+* **overlay:** lazily create container ([#894](https://github.com/angular/material2/issues/894)) ([1efbbb9](https://github.com/angular/material2/commit/1efbbb9))
+* **progress-circle:** correct elapsed time calculation ([#927](https://github.com/angular/material2/issues/927)) ([0b17cd3](https://github.com/angular/material2/commit/0b17cd3)), closes [#926](https://github.com/angular/material2/issues/926)
+* **progress-circle:** remove performance.now to support non browser envs ([#857](https://github.com/angular/material2/issues/857)) ([14c1765](https://github.com/angular/material2/commit/14c1765))
+* **progress-circle:** remove references to window ([#838](https://github.com/angular/material2/issues/838)) ([66ddd3a](https://github.com/angular/material2/commit/66ddd3a)), closes [#837](https://github.com/angular/material2/issues/837)
+* **radio:** only emit change event if native input does. ([#911](https://github.com/angular/material2/issues/911)) ([23a61ab](https://github.com/angular/material2/commit/23a61ab)), closes [#791](https://github.com/angular/material2/issues/791)
+* **slide-toggle:** fix runtime exception for incorrect mousedown binding. ([#828](https://github.com/angular/material2/issues/828)) ([bbbc87f](https://github.com/angular/material2/commit/bbbc87f)), closes [#828](https://github.com/angular/material2/issues/828)
+* fix type mismatches when offline compiling. ([#835](https://github.com/angular/material2/issues/835)) ([4bb7790](https://github.com/angular/material2/commit/4bb7790))
+
+
+### Features
+
+* Add NgModules ([#950](https://github.com/angular/material2/issues/950)) ([ca351b2](https://github.com/angular/material2/commit/ca351b2))
+
+Note that NgModules are now the supported way of including the Material components in your app.
+The MD_XXX_DIRECTIVES constants are now deprecated and will be removed in alpha.8.
+
+
+* **tooltip:** initial tooltip implementation ([#799](https://github.com/angular/material2/issues/799)) ([f5e2a81](https://github.com/angular/material2/commit/f5e2a81))
+* **md-slider:** initial version for md-slider ([#779](https://github.com/angular/material2/issues/779)) ([8354750](https://github.com/angular/material2/commit/8354750))
+* **md-menu** initial version for md-menu (more features coming in alpha.8) ([#893](https://github.com/angular/material2/issues/893)) ([16eb6be](https://github.com/angular/material2/commit/16eb6be)) ([#855](https://github.com/angular/material2/issues/855)) ([e324e47](https://github.com/angular/material2/commit/e324e47)) ([#867](https://github.com/angular/material2/issues/867)) ([9a32489](https://github.com/angular/material2/commit/9a32489))
+* **ripple:** initial mdInkRipple implementation ([#681](https://github.com/angular/material2/issues/681)) ([47448cb](https://github.com/angular/material2/commit/47448cb))
+* **button:** add ripple to md-button ([32aa461](https://github.com/angular/material2/commit/32aa461))
+* **input:** support autocapitalize and autocorrect attributes ([#858](https://github.com/angular/material2/issues/858)) ([b2471f2](https://github.com/angular/material2/commit/b2471f2)) 
+* **slide-toggle:** add drag functionality to thumb ([#750](https://github.com/angular/material2/issues/750)) ([25b4f21](https://github.com/angular/material2/commit/25b4f21))
+
+
+### In-progress, not yet released
+* **dialog:** add styles and ability to close. ([#862](https://github.com/angular/material2/issues/862)) ([758b851](https://github.com/angular/material2/commit/758b851))
+* **dialog:** initial framework for md-dialog ([#761](https://github.com/angular/material2/issues/761)) ([9552ed5](https://github.com/angular/material2/commit/9552ed5))
+
+
+### Code health
+* **tabs:** adds e2e tests for tabs ([#650](https://github.com/angular/material2/issues/650)) ([3c74ae0](https://github.com/angular/material2/commit/3c74ae0)), closes [#549](https://github.com/angular/material2/issues/549)
+
+### BREAKING CHANGES
+
+* radio: radio-button will no longer emit change event on de-select.
+
+
+
 <a name="2.0.0-alpha.6"></a>
-# [2.0.0-alpha.6 carbonfiber-discotheque](https://github.com/angular/material2/compare/2.0.0-alpha.5...v2.0.0-alpha.6) (2016-06-30)
+# [2.0.0-alpha.6 carbonfiber-discotheque](https://github.com/angular/material2/compare/2.0.0-alpha.5...2.0.0-alpha.6) (2016-06-30)
 
 ### Breaking changes
 * `MdRadioDispatcher` is now `MdUniqueSelectionDispatcher` and is imported from `core`
@@ -59,7 +171,7 @@
 
 
 <a name="2.0.0-alpha.5"></a>
-# [2.0.0-alpha.5 granite-gouda](https://github.com/angular/material2/compare/2.0.0-alpha.4...v2.0.0-alpha.5) (2016-05-25)
+# [2.0.0-alpha.5 granite-gouda](https://github.com/angular/material2/compare/2.0.0-alpha.4...2.0.0-alpha.5) (2016-05-25)
 
 
 ### Bug Fixes
@@ -101,7 +213,7 @@
 
 
 <a name="2.0.0-alpha.4"></a>
-# [2.0.0-alpha.4 mahogany-tambourine](https://github.com/angular/material2/compare/2.0.0-alpha.3...v2.0.0-alpha.4) (2016-05-04)
+# [2.0.0-alpha.4 mahogany-tambourine](https://github.com/angular/material2/compare/2.0.0-alpha.3...2.0.0-alpha.4) (2016-05-04)
 
 
 ### Bug Fixes
@@ -125,7 +237,7 @@
 
 
 <a name="2.0.0-alpha.3"></a>
-# [2.0.0-alpha.3 cotton-candelabrum](https://github.com/angular/material2/compare/2.0.0-alpha.2...v2.0.0-alpha.3) (2016-04-21)
+# [2.0.0-alpha.3 cotton-candelabrum](https://github.com/angular/material2/compare/2.0.0-alpha.2...2.0.0-alpha.3) (2016-04-21)
 
 
 ### Bug Fixes
@@ -147,7 +259,7 @@
 
 
 <a name="2.0.0-alpha.2"></a>
-# [2.0.0-alpha.2 diamond-haircut](https://github.com/angular/material2/compare/2.0.0-alpha.1...v2.0.0-alpha.2) (2016-04-06)
+# [2.0.0-alpha.2 diamond-haircut](https://github.com/angular/material2/compare/2.0.0-alpha.1...2.0.0-alpha.2) (2016-04-06)
 
 
 ### Bug Fixes
@@ -180,7 +292,7 @@
 
 
 <a name="2.0.0-alpha.1"></a>
-# [2.0.0-alpha.1 nylon-hyperdrive](https://github.com/angular/material2/compare/2.0.0-alpha.0...v2.0.0-alpha.1) (2016-03-16)
+# [2.0.0-alpha.1 nylon-hyperdrive](https://github.com/angular/material2/compare/2.0.0-alpha.0...2.0.0-alpha.1) (2016-03-16)
 
 
 ### Features

GETTING_STARTED.md

@@ -21,12 +21,14 @@ some initial config for the SystemJS module loader.
 ### Install Angular Material 2 components 
 
 Now that your project has been created, you can install any Angular Material 2 components you'd like 
-to use through npm. You can see our [list of published packages here](https://www.npmjs.com/~angular2-material).  
+to use through npm. You can see our [list of published packages here](https://www.npmjs.com/~angular2-material).
+
+Note that only packages published under the `@latest` npm tag are officially released.
 
 ```bash
 npm install --save @angular2-material/core @angular2-material/button @angular2-material/card
 ```
-Note: the core module is required as a peer dependency of other components.
+(the core module is required as a peer dependency of other components)
 
 ### Add components to vendor bundle
 
@@ -98,96 +100,53 @@ Now you should be able to import the components normally wherever you'd like to
 
 **src/app/my-project.component.ts**
 ```ts
-import { MD_CARD_DIRECTIVES } from '@angular2-material/card';
-import { MD_BUTTON_DIRECTIVES } from '@angular2-material/button';
+import { MdCardModule } from '@angular2-material/card';
+import { MdButtonModule } from '@angular2-material/button';
 ```
 
-And don't forget to add the directives to your directives array:
+Import the components in your application module:
 
-**src/app/my-project.component.ts**
+**my-app-module.ts**
 ```ts
-directives: [MD_CARD_DIRECTIVES, MD_BUTTON_DIRECTIVES]
+@NgModule({
+  imports: [MdButtonModule, MdCardModule],
+  ...
+})
 ```
 
 ### Sample Angular Material 2 projects
 
-- [Puppy Love (ng-conf 2016)](https://github.com/kara/puppy-love) - see live demo [here](https://youtu.be/rRiV_b3WsoY?t=4m20s) 
-- [Puppy Love Mobile (Google IO 2016)](https://github.com/kara/puppy-love-io)
 - [Material 2 Sample App](https://github.com/jelbourn/material2-app)
 
-### Additional steps for using Material components with forms
-
-If you're using Angular Material 2 version alpha.6 or later, you'll need to upgrade to Angular 2's 
-new forms module.  Here's how:
+(the following are slightly out of date now)
+- [Puppy Love (ng-conf 2016)](https://github.com/kara/puppy-love) - see live demo [here](https://youtu.be/rRiV_b3WsoY?t=4m20s) 
+- [Puppy Love Mobile (Google IO 2016)](https://github.com/kara/puppy-love-io)
 
-- Install the `@angular/forms` package. If you're on Angular RC.4, install version 0.2.0.
 
-```bash
-npm install @angular/forms
+### Additional setup for `md-menu` and `md-tooltip`:
+For alpha.7, you need to include the overlay styles in your app via a `link` element. This will
+look something like
+```html
+<link href="vendor/@angular2-material/core/overlay/overlay.css" rel="stylesheet">
 ```
 
-- Change your bootstrap file to disable the old form directives and provide the new form 
-directives.    
+In future releases, all of the core styles will be combined into a single distributed css file.
 
-**main.ts**
-```ts
-import {disableDeprecatedForms, provideForms} from '@angular/forms'; 
 
-bootstrap(MyAppComponent, [
-  disableDeprecatedForms(),
-  provideForms()
-]);
-```
+### Additional setup for `md-slide-toggle` and `md-slider`:
+The slide-toggle and slider components have a dependency on [HammerJS](http://hammerjs.github.io/).
+1) Add HammerJS to your application via [npm](https://www.npmjs.com/package/hammerjs), a CDN 
+   (such as the [Google CDN](https://developers.google.com/speed/libraries/#hammerjs)), 
+   or served directly from your app.
+2) Include the typings for HammerJS in your typescript build ([more info on @types](https://blogs.msdn.microsoft.com/typescript/2016/06/15/the-future-of-declaration-files))
 
-- Import any and all forms symbols - `NgForm`, `Validators`, etc - from `@angular/forms`. 
-Importing them from `@angular/common` will result in a `No value accessor found` error.
 
-- Update your form code to use the new APIs. See more information about the changes in the proposal 
-doc [here](https://docs.google.com/document/u/1/d/1RIezQqE4aEhBRmArIAS1mRIZtWFf6JxN_7B4meyWK0Y/pub) 
-and the official documentation [here](https://angular.io/docs/ts/latest/guide/forms.html).
+### Additional setup for `md-icon`:
 
-### Additional steps for `md-icon` setup:
-
-- If you want to use Material Design icons, load the Material Design font in your `index.html`.  `md-icon` supports any font icons or svg icons,
- so this is only one potential option.
+- If you want to use Material Design icons, load the Material Design font in your `index.html`.  
+`md-icon` supports any font icons or svg icons, so this is only one potential option.
 
 **src/index.html**
 ```html
 <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 ```
-       
-- Include http providers in your `main.ts`: 
-    
-**src/main.ts**
-```ts
-import { HTTP_PROVIDERS } from '@angular/http';
-...
-bootstrap(MyAppComponent, [
-    HTTP_PROVIDERS
-]);       
-```
-    
-- Provide the icon registry at or above the component where you're using the icon:
-
-**src/app/my-project.component.ts**
- ```ts
-    import {MdIcon, MdIconRegistry} from '@angular2-material/icon';
-    ...
-    directives: [MD_CARD_DIRECTIVES, MD_BUTTON_DIRECTIVES, MdIcon],
-    providers: [MdIconRegistry]
- ```
-
-- Add the icon package to the list of Material components in your `system-config.ts`:
-
-**src/system-config.ts**
-```ts
-// put the names of any of your Material components here
-const materialPkgs:string[] = [
-  ...
-  'icon'
-];
-```
-    
-    
-    
-