From 617f5146f62bb59faa6ec6ca33b9aec3320dd128 Mon Sep 17 00:00:00 2001
From: Kara <kara@users.noreply.github.com>
Date: Wed, 21 Sep 2016 16:59:52 -0700
Subject: [PATCH] fix(grid-list): hide overflow on tiles (#1299)

---
 src/demo-app/snack-bar/snack-bar-demo.html | 12 +++++----
 src/lib/grid-list/grid-list.scss           |  1 +
 src/lib/snack-bar/base-snack-bar.ts        | 12 ---------
 src/lib/snack-bar/package.json             | 29 ----------------------
 src/lib/snack-bar/simple-snack-bar.scss    |  4 +--
 src/lib/snack-bar/simple-snack-bar.ts      | 16 ++++++++++--
 src/lib/snack-bar/snack-bar-config.ts      | 10 +++++---
 src/lib/snack-bar/snack-bar-ref.ts         |  4 +--
 src/lib/snack-bar/snack-bar.ts             | 20 +++++++++------
 9 files changed, 44 insertions(+), 64 deletions(-)
 delete mode 100644 src/lib/snack-bar/base-snack-bar.ts
 delete mode 100644 src/lib/snack-bar/package.json

diff --git a/src/demo-app/snack-bar/snack-bar-demo.html b/src/demo-app/snack-bar/snack-bar-demo.html
index 3e81b93bbee9..2ad2f577084d 100644
--- a/src/demo-app/snack-bar/snack-bar-demo.html
+++ b/src/demo-app/snack-bar/snack-bar-demo.html
@@ -2,11 +2,13 @@ <h1>SnackBar demo</h1>
 <div>
   <div>Message: <md-input type="text" [(ngModel)]="message"></md-input></div>
   <div>
-    <md-checkbox [(ngModel)]="action">Show button</md-checkbox>
-    <md-input type="text" class="button-label-input"
-              placeholder="Snack bar action label"
-              [disabled]="!action"
-              [(ngModel)]="actionButtonLabel"></md-input>
+    <md-checkbox [(ngModel)]="action">
+      <p *ngIf="!action">Show button</p>
+      <md-input type="text" class="button-label-input"
+                *ngIf="action"
+                placeholder="Snack bar action label"
+                [(ngModel)]="actionButtonLabel"></md-input>
+    </md-checkbox>
   </div>
 </div>
 
diff --git a/src/lib/grid-list/grid-list.scss b/src/lib/grid-list/grid-list.scss
index 13c69dc8bf93..cf2ee776125f 100644
--- a/src/lib/grid-list/grid-list.scss
+++ b/src/lib/grid-list/grid-list.scss
@@ -20,6 +20,7 @@ md-grid-list {
 md-grid-tile {
   display: block;
   position: absolute;
+  overflow: hidden;
 
   figure {
     display: flex;
diff --git a/src/lib/snack-bar/base-snack-bar.ts b/src/lib/snack-bar/base-snack-bar.ts
deleted file mode 100644
index ffbcb65bae7e..000000000000
--- a/src/lib/snack-bar/base-snack-bar.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import {MdSnackBarRef} from './snack-bar-ref';
-
-
-export class BaseSnackBarContent<T> {
-  /** The instance of the component making up the content of the snack bar. */
-  snackBarRef: MdSnackBarRef<T>;
-
-  /** Dismisses the snack bar. */
-  dismiss(): void {
-    this.snackBarRef.dismiss();
-  }
-}
diff --git a/src/lib/snack-bar/package.json b/src/lib/snack-bar/package.json
deleted file mode 100644
index 5122e38fa551..000000000000
--- a/src/lib/snack-bar/package.json
+++ /dev/null
@@ -1,29 +0,0 @@
-{
-  "name": "@angular2-material/snack-bar",
-  "version": "2.0.0-alpha.8-2",
-  "description": "Angular 2 Material snack bar",
-  "main": "./snack-bar.umd.js",
-  "module": "./index.js",
-  "typings": "./index.d.ts",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/angular/material2.git"
-  },
-  "keywords": [
-    "angular",
-    "material",
-    "material design",
-    "components",
-    "snackbar",
-    "toast",
-    "notification"
-  ],
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/angular/material2/issues"
-  },
-  "homepage": "https://github.com/angular/material2#readme",
-  "peerDependencies": {
-    "@angular2-material/core": "2.0.0-alpha.8-2"
-  }
-}
diff --git a/src/lib/snack-bar/simple-snack-bar.scss b/src/lib/snack-bar/simple-snack-bar.scss
index d380adaea3c2..9935cd92950e 100644
--- a/src/lib/snack-bar/simple-snack-bar.scss
+++ b/src/lib/snack-bar/simple-snack-bar.scss
@@ -1,6 +1,6 @@
 md-simple-snackbar {
-    display: flex;
-    justify-content: space-between;
+  display: flex;
+  justify-content: space-between;
 }
 
 .md-simple-snackbar-message {
diff --git a/src/lib/snack-bar/simple-snack-bar.ts b/src/lib/snack-bar/simple-snack-bar.ts
index 542cbe08f586..d74d6736c3df 100644
--- a/src/lib/snack-bar/simple-snack-bar.ts
+++ b/src/lib/snack-bar/simple-snack-bar.ts
@@ -1,20 +1,32 @@
 import {Component} from '@angular/core';
-import {BaseSnackBarContent} from './base-snack-bar';
+import {MdSnackBarRef} from './snack-bar-ref';
 
 
+/**
+ * A component used to open as the default snack bar, matching material spec.
+ * This should only be used internally by the snack bar service.
+ */
 @Component({
   moduleId: module.id,
   selector: 'simple-snack-bar',
   templateUrl: 'simple-snack-bar.html',
   styleUrls: ['simple-snack-bar.css'],
 })
-export class SimpleSnackBar extends BaseSnackBarContent<SimpleSnackBar> {
+export class SimpleSnackBar {
   /** The message to be shown in the snack bar. */
   message: string;
 
   /** The label for the button in the snack bar. */
   action: string;
 
+  /** The instance of the component making up the content of the snack bar. */
+  snackBarRef: MdSnackBarRef<SimpleSnackBar>;
+
+  /** Dismisses the snack bar. */
+  dismiss(): void {
+    this.snackBarRef.dismiss();
+  }
+
   /** If the action button should be shown. */
   get hasAction(): boolean { return !!this.action; }
 }
diff --git a/src/lib/snack-bar/snack-bar-config.ts b/src/lib/snack-bar/snack-bar-config.ts
index 9225964d33a6..1548f45b905c 100644
--- a/src/lib/snack-bar/snack-bar-config.ts
+++ b/src/lib/snack-bar/snack-bar-config.ts
@@ -1,11 +1,13 @@
 import {ViewContainerRef} from '@angular/core';
+import {AriaLivePoliteness} from '@angular2-material/core'
 
 
-export type SnackBarRole = 'alert' | 'polite';
-
 export class MdSnackBarConfig {
-  /** The aria-role of the snack bar. */
-  role: SnackBarRole = 'alert';
+  /** The politeness level for the MdAriaLiveAnnouncer announcement. */
+  politeness: AriaLivePoliteness = 'assertive';
+
+  /** Message to be announced by the MdAriaLiveAnnouncer */
+  announcementMessage: string;
 
   /** The view container to place the overlay for the snack bar into. */
   viewContainerRef: ViewContainerRef;
diff --git a/src/lib/snack-bar/snack-bar-ref.ts b/src/lib/snack-bar/snack-bar-ref.ts
index 4f1581fdd972..2fce54a5a60d 100644
--- a/src/lib/snack-bar/snack-bar-ref.ts
+++ b/src/lib/snack-bar/snack-bar-ref.ts
@@ -10,7 +10,7 @@ import {Subject} from 'rxjs/Subject';
  */
 export class MdSnackBarRef<T> {
   /** The instance of the component making up the content of the snack bar. */
-  readonly instance: T|any;
+  readonly instance: T;
 
   /** Subject for notifying the user that the snack bar has closed. */
   private _afterClosed: Subject<any> = new Subject();
@@ -18,7 +18,7 @@ export class MdSnackBarRef<T> {
   /** If the snack bar is active. */
   private _isActive: boolean = true;
 
-  constructor(instance: T|any, private _overlayRef: OverlayRef) {
+  constructor(instance: T, private _overlayRef: OverlayRef) {
     // Sets the readonly instance of the snack bar content component.
     this.instance = instance;
     this.afterDismissed().subscribe(null, null, () => { this._isActive = false; });
diff --git a/src/lib/snack-bar/snack-bar.ts b/src/lib/snack-bar/snack-bar.ts
index 8053bf3865ee..4792ab248368 100644
--- a/src/lib/snack-bar/snack-bar.ts
+++ b/src/lib/snack-bar/snack-bar.ts
@@ -5,14 +5,15 @@ import {
   ComponentRef,
 } from '@angular/core';
 import {
-  Overlay,
-  OverlayState,
-  OverlayRef,
   ComponentType,
   ComponentPortal,
+  Overlay,
   OverlayModule,
+  OverlayRef,
+  OverlayState,
   PortalModule,
   OVERLAY_PROVIDERS,
+  MdLiveAnnouncer,
 } from '@angular2-material/core';
 import {CommonModule} from '@angular/common';
 import {MdSnackBarConfig} from './snack-bar-config';
@@ -35,7 +36,8 @@ export class MdSnackBar {
   /** A reference to the current snack bar in the view. */
   private _snackBarRef: MdSnackBarRef<any>;
 
-  constructor(private _overlay: Overlay) {}
+  constructor(private _overlay: Overlay,
+              private _live: MdLiveAnnouncer) {}
 
   /**
    * Creates and dispatches a snack bar with a custom component for the content, removing any
@@ -48,8 +50,9 @@ export class MdSnackBar {
     }
     let overlayRef = this._createOverlay();
     let snackBarContainer = this._attachSnackBarContainer(overlayRef, config);
-
-    return this._attachSnackbarContent(component, snackBarContainer, overlayRef);
+    let mdSnackBarRef = this._attachSnackbarContent(component, snackBarContainer, overlayRef);
+    this._live.announce(config.announcementMessage, config.politeness);
+    return mdSnackBarRef;
   }
 
 
@@ -58,7 +61,9 @@ export class MdSnackBar {
    */
   open(message: string, actionLabel: string,
        config: MdSnackBarConfig): MdSnackBarRef<SimpleSnackBar> {
+    config.announcementMessage = message;
     let simpleSnackBarRef = this.openFromComponent(SimpleSnackBar, config);
+    simpleSnackBarRef.instance.snackBarRef = simpleSnackBarRef;
     simpleSnackBarRef.instance.message = message;
     simpleSnackBarRef.instance.action = actionLabel;
     return simpleSnackBarRef;
@@ -87,7 +92,6 @@ export class MdSnackBar {
     let portal = new ComponentPortal(component);
     let contentRef = container.attachComponentPortal(portal);
     let snackBarRef = <MdSnackBarRef<T>> new MdSnackBarRef(contentRef.instance, overlayRef);
-    snackBarRef.instance.snackBarRef = snackBarRef;
 
     this._snackBarRef = snackBarRef;
     return snackBarRef;
@@ -118,7 +122,7 @@ export class MdSnackBarModule {
   static forRoot(): ModuleWithProviders {
     return {
       ngModule: MdSnackBarModule,
-      providers: [MdSnackBar, OVERLAY_PROVIDERS]
+      providers: [MdSnackBar, OVERLAY_PROVIDERS, MdLiveAnnouncer]
     };
   }
 }