From 355ebf8df0ad2c45883af557ae5c1924c8285021 Mon Sep 17 00:00:00 2001
From: CDDelta <ngjunyen@gmail.com>
Date: Thu, 22 Feb 2018 04:50:15 +1100
Subject: [PATCH] docs(snackbar): add position example (#10000)

---
 .../snack-bar-position-example.html           | 19 ++++++++++++
 .../snack-bar-position-example.ts             | 29 +++++++++++++++++++
 2 files changed, 48 insertions(+)
 create mode 100644 src/material-examples/snack-bar-position/snack-bar-position-example.html
 create mode 100644 src/material-examples/snack-bar-position/snack-bar-position-example.ts

diff --git a/src/material-examples/snack-bar-position/snack-bar-position-example.html b/src/material-examples/snack-bar-position/snack-bar-position-example.html
new file mode 100644
index 00000000000..ddfe4aa6fb3
--- /dev/null
+++ b/src/material-examples/snack-bar-position/snack-bar-position-example.html
@@ -0,0 +1,19 @@
+<mat-form-field>
+  <mat-select placeholder="Horizontal position" [(value)]="horizontalPosition">
+    <mat-option value="start">Start</mat-option>
+    <mat-option value="center">Center</mat-option>
+    <mat-option value="end">End</mat-option>
+    <mat-option value="left">Left</mat-option>
+    <mat-option value="right">Right</mat-option>
+  </mat-select>
+</mat-form-field>
+<mat-form-field>
+  <mat-select placeholder="Vertical position" [(value)]="verticalPosition">
+    <mat-option value="top">Top</mat-option>
+    <mat-option value="bottom">Bottom</mat-option>
+  </mat-select>
+</mat-form-field>
+
+<button mat-button (click)="openSnackBar()" aria-label="Show an example snack-bar">
+  Pool party!
+</button>
diff --git a/src/material-examples/snack-bar-position/snack-bar-position-example.ts b/src/material-examples/snack-bar-position/snack-bar-position-example.ts
new file mode 100644
index 00000000000..f18d10fe2c8
--- /dev/null
+++ b/src/material-examples/snack-bar-position/snack-bar-position-example.ts
@@ -0,0 +1,29 @@
+import {Component} from '@angular/core';
+import {
+  MatSnackBar,
+  MatSnackBarHorizontalPosition,
+  MatSnackBarVerticalPosition,
+} from '@angular/material';
+
+/**
+ * @title Snack-bar with configurable position
+ */
+@Component({
+  selector: 'snack-bar-position-example',
+  templateUrl: 'snack-bar-position-example.html',
+})
+export class SnackBarPositionExample {
+
+  horizontalPosition: MatSnackBarHorizontalPosition = 'start';
+  verticalPosition: MatSnackBarVerticalPosition = 'bottom';
+
+  constructor(public snackBar: MatSnackBar) {}
+
+  openSnackBar() {
+    this.snackBar.open('Canonball!!', 'End now', {
+      duration: 500,
+      horizontalPosition: this.horizontalPosition,
+      verticalPosition: this.verticalPosition,
+    });
+  }
+}